Skip to content

Instantly share code, notes, and snippets.

@mduleone

mduleone/gist:8855689

Last active August 29, 2015 13:56
Show Gist options
  • Save mduleone/8855689 to your computer and use it in GitHub Desktop.
Save mduleone/8855689 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
gistfile1.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width" />
<title>Lords &amp; Knights - Trickle Sheet</title>
<link href='http://fonts.googleapis.com/css?family=Allerta+Stencil|Love+Ya+Like+A+Sister|Special+Elite' rel='stylesheet' type='text/css'>
<link href='C:\Users\Matt\Documents\GitHub\l-k\toolkit\css\lk_responsive.css' rel='stylesheet' type='text/css' />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.js"></script>
<style type='text/css'>
*{margin: 0px; padding: 0px; font-family: sans-serif;}
body{background: #333; color: #fff;}
ul{list-style: none;}
li{padding-left: 20px;}
div.content{width: 320px; padding: 0px; margin: 0px auto; text-align: center;}
h1{font-size: 32px; padding: 10px 0px;}
h2{font-size: 24px; padding: 5px 0px;}
span.footnote{padding-top: 20px; font-size: 14px; display: block;}
h1.allianceName{text-align: center; font-size: 28px;}
h1.logo{font-size: 32px;}
h1.logo{text-align: center;color: #fff; background: #333;}
h1.logo a{text-decoration: none; color: #fff;}
h1.logo .f1{font-family: 'Allerta Stencil', sans-serif;}
h1.logo .f2{font-family: 'Love Ya Like A Sister', cursive;}
h1.logo .f3{font-family: 'Special Elite', cursive;}
h1.logo .inv{color: #333; background: #fff;}
h1.logo{margin-bottom: 25px;}
td.castleLink{padding-left: 20px;}
td.castleData{font-size: 80%;}
a{color: #cff;}
div.smaller{font-size: 80%;}
div.full{float: left; width: 100%;}
div.left{float: left;}
div.right{float: right;}
textarea{width: 100%; margin: 10px auto; height: 400px;}
button{width: 80%; height: 3em; margin: 10px auto;}
tr.player_row td{text-align: left;}
tr td.points{text-align: right;}
tr.strike{text-decoration: line-through; color: #666;}
tr.setwidth{height: 1px;}
td.heading{font-weight: bold;}
tr.margin{height: 2em;}
.error{color: #c00;}
.centerCoords{width: 300px;}
.subscription{
font-size: 16px;
color: #0cf;
text-align: left;
}
#configToggles li{
text-align: left;
}
#configToggles label{
padding-left: 1em;
}
.time:hover{
cursor: pointer;
}
</style>
</head>
<body>
<h1 class='logo'><a href='/'><span class='f2'>R<span class='inv'>a</span>N<span class='f3'>s</span><span class='inv'>0</span>m'S</span> <span class='f1'>To<span class='inv f3'>o</span>lk<span class='f3'>i</span>t</span></a></h1>
<h1 class='allianceName'>Trickle Sheet</h1>
<h2 class='notice'><a href="mailto:dan@duleone.com?subject=Ransom's%20Toolkit:%20L%2BK%20Player's%20Castle%20List">Provide Comments &amp; Suggestions</a></h2>
<hr />
<div class='content'>
<div class='full'>
<div class='left'>
<label>time_1</label>
</div>
<div class='right'>
<div class='time'>
<a id="time_1" href="#">Open</a>
</div>
</div>
</div>
<div class='full'>
<div class='left'>
<label>time_2</label>
</div>
<div class='right'>
<div class='time'>
<a id="time_2" href="#">Open</a>
</div>
</div>
</div>
<div class='full'>
<div class='left'>
<label>time_3</label>
</div>
<div class='right'>
<div class='time'>
<a id="time_3" href="#">Open</a>
</div>
</div>
</div>
<div class='full'>
<div class='left'>
<label>time_4</label>
</div>
<div class='right'>
<div class='time'>
<a id="time_4" href="#">Open</a>
</div>
</div>
</div>
</div>
<script type="text/javascript" lang="javascript">
var timeslots = new Object;
var times = $('div.time a');
$(times).each(function(idx){
timeslots[$(times[idx]).attr('id')] = new Object;
timeslots[$(times[idx]).attr('id')]['name'] = '';
timeslots[$(times[idx]).attr('id')]['type'] = '';
timeslots[$(times[idx]).attr('id')]['qty'] = '';
});
$('div.time a').click(function(){
var id = $(this).attr('id');
//console.log(timeslots[id]);
//console.log(timeslots[id]['name']);
var parent = $(this).parent();
parent.html('<input type=\'text\' name=\'name\' value=\'' + timeslots[id]['name'] + '\' placeholder=\'Your Name\'><br />\n' +
'<input type=\'text\' name=\'type\' value=\'' + timeslots[id]['type'] + '\' placeholder=\'Troop Type\'><br />\n' +
'<input type=\'number\' name=\'qty\' value=\'' + parseInt(timeslots[id]['qty']) + '\' placeholder=\'Amount\'><br />\n' +
'<input type=\'button\' value=\'Close\' onclick=\'close("' + id + '")\'>');
parent.attr('id',id);
});
function close(id){
var slot = timeslots[id];
slot['name'] = $('#' + id + ' input[name$="name"]').val();
slot['type'] = $('#' + id + ' input[name$="type"]').val();
slot['qty'] = $('#' + id + ' input[name$="qty"]').val();
}
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment