spontaneous 0.2.0.beta5 → 0.2.0.beta6

data/application/js/conflicted_field_dialogue.js

@@ -10,14 +10,14 @@ Spontaneous.ConflictedFieldDialogue = (function($, S) {
 			this.wrap = dom.div('#conflicted-fields-dialogue');
 		},
 		title: function() {
-			return "Conflicted Fields";
+			return 'Conflicted Fields';
 		},
 		width: function() {
 			return '90%';
 		},
 		buttons: function() {
 			var btns = {};
-			btns["Use"] = this.conflict_resolved.bind(this);
+			btns['Use'] = this.conflict_resolved.bind(this);
 			return btns;
 		},
 
@@ -41,7 +41,7 @@ Spontaneous.ConflictedFieldDialogue = (function($, S) {
 			}
 		},
 		home_created: function(data) {
-			window.location.href = S.Ajax.namespace
+			window.location.href = S.Ajax.namespace;
 		},
 		select_type: function(type) {
 			this.type = type;
@@ -59,7 +59,7 @@ Spontaneous.ConflictedFieldDialogue = (function($, S) {
 			var conflict = this.current_conflict(),
 			field = conflict.field,
 			instructions = dom.p('.instructions');
-			instructions.html("The field '"+field.label()+"' has been modified by another person. Please select which version you want to use.")
+			instructions.html("The field '"+field.label()+"' has been modified by another person. Please select which version you want to use.");
 			var view = field.conflict_view(this, conflict);
 			outer.append(instructions);
 			outer.append(view.panel());
@@ -83,7 +83,7 @@ Spontaneous.ConflictedFieldDialogue = (function($, S) {
 		},
 		cancel_button: function() {
 			return false;
-		},
+		}
 	});
 	return ConflictedFieldDialogue;
 })(jQuery, Spontaneous);

data/application/js/content.js

@@ -1,6 +1,7 @@
 // console.log('Loading Content...')
 
 Spontaneous.Content = (function($, S) {
+	'use strict';
 	var dom = S.Dom;
 
 	var Content = new JS.Class({
@@ -25,7 +26,7 @@ Spontaneous.Content = (function($, S) {
 			return this.content.target;
 		},
 		developer_description: function() {
-			return this.type().type + "["+this.id()+']';
+			return this.type().type + '['+this.id()+']';
 		},
 		developer_edit_url: function() {
 			return this.type().edit_url();
@@ -51,9 +52,6 @@ Spontaneous.Content = (function($, S) {
 			$.each(this.entries(), function(i, e) { e.unload(); });
 		},
 
-		has_fields: function() {
-			return this.field_list().length > 0;
-		},
 		field_list: function() {
 			var type = this.type(), prototypes = type.field_prototypes, names = type.field_names;
 			var fields = this.fields(), list = [];
@@ -103,19 +101,19 @@ Spontaneous.Content = (function($, S) {
 					type_class = this.constantize(prototype.type);
 					if (!type_class) {
 						console.warn(
-							"Content#fields:",
-							"Field has invalid type", prototype.type,
-							"content_id:", this.content.id,
-							"type:", "'"+type.title+"'",
-							"field_name:", f.name
+							'Content#fields:',
+							'Field has invalid type', prototype.type,
+							'content_id:', this.content.id,
+							'type:', "'"+type.title+"'",
+							'field_name:', f.name
 						);
 						type_class = Spontaneous.Field.String;
 					}
-					var field = new type_class(this, f);
+					var field = new type_class(this, f); // jshint ignore:line
 					// field.watch('value', this.field_updated.bind(this, field));
 					fields[f.name] = field;
 				}
-			};
+			}
 			return fields;
 		}.cache(),
 
@@ -147,7 +145,7 @@ Spontaneous.Content = (function($, S) {
 		},
 
 		has_fields: function() {
-			return (this.content.fields.length > 0)
+			return this.field_list().length > 0;
 		},
 
 		title: function() {
@@ -155,7 +153,15 @@ Spontaneous.Content = (function($, S) {
 		},
 
 		title_field: function() {
-			return this.fields()[this.type().title_field_name];
+			var self = this, title_field = self.fields()[self.type().title_field_name];
+			// if we're aliasing a page with a page then it's likely that the alias type
+			// won't have a title field (falling back to its target's value instead)
+			// so we need to fall back to the target's title field in that base
+			if (!title_field && self.type().is_alias()) {
+				var target = new Content(self.target());
+				title_field = target.title_field();
+			}
+			return title_field;
 		},
 
 		hidden: function() {
@@ -185,7 +191,7 @@ Spontaneous.Content = (function($, S) {
 		}.cache(),
 
 		has_boxes: function() {
-			return (this.boxes().length > 0)
+			return (this.boxes().length > 0);
 		},
 
 		wrap_entry: function(entry) {
@@ -193,7 +199,7 @@ Spontaneous.Content = (function($, S) {
 			if (entry.is_page) {
 				entry_class = Spontaneous.PageEntry;
 			}
-			return new entry_class(entry, this);
+			return new entry_class(entry, this); // jshint ignore:line
 		},
 
 		allowed_types: function() {
@@ -208,7 +214,7 @@ Spontaneous.Content = (function($, S) {
 			Spontaneous.Ajax.del(['/content', this.content.id].join('/'), {}, this.destroyed.bind(this));
 		},
 		toggle_visibility: function() {
-			Spontaneous.Ajax.patch(['/content', this.content.id, "toggle"].join('/'), {}, this.visibility_toggled.bind(this));
+			Spontaneous.Ajax.patch(['/content', this.content.id, 'toggle'].join('/'), {}, this.visibility_toggled.bind(this));
 		},
 		visibility_toggled: function(result) {
 			this.set('hidden', result.hidden);

data/application/js/content_area.js

@@ -11,14 +11,45 @@ Spontaneous.ContentArea = (function($, S) {
 		mode: 'edit',
 
 		init: function() {
-			this.wrap  = dom.div("#content-outer");
-			this.metaWrap = dom.div("#content-meta").hide();
-			this.inner = dom.div('#content');
-			this.preview = S.Preview.init(this.inner);
-			this.editing = S.Editing.init(this.inner);
-			this.service = S.Services.init(this.inner);
-			this.wrap.append(this.metaWrap, this.inner);
-			return this.wrap;
+			var self = this;
+			self.wrap = dom.div('#content-outer');
+			self.metaWrap = dom.div('#content-meta').hide();
+			self.inner = dom.div('#content');
+			self.inner.append(dom.div('#content-loading'));
+			self.configureScrollBottomHandler(self.inner);
+			self.preview = S.Preview.init(self.inner);
+			self.editing = S.Editing.init(self.inner);
+			self.service = S.Services.init(self.inner);
+			self.wrap.append(self.metaWrap, self.inner);
+			return self.wrap;
+		},
+		configureScrollBottomHandler: function(inner) {
+			inner.scroll(function(contentArea, div) {
+				var count = 0;
+				return function(e) {
+					var st = div.scrollTop()
+					, ih = div.innerHeight()
+					, sh = div[0].scrollHeight
+					// don't wait until we're at the exact bottom, but trigger a little bit earlier
+					// this should ideally be context sensitive, so that the trigger for short containers
+					// loads a bit earlier. This would mean that the first load of additional content would
+					// happen more promptly than later ones. Currently it's the inverse of that.
+, margin = 0.95
+					, bottom = ((st + ih) >= (sh * margin));
+					if (bottom) {
+						contentArea.set('scroll_bottom', (++count));
+					}
+				};
+			}(this, inner));
+		},
+		location_loading: function(destination) {
+			if (destination) {
+				this.wrap.addClass('loading');
+				this.current().showLoading();
+			} else {
+				this.wrap.removeClass('loading');
+				this.current().hideLoading();
+			}
 		},
 
 		location_changed: function(location) {
@@ -29,37 +60,35 @@ Spontaneous.ContentArea = (function($, S) {
 			this.current().display(S.Location.location());
 		},
 		current: function() {
-			this.exitMeta();
-			// YUK
-			if (this.mode === 'preview') {
-				this.editing.hide();
-				this.service.hide();
-				this.preview.show();
-				return this.preview;
-			} else if (this.mode === 'edit') {
-				this.preview.hide();
-				this.service.hide();
-				this.editing.show();
-				return this.editing;
-			} else if (this.mode === 'service') {
-				this.preview.hide();
-				this.editing.hide();
-				this.service.show();
-				return this.service;
+			var self = this, hide = [], active, editing = self.editing, service = self.service, preview = self.preview;
+			self.exitMeta();
+
+			if (self.mode === 'preview') {
+				hide = [editing, service];
+				active = preview;
+			} else if (self.mode === 'edit') {
+				hide = [preview, service];
+				active = editing;
+			} else if (self.mode === 'service') {
+				hide = [preview, editing];
+				active = service;
 			}
+			hide.forEach(function(el) { el.hide(); });
+			active.show();
+			return active;
 		},
 		goto_page: function(page) {
 			this.current().goto_page(page);
 		},
 		scroll_to_bottom: function(duration, delay) {
 
-			this.inner.delay(delay || 0).animate({ scrollTop:this.inner[0].scrollHeight }, (duration || 1000));
+			this.inner.delay(delay || 0).velocity({ scrollTop:this.inner[0].scrollHeight }, (duration || 1000));
 		},
 		showService: function(service) {
 			if (!this.modeBeforeService) {
 				this.modeBeforeService = this.mode;
 			}
-			this.mode = "service";
+			this.mode = 'service';
 			this.current().display(service.url);
 		},
 		hideService: function() {
@@ -71,24 +100,24 @@ Spontaneous.ContentArea = (function($, S) {
 			if (this.metaView === view) { return; }
 			this.metaView = view;
 			var outer = this.metaWrap.hide();
-			this.inner.animate({top: "100%"}, 300, function() {
-				if (view && typeof view.show === "function") {
+			this.inner.velocity({top: '100%'}, 300, function() {
+				if (view && typeof view.show === 'function') {
 					view.show(outer);
 				}
-				outer.fadeIn(300);
+				outer.velocity('fadeIn', 300);
 			});
 		},
 		exitMeta: function() {
 			if (!this.metaView) { return; }
-			if (typeof this.metaView.detach === "function") {
+			if (typeof this.metaView.detach === 'function') {
 				this.metaView.detach();
 			}
 			this.metaView = null;
 			var inner = this.inner, outer = this.metaWrap;
-			inner.animate({top: "0%"}, 300, function() {
+			inner.velocity({top: '0%'}, 300, function() {
 				outer.empty().hide();
 			});
-			outer.fadeOut(300);
+			outer.velocity('fadeOut', 300);
 		}
 	});
 	return ContentArea;

data/application/js/dialogue.js

@@ -28,16 +28,16 @@ Spontaneous.Dialogue = (function($, S) {
 			return ['button', (this.is_default ? 'default' : ''), this.label.toLowerCase().split(' ')[0]].join(' ');
 		},
 		disable: function() {
-			this.set_disabled(true)
+			this.set_disabled(true);
 		},
 		enable: function() {
-			this.set_disabled(false)
+			this.set_disabled(false);
 		},
 		set_disabled: function(state) {
 			this.disabled = state;
 			this.button.removeClass('disabled');
 			if (this.disabled) {
-				this.button.addClass('disabled')
+				this.button.addClass('disabled');
 			}
 		}
 	});
@@ -62,7 +62,7 @@ Spontaneous.Dialogue = (function($, S) {
 			return '50%';
 		},
 		title: function() {
-			return "Dialogue";
+			return 'Dialogue';
 		},
 		class_name: function() {
 			return '';
@@ -103,14 +103,14 @@ Spontaneous.Dialogue = (function($, S) {
 			if (this._open || !instance) { return; }
 			this._instance = instance;
 			instance.manager = this;
-			$('body').css("overflow", "hidden");
-			this.overlay().fadeIn(200);
+			$('body').css('overflow', 'hidden');
+			this.overlay().velocity('fadeIn', {duration: 200});
 			var c = this.container(), a = this._actions, b;
 			var buttons = instance.buttons(), button_map = {};
 			a.empty().append(dom.div('.spacer'));
 			b = instance.cancel_button();
 			if (b) {
-				button_map['cancel'] = b;
+				button_map.cancel = b;
 				button_map[instance.cancel_label().toLowerCase()] = b;
 				a.append(b.html());
 				$(document).bind('keydown.dialogue', function(event) {
@@ -139,7 +139,7 @@ Spontaneous.Dialogue = (function($, S) {
 			this.button_map = button_map;
 			this._body.empty().append(instance.body());
 
-			c.fadeIn(200);
+			c.velocity('fadeIn', {duration: 200});
 			this._open = true;
 		},
 
@@ -148,20 +148,20 @@ Spontaneous.Dialogue = (function($, S) {
 			, dialogueHeight = (+contentsHeight) + this._actions.outerHeight() + this._title.outerHeight()
 			, el = this._frame;
 			dialogueHeight = Math.max(dialogueHeight, 100);
-			if (contentsHeight && dialogueHeight <  this._originalHeight) {
-				el.animate({'height': dialogueHeight}, 400);
+			if (contentsHeight && dialogueHeight < this._originalHeight) {
+				el.velocity({'height': dialogueHeight}, 400);
 			}
 		},
 		disable_button: function(button_name) {
-			var button = this.button_map[button_name.toLowerCase()]
+			var button = this.button_map[button_name.toLowerCase()];
 			button.disable();
 		},
 		close: function() {
 			if (!this._instance || !this._open) { return; }
 			this._instance.cleanup();
 			this.container().remove();
-			this.overlay().fadeOut(200, function() {
-				$('body').css("overflow", "auto");
+			this.overlay().velocity('fadeOut', 200, function() {
+				$('body').css('overflow', 'auto');
 			});
 			this._instance = this._container = this._open = false;
 			$(document).unbind('keydown.dialogue');
@@ -185,10 +185,10 @@ Spontaneous.Dialogue = (function($, S) {
 				outline.append(title);
 				outline.append(body);
 				outline.append(controls_wrap);
-				wrap.append(outline)
+				wrap.append(outline);
 				$('#content').append(wrap);
 				this._originalHeight = outline.outerHeight();
-				console.log('orig height', this._originalHeight)
+				console.log('orig height', this._originalHeight);
 				this._frame = outline;
 				this._actions = actions;
 				this._title = title;
@@ -200,7 +200,7 @@ Spontaneous.Dialogue = (function($, S) {
 		overlay: function() {
 			if (!this._overlay) {
 				var o = dom.div('#dialogue-overlay').css('z-index', this.z_index()).hide();
-				$('#content').append(o)
+				$('#content').append(o);
 				this._overlay = o;
 			}
 			return this._overlay;

data/application/js/dom.js

@@ -1,7 +1,7 @@
 // console.log('Loading DOM...');
 
 Spontaneous.Dom = (function($, S) {
-	var tags = 'div p iframe a span strong img select option label ul li dl dt dd table tr td h1 h2 h3 h4 header input button form textarea optgroup'.split(' ');
+	var tags = 'div p iframe a span strong i img select option label ul li dl dt dd table tr td h1 h2 h3 h4 header input button form textarea optgroup'.split(' ');
 	var Dom = {
 		body: function() {
 			return $(document.body);
@@ -13,19 +13,19 @@ Spontaneous.Dom = (function($, S) {
 			return dim + 'px';
 		},
 		cmd_key_label: function(text, key) {
-			var cmd = ((window.navigator.platform.indexOf("Mac") === 0) ? "Cmd" : "Ctrl");
+			var cmd = ((window.navigator.platform.indexOf('Mac') === 0) ? 'Cmd' : 'Ctrl');
 			// var alt =  '<span class="key-combo">(' + cmd  + "+"+key+')</span>';
-			return this.key_label(text, cmd  + "+" +key);
+			return this.key_label(text, cmd + '+' +key);
 		},
 		key_label: function(text, key) {
-			var alt =  '<span class="key-combo">('+key+')</span>';
-			return text + " " + alt;
+			var alt = '<span class="key-combo">('+key+')</span>';
+			return text + ' ' + alt;
 		},
 		parse_selector: function(selector) {
 			var p, id = '', classes = [], result = {};
 			selector = selector || '';
 			if (typeof selector === 'string') {
-				p = selector.split('.')
+				p = selector.split('.');
 			} else if ($.isArray(selector)) {
 				p = selector;
 			}
@@ -42,10 +42,10 @@ Spontaneous.Dom = (function($, S) {
 				}
 			}
 			if (id !== '') {
-				result['id'] = id;
+				result.id = id;
 			}
 			if (classes.length > 0) {
-				result['class'] = classes.join(' ')
+				result['class'] = classes.join(' ');
 			}
 			return result;
 		},
@@ -56,7 +56,6 @@ Spontaneous.Dom = (function($, S) {
 		}
 	};
 	var generate = function(tag_name) {
-		var tag = '<'+tag_name+'/>';
 		return function(selector, params) {
 			if (typeof selector === 'object') {
 				if (!$.isArray(selector)) {
@@ -65,7 +64,7 @@ Spontaneous.Dom = (function($, S) {
 				}
 			}
 			var attrs = $.extend((params || {}), Dom.parse_selector(selector));
-			return $(tag, attrs);
+			return $(document.createElement(tag_name)).attr(attrs);
 		};
 	};
 	for (var i = 0, ii = tags.length; i < ii; i++) {