Integrar en el ejemplo del carrusel realizado con Bootstrap en la última actividad la calculadora desarrollada como entrega P2P final del modulo 5 que utiliza jQuery e incluye todas las teclas de operaciones unitarias, binarias y n-arias.

La calculadora integrada debe estar accesible desde todos los enlaces del carrusel:

• Barra de navegación superior
• Foto de la calculadora en el carrusel
• Botonera inferior

La calculadora integrada debe incluir una barra de navegación adaptable a pantallas estrechas y anchas, similar a la que se incluyo en la integración del puzzle.

Subir el carrusel completo basado en bootstrap con el puzzle y la calculadora integrados a la cuenta de neocities.org

Parte opcional de la entrega:

Para practicar con el uso de jQuery UI, pueden añadir a la calculadora una memoria donde almacenar el valor del cajetín. El contenido de esta memoria deberá hacerse visible en la página Web, por ejemplo cerca del cajetín. Para mover el contenido de uno a otro se deben añadir 2 teclas a la calculadora:

El contenido del cajetín debe poder arrastrarse también con el ratón para depositar en la memoria, utilizando las interacciones draggable y droppable de jQuery UI. Un último paso más difícil es permitir arrastrar en sentido inverso.

Algunas sugerencias para implementar el arrastre del cajetín a la memoria:

• Usar bloque <div contentEditable=“true” …> en vez de <input type=“text” …> para introducir el número y delimitar el cajetin con los comandos CSS border, hight y width.
• Usar un bloque <div> para la memoria donde guardar el número. Delimitar esta zona también con los comandos CSS border, hight y width.
• Inicializar la función draggable al menos con las opciones {revert: "invalid", helper:"clone"} para que retorne si no llega al destino y para que no desplace el cajetín original.
• Inicializar la función dropable al menos con las opciones {activeClass:"act", drop:function(event, ui){…}} para indicar con activeClass cual es el destino (memoria) y para definir con drop el manejador del ejvento que copia el contenido. El manejador tendrá un código similar al del botón ToM.

Pueden encontrar las instrucciones en:

• http://www.desarrolloweb.com/manuales/manual-jqueryui.html
• https://jqueryui.com/
• http://api.jqueryui.com/