Skip to content
This repository has been archived by the owner on Jan 10, 2023. It is now read-only.

Commit

Permalink
Start using Bootstrap
Browse files Browse the repository at this point in the history
  • Loading branch information
powdahound committed Nov 22, 2012
1 parent 41d9026 commit 8b06b4b
Show file tree
Hide file tree
Showing 11 changed files with 9,114 additions and 67 deletions.
1,088 changes: 1,088 additions & 0 deletions www/bootstrap/css/bootstrap-responsive.css

Large diffs are not rendered by default.

9 changes: 9 additions & 0 deletions www/bootstrap/css/bootstrap-responsive.min.css

Large diffs are not rendered by default.

5,893 changes: 5,893 additions & 0 deletions www/bootstrap/css/bootstrap.css

Large diffs are not rendered by default.

9 changes: 9 additions & 0 deletions www/bootstrap/css/bootstrap.min.css

Large diffs are not rendered by default.

Binary file added www/bootstrap/img/glyphicons-halflings-white.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added www/bootstrap/img/glyphicons-halflings.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
2,025 changes: 2,025 additions & 0 deletions www/bootstrap/js/bootstrap.js

Large diffs are not rendered by default.

6 changes: 6 additions & 0 deletions www/bootstrap/js/bootstrap.min.js

Large diffs are not rendered by default.

19 changes: 2 additions & 17 deletions www/default.css
Original file line number Diff line number Diff line change
@@ -1,22 +1,7 @@
* {
font-family: verdana;
}
body {
margin: 8px 10px;
}
p, td, th {
font-size: 12px;
}
h1 {
margin-top: 0;
font-size: 26px;
}
h2 {
font-size: 18px;
}
abbr {
border-bottom: 1px dotted #ccc;
padding: 5px 20px;
}

#footer {
position: absolute;
bottom: 10px;
Expand Down
80 changes: 49 additions & 31 deletions www/default.js
Original file line number Diff line number Diff line change
@@ -1,67 +1,85 @@
function change_cost(duration) {
// update menu text
var first = duration.charAt(0).toUpperCase();
var text = first + duration.substr(1);
$("#cost-dropdown .dropdown-toggle .text").text("Cost: "+text);

// update selected menu option
$('#cost-dropdown li a').each(function(i, e) {
e = $(e);
if (e.attr('duration') == duration) {
e.parent().addClass('active');
} else {
e.parent().removeClass('active');
}
});

var hour_multipliers = {
"hourly": 1,
"daily": 24,
"weekly": (7*24),
"monthly": (24*30),
"yearly": (365*24)
};
var multiplier = hour_multipliers[duration];
var per_time;
$.each($("td.cost"), function(i, elem) {
elem = $(elem);
per_time = elem.attr("hour_cost");
per_time = (per_time * multiplier).toFixed(2);
elem.text("$" + per_time + " " + duration);
});

}

// add parser through the tablesorter addParser method
$.tablesorter.addParser({
// set a unique id
id: 'ioperf',
id: "ioperf",
is: function(s) { return false; },
format: function(s) {
// format your data for normalization
if (s == 'Low') {
if (s == "Low") {
return 0;
} else if (s == 'Moderate') {
} else if (s == "Moderate") {
return 1;
} else if (s == 'High') {
} else if (s == "High") {
return 2;
} else {
return 3;
}
},
// set type, either numeric or text
type: 'numeric'
type: "numeric"
});

$(function() {
$('.tablesorter').tablesorter({
$(".tablesorter").tablesorter({
headers: {
/* memory */
1: {
sorter: 'digit'
sorter: "digit"
},
/* compute units */
2: {
sorter: 'digit'
sorter: "digit"
},
/* storage */
3: {
sorter: 'digit'
sorter: "digit"
},
/* i/o perf */
5: {
sorter: 'ioperf'
sorter: "ioperf"
}
},
// sortList: [[0,1]],
widgets: ['zebra']
widgets: ["zebra"]
});

change_cost('hourly');
});

$('#cost').bind('change', function(e) {
var selected = $('#cost option:selected').val();
var hour_multipliers = {
'hour': 1,
'day': 24,
'week': (7*24),
'month': (24*30),
'year': (365*24)
};
var multiplier = hour_multipliers[selected];
var per_hour;
var per_time;
$.each($('td.cost'), function(i, elem) {
elem = $(elem);
per_time = elem.attr('hour_cost');
if (selected != 'hour') {
per_time = (per_time * multiplier).toFixed(2);
}
elem.text('$' + per_time + ' per ' + selected);
});
$("#cost-dropdown li").bind("click", function(e) {
change_cost(e.target.getAttribute("duration"));
});
52 changes: 33 additions & 19 deletions www/index.html
Original file line number Diff line number Diff line change
@@ -1,34 +1,47 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<!DOCTYPE html>

<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Amazon EC2 Instance Comparison</title>
<link rel="stylesheet" href="default.css" type="text/css">
<link rel="stylesheet" href="default.css" media="screen">
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css" media="screen">
</head>

<body>
<h1>Amazon EC2 Instance Comparison</h1>
<div class="page-header">
<h1>EC2Instances.info <small>Easy Amazon EC2 Instance Comparison</small></h1>
</div>

<p>
A sortable table displaying all the Amazon EC2 <a href="http://aws.amazon.com/ec2/instance-types/" target="_blank">instance type</a> and <a href="http://aws.amazon.com/ec2/pricing/" target="_blank">pricing</a> information so its easier to make comparisons. It's <a href="http://powdahound.com/2011/03/hosting-a-static-site-on-amazon-s3-ec2instances-info" target="_blank">hosted on S3</a> and awaiting your improvements <a href="https://github.com/powdahound/ec2instances.info" target="_blank">on GitHub</a>.
</p>

<p style="text-align: right">
Region:
<select id="region">
<option value="us-east">US East</option>
</select>
Costs:
<select id="cost">
<option value="hour">Hourly</option>
<option value="day">Daily</option>
<option value="week">Weekly</option>
<option value="month">Monthly</option>
<option value="year">Yearly</option>
</select>
</p>
<div>
<div class="btn-group">
<a class="btn dropdown-toggle btn-primary" data-toggle="dropdown" href="#">
Region: US East
<span class="caret"></span>
</a>
<ul class="dropdown-menu" role="menu">
<li><a href="javascript:;">US East</a></li>
</ul>
</div>

<div class="btn-group" id="cost-dropdown">
<a class="btn dropdown-toggle btn-primary" data-toggle="dropdown" href="#">
<span class="text"></span>
<span class="caret"></span>
</a>
<ul class="dropdown-menu" role="menu">
<li><a href="javascript:;" duration="hourly">Hourly</a></li>
<li><a href="javascript:;" duration="daily">Daily</a></li>
<li><a href="javascript:;" duration="weekly">Weekly</a></li>
<li><a href="javascript:;" duration="monthly">Monthly</a></li>
<li><a href="javascript:;" duration="yearly">Yearly</a></li>
</ul>
</div>
</div>

<table cellspacing="0" class="tablesorter">
<thead>
Expand Down Expand Up @@ -246,7 +259,8 @@ <h1>Amazon EC2 Instance Comparison</h1>
Made by <a href="http://twitter.com/powdahound" target="_blank">@powdahound</a> /
<a href="https://github.com/powdahound/ec2instances.info" target="_blank">Fork on GitHub</a>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script src="bootstrap/js/bootstrap.min.js" type="text/javascript" charset="utf-8"></script>
<script src="jquery.tablesorter.min.js" type="text/javascript" charset="utf-8"></script>
<script src="default.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
Expand Down

0 comments on commit 8b06b4b

Please sign in to comment.