social_cheesecake 0.1.0 → 0.2.0

data/app/assets/javascripts/socialcheesecake/sector.js

@@ -5,27 +5,30 @@ var socialCheesecake = socialCheesecake || {};
 			center : { x : 0,  y : 0 },
 			rIn : 0,
 			rOut : 300,
-			delta : Math.PI / 2,
+			delta : Math.PI /2 ,
 			phi : 0,
 			label : "",
-			color : "#eeffee",
-			mouseover : { color : "#aaffaa" },
-			mouseout : { color : "#eeffee" },
-			mouseup : { color : "#77ff77" },
-			mousedown : { color : "#aaffaa" },
+			color : socialCheesecake.Cheesecake.getSectorFillColor(),
+			textAndStrokeColor : socialCheesecake.Cheesecake.getSectorTextAndStrokeColor(),
+			mouseover : { color : socialCheesecake.Cheesecake.getSectorHoverColor() },
+			mouseout : { color : socialCheesecake.Cheesecake.getSectorFillColor() },
+			mouseup : { color : socialCheesecake.Cheesecake.getSectorFillColor() },
+			mousedown : { color : socialCheesecake.Cheesecake.getSectorFocusColor() },
 			auxiliar : false
 		}
 		for(var property in defaultSettings) {
-			if(!(property in settings)) {
+			if(!(property in settings) || (settings[property]===undefined)) {
 				settings[property] = defaultSettings[property];
 			}
 		}
-		if(settings.phi < 0 || settings.phi > 2 * Math.PI) {
-			throw "Phi must be greater or equal to 0 and less than 2*pi";
+		settings.phi %= 2*Math.PI;
+		while(settings.phi <0){
+			settings.phi += 2*Math.PI;
 		}
 		if(settings.delta <= 0 || settings.delta > 2 * Math.PI) {
 			throw "Delta must be greater than 0 and less than 2*pi";
 		}
+		if(settings.id) this.id = settings.id;
 		this.x = settings.center.x;
 		this.y = settings.center.y;
 		this.rOut = settings.rOut;
@@ -34,11 +37,13 @@ var socialCheesecake = socialCheesecake || {};
 		this.delta = settings.delta;
 		this.label = settings.label;
 		this.color = settings.color;
+		this.textAndStrokeColor = settings.textAndStrokeColor;
 		this.mouseover = settings.mouseover;
 		this.mouseup = settings.mouseup;
 		this.mouseout = settings.mouseout;
 		this.mousedown = settings.mousedown;
 		this.subsectors = [];
+		this.extraSubsectors = [];
 		this.actors = [];
 		if(settings.parent != null) this.parent = settings.parent;
 		if(settings.simulate != null) this.simulate = settings.simulate;
@@ -49,7 +54,8 @@ var socialCheesecake = socialCheesecake || {};
 			var separation = (this.rOut - this.rIn) / settings.subsectors.length;
 			for(var i in settings.subsectors) {
 				var rOutSubsector = rInSubsector + separation;
-				var layer = new socialCheesecake.Subsector({
+				var subsector = new socialCheesecake.Subsector({
+					id : settings.subsectors[i].id,
 					label : settings.subsectors[i].name,
 					parent : this,
 					x : this.x,
@@ -59,11 +65,11 @@ var socialCheesecake = socialCheesecake || {};
 					rIn : rInSubsector,
 					rOut : rOutSubsector,
 					actors : settings.subsectors[i].actors,
-					mouseover : { color : "#aaffaa",
+					mouseover : { color : socialCheesecake.Cheesecake.getSectorHoverColor(),
 						callback : function(subsector) {
 							/* FIX FOR EXECUTING MOUSEOUT BEFORE MOUSEOVER */					
 							for(var i in subsector.parent.subsectors){
-								subsector.parent.subsectors[i].getRegion().addEventListener("mouseout", undefined);
+								subsector.parent.subsectors[i].getRegion().removeEventListener("mouseout");
 								if(subsector.parent.subsectors[i]!= subsector){
 								 subsector.parent.subsectors[i].changeColor(subsector.parent.subsectors[i].mouseout.color);
 								}
@@ -71,22 +77,30 @@ var socialCheesecake = socialCheesecake || {};
 							subsector.getRegion().addEventListener("mouseout", function() {
 								subsector.eventHandler('mouseout');
 							});
-							
+							/* END of FIX */							
 							document.body.style.cursor = "pointer";
-							subsector.parent.parent.grid.hideAll();
-							subsector.parent.parent.grid.fadeIn(subsector.actors, 300, true);				
+							subsector.getCheesecake().grid.hideAll();
+							subsector.getCheesecake().grid.fadeIn(subsector.actors, 300, true);
+							subsector.getCheesecake().setHighlightedSector(subsector);
 						}
 					},
 					mouseout :{
-						color : "#eeffee",
+						color : socialCheesecake.Cheesecake.getSectorFillColor(),
 						callback : function(subsector) {
 							document.body.style.cursor = "default";
-							subsector.parent.parent.grid.fadeIn(subsector.parent.actors, 300, true);
+							subsector.getCheesecake().grid.fadeIn(subsector.parent.actors, 300, true);
+							subsector.getCheesecake().setHighlightedSector(subsector.parent);
 						}
-					} 
+					},
+					mousedown : {
+						callback : function(subsector) {
+							var selectedActors = subsector.getCheesecake().grid.getSelectedActors();
+							subsector.changeMembership(selectedActors);
+						}
+					}
 				});
 				rInSubsector = rOutSubsector;
-				this.subsectors.push(layer);
+				this.subsectors.push(subsector);
 			}
 		}
 		this.originalAttr = {
@@ -97,6 +111,7 @@ var socialCheesecake = socialCheesecake || {};
 			rIn : this.rIn,
 			rOut : this.rOut,
 			color : this.color,
+			textAndStrokeColor : this.textAndStrokeColor,
 			label : this.label,
 			mouseover : this.mouseover,
 			mouseout : this.mouseout,
@@ -117,18 +132,10 @@ var socialCheesecake = socialCheesecake || {};
 		var rIn = this.rIn;
 		var rOut = this.rOut;
 		var color = this.color;
+		var textAndStrokeColor = this.textAndStrokeColor;
 		var label = this.label;
 		var actors = this.actors;
-		if(options != null) {
-			if(options.x != null) x = options.x;
-			if(options.y != null) y = options.y;
-			if(options.phi != null) phi = options.phi;
-			if(options.delta != null)  delta = options.delta;
-			if(options.rIn != null)  rIn = options.rIn;
-			if(options.rOut != null) rOut = options.rOut;
-			if(options.color != null)  color = options.color;
-			if(options.label != null) label = options.label;
-		}
+		
 		context.restore();
 		context.save();
 		context.beginPath();
@@ -138,11 +145,19 @@ var socialCheesecake = socialCheesecake || {};
 		context.closePath();
 		context.fillStyle = color;
 		context.fill();
-		context.lineWidth = 4;
+		context.lineWidth = 2;
+		context.strokeStyle = textAndStrokeColor;
 		context.stroke();
-		socialCheesecake.text.writeCurvedText(label, context, x, y, 0.75*rOut, phi, delta);		
+		if((this.auxiliar)&&(label=="+")){
+			socialCheesecake.text.addPlusCharacter(context, x, y, 0.5*(rOut-rIn) + rIn, 
+			phi, delta, textAndStrokeColor);
+		}else{
+			socialCheesecake.text.writeCurvedText(label, context, x, y, 0.7*(rOut-rIn) + rIn, 
+			phi, delta, textAndStrokeColor);
+		}				
 		if(!this.auxiliar)
-		socialCheesecake.text.writeCurvedText("(" + actors.length + ")", context, x, y, 0.6*rOut, phi, delta);
+			socialCheesecake.text.writeCurvedText("(" + actors.length + ")", context, x, y, 
+				0.55*(rOut-rIn) + rIn, phi, delta, textAndStrokeColor);
 	}
 	
 	socialCheesecake.Sector.prototype.getRegion = function() {
@@ -194,27 +209,111 @@ var socialCheesecake = socialCheesecake || {};
 		var rIn = this.rIn;
 		var sector = (this.simulate != null) ? cheesecake.sectors[this.simulate] :  this;
 		var subsectors = sector.subsectors;
+		var parts = subsectors.length * 2 + 1;
 
 		//Draw sector's subsectors over it
 		var subsectorRIn = rIn;
-		var separation = 0;
-		if(subsectors.length > 0)
-			separation = (rOut + rIn) / subsectors.length;
-		for(var i in subsectors) {
+		var extraWidth = (rOut - rIn) * 0.06;
+		var sectorWidth = (rOut - rIn - (parts - subsectors.length) * extraWidth) / subsectors.length;
+		var extraSettings = {
+			x : cheesecake.center.x,
+			y : cheesecake.center.y,
+			delta : delta,
+			phi : phi,
+			label : "+",
+			parent : this,
+			auxiliar : true,
+			color : socialCheesecake.Cheesecake.getExtraSectorFillColor(),
+			mouseover : {
+				color : socialCheesecake.Cheesecake.getExtraSectorHoverColor(),
+				callback : function (sector){
+					sector.resizeWidth({
+						width : extraWidth*1.5,
+						anchor : "m",
+						step : 1 
+					});
+				}
+			},
+			mouseout : {
+				color : socialCheesecake.Cheesecake.getExtraSectorFillColor(),
+				callback : function(sector){
+					sector.resizeWidth({
+						width : extraWidth,
+						anchor : "m",
+						step : 1,
+						priority : true 
+					})
+				}
+			}
+		}		
+		//Add sector's subsectors
+		for(var i in subsectors){			
+			rIn += extraWidth;
 			subsectors[i].rIn = rIn;
-			subsectors[i].rOut = rIn + separation;
+			subsectors[i].rOut = rIn + sectorWidth;
 			subsectors[i].phi = phi;
 			subsectors[i].delta = delta;
 			cheesecake.stage.add(subsectors[i].getRegion());
-			rIn += separation;
+			rIn += sectorWidth;
+		}
+		//Add extra subsectors 
+		rIn = 0;
+		for(var i = 0; i< parts- subsectors.length; i++){			
+			if(i == 0){
+				var extraSettingsFirst = {
+					x : cheesecake.center.x,
+					y : cheesecake.center.y,
+					rIn : rIn,
+					rOut : rIn +extraWidth,
+					delta : delta,
+					phi : phi,
+					label : "+",
+					parent : this,
+					auxiliar : true,
+					color : socialCheesecake.Cheesecake.getExtraSectorFillColor(),
+					mouseover : {
+						color : socialCheesecake.Cheesecake.getExtraSectorHoverColor(),
+						callback : function (sector){
+							sector.resizeWidth({
+								width : extraWidth*1.5,
+								anchor : "rin",
+								step : 1 
+							});
+						}
+					},
+					mouseout : {
+						color : socialCheesecake.Cheesecake.getExtraSectorFillColor(),
+						callback : function(sector){
+							sector.resizeWidth({
+								width : extraWidth,
+								anchor : "rin",
+								step : 1,
+								priority : true 
+							})
+						}
+					}
+				}
+				var extraSector = new socialCheesecake.Subsector(extraSettingsFirst);  
+			}else{
+				extraSettings["rIn"]= rIn;
+				extraSettings["rOut"]= rIn + extraWidth;
+				var extraSector = new socialCheesecake.Subsector(extraSettings); 
+			}
+			cheesecake.stage.add(extraSector.getRegion());
+			this.extraSubsectors.push(extraSector);
+			rIn += extraWidth + sectorWidth;
 		}
 	}
 	
 	socialCheesecake.Sector.prototype.putTogether = function() {
 		var cheesecake = this.getCheesecake();
-		var sector; (this.simulate != null) ? sector = cheesecake.sectors[this.simulate] : sector = this;
+		var sector = (this.simulate != null) ? cheesecake.sectors[this.simulate] : this;
 		var subsectors = sector.subsectors;
+		var extraSubsectors = this.extraSubsectors;
 		//Clear subsectors from stage
+		for(var i = extraSubsectors.length ; i>0 ; i--){
+			cheesecake.stage.remove((extraSubsectors.pop()).getRegion());
+		}
 		for(var i in subsectors) {
 			cheesecake.stage.remove(subsectors[i].getRegion());
 		}
@@ -233,17 +332,14 @@ var socialCheesecake = socialCheesecake || {};
 	}
 	
 	/**
-	*
-	* Options: 
-	*	delta - new delta to achieve
-	*	context - sector context to work with
-	*	step - sets the animation speed
-	*	anchor - "beginning" , "b", "B"
-	*	"middle", "m", "M"
-	*	"end", "e", "E"
-	*
-	**/
-	socialCheesecake.Sector.prototype.resize = function(options) {
+	 	* Options: 
+		*	delta - new delta to achieve (default: Math.PI/2)
+		*	step - sets the animation speed (default: 0.05)
+		*	anchor - 	"beginning" , "b", "B"
+		*						"middle", "m", "M"
+		*						"end", "e", "E"
+	 */
+	socialCheesecake.Sector.prototype.resizeDelta = function(options) {
 		if(!options)
 			throw "No arguments passed to the function";
 		var sector = this;
@@ -254,10 +350,15 @@ var socialCheesecake = socialCheesecake || {};
 		var step = 0.05;
 		var goalDelta = Math.PI / 2;
 		var anchor = 1;
+		
 		if(options.step) step = options.step;
 		if(options.delta) {
 			goalDelta = options.delta;
 		}
+		console.log("resizing delta of sector "+ sector.label);
+		console.log("current delta "+ currentDelta);
+		console.log("delta to achieve "+ goalDelta);
+		
 		if(options.anchor) {
 			if((options.anchor.toLowerCase() == "b") || (options.anchor == "beginning"))
 				anchor = 0;
@@ -266,7 +367,7 @@ var socialCheesecake = socialCheesecake || {};
 			if((options.anchor.toLowerCase() == "e") || (options.anchor == "end"))
 				anchor = 1;
 		}
-
+		//Calculate new parameters
 		if(currentDelta > goalDelta) {
 			if(currentDelta - goalDelta < step) step = currentDelta - goalDelta;
 			currentDelta -= step;
@@ -278,24 +379,108 @@ var socialCheesecake = socialCheesecake || {};
 		}
 		sector.delta = currentDelta;
 		sector.phi = currentPhi;
-
+		
+		//Redraw
 		context.restore();
 		context.save();
 		stage.draw();
+		//Repeat if necessary
 		if(currentDelta != goalDelta) {
 			requestAnimFrame(function() {
-				sector.resize(options);
+				sector.resizeDelta(options);
 			});
 		} else if(options.callback) {
 			options.callback();
 		}
 	}
-	
+
+	/**
+	 	* Options: 
+		*	width - new width to achieve
+		*	step - sets the animation speed
+		*	anchor - 	"rIn" , "rin", "in", "I", "i"
+		*						"middle", "m", "M"
+		*						"rOut", "rout", "out", "O", "o"
+		* priority - true to terminate other resizeWidth methods running
+	 */
+	socialCheesecake.Sector.prototype.resizeWidth = function(options) {
+		var sector = this;
+		var context = sector.getRegion().layer.getContext();
+		var stage = sector.getCheesecake().stage;
+		var currentRIn = this.rIn;
+		var currentROut = this.rOut;
+		var currentWidth = (currentROut - currentRIn);
+		var step = 0.05;
+		var goalWidth = currentWidth;
+		var anchor = 1;
+		var grow = 0;
+		var error = false;
+		var goOn = true;
+		if(options.step) step = options.step;
+		if(options.width) goalWidth = options.width;
+		if(goalWidth < 0) throw "Width must be greater than or equal to zero";
+		if(options.anchor) {
+			if((options.anchor.toLowerCase() == "i") || (options.anchor == "in") 
+					|| (options.anchor.toLowerCase() == "rin")){
+				anchor = 1;
+			}
+			if((options.anchor.toLowerCase() == "m") || (options.anchor == "middle")){
+				anchor = 0.5;
+			}
+			if((options.anchor.toLowerCase() == "o") || (options.anchor == "out")
+					|| (options.anchor.toLowerCase() == "rout")){
+				anchor = 0;
+			}
+		}
+		//Calculate new parameters
+		if(currentWidth > goalWidth) {
+			//Make more little
+			if(currentWidth - goalWidth < step) step = currentWidth - goalWidth;	
+			grow = -1;
+		} else if(currentWidth < goalWidth) {
+			//Make bigger
+			if(goalWidth - currentWidth < step)	step = goalWidth - currentWidth;
+			grow = 1;
+		}
+		if(options.priority) sector.grow =grow;
+		if((sector.grow!=null)&&(grow != sector.grow)){
+			goOn =false;
+		}else{
+			goOn = true;
+			sector.grow = grow;
+		}
+		currentROut = currentROut + (grow * anchor * step);
+		currentRIn = currentRIn - (grow * (1 - anchor) * step);
+		currentWidth = currentROut - currentRIn;
+		if(currentRIn <0 || currentROut <0){
+			console.log("WARNING!! Width cannot change anymore. It has reached it maximum/ minimum level.");
+			error =true;
+		}else{
+			sector.rOut = currentROut;
+			sector.rIn = currentRIn;
+			//Redraw
+			context.restore();
+			context.save();
+			stage.draw();
+		}
+		//Repeat if necessary
+		if ((goOn) &&(!error && Math.round(currentWidth *1000) != Math.round(goalWidth *1000))) {
+			requestAnimFrame(function() {
+				sector.resizeWidth(options);
+			});
+		} else{
+			sector.grow= undefined;
+			if(options.callback) {
+				options.callback();
+			}
+		}
+	}
+		
 	socialCheesecake.Sector.prototype.focus = function() {
 		var sector = this;
 		var context = sector.getRegion().layer.getContext();
 		var stage = sector.getCheesecake().stage;
-		sector.rOut *= 1.05;
+		sector.rOut = sector.originalAttr.rOut * 1.05;
 		context.restore();
 		context.save();
 		stage.draw();
@@ -344,7 +529,9 @@ var socialCheesecake = socialCheesecake || {};
 		} else if(phiDestination < currentPhi) {
 			grow = -1;
 		}
-		if(Math.round(((2 * Math.PI) - Math.abs(phiDestination - currentPhi) ) * 1000) / 1000 >= Math.round(Math.abs(phiDestination - currentPhi) * 1000) / 1000) {
+		if(Math.round(((2 * Math.PI) - Math.abs(phiDestination - currentPhi) ) * 1000) / 1000 
+			>= Math.round(Math.abs(phiDestination - currentPhi) * 1000) / 1000) {
+				
 			if(Math.abs(phiDestination - currentPhi) < step)
 				step = Math.abs(phiDestination - currentPhi);
 			currentPhi += (grow * step);
@@ -383,14 +570,14 @@ var socialCheesecake = socialCheesecake || {};
 		}
 	}
 	
-	socialCheesecake.Sector.prototype.addActor = function(actor_info , subsector){
+	socialCheesecake.Sector.prototype.addActor = function(actorInfo , subsector){
 		var actors = this.actors;
 		var actor;
 		
 		//Check if the actor is already in the array
 		var actorAlreadyDeclared = false;
 		for (var i in actors){
-			if (actors[i].id == actor_info.id){
+			if (actors[i].id == actorInfo.id){
 				actorAlreadyDeclared = true;
 				actor = actors[i];
 				//Check if the subsector has already been declared a parent of the actor
@@ -404,17 +591,43 @@ var socialCheesecake = socialCheesecake || {};
 		// If the actor was not in the array, ask the parent or the grid for it
 		if(!actorAlreadyDeclared){		
 			if (this == subsector){
-				actor = this.parent.addActor(actor_info, subsector);
+				actor = this.parent.addActor(actorInfo, subsector);
 			}else{
-				actor = this.parent.grid.addActor(actor_info, subsector);
+				actor = this.parent.grid.addActor(actorInfo, subsector);
 			}
 			actors.push(actor);
 		}
 		return actor;
 	}
 	
+	socialCheesecake.Sector.prototype.removeActor = function (actor){
+		var actors = this.actors;
+		var actorParents;
+		var actorPresentInSector = false;
+		
+		for(var actorIndex in actors){
+			if(actors[actorIndex].id == actor.id){
+				actorParents = actor.parents;
+				//Find out if there is a subsector in this sector with this actor
+				for (var parent in actorParents){
+					for (var subsector in this.subsectors){
+						if(actorParents[parent] === this.subsectors[subsector]){
+							actorPresentInSector = true;
+							break;
+						}
+					}						
+				}
+				//If there isn't, remove the actor from the array and tell the Grid
+				if(!actorPresentInSector){
+					actors.splice(actorIndex,1);
+				}
+			}
+		}
+	}
+	
 	/*SUBSECTOR*/
 	socialCheesecake.Subsector = function(settings) {
+		this.id = settings.id;
 		if(settings.parent != null) this.parent = settings.parent;		
 		this.label = "";
 		if(settings.label != null) this.label = settings.label;
@@ -425,6 +638,9 @@ var socialCheesecake = socialCheesecake || {};
 		this.phi = settings.phi;
 		this.delta = settings.delta;
 		this.actors = [];
+		this.auxiliar = (settings.auxiliar) ? settings.auxiliar : false;
+		if(settings.color) this.color = settings.color;
+		if(settings.textAndStrokeColor) this.textAndStrokeColor = settings.textAndStrokeColor;
 		if(settings.mousedown != null) this.mousedown = settings.mousedown;
 		if(settings.mouseup != null) this.mouseup = settings.mouseup; 
 		if(settings.mouseover != null) this.mouseover = settings.mouseover; 
@@ -432,9 +648,10 @@ var socialCheesecake = socialCheesecake || {};
 
 		var grid = this.getCheesecake().grid;
 		if (settings.actors){
-			for( var actor in settings.actors){
+			for(var actor in settings.actors){
 				var actor_info = {
-					id : settings.actors[actor][0]
+					id : settings.actors[actor][0],
+					name : settings.actors[actor][1]
 				}
 				this.addActor(actor_info ,this);
 			}
@@ -442,6 +659,7 @@ var socialCheesecake = socialCheesecake || {};
 	}
 	
 	socialCheesecake.Subsector.prototype = new socialCheesecake.Sector({
+		id : this.id,
 		parent : this.parent,
 		center : {  x : this.x, y : this.y },
 		label : this.label,
@@ -449,6 +667,9 @@ var socialCheesecake = socialCheesecake || {};
 		rOut : this.rOut,
 		phi : this.phi,
 		delta : this.delta,
+		auxiliar : this.auxiliar,
+		color : this.color,
+		textAndStrokeColor : this.textAndStrokeColor,
 		
 		mouseover : this.mouseover,
 		mouseout : this.mouseout,
@@ -460,4 +681,47 @@ var socialCheesecake = socialCheesecake || {};
 		var subsector = this;
 		return subsector.parent.parent;
 	}
+	
+	socialCheesecake.Subsector.prototype.removeActor = function(actor){
+		var actors = this.actors;
+		var actorParents;
+		for(var actorIndex in actors){
+			if(actors[actorIndex].id == actor.id){
+				actorParents = actor.parents;
+				//Remove subsector from actors parents array
+				for( var parent in actorParents){
+					if (actorParents[parent] === this){
+						actorParents.splice(parent,1);
+					}
+				}
+				//Remove from actors array and tell the sector parent
+				actors.splice(actorIndex,1);
+				this.parent.removeActor(actor);
+			}
+		}
+	}
+	
+	socialCheesecake.Subsector.prototype.changeMembership = function(actors){
+		var actualActors = this.actors;
+		var actorInfo;
+		var isMember = false;
+		
+		for(var i in actors){
+			for ( var j in actualActors){
+				if (actualActors[j].id == actors[i].id){
+					isMember = true;
+					this.removeActor(actors[i]);
+					break;
+				}
+			}
+			if(!isMember){
+				actorInfo = { id : actors[i].id};
+				this.addActor(actorInfo, this);
+			}
+			this.getCheesecake().updateActorMembership(actors[i].id);
+			isMember = false;
+		}
+		this.getCheesecake().calculatePortions();
+	}
+
 })();

data/app/assets/javascripts/socialcheesecake/text.js

@@ -1,11 +1,34 @@
 var socialCheesecake = socialCheesecake || {}; (function() {
 	socialCheesecake.text = {
-		writeCurvedText : function(text, context, x, y, r, phi, delta) {
+		addPlusCharacter : function(context, x, y, r, phi, delta, color) {
 			context.font = "bold 14px sans-serif";
-			context.fillStyle = '#000';
+			context.fillStyle = color || "#000";
+  		context.textAlign = "center";
+			context.textBaseline = "middle";
+			text = "+";
+			context.translate(x, y);
+			context.rotate(- delta / 2 - phi - Math.PI / 2);
+			context.fillText(text[0], 0, r);
+			context.restore();
+			context.save();
+		},
+		writeCurvedText : function(text, context, x, y, r, phi, delta, color) {
+			context.font = "bold 14px sans-serif";
+			context.fillStyle = color || "#000";
 			context.textBaseline = "middle";
 			var medium_alpha = Math.tan(context.measureText(text).width / (text.length * r));
+			var old_text = null;
+			var original_text = text;
 			while(medium_alpha * (text.length + 4) > delta) {
+				if(old_text==text){
+					console.log("WARNING: Infinite loop detected and stopped. Text '" + original_text + "' failed to be " + 
+								"correctly truncated. Proccesed serveral times as '" + text + "' and will be returned as '" + 
+								words[0].substring(0, delta/medium_alpha - 7) + "'. Space too small to even be able to truncate.")								
+					text = words[0].substring(0, delta/medium_alpha - 7);
+					break;
+				}else{
+					old_text = text;
+				}
 				words = text.split(" ");
 				if(words.length > 1){
 					words.splice(words.length - 1, 1);

data/lib/social_cheesecake/version.rb

@@ -1,3 +1,3 @@
 module SocialCheesecake
-  VERSION = "0.1.0"
+  VERSION = "0.2.0"
 end