Ready JavaScript Curriculum

This commit is contained in:
benmcmahon100
2015-07-30 20:58:02 +01:00
parent fd10044367
commit e78a39cb8d

View File

@ -1069,6 +1069,152 @@
"})();(function(){return(test);})();" "})();(function(){return(test);})();"
], ],
"challengeType": 1 "challengeType": 1
},
{
"id":"cf1111c1c12feddfaeb9bdef",
"name":"Creating a slots machine",
"dashedName":"creating-a-slots-machine",
"difficulty":"9.987",
"description":[
"",
"We are now going to try and combine some of the stuff we've just learnt abd create the logic for a slot machine game",
"For this we will need to generate three random numbers between <code>1</code> and <code>5</code> to represent the possible values of each individual slot",
"Store the three random numbers in <code>slotOne</code>, <code>slotTwo</code> and <code>slotThree</code>",
"Generate the random numbers by using the system we used earlier in /challenges/random-whole-numbers-in-a-range",
"<code> Math.floor(Math.random() * (5 - 1 + 1)) + 1; </code>"
],
"tests":[
"assert(typeof(runSlots($(''))[0]) == 'number', 'SlotOne should be a random number');",
"assert(typeof(runSlots($(''))[1]) == 'number', 'SlotTwo should be a random number');",
"assert(typeof(runSlots($(''))[2]) == 'number', 'SlotThree should be a random number');",
"assert(editor.getValue().match(/Math.floor\\(Math.random\\(\\) \\* \\(5 \\- 1 \\+ 1\\)\\) \\+ 1/g).length === 3);"
],
"challengeSeed":[
"fccss",
" function runSlots(slots){",
" var slotOne;",
" var slotTwo;",
" var slotThree;",
" ",
" /*Don't modify above here*/",
" ",
" ",
" ",
" /*Don't modify below here*/",
" ",
" if(slotOne !== undefined && slotTwo !== undefined && slotThree !== undefined){",
" $('.logger').html(slotOne + ' ' + slotTwo + ' ' + slotThree);",
" }",
" return([slotOne, slotTwo, slotThree]);",
" }",
"",
" $(document).ready(function(){",
" var slots = $('.slot');",
" ",
" $('.go').click(function(){",
" runSlots(slots);",
" });",
" });",
"fcces",
" ",
"<div>",
" <div class = 'container inset'>",
" <div class = 'header inset'>",
" <h2>FCC Slot Machine</h2>",
" </div>",
" <div class = 'slots inset'>",
" <div class = 'slot inset'>",
" ",
" </div>",
" <div class = 'slot inset'>",
" ",
" </div>",
" <div class = 'slot inset'>",
" ",
" </div>",
" </div>",
" <br/>",
" <div class = 'outset'>",
" <button class = 'go inset'>",
" Go",
" </button>",
" </div>",
" <br/>",
" <div class = 'foot inset'>",
" <span class = 'logger'></span>",
" </div>",
" </div>",
"</div>",
"",
"<link href='http://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'>",
"",
"<style>",
" .container {",
" background-color: darkred;",
" height: 400px;",
" width: 260px;",
" margin: 50px auto;",
" border-radius: 4px;",
" }",
" .header {",
" border: 2px solid gold;",
" border-radius: 4px;",
" height: 50px;",
" margin: 14px auto;",
" }",
" .header h2 {",
" font-size: 24px;",
" margin: 10px 30px;",
" padding: 0;",
" font-family: lobster;",
" color: gold;",
" }",
" .slots{",
" display: flex;",
" background-color: rgb(90, 1, 1);",
" border-radius: 6px;",
" }",
" .slot{",
" flex: 1 0 auto;",
" background: white;",
" height: 75px;",
" margin: 8px;",
" border: 2px solid brown;",
" border-radius: 4px;",
" }",
" .go {",
" width: 100%;",
" color: gold;",
" background-color: rgb(90, 1, 1);",
" border: 2px solid gold;",
" border-radius: 2px;",
" box-sizing: none;",
" outline: none!important;",
" }",
" .foot {",
" height: 150px;",
" background-color: rgb(90,1,1);",
" }",
" ",
" .logger {",
" color: white;",
" margin: 10px;",
" }",
" ",
" .outset {",
" -webkit-box-shadow: 0px 0px 15px -2px rgba(0,0,0,0.75);",
" -moz-box-shadow: 0px 0px 15px -2px rgba(0,0,0,0.75);",
" box-shadow: 0px 0px 15px -2px rgba(0,0,0,0.75);",
" }",
" ",
" .inset {",
" -webkit-box-shadow: inset 0px 0px 15px -2px rgba(0,0,0,0.75);",
" -moz-box-shadow: inset 0px 0px 15px -2px rgba(0,0,0,0.75);",
" box-shadow: inset 0px 0px 15px -2px rgba(0,0,0,0.75);",
" }",
"</style>"
],
"challengeType": 0
} }
] ]
} }