diff options
Diffstat (limited to 'public')
| -rw-r--r-- | public/javascripts/app.js | 26 | ||||
| -rw-r--r-- | public/stylesheets/style.css | 32 |
2 files changed, 55 insertions, 3 deletions
diff --git a/public/javascripts/app.js b/public/javascripts/app.js index c700880..759c5eb 100644 --- a/public/javascripts/app.js +++ b/public/javascripts/app.js @@ -5,6 +5,7 @@ var App = App || null; this.characters = []; this.answer = null; this.answer_name = ''; + this.answer_image_url = ''; this.playlist = [] @@ -21,7 +22,10 @@ var App = App || null; this.on('click', function(e) { if (the_other.playlist[e].title == the_other.answer_name) { // Answered correctly - the_other.correct_answer(); + the_other.pick_character({ correct: true }); + } + else { + the_other.pick_character({ correct: false }); } }); }); @@ -61,6 +65,7 @@ var App = App || null; if (params.answer_id == r.characters[i].tms_personId) { that.answer_name = r.characters[i].name; + that.answer_image_url = r.characters[i].image } } that.initialise_js_cover_flow(that.playlist); @@ -68,8 +73,23 @@ var App = App || null; ); }; - this.correct_answer = function() { - alert('chosen'); + this.pick_character = function(params) { + var params = params || { + correct: false + }; + + var $open_dialog_button = $('<a id="character-chosen-dialog-button" href="#" data-transition="slideup" style="display: none;"></a>'); + $('body').append($open_dialog_button); + var $open_dialog_button_in_dom = $('#character-chosen-dialog-button'); + + if (params.correct) { + $open_dialog_button_in_dom.attr('href', '/character-chosen/true'); + } + else { + $open_dialog_button_in_dom.attr('href', '/character-chosen/false/?character_name=' + this.answer_name + '&character_image_url=' + this.answer_image_url); + } + + $open_dialog_button_in_dom.trigger('click'); }; diff --git a/public/stylesheets/style.css b/public/stylesheets/style.css index b9d84e1..1c3215e 100644 --- a/public/stylesheets/style.css +++ b/public/stylesheets/style.css @@ -1,6 +1,11 @@ html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}table{border-collapse:collapse;border-spacing:0} +b { + font-weight: bold; +} + + section.video { position: relative; padding-bottom: 56.25%; @@ -36,6 +41,33 @@ footer { } +/* Character Chosen dialog */ +/* +body.character-chosen-dialog .ui-body-c { + background-color: #ddd; +} +*/ + +#character-chosen-content { + width: 95%; + margin: 0 auto; + position: relative; + top: 2em; +} + +#character-chosen-content h1 { + font-size: 2em; + font-weight: bold; + line-height: 1.2em; + text-align: center; +} + +#character-chosen-content p { + margin-top: 1em; + text-align: center; +} + + /* jQuery Mobile overrides */ .ui-body-c { |