spontaneous 0.1.0.alpha1

data/application/js/edit_dialogue.js

@@ -0,0 +1,137 @@
+// console.log('Loading EditDialogue...')
+
+Spontaneous.EditDialogue = (function($, S) {
+	var dom = S.Dom, Dialogue = Spontaneous.Dialogue;
+
+	var EditDialogue = new JS.Class(Dialogue, {
+		initialize: function(content) {
+			this.content = content;
+		},
+		buttons: function() {
+			var save_label = "Save (" + ((window.navigator.platform.indexOf("Mac") === 0) ? "Cmd" : "Ctrl") + "+s)", btns = {};
+			btns[save_label] = this.save.bind(this);
+			return btns;
+		},
+		id: function() {
+			return this.content.id();
+		},
+		uid: function() {
+			return this.content.uid() + '!editing';
+		},
+		save: function() {
+			var values = this.form.serializeArray();
+			var field_data = new FormData();
+			var size = 0;
+			$.each(values, function(i, v) {
+				field_data.append(v.name, v.value);
+				size += (v.name.length + v.value.length);
+			});
+			$('> *', this.form).animate({'opacity': 0.3}, 400, function() {
+				Spontaneous.UploadManager.form(this, field_data, size);
+				$.each(this.content.file_fields(), function() {
+					this.save();
+				});
+			}.bind(this));
+			return false;
+		},
+
+		upload_progress: function(position, total) {
+			console.log('EditDialogue.upload_progress', position, total)
+		},
+		upload_complete: function(response) {
+			var fields = response.fields;
+			for (var i = 0, ii = fields.length; i < ii; i++) {
+				var values = fields[i], field = this.content.field(values.name);
+				field.update(values);
+			}
+			this.close();
+		},
+		cleanup: function() {
+			S.Popover.close();
+
+			var fields = this.content.field_list();
+			for (var i = 0, ii = fields.length; i < ii; i++) {
+				var field = fields[i];
+				field.close_edit();
+			}
+			$(':input', this.form).add(document).unbind('keydown.savedialog');
+		},
+		body: function() {
+			var editing = dom.form('#editing', {'enctype':'multipart/form-data', 'method':'post'});
+			var outer = dom.div();
+			outer.append(dom.div('.field-group-bg.text'));
+			outer.append(dom.div('.field-group-bg.image'));
+			var text_field_wrap = dom.div('.field-group.text');
+			var image_field_wrap = dom.div('.field-group.image');
+			var text_fields = this.content.text_fields();
+			var submit = dom.input({'type':'submit'});
+
+			for (var i = 0, ii = text_fields.length; i < ii; i++) {
+				var field = text_fields[i];
+				text_field_wrap.append(this.field_edit(field));
+			}
+			outer.append(text_field_wrap);
+			var image_fields = this.content.image_fields();
+
+			for (var i = 0, ii = image_fields.length; i < ii; i++) {
+				var field = image_fields[i];
+				image_field_wrap.append(this.field_edit(field));
+			}
+			outer.append(image_field_wrap);
+			outer.append(submit);
+			editing.append(outer);
+			__dialogue = this;
+			// activate the highlighting
+			$('input, textarea', editing).focus(function() {
+				__dialogue.field_focus(this);
+			}).blur(function() {
+				// $(this).parents('.field').first().removeClass('focus');
+			});
+			editing.submit(this.save.bind(this));
+			this.form = editing;
+			$(':input', this.form).add(document).bind('keydown.savedialog', function(event) {
+				var s_key = 83;
+				if ((event.ctrlKey || event.metaKey) && event.keyCode === s_key) {
+					this.save();
+					return false;
+				}
+			}.bind(this));
+			return this.form;
+		},
+		field_focus: function(input) {
+			var text_fields = this.content.text_fields(), active_field = false;
+			for (var i = 0, ii = text_fields.length; i < ii; i++) {
+				var field = text_fields[i];
+				if (field.input()[0] === input) {
+					active_field = field;
+					break;
+				}
+			}
+			if (active_field === this.active_field) { return; }
+			if (this.active_field) {
+				this.active_field.on_blur();
+			}
+			if (active_field) {
+				this.active_field = active_field;
+				this.active_field.on_focus();
+			}
+		},
+		field_edit: function(field) {
+			var d = dom.div('.field');
+			d.append(dom.label('.name', {'for':field.css_id()}).html(field.label()));
+			var toolbar = field.toolbar();
+			if (toolbar) {
+				d.append(dom.div('.toolbar').html(toolbar));
+			}
+			var edit = field.edit();
+			d.append(dom.div('.value').html(edit));
+			var footer = field.footer();
+			if (footer) {
+				d.append(dom.div('.footer').html(footer));
+			}
+			return d;
+		}
+	});
+	return EditDialogue;
+})(jQuery, Spontaneous);
+

data/application/js/edit_panel.js

@@ -0,0 +1,232 @@
+// console.log('Loading EditPanel...')
+
+Spontaneous.EditPanel = (function($, S) {
+	var dom = S.Dom, Dialogue = Spontaneous.Dialogue;
+
+	var EditPanel = new JS.Class(Dialogue, {
+		initialize: function(parent_view) {
+			this.parent_view = parent_view;
+		},
+		buttons: function() {
+			var save_label = "Save (" + ((window.navigator.platform.indexOf("Mac") === 0) ? "Cmd" : "Ctrl") + "+s)", btns = {};
+			btns[save_label] = this.save.bind(this);
+			return btns;
+		},
+
+		id: function() {
+			return this.parent_view.id();
+		},
+
+		schema_id: function() {
+
+		},
+
+		uid: function() {
+			return this.parent_view.uid() + '!editing';
+		},
+
+		save: function() {
+			var fields = this.parent_view.field_list();
+			console.log('save', fields)
+			S.Ajax.test_field_versions(this.parent_view, fields, this.upload_values.bind(this), this.upload_conflict.bind(this));
+
+			return false;
+		},
+
+		upload_values: function() {
+			var values = this.form.serializeArray();
+			var field_data = new FormData();
+			var size = 0;
+			$.each(values, function(i, v) {
+				field_data.append(v.name, v.value);
+				size += (v.name.length + v.value.length);
+			});
+			$('> *', this.form).animate({'opacity': 0.3}, 400);
+			if (values.length > 0) {
+				Spontaneous.UploadManager.form(this, field_data, size);
+			} else {
+				this.close();
+			}
+			$.each(this.parent_view.file_fields(), function() {
+				this.save();
+			});
+		},
+
+		save_path: function() {
+			return this.parent_view.save_path();
+		},
+
+		upload_progress: function(position, total) {
+			// console.log('EditPanel.upload_progress', position, total)
+		},
+
+		upload_complete: function(response) {
+			this.parent_view.save_complete(response);
+			this.close();
+		},
+
+
+		upload_failed: function(event) {
+			// console.log("FAILED", event)
+		},
+
+		upload_conflict: function(conflict_data) {
+			console.log('conflicted_fields', conflict_data)
+			var dialogue = new S.ConflictedFieldDialogue(this, conflict_data);
+			dialogue.open();
+		},
+
+		conflicts_resolved: function(conflict_list) {
+			console.log('conflicts resolved', conflict_list)
+			var ff = this.parent_view.field_list(), conflicts = {};
+			for (var i =0, ii = conflict_list.length; i < ii; i++) {
+				var conflict = conflict_list[i];
+				conflicts[conflict.field.schema_id()] = conflict;
+			}
+			for (var i = 0, ii = ff.length; i < ii; i++) {
+				var field = ff[i], conflict = conflicts[field.schema_id()];
+				if (conflict) {
+					console.log(">>> conflicts_resolved", field, conflict.version)
+					field.set_edited_value(conflict.value);
+					field.set_version(conflict.version);
+				}
+			}
+			// no need to animate as the dialog is over the top
+			// $('> *', this.form).css({'opacity': 1});
+		},
+
+		cancel: function() {
+			var fields = this.parent_view.field_list();
+			for (var i = 0, ii = fields.length; i < ii; i++) {
+				fields[i].cancel_edit();
+			}
+			this.close();
+			return false;
+		},
+
+		close: function() {
+			S.Popover.close();
+
+			var fields = this.parent_view.field_list();
+			for (var i = 0, ii = fields.length; i < ii; i++) {
+				fields[i].close_edit();
+			}
+			$(':input', this.form).add(document).unbind('keydown.savedialog');
+			if (typeof this.parent_view.edit_closed === 'function') {
+				this.parent_view.edit_closed();
+			}
+		},
+
+		view: function() {
+			var _save_ = this.save.bind(this);
+			var _cancel_ = this.cancel.bind(this);
+			var get_toolbar = function(class_name) {
+				var save = dom.a('.button.save').html(dom.cmd_key_label('Save', 's')).click(_save_);
+				var cancel = dom.a('.button.cancel').html(dom.key_label('Cancel', 'Esc')).click(_cancel_);
+				var shadow = dom.div('.indent');
+				var buttons = dom.div('.buttons').append(cancel).append(save);
+				var toolbar = dom.div('.editing-toolbar').append(shadow).append(buttons);
+				if (class_name) { toolbar.addClass(class_name); }
+				return toolbar;
+			};
+			var editing = dom.form(['.editing-panel', this.parent_view.depth_class()], {'enctype':'multipart/form-data', 'method':'post'})
+			var toolbar = get_toolbar();
+			var outer = dom.div('.editing-fields');
+			var text_field_wrap = dom.div('.field-group.text');
+			var image_field_wrap = dom.div('.field-group.image');
+			var text_fields = this.parent_view.text_fields();
+			var submit = dom.input({'type':'submit'});
+			editing.append(toolbar);
+			for (var i = 0, ii = text_fields.length; i < ii; i++) {
+				var field = text_fields[i];
+				text_field_wrap.append(this.field_edit(field));
+			}
+			if (text_fields.length > 0) {
+				outer.append(text_field_wrap);
+			}
+			var image_fields = this.parent_view.image_fields();
+
+			for (var i = 0, ii = image_fields.length; i < ii; i++) {
+				var field = image_fields[i];
+				image_field_wrap.append(this.field_edit(field));
+			}
+			if (image_fields.length > 0) {
+				outer.append(image_field_wrap);
+			}
+			outer.append(submit);
+			editing.append(outer);
+			editing.append(dom.div('.clear'));
+			editing.append(get_toolbar('bottom'));
+			__dialogue = this;
+			// activate the highlighting
+			$('input, textarea', editing).focus(function() {
+				__dialogue.field_focus(this);
+			}).blur(function() {
+				// $(this).parents('.field').first().removeClass('focus');
+			});
+			editing.submit(this.save.bind(this));
+			this.form = editing;
+			$(':input', this.form).add(document).bind('keydown.savedialog', function(event) {
+				var s_key = 83, esc_key = 27;
+				if ((event.ctrlKey || event.metaKey) && event.keyCode === s_key) {
+					this.save();
+					return false;
+				} else {
+					if (event.keyCode === esc_key) {
+						_cancel_();
+					}
+				}
+			}.bind(this));
+			return this.form;
+		},
+		on_show: function(focus_field) {
+			if (!focus_field || !(focus_field['focus']) || !focus_field.accepts_focus) { focus_field = null; }
+			var focus_field = focus_field || this.parent_view.text_fields()[0];
+			if (focus_field) {
+				focus_field.focus();
+			}
+		},
+		field_focus: function(input) {
+			var text_fields = this.parent_view.text_fields(), active_field = false;
+			for (var i = 0, ii = text_fields.length; i < ii; i++) {
+				var field = text_fields[i];
+				if (field.input()[0] === input) {
+					active_field = field;
+					break;
+				}
+			}
+			if (active_field === this.active_field) { return; }
+			if (this.active_field) {
+				this.active_field.on_blur();
+			}
+			if (active_field) {
+				this.active_field = active_field;
+				this.active_field.on_focus();
+			}
+		},
+		field_edit: function(field) {
+			var d = dom.div('.field');
+			// d.append($(dom.label, {'class':'name', 'for':field.css_id()}).html(field.label()));
+			var label = dom.label('.name', {'for':field.css_id()}).html(field.label());
+			if (field.type.comment) {
+			var comment = dom.span('.comment').text('('+field.type.comment+')');
+			label.append(comment)
+			}
+			d.append(label);
+			var toolbar = field.toolbar();
+			if (toolbar) {
+				d.append(dom.div('.toolbar').html(toolbar));
+			}
+			var edit = field.edit();
+			d.append(dom.div('.value').append(edit));
+			var footer = field.footer();
+			if (footer) {
+				d.append(dom.div('.footer').html(footer));
+			}
+			return d;
+		}
+	});
+	return EditPanel;
+})(jQuery, Spontaneous);
+
+

data/application/js/editing.js

@@ -0,0 +1,42 @@
+// console.log('Loading Editing Interface...')
+
+Spontaneous.Editing = (function($, S) {
+	var dom = S.Dom, Page = S.Page;
+
+	var Editing = new JS.Singleton({
+		include: Spontaneous.Properties,
+
+		init: function(container) {
+			this.container = dom.div('#data_pane');
+			this.container.hide();
+			container.append(this.container);
+			return this;
+		},
+		display: function(page) {
+			this.goto_page(page);
+		},
+		goto_page: function(page) {
+			if (!page) { return; }
+			this.container.show().fadeOut(0)
+			S.Ajax.get('/page/{id}'.replace('{id}', page.id), this.page_loaded.bind(this));
+			this.set('location', page);
+		},
+		page_loaded: function(page_data) {
+			var page = this.get('page');
+			if (page) { page.unload(); }
+			page = new Page(page_data);
+			view = new S.Views.PageView(page);
+			this.container.empty();
+			this.container.append(view.panel());
+			this.set('page', page);
+			this.container.fadeIn(300);
+		},
+		hide: function() {
+			this.container.hide();
+		},
+		show: function() {
+			this.container.show();
+		}
+	});
+	return Editing;
+})(jQuery, Spontaneous);

data/application/js/entry.js

@@ -0,0 +1,13 @@
+// console.log('Loading Entry...')
+
+Spontaneous.Entry = (function($, S) {
+	var dom = S.Dom, user = S.User;
+
+	var Entry = new JS.Class(Spontaneous.Content, {
+		initialize: function(content, container) {
+			this.container = container;
+			this.callSuper(content);
+		},
+	});
+	return Entry;
+})(jQuery, Spontaneous);

data/application/js/extensions.js

@@ -0,0 +1,104 @@
+if (!window.console) {
+	window.console = {
+		log: function() {},
+		warn: function() {},
+		error: function() {},
+	};
+} else {
+	// var debug = Spontaneous.debug;
+	// window.__console = window.console;
+	// window.console = {
+	// 	log: function() {
+	// 		if (debug) { window.__console.log.apply(window.__console, arguments); }
+	// 	},
+	// 	warn: function() {
+	// 		if (debug) { window.__console.warn.apply(window.__console, arguments); }
+	// 	},
+	// 	error: function() {
+	// 		if (debug) { window.__console.error.apply(window.__console, arguments); }
+	// 	}
+	// };
+}
+
+// console.log('Loading Extensions...')
+
+// Thank you Prototype
+function $A(iterable) {
+	if (!iterable) return [];
+	if (iterable.toArray) return iterable.toArray();
+	var length = iterable.length || 0, results = new Array(length);
+	while (length--) results[length] = iterable[length];
+	return results;
+};
+
+(function($) {
+
+	var function_id = 0;
+
+	if (!(typeof Function.prototype.bind === 'function')) {
+		Function.prototype.bind = function() {
+			var __method = this, args = $A(arguments), object = args.shift();
+			return function() {
+				return __method.apply(object, args.concat($A(arguments)));
+			};
+		};
+	}
+	$.extend(Function.prototype, {
+		cache: function(name) {
+			var __method = this, id = name || ('__cached__'+(++function_id)), _undefined_;
+			return function() {
+				if (this[id] === _undefined_) {
+					this[id] = __method.apply(this, arguments) || null;
+				}
+				return this[id];
+			};
+		}
+	});
+
+
+	$.extend(Number.prototype, {
+		to_filesize: function() {
+			var thou = 1000, units = [" bytes", ' KB', ' MB', ' GB'],
+			power = Math.floor(Math.log(this) / Math.log(thou))
+			return this / (Math.pow(thou, power)) + units[power]
+		}
+	});
+
+	var opacity_change_duration = 200, height_change_duration = 200;
+
+	$.fn.appear = function(callback) {
+		var $this = this, siblings = $this.siblings(), fade_in = function() {
+			$this.animate({'opacity':1}, {
+				duration: opacity_change_duration,
+				complete: callback
+			});
+		};
+
+		if (siblings.length == 0) {
+			// skip height animation and just fade the element in
+			// otherwise there's this weird gap where nothing seems to be
+			// happening. this only happens when the item being 'appeared' is
+			// the first in the list
+			$this.css({'opacity': 0}).show();
+			fade_in();
+		} else {
+			$this.hide().css({'opacity': 0}).animate({'height':'show'}, {
+				duration: height_change_duration,
+				complete: fade_in
+			});
+		}
+	};
+
+	$.fn.disappear = function(callback) {
+		var $this = this;
+		this.animate({'opacity':0}, {
+			duration: opacity_change_duration,
+			complete: function() {
+				$this.animate({'height':'hide'}, {
+					duration: height_change_duration,
+					complete:callback
+				});
+			}
+		});
+	};
+}(jQuery));

data/application/js/field.js

@@ -0,0 +1,4 @@
+// console.log('Loading FieldTypes...')
+
+Spontaneous.FieldTypes = {};
+

data/application/js/field_preview.js

@@ -0,0 +1,55 @@
+// console.log('Loading FieldPreview...')
+
+Spontaneous.FieldPreview = (function($, S) {
+	var dom = S.Dom;
+
+	var FieldPreview = new JS.Class({
+		initialize: function(view, wrap_id) {
+			this.view = view;
+			this.wrap_id = wrap_id;
+		},
+
+		depth_class: function() {
+			return 'depth-'+this.view.depth();
+		},
+		has_fields: function() {
+			return this.view.has_fields();
+		},
+		panel: function() {
+			var wrapper = dom.div([dom.id(this.wrap_id), 'fields-preview', this.depth_class()])
+			// $(dom.div, {'id':this.wrap_id, 'class':'fields-preview ' + this.depth_class()});
+			wrapper.append(this.fields_panel(this.view.text_fields(), 'text'));
+			wrapper.append(this.fields_panel(this.view.image_fields(), 'image', true));
+			if (this.view.mouseover) {
+				wrapper.mouseover(this.view.mouseover.bind(this.view))
+			}
+			if (this.view.mouseout) {
+				wrapper.mouseout(this.view.mouseout.bind(this.view))
+			}
+			wrapper.click(function() {
+				this.view.edit(this.field_to_edit);
+			}.bind(this))
+			return wrapper;
+		},
+		fields_panel: function(fields, type, ignore_changes) {
+			var wrapper = dom.ul('.fields-preview-'+type), __this = this;
+			if (fields.length === 0) { wrapper.addClass('empty'); }
+			$.each(fields, function(i, field) {
+				var li = dom.li();
+				var name = dom.div('.name').text(field.title);
+				var value = dom.div('.value').html(field.preview());
+				li.click(function() {
+					__this.field_to_edit = field;
+				})
+				field.activate(value);
+				if (!ignore_changes) {
+					field.watch('value', function(field, v) { $(this).html(field.preview()) }.bind(value, field));
+				}
+				li.append(name).append(value);
+				wrapper.append(li);
+			});
+			return wrapper;
+		}
+	});
+	return FieldPreview;
+})(jQuery, Spontaneous);

data/application/js/field_types/date_field.js

@@ -0,0 +1,16 @@
+// console.log('Loading DateField...')
+Spontaneous.FieldTypes.DateField = (function($, S) {
+	var dom = S.Dom;
+	var DateField = new JS.Class(Spontaneous.FieldTypes.StringField, {
+		// get_input: function() {
+		// 	this.input = $(dom.textarea, {'id':this.css_id(), 'name':this.form_name(), 'rows':10, 'cols':30}).text(this.unprocessed_value());
+		// 	return this.input;
+		// },
+		// edit: function() {
+		// 	return this.get_input();
+		// }
+	});
+
+	return DateField;
+})(jQuery, Spontaneous);
+

data/application/js/field_types/file_field.js

@@ -0,0 +1,71 @@
+// console.log('Loading FileField...')
+Spontaneous.FieldTypes.FileField = (function($, S) {
+	var dom = S.Dom;
+	var FileField = new JS.Class(Spontaneous.FieldTypes.StringField, {
+		selected_files: false,
+		preview: function() {
+			Spontaneous.UploadManager.register(this);
+			return this.callSuper();
+		},
+		unload: function() {
+			this.callSuper();
+			this.input = null;
+			this._progress_bar = null;
+			Spontaneous.UploadManager.unregister(this);
+		},
+		upload_complete: function(values) {
+			console.log('upload complete', values)
+			this.set_version(values.version);
+			this.selected_files = null;
+			this.disable_progress();
+		},
+		disable_progress: function() {
+			this.progress_bar().parent().hide();
+			this.drop_target.removeClass('uploading')
+		},
+		upload_progress: function(position, total) {
+			if (!this.drop_target.hasClass('uploading')) { this.drop_target.addClass('uploading'); }
+			this.progress_bar().parent().show();
+			this.progress_bar().css('width', ((position/total)*100) + '%');
+		},
+		is_file: function() {
+			return true;
+		},
+		get_input: function() {
+			this.input = dom.input({'type':'file', 'name':this.form_name(), 'accept':'image/*'});
+			return this.input;
+		},
+		accepts_focus: false,
+		// called by edit dialogue in order to begin the async upload of files
+		save: function() {
+			if (!this.selected_files) { return; }
+			var files = this.selected_files; //this.input[0].files;
+			if (files && files.length > 0) {
+				this.drop_target.addClass('uploading');
+				this.progress_bar().parent().show();
+				var file_data = new FormData();
+				var file = files[0];
+				S.UploadManager.replace(this, file);
+			}
+			this.selected_files = false;
+		},
+		is_modified: function() {
+			var files = this.selected_files; //this.input[0].files;
+			return (files && files.length > 0);
+		},
+		original_value: function() {
+			this.processed_value();
+		},
+		set_edited_value: function(value) {
+			console.log('set_edited_value', value, this.edited_value(), this.original_value())
+			if (value === this.edited_value()) {
+				// do nothing
+			} else {
+				this.selected_files = null;
+				this.set('value', value);
+			}
+		}
+	});
+	return FileField;
+})(jQuery, Spontaneous);
+