Skip to content

Instantly share code, notes, and snippets.

@xflahertyx
Last active August 29, 2015 14:16
Show Gist options
  • Save xflahertyx/9f2056744f55e3d2eeee to your computer and use it in GitHub Desktop.
Save xflahertyx/9f2056744f55e3d2eeee to your computer and use it in GitHub Desktop.
Test run for algorithm sort
button {
display: inline-block;
}
div {
border: 2px solid black;
margin: 2px;
display: inline-block;
font-size: 1px;
}
.red {
background-color: red; }
.orange {
background-color: orange; }
.yellow {
background-color: yellow; }
.green {
background-color: green; }
.blue {
background-color: blue; }
.indigo {
background-color: indigo; }
.violet {
background-color: violet; }
.white {
background-color: white; }
.gray {
background-color: gray; }
.black {
background-color: black; }
.size0 {
height: 8px; width: 8px; }
.size1 {
height: 10px; width: 10px; }
.size2 {
height: 12px; width: 12px; }
.size3 {
height: 14px; width: 14px; }
.size4 {
height: 16px; width: 16px; }
.size5 {
height: 18px; width: 18px; }
.size6 {
height: 20px; width: 20px; }
.size7 {
height: 22px; width: 22px; }
.size8 {
height: 24px; width: 24px; }
.size9 {
height: 26px; width: 26px; }
<!DOCTYPE html>
<html>
<head>
<title>Make divs of random sizes and colors</title>
<link href="divpush.css" type="text/css" rel="stylesheet" />
</head>
<body>
<button id="push">Push</button>
<button id="sSort">Sort Size</button>
<button id="cSort">Sort Color</button>
<section>
<p>Start!</p>
</section>
</body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="divpush.js"> </script>
</html>
var rand;
var oneDiv = '<div></div>';
var newDiv = function(){
$('p').after(oneDiv);
};
var aClass = function(){
$('div:first-of-type').addClass(rColor[randC]).addClass(rSize[randS]).text(randS);
};
$('#push:button').on('click', function(){
for (var i=0; i < 501; i++) {
dPush(i);
};
});
//Scott helped me with this
var dPush = function(){
randC = Math.floor(Math.random()*10);
randS = Math.floor(Math.random()*10);
newDiv();
aClass();
};
var rColor =["red", "orange", "yellow", "green", "blue",
"indigo", "violet", "white", "gray", "black"];
var rSize = ["size0", "size1", "size2", "size3", "size4",
"size5", "size6", "size7", "size8", "size9",];
//http://www.onemoretake.com/2009/02/25/sorting-elements-with-jquery/
$('#sSort:button').on('click', function(){
var mylist = $('section');
var listitems = mylist.children('div').get();
listitems.sort(function(a, b) {
var compA = $(a).text();
var compB = $(b).text();
return (compA < compB) ? -1 : (compA > compB) ? 1 : 0;
})
$.each(listitems, function(idx, itm) { mylist.append(itm); });
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment