first commit

kr1sp1n · Dec 27, 2011 · add9e7e · add9e7e
commit add9e7e
Show file tree

Hide file tree

Showing 13 changed files with 1,247 additions and 0 deletions.
diff --git a/README b/README
diff --git a/favicon.ico b/favicon.ico
diff --git a/index.html b/index.html
@@ -0,0 +1,38 @@
+<html>
+<head>
+	<meta http-equiv="Content-type" content="text/html; charset=utf-8">
+	<title>Dashboard</title>
+	<link rel="stylesheet" href="http://twitter.github.com/bootstrap/1.4.0/bootstrap.min.css" />
+	<link rel="stylesheet" href="stylesheets/style.css" type="text/css" media="screen" title="dashboard" charset="utf-8" />
+	<link href='http://fonts.googleapis.com/css?family=Reenie+Beanie&amp;amp;subset=latin' rel='stylesheet' type='text/css' />
+
+	<!--<script src="javascripts/three.js" type="text/javascript" charset="utf-8"></script>
+	<script src="javascripts/RequestAnimationFrame.js" type="text/javascript" charset="utf-8"></script>-->
+	<script src="http://js.pusherapp.com/1.9/pusher.min.js" type="text/javascript"></script>
+	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript" charset="utf-8"></script>
+	<script src="javascripts/store+json2.min.js" type="text/javascript" charset="utf-8"></script>
+	<script src="javascripts/Dashboard.js" type="text/javascript" charset="utf-8"></script>
+	<script src="javascripts/shared.js" type="text/javascript" charset="utf-8"></script>
+
+	<script src="javascripts/main.js" type="text/javascript" charset="utf-8"></script>
+</head>
+<body>
+	<div class="container">
+		<div class="content">
+			<div class="page-header">
+				<h1>Taskboard <small id="taskboard_id"></small></h1>
+				<div id="status">connecting...</div>
+			</div>
+			<div class="row">
+				<ul id="tasks">
+				</ul>
+			</div>
+			<div class="row" id="qr_code">
+			</div>
+		</div>
+		<footer>
+			<p>Rock'n'Roll</p>
+		</footer>
+	</div>
+</body>
+</html>
diff --git a/javascripts/Dashboard.js b/javascripts/Dashboard.js
@@ -0,0 +1,61 @@
+var Dashboard = (function (dashboard) {
+	//store.clear();
+	//store.remove("my_new_dashboard");
+
+	dashboard.start = function(id) {
+		dashboard.items = {};
+		return dashboard.load(id);
+	};
+
+	dashboard.load = function(id) {
+		dashboard.id = (id===undefined) ? uuid() : id;
+
+		var d = store.get(dashboard.id);
+		if(d===undefined) {
+			dashboard.save();
+		} else {
+			dashboard.merge(d);
+		}
+		return dashboard;
+	};
+
+	dashboard.save = function() {
+		store.set(dashboard.id, dashboard);
+		return dashboard;
+	}
+
+	dashboard.merge = function(d) {
+		var key;
+		for(key in d) {
+			dashboard[key] = d[key];
+		}
+		dashboard.save();
+		return dashboard;
+	};
+
+	dashboard.set = function(id, item) {
+		dashboard.items[id] = item;
+		dashboard.save();
+		return dashboard;
+	};
+
+	dashboard.get = function(id, callback) {
+		var item = dashboard.items[id];
+
+		if(item===undefined) {
+			callback("no item found", null);
+		} else {
+			callback(null, item);
+		}
+		return dashboard;
+	};
+
+	dashboard.inspect = function() {
+		console.log(dashboard);
+	};
+
+	return dashboard;
+}(Dashboard || {}));
+
+/* Utils */
+function uuid(a){return a?(0|Math.random()*16).toString(16):(""+1e7+-1e3+-4e3+-8e3+-1e11).replace(/1|0/g,uuid)}
diff --git a/javascripts/RequestAnimationFrame.js b/javascripts/RequestAnimationFrame.js
@@ -0,0 +1,22 @@
+/**
+ * Provides requestAnimationFrame in a cross browser way.
+ * http://paulirish.com/2011/requestanimationframe-for-smart-animating/
+ */
+
+if ( !window.requestAnimationFrame ) {
+
+	window.requestAnimationFrame = ( function() {
+
+		return window.webkitRequestAnimationFrame ||
+		window.mozRequestAnimationFrame ||
+		window.oRequestAnimationFrame ||
+		window.msRequestAnimationFrame ||
+		function( /* function FrameRequestCallback */ callback, /* DOMElement Element */ element ) {
+
+			window.setTimeout( callback, 1000 / 60 );
+
+		};
+
+	} )();
+
+}
diff --git a/javascripts/main.js b/javascripts/main.js
@@ -0,0 +1,39 @@
+function after_update_task(task) {
+	render_task(task);
+}
+
+function after_new_task(task) {
+	render_task(task);
+}
+
+function after_connected() {
+	$('#status').text('online');
+}
+
+function after_disconnected() {
+	$('#status').text('offline');
+}
+
+$(document).ready(function() {
+
+	$('#taskboard_id').text(Dashboard.id);
+
+	// "dbee5cd1-de7a-4ddb-8444-ad4056489dc5"
+	// "my_new_dashboard"
+
+	var key, items = Dashboard.items;
+	for(key in items) {
+	  render_task(items[key]);
+	}
+
+	var reg = /([\w|\W]*)\//gi;
+	var match = location.href.match(reg);
+	var url = (match.length==1)? match[0] + 'remote.html#'+ Dashboard.id : false;
+
+	$('#qr_code').append('<img class="qrcode" src="http://qrcode.kaywa.com/img.php?s=3&d='+encodeURIComponent(url)+'" />');
+
+});
+
+function render_task(task) {
+	$('<li class="task"><p>'+task.text+'</p></li>').css('display', 'none').prependTo('#tasks').fadeIn('slow');
+}
diff --git a/javascripts/remote.js b/javascripts/remote.js
@@ -0,0 +1,93 @@
+function after_connected() {
+	$('#status').text('online');
+}
+
+function after_disconnected() {
+	$('#status').text('offline');
+}
+
+function after_update_task(task) {
+	render_task(task);
+	$('#task_list').listview('refresh');
+}
+
+function after_new_task(task) {
+	render_task(task);
+	$('#task_list').listview('refresh');
+}
+
+$(document).bind("mobileinit", function(){
+  //apply overrides here
+});
+
+$(document).bind( "pagebeforechange", function( e, data ) {
+	/* grab Dashboard id from hash */
+	if ( typeof data.toPage === "string" ) {
+		var u = $.mobile.path.parseUrl( data.toPage );
+		if(u.hash!="#tasks") $.mobile.changePage("#tasks", data.options );
+		//e.preventDefault();
+	}
+});
+
+$( document ).bind( "pagebeforeload", function( event, data ){
+
+	// Let the framework know we're going to handle the load.
+
+	alert(data.absUrl);
+
+	//event.preventDefault();
+
+	// ... load the document then insert it into the DOM ...
+	// at some point, either in this callback, or through
+	// some other async means, call resolve, passing in
+	// the following args, plus a jQuery collection object
+	// containing the DOM element for the page.
+
+	//data.deferred.resolve( data.absUrl, data.options, page );
+
+});
+
+$( document ).bind( "pageloadfailed", function( event, data ){
+
+	// Let the framework know we're going to handle things.
+
+	//event.preventDefault();
+
+    alert('failed');
+
+	// ... attempt to load some other page ...
+	// at some point, either in this callback, or through
+	// some other async means, call resolve, passing in
+	// the following args, plus a jQuery collection object
+	// containing the DOM element for the page.
+
+	//data.deferred.resolve( data.absUrl, data.options, page );
+
+});
+
+$( document ).delegate("#tasks", "pagecreate", function() {
+	var key, items = Dashboard.items;
+	for(key in items) {
+	  render_task(items[key]);
+	}
+
+	$(".button.create_new_task").live("click", function(){
+		 createTask($('#task_description').val());
+	});
+});
+
+function render_task(task) {
+	$('<li><a href="#">'+task.text+'</a></li>').css('display', 'none').prependTo('#task_list').fadeIn('slow');
+}
+
+function createTask(text) {
+	var id = uuid(),
+	task = {};
+	task.id = id;
+	task.text = text;
+
+	Dashboard.set(id, task);
+	render_task(task);
+	channel.trigger("client-new-task", {dashboard:{id:Dashboard.id, task: task}});
+	$('#task_list').listview('refresh');
+}
diff --git a/javascripts/scene.js b/javascripts/scene.js
@@ -0,0 +1,43 @@
+var camera, scene, renderer,
+    geometry, material, mesh;
+
+    init();
+    animate();
+
+    function init() {
+
+        scene = new THREE.Scene();
+
+        camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 1, 10000 );
+        camera.position.z = 1000;
+        scene.add( camera );
+
+        geometry = new THREE.CubeGeometry( 200, 200, 200 );
+        material = new THREE.MeshBasicMaterial( { color: 0xff0000, wireframe: true } );
+
+        mesh = new THREE.Mesh( geometry, material );
+        scene.add( mesh );
+
+        renderer = new THREE.CanvasRenderer();
+        renderer.setSize( window.innerWidth, window.innerHeight );
+
+        document.body.appendChild( renderer.domElement );
+
+    }
+
+    function animate() {
+
+        // Include examples/js/RequestAnimationFrame.js for cross-browser compatibility.
+        requestAnimationFrame( animate );
+        render();
+
+    }
+
+    function render() {
+
+        mesh.rotation.x += 0.01;
+        mesh.rotation.y += 0.02;
+
+        renderer.render( scene, camera );
+
+    }
diff --git a/javascripts/shared.js b/javascripts/shared.js
@@ -0,0 +1,75 @@
+// Enable pusher logging - don't include this in production
+Pusher.log = function(message) {
+  if (window.console && window.console.log) window.console.log(message);
+};
+
+// Flash fallback logging - don't include this in production
+WEB_SOCKET_DEBUG = true;
+var pusher = new Pusher('66921715ac8ef4dec222');
+var channel = pusher.subscribe('test_channel');
+
+pusher.connection.bind('connected', function() {
+	fetch_tasks();
+	after_connected();
+});
+
+pusher.connection.bind('unavailable', function() {
+	after_disconnected();
+});
+
+function getHash() {
+  var hash = window.location.hash;
+  return hash.substring(1); // remove #
+}
+
+var hash = getHash();
+var dashboard_id = uuid();
+
+if(hash=="") {
+	document.location.href = document.location.href + "#" + dashboard_id;
+} else {
+	dashboard_id = hash;
+}
+
+Dashboard.start(dashboard_id).inspect();
+
+function fetch_tasks() {
+	channel.trigger("client-fetch-tasks", {dashboard:{id:Dashboard.id, tasks: Dashboard.items}});
+}
+
+channel.bind('client-fetch-tasks', function(data) {
+	if(data.dashboard.id===Dashboard.id) {
+		var local_key, local_items = Dashboard.items, foreign_items = data.dashboard.items, foreign_key;
+
+		for(foreign_key in foreign_items) {
+			Dashboard.set(foreign_key, foreign_items[foreign_key]).inspect();
+		}
+
+		for(local_key in local_items) {
+			channel.trigger("client-update-task", {dashboard:{id: Dashboard.id, task: local_items[local_key]}});
+		}
+	}
+});
+
+channel.bind('client-new-task', function(data) {
+	if(data.dashboard.id===Dashboard.id) {
+		var task = data.dashboard.task;
+		Dashboard.set(task.id, task).inspect();
+		after_new_task(task);
+	}
+});
+
+channel.bind('client-update-task', function(data) {
+	if(data.dashboard.id===Dashboard.id) {
+		var task = data.dashboard.task;
+
+		Dashboard.get(task.id, function(err, t) {
+			//console.log(t);
+			if(t!==null) {
+			} else {
+				Dashboard.set(task.id, task).inspect();
+				after_update_task(task);
+			}
+		});
+	}
+});
diff --git a/javascripts/store+json2.min.js b/javascripts/store+json2.min.js