diff --git a/anne-survey.rb b/anne-survey.rb index 62cc2e4..9ca7115 100644 --- a/anne-survey.rb +++ b/anne-survey.rb @@ -189,8 +189,10 @@ module Anne::Views "afbeelding. De test duurt 5 à 10 minuten. Succes!" p "Doe de test volledig om kans te maken op de prijs." p "– Anne Pijl" - a "Verder", :href => R(Start) - p "(Jij logt in vanaf #{@env["REMOTE_ADDR"]}.)" + + form :action => R(Start), :method => :get do + input :type => "submit", :value => "Ga verder" + end end def make_select(label_name, name, options) @@ -207,7 +209,7 @@ module Anne::Views p "Graag zou ik ten behoeve van de statistiek het volgende van je willen weten:" form :action => R(Start), :method => :post do - make_select "Faculteit:", "user_study", + make_select "Faculteit", "user_study", ["niet van toepassing", "Biomedische Technologie", "Bouwkunde", @@ -230,15 +232,14 @@ module Anne::Views def vote(image, progress = 0) h2 "Welk beeld is ruimtelijker?" - # FIXME: offset the two images in the same way as in the original - # composited image. form :action => R(Vote), :method => :post do input :type => "hidden", :name => "image", :value => image - input :type => "image", :src => R(ImageX, "#{image}-l.png"), :name => "left" - input :type => "image", :src => R(ImageX, "#{image}-r.png"), :name => "right" + input.image :type => "image", :src => R(ImageX, "#{image}-l.png"), :name => "left", :id => "left" + input.image :type => "image", :src => R(ImageX, "#{image}-r.png"), :name => "right", :id => "right" + end + div.progressbar! do + div.done! :style => "width: #{progress}%" do " " end end - # FIXME: make a nice div with two spans of the following. - p "Woep, je bent al op #{progress}%!" end def finish @@ -253,7 +254,7 @@ module Anne::Views end p do input :type => "checkbox", :name => "prize", :checked => true - label "Ik wil meedingen naar de prijs", :for => "prize" + label "Ik wil meedingen naar de prijs.", :for => "prize" end p do input :type => "checkbox", :name => "results", :checked => true @@ -275,11 +276,52 @@ module Anne::Views end -# FIXME: Insert some TU/e styling here __END__ /* Style sheet for the Anne Survey Camping app */ +html, body { margin: 0; padding: 0; background: #333; } + body { + margin: 0 auto; + margin-top: 10pt; + border: thin solid #333; + padding: 10px; + width: 960px; + font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; color: white; background-color: black; + -webkit-border-radius: 1em; + -moz-border-radius: 1em; + border-radius: 1em; +} + +#header { + background: url('image/tuelogo.gif') no-repeat right; + height: 73px; +} + +#header h1 { + padding-top: 20px; +} + +.image { border: thin solid #888; text-align: center; } +#left { margin-right: 10px; } +#right { margin-left: 10px; } + +#progressbar { + height: 6px; + margin-top: 1.2em; + background-color: #101073; +} + +#progressbar #done { + height: 5pt; + background-color: #d6007b; +} + +#footer { + padding: 3pt 8pt 0pt 8pt; + margin-top: 1em; + border-top: thin #eee solid; + font-size: 62.5%; }