Compare cloudies
by Gert Vaartjes
HTML
<table id="result">
<tr>
<th>Cloud</th>
<th>Staging</th>
</tr>
</table>
<pre id="hashes"...
CSS
body {
background: #252530;
font-family: Arial;
}
#result div {
width: 44%;
max-width: 400px;
margin: 2%;
display: inline-block;
}
img {
width: 100%;
}
span, a {
color: white;
margin-right: 1em;
}
iframe {
height: 400px;
width: 600px;
}
JavaScript
// db.Hashes.find({ $where: function () { return this.views > 100000; }}).map(function (doc) { return { _id: doc._id, userId: doc.userId && +doc.userId, views: +doc.views }; });
var allHashes = document.getElementById('hashes').innerHTML.split('\n');
var hashes = allHashes.slice(0,10);
hashes.forEach(function (doc) {
var $table = $('#result');
var $tr = $('<tr>')
.appendTo($table);
var $td0 = $('<td>')
.appendTo($tr);
var $td1 = $('<td>')
.appendTo($tr);
var $td2 = $('<td>')
.appendTo($tr);
var cb = $('<input id="' + doc + '"type="checkbox"></input>');
cb.click(function() {
var idx,
stored;
// init localStorage
if (localStorage.test === undefined) {
localStorage.test = "";
}
stored = JSON.parse(localStorage.test);
if ($(this).prop('checked')) {
// add id to localstorage
//stored.push(this.id);
} else {
/*idx = stored.indexOf(this.id);
if (idx > -1) {
stored.splice(idx, 1);
localStorage.test = JSON.stringify(stored);
}*/
}
});
cb.appendTo($td0);
$('<iframe>')
.attr({
src: 'http://cloud.highcharts.com/embed/' + doc
})
.appendTo($td1);
$('<iframe>')
.attr({
src: 'http://staging-editor.highcharts.com/embed/' + doc
})
.appendTo($td2);
});