Materials for workshop about cloud development
Create H1 header with title of application. Add div tag with English word. Add 4 buttons tags with Czech translation.
Add necessary header in order to display diacritics correctly.
Add Twitter bootstrap CDN to header to make app nicer
Change 4 Czech options to 4 buttons. Replace div tag by button tag and class.
Add CSS class definition to buttons: class="btn btn-default".
Fix for C9.io ide to avoid jQuery warning, add /* global $ */
Add JavaScript using jQuery and display alert after any button click.
We need to know what is value of clicked button. Find it and display it.
Compare value from clicked button and display alert with fail or success.
Add div with id "status" and set its "text" value instead of display alert.
Display icon which indicates status. Use Twitter Glyphicons.
- http://getbootstrap.com/components/
- http://api.jquery.com/addClass/
- http://api.jquery.com/removeClass/
Create two lists of words. One in English and one in Czech.
var czechWords = []; var englishWords = [];
Select random word and display it on sreen. Use Math.random and Math.floor functions.
Compare index of selected word with primary word and display success or failure.
Define ID for each button and use "for" cycle to display words on buttons
Run function for generating word again when the word was correct.
Use setTimeout function to invoke new game after selecting word.
Use fadeOut function to remove message from display.
Bring back message tag using "show" function.