Displaying 100 quizzes on the main quiz page

  • Anonymous - 2011-09-28

    I have over 100 quizzes so the way the main quiz page is stuck at a particular width/height isn't good for me.

    It would be nice if the list of quizzes could be set outside the box and that clicking on a quiz would expand to show the description with a link to "take the quiz" and open that quiz in colorbox.  When the quiz is completed and the user clicks the "take another quiz" button the colorbox will close and the user will see the list of quizzes again.

    If colorbox is not an option at least make it so a list can be on the main page with quiz links to a quiz page and clicking the "take another quiz" button brings you back to the main page.

  • Joe B.

    Joe B. - 2011-09-29

    I know this is not exactly what you're asking for, but a quick and simple way to make the quiz list larger than the quiz is to change its size for when the user is selecting a quiz. If you're pressed for time I think it would work in a pinch… maybe.

    I attached a patch to change quizzy.js from quizzy-2.0b1 to work this way. Let me know if you really want to use quizzy-1.0 and I'll back port it for you.

    I'll look into moving the quiz into something like color box soon but I'm going to be busy for a little while.

    Here is that patch:

    diff --git a/quizzy.js b/quizzy.js
    index 02ab025..1d6f261 100644
    --- a/quizzy.js
    +++ b/quizzy.js
    @@ -35,6 +35,10 @@ quizzyState.quizWidth = -1;
     // NOTE: This variable isn't used in here anywhere.
     quizzyState.height = -1;
    +// Size of the quiz select screen
    +quizzyState.selectHeight = 600;
    +quizzyState.selectWidth = 900;
      * This function is called when the page is fully loaded and ready to run javaScript.
      * It initializes the loading plugin, resets the quizzy state,
    @@ -55,6 +59,10 @@ $(document).ready(function() {
         $.loading.delay = quizzyState.loadingDelay;
         $.loading.onAjax = true;  // don't change this!
    +  // Change the size back to the the select size
    +  $('#quizzy').animate({width:quizzyState.selectWidth, height:quizzyState.selectHeight});
    +  $('#quizzy_load').animate({width:quizzyState.selectWidth});
       // hide the quiz descriptions, uncheck all of the options
    @@ -135,6 +143,10 @@ function startQuiz()
         quizzyState.numQuestions = data.numQuestions;
    +    // Return the container divs to the appropriate sizes
    +    $('#quizzy').animate({width:quizzyState.quizWidth, height:quizzyState.quizHeight});
    +    $('#quizzy_load').animate({width:quizzyState.quizWidth});
         // we also got a quizzyState.numQuestions set, need to resize a few divs.
         $('#quizzy_c').width((quizzyState.numQuestions + 3) * quizzyState.quizWidth);
         $('#quizzy_quiz').width((quizzyState.numQuestions + 2) * quizzyState.quizWidth);
    @@ -407,6 +419,10 @@ function restartQuizzy()
           // Focus the first radio button
    +      // Change the size back to the the select size
    +      $('#quizzy').animate({width:quizzyState.selectWidth, height:quizzyState.selectHeight});
    +      $('#quizzy_load').animate({width:quizzyState.selectWidth});
         }); // quizzy_c
       }); // quizzy_q_c

Log in to post a comment.

Get latest updates about Open Source Projects, Conferences and News.

Sign up for the SourceForge newsletter:

No, thanks