From 440f9906d213a3ff8b43d8a1205334af943f0642 Mon Sep 17 00:00:00 2001 From: nael Date: Wed, 3 Apr 2019 18:20:23 +0200 Subject: [PATCH] WIP #2647 @7:00 --- index.php | 268 +++++++++++++++++++---------------------------- js/bonaquiz.js | 30 +++++- style/style.sass | 33 +++--- 3 files changed, 156 insertions(+), 175 deletions(-) diff --git a/index.php b/index.php index f0d1584..4e3dee0 100644 --- a/index.php +++ b/index.php @@ -159,13 +159,12 @@ $question = [ -
-
+
+
-

The Bona 100‑year

anniversary quiz

@@ -173,188 +172,136 @@ $question = [ Start
- - -
- - -//
-//

Question '.$question[$i]['id'].'/'.count($question).'

-//

'.$question[$i]['label'].'

-//
    '; -// -// for($e=0;$e -//
  • -//
    -// '.chr($num ) .' -//
    -// '.$question[$i]['choices'][$e] .' -//
    • -// '; -// } -// echo ' -//
-//
-//
-//
'; -// $v= $question[$i]['correct']-1; -// $answer = $question[$i]['choices'][$v]; -// -// -// $letter = $question[$i]['correct'] + 64; -// echo ' -// -//
-// -//
-//

Question '.$question[$i]['id'].'/'.count($question).'

-// -//

'.$question[$i]['label'].'

-// -// Correct answer : -// -//
    -//
  • -//
    -// '.chr($letter).' -//
    -// '.$answer.' -//
    • -//
-// -//

'.$question[$i]['explaination'] .'

-// -// -// -//
-//
-//
'; + echo ' +
+
+

Question '.$question[$i]['id'].'/'.count($question).'

+

'.$question[$i]['label'].'

+
    '; + for($e=0;$e +
  • +
    +
    + '.chr($num ) .' +
    + '.$question[$i]['choices'][$e] .' +
    +
    • + '; + } + echo ' +
+
+
'; + $v= $question[$i]['correct']-1; + $answer = $question[$i]['choices'][$v]; + $letter = $question[$i]['correct'] + 64; + echo ' + +
+
+

Question '.$question[$i]['id'].'/'.count($question).'

+

'.$question[$i]['label'].'

+ Correct answer : +
    +
  • +
    +
    + '.chr($letter).' +
    + '.$answer.' +
    +
    • +
+ +

'.$question[$i]['explaination'] .'

+ + + + +
+
'; } else{ - echo '
- + echo ' +

Question '.$question[$i]['id'].'/'.count($question).'

'.$question[$i]['label'].'

    '; - for($z=0;$z<$question['imagesnb']; $z++) - -// var_dump($question[$i]['imagesnb']); + for($z=0;$z<$question[$i]['imagesnb']; $z++) { $numb = $z; $num = $numb + 65; - var_dump($z); - - echo $z++; -// if ($z % 2 == 1) -// { -// echo "$z est impair"; -// } -// elseif ($z % 2 == 0) -// { -// echo "$z est pair"; -// } - echo ' - -
  • -
    - '.chr($num ).' -
    -
    • -     '; + if ($z % 2 == 1) // impair + { + echo ' + +
  • +
    + '.chr($num).' +
    +
    • +     '; + echo ''; + } + elseif ($z % 2 == 0) // pair + { + echo ''; + echo ' + +
  • +
    + '.chr($num).' +
    +
    • +     '; + } } echo '
-
+
'; + // reponse question img + $letter = $question[$i]['correct'] + 64; + echo ' +
+
+

Question '.$question[$i]['id'].'/'.count($question).'

+

'.$question[$i]['label'].'

+ + Correct answer : + +
    + +
  • +
    + '.chr($letter).' +
    +
    • +     +
+ + +
+
'; } } -// var_dump(count($question)); + // var_dump(count($question)); ?> - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- -
-

Question 2/10

- -

Which photo is the Austrian Chancellor's Office, Vienna, where - we had the opportunity to bring out the beauty in the floor?

- - Correct answer : - -
    - -
  • -
    - D -
    -
    • -     -
- -
-
-
-

Congrats

@@ -372,6 +319,7 @@ $question = [
+
diff --git a/js/bonaquiz.js b/js/bonaquiz.js index 9ab18f4..e13ad36 100644 --- a/js/bonaquiz.js +++ b/js/bonaquiz.js @@ -1,8 +1,11 @@ $(function () { $(window).on('resize', resize); + $(window).on('resize', resizeBar); resize(); + resizeBar(); setTimeout(function () { resize(); + resizeBar(); $("body").addClass('loaded'); }, 1000); }); @@ -52,5 +55,30 @@ function resize() { if (home) { $("#projector").css('bottom', Math.max(cssSection.top, hh * 0.05)); } +} -} \ No newline at end of file +function resizeBar(){ + let windowWidth = window.outerWidth; + let windowHeight = window.outerHeight; + console.log('width : '+windowWidth); + $(".progressbar").css('font-size', 10); + + // $(".progressbar").css('font-size', 10 * scale); + if (windowHeight > windowWidth){ + let scale = windowWidth / windowHeight; + $(".progressbar").css('font-size', 10 * scale); + } +} + + + +$('#container .data').each(function (index) { + // let questionID= $(this).attr("data-question"); + + $(this).on('click', function() { + alert($(this).data("question")); + }); + // console.log($('#container .data').eq(index).attr('data-question')); + + // console.log(questionID); +}); \ No newline at end of file diff --git a/style/style.sass b/style/style.sass index 18ef161..5b41a76 100644 --- a/style/style.sass +++ b/style/style.sass @@ -30,8 +30,10 @@ body display: block!important .section display: none + height: 100% a.btn-next text-decoration: none + display: block section z-index: 1 position: relative @@ -115,20 +117,21 @@ section &__list position: relative max-width: 40em - height: 10em - padding: 3em + width: 40em + height: 9em background: white margin: 0 auto border-radius: 5.25em - display: flex - align-items: center margin-bottom: 2em cursor: pointer transition: 400ms all ease &--text - font-size: 2.3em + font-size: 2em color: $darkblue - padding-left: 0.5em + padding-left: 1.2em + padding-right: 0.5em + text-align: left + width: 85% &--letter color: white left: 1.8em @@ -136,13 +139,14 @@ section &--circle width: 5em height: 5em - background: $green + background: #669933 border-radius: 50% position: relative - left: -0.8em + left: 1.2em display: flex justify-content: center align-items: center + z-index: 55 .questions__list:hover background: $green transition: 400ms all ease @@ -155,13 +159,17 @@ section .questions__list--text color: white transition: 400ms all ease - +.questions__contain + display: flex + align-items: center + width: 100% + height: 100% .progressbar - width: 50em + width: 55em margin: 0 auto position: absolute bottom: 3em - height: 1em + height: 0.75em background: white left: 0 right: 0 @@ -261,9 +269,6 @@ section.questions a.button.next @media only screen and (max-width: 529px) #background #projector background-size: 150% auto - .progressbar - width: 25em - height: 0.5em .circleContainer span .questionsCircle -- 2.39.5