NetThings.Core.js

var Mike;
Mike = Mike || {};
Mike.NetThings = Mike.NetThings || {};

Mike.NetThings.Core = function () {

var applyMovable = function(target) {
	target.draggable({stop: dragStop});
};

var applyPortal = function(target, params) {
	var destination = params.destination;
	target.data('portal', function(object) { handlePortal(destination, object);});
	portals.push(target);
};

var handlePortal = function(destination, object){
	var objectId = object.attr('id');
	var objectSpec = placeObjects[objectId];
	delete placeObjects[objectId];
	objectState[destination][objectId] = objectSpec;
	object.hide();
	saveState();
};




var behaviorHandlers = {
'movable' : applyMovable,
'portal' : applyPortal
};

// hash where key is the page key, value is the page's objects
var initialState = {
'chaos' : {
			'greybox' :	{ name: '', top: 10, left: 50, height:30, width: 30, color: 'Grey', behaviors: [{type:'movable'}] },
			'redbox' : { name: '', top: 100, left: 100, height:50, width: 50, color: 'Red', behaviors: [{type:'movable'}] },
			'world1portal' : { name: '', top: 300, left: 600, height:100, width: 100, color: 'Black', behaviors: [{type:'portal', params : {destination:'world1'}}]} 
		  },
'world1' : {}
};


var objectState;
var placeObjects;
var portals = [];

var dragStop = function(e, ui) {
	// when someone finishes dragging an object, let's update its object state
	// and save it into a cookie
	
	var objectId = ui.helper.attr('id');
	placeObjects[objectId].top = ui.position.top;
	placeObjects[objectId].left = ui.position.left;
	
	handlePortals(ui.helper, ui.position);
	
	saveState();	
}

var handlePortals = function(object, position) {
	for(i=0;i<portals.length;i++)
	{
		var portal = portals[i];
		var portalPosition = portal.offset();
		
		var portalBottom = portalPosition.top + portal.height();
		var portalRight = portalPosition.left + portal.width();
		if (position.top > portalPosition.top && position.left > portalPosition.left 
			&& position.top < portalBottom && position.left < portalRight)
			{
				portal.data('portal')(object);
			}
	}
}

var clearSavedState = function() {
	createCookie('thingsState', '', -1);
};

var saveState = function() {
	objectState[inferPlace()] = placeObjects;
	createCookie('thingsState', JSON.stringify(objectState));
};

var loadState = function() {
	var stateJson = readCookie('thingsState');
	if (stateJson)
	{
		objectState = JSON.parse(stateJson);
	} else {
		objectState = initialState;
	}
	
	loadPlace();
};

var getPlaceObjects = function(place) {
	place = place || inferPlace();
	return objectState[place];
};

var inferPlace = function() {
	var pathParts = window.location.pathname.split('/');
	var lastPart = pathParts[pathParts.length - 1];
	var inferredPlace = lastPart.split('.')[0];
	return inferredPlace;
};

var loadPlace = function() {
	placeObjects = getPlaceObjects();
};

var render = function() {
	
	for (var i in placeObjects)
	{
		var objectSpec = placeObjects[i];
		var id = i;
		var objectHtml = "<div id='" + id + "' class='object'>" + objectSpec.name + "</div>";
		$('#objects').append(objectHtml);
		$('#' + id).css(
		{
			'top' : objectSpec.top,
			'left' : objectSpec.left,
			'height' : objectSpec.height,
			'width' : objectSpec.width,
			'background-color' : objectSpec.color
		});
		
		var behaviors = objectSpec.behaviors;
		
		for (j=0;j<behaviors.length;j++) {
			var behavior = behaviors[j];
			var handler = behaviorHandlers[behavior.type];
			handler($('#' + id), behavior.params);
		}
		
	}
};

return {
	render: render,
	loadState: loadState,
	clearSavedState: clearSavedState
};

}();