Created
April 16, 2017 22:16
-
-
Save aamax/4ca8383956ab2f34f7881dc3e191f3ac to your computer and use it in GitHub Desktop.
raffle selection spinner for RubyHACK....
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<div class="well"> | |
<h1 id="selected_winner">Spin To Select A Winner!</h1> | |
<br/> | |
<div id="planeMachine" style="overflow: hidden; height: 70px;" class="" > | |
<div class="slotMachineContainer" style="transition: 0.9s ease-out; transform: matrix(1, 0, 0, 1, 0, -240);"> | |
<% @raffle_entries.each do |re| %> | |
<div class="text-center"> | |
<h1 id="panel1"><%= "#{re[:fname]} #{re[:lname]}" %></h1> | |
</div> | |
<% end %> | |
</div> | |
</div> | |
</div> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var raffleEntries = <%= raw @raffle_entries.to_json %>; | |
// click spin wheel button | |
function selectWinner() { | |
var index = Number($("#current_index").val()); | |
var skipOrganizers = $("#cb_without_organizers:checked").val() != undefined; | |
var skipWinners = $("#cb_without_winners:checked").val() != undefined; | |
$("#planeMachine").show(); | |
var machine = $("#planeMachine").slotMachine({ | |
active : 1, | |
delay : 500, | |
auto : 1000, | |
spins : false, | |
stopHidden : true | |
}); | |
$("#selected_winner").hide(); | |
index += 1; | |
// rotate spinner for 6 seconds then show winner... | |
sleep(5500).then(() => { | |
machine.stop(); | |
machine.destroy(); | |
$("#planeMachine").hide(); | |
}); | |
// TODO Spin animation and clicker... | |
$("audio")[0].play(); | |
// Usage! | |
sleep(6000).then(() => { | |
index = setIndex(index, skipOrganizers, skipWinners); | |
var winnerString = getWinnerString(index); | |
$("#selected_winner").show(); | |
$("#selected_winner").text(winnerString); | |
$("#current_index").val(index); | |
}); | |
} | |
function getWinnerString(index) { | |
if(index >= raffleEntries.length) { | |
return "End of List - refresh page!"; | |
} | |
return raffleEntries[index].fname + " " + raffleEntries[index].lname; | |
} | |
function setIndex(index, skipOrganizers, skipWinners) { | |
var selected = false; | |
var arrayLength = raffleEntries.length; | |
for (var i = index; i < arrayLength; i++) { | |
if (skipOrganizers && raffleEntries[i].role == 'organizer') { | |
index++; | |
continue; | |
} | |
if (skipWinners && raffleEntries[i].winner != undefined) { | |
index++; | |
continue; | |
} | |
break; | |
} | |
return index; | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
The library I'm using is found here: https://github.com/josex2r/jQuery-SlotMachine | |
The list of raffle entries is populated from the rails controller... |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment