Simple XML Quiz

This quiz allows for an unlimited number of questions and answers to be passed through a XML file. If there are more options for answering than fit the page, a scroll is automatically displayed.

Each question has exactly one correct answer, and in order to continue to the next question, it's mandatory for the user to choose one answer.

For each correct answer, the user receives one point. For each incorrect answer, the user receives zero points.

At the end of the quiz, based on the total number of accumulated points, the user receives a message set in the XML, and the results are saved in a text file.

The text file is scores.txt. For each user the results are saved on a new line. The information is formated like this:

USER IP, DATE, SCORE
USER IP, DATE, SCORE
USER IP, DATE, SCORE
USER IP, DATE, SCORE

This process is transparent to the user. Note you need a server with PHP support.


The final results passed to the user are calculated like this:

0 - 2 (0, 1, 2 points)
3 - 4 (3, 4 points)
5 - 6 (5, 6 points)
7 - 8 (7, 8 points)

Any values and any number of values can be passed here as long as the last is smaller than the total number of questions (since the maximum result can be equal to this number if the user answers all questions correctly).

In the settings XML file you can edit colors and sizes, and the XML is very intuitive. Please check the help tab for more information.

 

abie lee

on 28/8/09

 

Is there any way of using this quiz with an existing FLV that I've imported into flash? Ideally I'd like to overlay the quiz and set the questions to come up at certain specified cue points on the timeline...is this possible?

Thank you!

 

Andrei Potorac

on 28/8/09

 

Well, possible it is, but you need to dive deep in the code. Otherwise, you can contact us at support with a complete brief, timeframe and budget.

 

Bulent Turgut

on 1/9/09

 

Also I can pay some money for my support. Second I want to make a flash intro for my Islamic website. Could you make it for me? I will pay money about USD 100. If you can make it, please contact me. I will write you detailed informations and images, animations in my idea. Also you can sell this project in your website. Thank you.

 

Andrei Potorac

on 2/9/09

 

burgutex, please get in touch for our quotes by email. Also, we need to receive a complete brief at [email protected] Thanks! :)

 

Tad Feiss

on 12/10/09

 

Hi, Love your products! I'm working on this quiz, and i have a few questions. I would like to eliminate the white that borders the rounded corners of the main area. I'm using on a different color BG and would love for it to blend, so which parameter is this? Also is it complicated to add a simple "Name" attribute at the end of the quiz that would allow the quiz taker to enter their name and then have that added to the "scores.txt?" I found most of the places that i would need to edit, but i'm not a good coder. Any help would be great!

Thanks, love your stuff!

 

Andrei Neamtu

on 16/10/09

 

brainbucket,

If you want to eliminate the corners of the quiz go inside the html code and define this param for the swf object(look in the "index.html"):
params.wmode = "transparent";

The name input you want is not that easy to do. You need flash skills and also it needs to write in a file and that needs php.

 

albes

on 4/12/09

 

Hi, you have really nice components! I would like to add a quizz in my website with a random selection. Let 's say, if I have 100 questions in my xml file, I would like only 10 to be shown in the quizz. Is there any possibility with this free Simple XML Quiz?

Thanks :)

 

Andrei Potorac

on 7/12/09

 

albes, thank you. :-)

Well, not implemented in the component, but you can do this with php, and write in the XML a random selection of those questions. This can be done in the Flash file as well, but it isn't implemented in this product.

If you want, you can also get in touch for us to modify it for you, within a budget. Otherwise, please make this change inside a PHP file, it should work correctly.

 

bonobo

on 17/12/09

 

Hello, to eliminate the white that borders the rounded corners of the main area I went inside the html code and define this param for the swf object params.wmode = "transparent"; but it's still white and I can see still the thin lines of the panel. What did I wrong? Thnaks

 

Andrei Potorac

on 17/12/09

 

bonobo, nice avatar! :-)

Please check the settings.xml file. You can set the background color there.

7...54321

Post a comment

Please login to join the discussions. Don't have an account? Register (it takes 30 seconds)

There are currently no frequent asked questions. As soon as we receive your feedback, we'll update this section permanently.

There are no video tutorials for this flash component yet.

Simple XML Quiz - change log

 2010.11.22 - version 1.0.2
- new flabell standard


 2010.07.29 - version 1.0.1
- ofString XML setting fixed


 2009.08.03 - version 1.0
* First release!

Simple XML Quiz - tips and tricks

Introduction: 

     This is a fully customizable Simple XML Quiz, with support for unlimited questions and answers. Only one answer at a time can be the correct answer.

     Everything is customizable in the XML files, including the question’s height, text color, size and much more.

     This Simple XML Quiz contains a handful of features and settings. It is easy to use the quiz in your Flash projects or as an independent Flash Quiz Component on your html based website.

     If you want to use the quiz in a Flash file, importing it is as easy as moving some actionscript files around and dragging the movieclip containing the quiz in your Flash file.

     Skinning is very simple as well. To edit the file you don't need any Flash experience, because all the settings are loaded from an external XML file, which you can edit with any text editor. You can change the colors of the elements, the size of the elements, the size of the quiz and much more.

     The code is very well commented, written following the best OOP practices, and the downloaded file comes with all the assets used to create the Simple XML Quiz such as the fonts, the .ai source files, and the .fla source file.

Features:

1. Customize the quiz through the XML file.
2. Add unlimited questions and answers.
3. Customize the colors from the XML file.
4. Supports scrolling.

 

Folder structure:

     Please navigate to the deploy folder, inside the project folder. This folder contains all the files you need to upload to your server to have the Flash XML Quiz work. Your server must support PHP.

     quiz/xml/settings.xml

     XML configuration file - This is where you make all changes to the look and feel of your Flash XML Quiz.

     quiz/xml/quiz.xml

     Questions/Answers XML configuration file - This is where you make all changes to the quiz questions and answers.

     js/swfobject.js

     Deconcept SWFObject is a small JavaScript file used for embedding Adobe Flash content. The script can detect the Flash plug-in in all major web browsers (on Mac and PC) and is designed to make embedding Flash movies as easy as possible.

     js/expressInstall.swf

     SWFObject has full support for the Adobe Flash Player Express Install feature. Using expressinstall, your users never have to leave your site to upgrade their Flash Player.

     preview.swf

     This is the component swf file which is embedded in your website.

     index.html

     HTML document used to embed the swf file. Please check the source code to see how the variables are passed to the swf file, using any text editor such as Notepad or Textedit.

 settings.xml structure: 

     Below you can see what each of the attributes in the XML file means:

<settings width="560"
height="420">

     Here you can define the quiz width and height if these are not defined in the HTML (for example when you use the quiz inside another Flash file).

<loader color="0xEEEFEF"/>

     Here you can define the loader's color.

<background strokeColor="0xC8CACC"
fillColor="0xF3F5F5"
contentMargin="15"
contentYPosition="10"/>

     Sets the poll background stroke color, fill color and width of the content margin, as well as the position from the top of the quiz of the questions.

<splash_screen strokeColor="0x27AAE1" 
fillColor="0x27AAE1" 
textColor="0xffffff" 
buttonFillColor="0xffffff" 
buttonStrokeColor="0x999999" 
buttonTextColor="0x333333" 
buttonText="Start quiz" 
buttonHeight="26" 
overButtonColor="0x27AAE1" 
overButonTextColor="0xffffff"/>

     The XML attributes are self explanatory. These control the splash page.

<questions_screen questionTextColor="0x231F20"
questionBackgroundFillColor="0xffffff"
questionBackgroundStrokeColor="0x2A2828"
answerActiveStrokeColor="0xEEEFEF"
answerActiveFillColor="0xF4F4F2"
answerInactiveTextColor="0xA7A9AC" 
answerActiveTextColor="0x231F20" 
answerInactiveStrokeColor="0xEEEFEF" 
answerInactiveFillColor="0xF8F8F8" 
questionInactiveCircleColor="0xEEEFEF" 
questionActiveCircleColor="0x27AAE1" 
questionPointColor="0x27AAE1" 
questionPositionColor="0x231F20" 
questionsPositionNumberColor="0x27AAE1" 
nextButtonFillInactiveColor="0xF6F7F7" 
nextButtonStrokeInactiveColor="0xE1E2E3" 
nextButtonTextInactiveColor="0xE6E7E8" 
nextButtonFillActiveColor="0xffffff" 
nextButtonStrokeActiveColor="0x2A2828" 
nextButtonTextActiveColor="0x231F20" 
nextButtonText="next" 
finishButtonText="finish" 
ofString="of" 
buttonHeight="20" 
overButtonColor="0x27AAE1"/>

     The XML attributes are self explanatory. These control the questions pages.

<final_screen strokeColor="0x27AAE1" 
fillColor="0x27AAE1" 
questionTextColor="0xffffff" 
resultsStrokeColor="0xA3A0A0" 
resultsFillColor="0xffffff" 
resultsTextColor="0x000000" 
pointsTextColor="0x27AAE1" 
pointsStringTextColor="0x231F20" 
pointsString="points"/>

      The XML attributes are self explanatory. These control the results page.

<scrollbar backgroundWidth="12" 
scrollerWidth="6" 
backgroundColor="0x27AAE1" 
scrollerColor="0xffffff"/>

     Sets the scroll width, background width, scroll background color and scroller's color. The scroll only appears when it's needed. (meaning you want to display more answers inside an area than fit)

<error textColor="0x27AAE1" 
visibilityTime="5" 
unselectedChoice="Please select an option"/>

     Self-explanatory attributes. Basically you add the strings for each textfield, on particular situations.

quiz.xml structure:

     This xml contains the quiz data. It has a node for the description:

<description><![CDATA[Do you miss all the incredible clothes worn by Carrie and Co. on "Sex and the City"? This "designer" quiz spans all six seasons. For fashion addicts only!]]></description>

     Several nodes for questions and answers like :

<item id="1" correct="1">
	<question><![CDATA[In season one's "The Power of Female Sex", in which fabulous store are Carrie and Amalita when Amalita states, "You can pay me back NEVER!"?]]></question>
	<answer id="1"><![CDATA[Christian Dior]]></answer>
	<answer id="2"><![CDATA[Jimmy Choo]]></answer>
	<answer id="3"><![CDATA[Manolo Blahnik]]></answer>
	<answer id="4"><![CDATA[Dolce & Gabbana]]></answer>
</item>

     Note each question has it's own id, as well as each answer. The correct attribute holds the value of the correct answer, as an id.

     There is one more node for the results screen text and user message:

<final_screen>	
	<limit value="4"><![CDATA[Congratulations!]]></limit>
	<limit value="8"><![CDATA[Congratulations!]]></limit>
</final_screen>

     The final results passed to the user are calculated like this:

<limit value="2"><![CDATA[Lorem ipsum dolor sit amet, consectetur adipiscing elit.]]></limit>
<limit value="4"><![CDATA[Lorem ipsum dolor sit amet, consectetur adipiscing elit.]]></limit>
<limit value="6"><![CDATA[Lorem ipsum dolor sit amet, consectetur adipiscing elit.]]></limit>
<limit value="8"><![CDATA[Lorem ipsum dolor sit amet, consectetur adipiscing elit.]]></limit>

0 - 2 (0, 1, 2 points)
3 - 4 (3, 4 points)
5 - 6 (5, 6 points)
7 - 8 (7, 8 points)

     Any values and any number of values can be passed here as long as the last is smaller than the total number of questions (since the maximum result can be equal to this number if the user answers all questions correctly). In this example the total number of questions is 8,  so the maximum value needs to be 8 as well.   

Flashvars:

     In the html file you can set some variables for the quiz like dimensions (width and height), the path to the files if you choose to put them in another location rather than the same folder of course, and the quiz data xml files.                        
     

flashvars.stageW = stageW;
flashvars.stageH = stageH;
            
flashvars.pathToFiles = "quiz/";
            
flashvars.settingsPath = "xml/settings.xml";     
flashvars.xmlPath = "xml/quiz.xml";

Support:

     If you need any help using the product, please contact us at [email protected].