Skip to content

Instantly share code, notes, and snippets.

@daangemist
Created April 20, 2013 20:32
Show Gist options
  • Save daangemist/5427304 to your computer and use it in GitHub Desktop.
Save daangemist/5427304 to your computer and use it in GitHub Desktop.
A HTML page to easily display three RememberTheMlik lists using the mobile website and an iFrame.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>RTMDash</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
/* IE10 Consumer Preview */
background-image: -ms-linear-gradient(bottom, #FFFFFF 0%, #23A614 100%);
/* Mozilla Firefox */
background-image: -moz-linear-gradient(bottom, #FFFFFF 0%, #23A614 100%);
/* Opera */
background-image: -o-linear-gradient(bottom, #FFFFFF 0%, #23A614 100%);
/* Webkit (Safari/Chrome 10) */
background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #FFFFFF), color-stop(1, #23A614));
/* Webkit (Chrome 11+) */
background-image: -webkit-linear-gradient(bottom, #FFFFFF 0%, #23A614 100%);
/* W3C Markup, IE10 Release Preview */
background-image: linear-gradient(to top, #FFFFFF 0%, #23A614 100%);
#dashboard { margin-left: 10px; }
#dashboard .window { float: left; width: 400px; height: 300px; margin: 14px 5px; }
#dashboard .caption { display:block; font-weight:bold; width:100%; }
#dashboard iframe { width: 100%; height: 100%; }
</style>
<script src="app://js/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
var dashboard = {
dashboards : [
['Widget', 'https://m.rememberthemilk.com/lists/-/21173589'],
['Work', 'https://m.rememberthemilk.com/lists/-/28856418'],
['MC', 'https://m.rememberthemilk.com/lists/-/24461873'],
],
addWindow : function( name, url )
{
$('#dashboard').append('<div class="window"><div class="caption">' + name + ' <a href="#" class="refreshBtn">refresh</a></div><iframe src="' + url + '">' + name + 'iFrame</iframe></div>');
}
}
function refreshAllOnTimer( firstLoad )
{
//on the first request of this function, only set the time
if( !firstLoad ) {
$('iframe').each( function(index) {
$(this).attr('src', $(this).attr('src') );
});
}
setTimeout('refreshAllOnTimer(false);', 1800000); //refresh every half an hour
}
$(document).ready( function() {
var i = 0;
for( i = 0; i < dashboard.dashboards.length; i++) {
dashboard.dashboards[i][0];
dashboard.addWindow( dashboard.dashboards[i][0], dashboard.dashboards[i][1] );
}
$('.caption .refreshBtn').click( function() {
var frame = $(this).parent().parent().children('iframe');
frame.attr('src', frame.attr('src'));
});
/*
-- Does not work on multiple lines
$(window).resize(function(e) {
$('#dashboard .window').height($(window).height() - (100));
});
*/
refreshAllOnTimer(true);
});
</script>
</head>
<body>
<div id="dashboard"></div>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment