bhf 0.4.2.2 → 0.4.2.3

data/vendor/assets/javascripts/bhf/application.js

@@ -0,0 +1,280 @@
+//= require ./mootools-core-1.3.2-full-compat-yc.js
+//= require ./mootools-more-1.3.2.1.js
+//= require mootools_ujs
+//= require_tree ./classes/
+
+window.addEvent('domready', function(){
+	var ajaxNote = new Ajaxify();
+	var lang = document.html.get('lang');
+	if (lang === 'en') {
+		lang = 'en-US';
+	}
+	else {
+		lang = lang+'-'+lang.toUpperCase();
+	}
+	Locale.use(lang);
+	var wysiwyg = [];
+	var setupJsForm = function(scope){
+		scope.getElements('.wysiwyg').each(function(elem){
+			wysiwyg.push(elem.mooEditable());
+		});
+		
+		scope.getElements('.multiple_fields').each(function(elem){
+			new MultipleFields(elem);
+		});
+		scope.getElements('.array_holder').each(function(elem){
+			new ArrayFields(elem);
+		});
+		
+		var dateFormat = Locale.get('Date.shortDate').replace(/%/g, '');
+		var timeFormat = 'H:i'; // Locale.get('Date.shortTime').replace(/%/g, '')
+		var dateMonths = Locale.get('Date.months');
+		var dateDays = Locale.get('Date.days');
+		new DatePicker(scope.getElements('.picker.datetime, .picker.timestamp'), {
+			allowEmpty: true,
+			inputOutputFormat: 'Y-m-d H:i',
+			months: dateMonths,
+			days: dateDays,
+			timePicker: true,
+			format: dateFormat+' '+timeFormat
+		});
+		new DatePicker(scope.getElements('.picker.date'), {
+			allowEmpty: true,
+			inputOutputFormat: 'Y-m-d H:i',
+			months: dateMonths,
+			days: dateDays,
+			format: dateFormat
+		});
+		new DatePicker(scope.getElements('.picker.time'), {
+			allowEmpty: true,
+			inputOutputFormat: 'Y-m-d H:i',
+			months: dateMonths,
+			days: dateDays,
+			timePickerOnly: true,
+			format: timeFormat
+		});
+	};
+
+	// TODO: disable more ajax calls while ajax is loading
+	var quickEdit = new AjaxEdit({
+		holderParent: $('content'),
+		onStartRequest: function(form){
+			ajaxNote.loading();
+		},
+		onFormInjected: function(form){
+			setupJsForm(form);
+			scrollContent();
+			ajaxNote.success();
+		},
+		onSave: function(form){
+			ajaxNote.success();
+		},
+		onBeforeSubmit: function(){
+			ajaxNote.loading();
+			wysiwyg.each(function(elem){
+				elem.saveContent();
+			});
+		}
+	});
+
+	var platforms = document.body.getElements('.platform');
+	var mainForm = document.id('main_form');
+
+	if (platforms.length) {
+		var setupSortables = function(scope){
+			new Sortables(scope.getElements('.sortable'), {
+				handle: '.handle',
+				onStart: function(element, clone){
+					element.addClass('dragged');
+				},
+				onComplete: function(element){
+					element.removeClass('dragged');
+					new Request({
+						method: 'put',
+						url: this.element.getParent('tbody').get('data-sort-url')
+					}).send({data: {order: this.serialize()}});
+				}
+			});
+		};
+		var updatePlatform = function(href, platform, callback){
+			ajaxNote.loading();
+			new Request.HTML({
+				method: 'get',
+				url: href,
+				onSuccess: function(a, b, html){
+					platform.innerHTML = html;
+					if (callback) {
+						callback.call();
+					}
+					setupSortables(platform);
+					ajaxNote.success();
+					windowHight = document.body.clientHeight;
+				}
+			}).send();
+		};
+
+		platforms.addEvents({
+			'click:relay(.pagination a, thead a)': function(e){
+				e.preventDefault();
+				updatePlatform(this.get('href'), this.getParent('.platform'));
+			},
+			'submit:relay(.search)': function(e){
+				ajaxNote.loading();
+				e.preventDefault();
+				var parent = this.getParent('.platform');
+				var hidden_search = e.target.getElement('.hidden_search');
+				if (hidden_search) {
+					hidden_search.destroy();
+				}
+
+				new Request.HTML({
+					method: 'get',
+					url: this.get('action'),
+					onSuccess: function(a, b, html){
+						parent.innerHTML = html;
+						setupSortables(parent);
+						ajaxNote.success();
+					}
+				}).send({data: this});
+			},
+			'click:relay(.quick_edit)': function(e){
+				e.preventDefault();
+				quickEdit.startEdit(this, this.getParent('tr'));
+			},
+			'click:relay(.action a)': function(e){
+				this.addClass('clicked');
+			},
+			'click:relay(.delete)': function(e){
+				e.target.addEvents({
+					'ajax:success': function(html){
+						this.getParent('tr').dispose();
+					},
+					'ajax:failure': function(html){
+						alert('Something went wrong!');
+					}
+				});
+			}
+		});
+
+		quickEdit.addEvents({
+			successAndChange: function(json){
+				var tr = this.wrapElement;
+				tr.getElements('td').each(function(td){
+					var name = td.get('data-column-name');
+					if ( ! name) { return; }
+					var a = td.getElement('a.quick_edit');
+					(a ? a : td).innerHTML = json[name] || '';
+				});
+			},
+			successAndNext: function(json){
+				var tr = this.wrapElement;
+				var nextTr = tr.getNext('tr');
+
+				if (nextTr) {
+					quickEdit.startEdit(nextTr.getElement('a'), nextTr);
+				}
+				else {
+					var platform = tr.getParent('.platform');
+					var loadMore = platform.getElement('.load_more');
+					if (loadMore) {
+						trIndex = tr.getParent('tbody').getElements('tr').indexOf(tr);
+						updatePlatform(loadMore.get('href'), platform, function(){
+							platform.getElements('tbody tr').each(function(newTr, index){
+								if (trIndex === index) {
+									nextTr = newTr.getNext('tr');
+									quickEdit.startEdit(nextTr.getElement('a'), nextTr);
+								}
+							});
+						});
+					}
+					else {
+						nextTr = platform.getElements('tbody tr')[0];
+						quickEdit.startEdit(nextTr.getElement('a'), nextTr);
+					}
+				}
+			}
+		});
+		setupSortables(document.body);
+	}
+	else if (mainForm) {
+		setupJsForm(mainForm);
+
+		mainForm.addEvents({
+			'click:relay(.quick_edit)': function(e){
+				e.preventDefault();
+				quickEdit.startEdit(this);
+			},
+			'click:relay(.delete)': function(e){
+				e.target.addEvents({
+					'ajax:success': function(html){
+						var relation = e.target.getParent('.relation');
+						if (relation.getElements('li').length < 2) {
+							relation.getPrevious('.empty').removeClass('hide');
+							if (relation.hasClass('has_one') || relation.hasClass('embeds_one')) {
+								relation.getNext('.add_field').removeClass('hide');
+							}
+						}
+						e.target.getParent('li').dispose();
+					},
+					'ajax:failure': function(html){
+						alert('Something went wrong!');
+					}
+				});
+			}
+		});
+
+		quickEdit.addEvents({
+			successAndAdd: function(json){
+				var relation = this.wrapElement.getPrevious('.relation');
+				relation.getPrevious('.empty').addClass('hide');
+				if (relation.hasClass('has_one') || relation.hasClass('embeds_one')) {
+					relation.getNext('.add_field').addClass('hide');
+				}
+				relation.adopt(
+					new Element('li').adopt(
+						new Element('a.quick_edit', {text: json.to_bhf_s || '', href: json.edit_path})
+					)
+				);
+			},
+			successAndChange: function(json){
+				this.wrapElement.set('text', json.to_bhf_s || '');
+			},
+			successAndNext: function(json){
+				var a = this.wrapElement;
+				var li = a.getParent('li');
+				if ( ! li) { 
+					this.close();
+					return;
+				}
+				var holder = li.getNext('li');
+
+				if ( ! holder) {
+					holder = li.getParent('ul');
+				}
+				quickEdit.startEdit(holder.getElement('a'));
+			}
+		});
+	}
+	var windowHight = document.body.clientHeight;
+	window.onresize = function(e){
+		windowHight = document.body.clientHeight;
+	};
+	var scrollContent = function(){
+		var innerForm = quickEdit.holder.getElement('form');
+		if ( ! innerForm) { return; }
+		var scroll = document.body.scrollTop-70;
+		if (scroll < 10) {
+			scroll = 10;
+		}
+		if (scroll + innerForm.getSize().y > windowHight) { return; }
+		quickEdit.holder.setStyle('padding-top', scroll);
+	};
+	window.onscroll = scrollContent;
+	
+	var fm = $('flash_massages');
+	if (fm) {
+		fm.addClass('show').removeClass.delay(4000, fm, 'show');
+	}
+	
+	new BrowserUpdate({vs:{i:8,f:3,o:10.01,s:2,n:9}});
+});

data/vendor/assets/javascripts/bhf/classes/AjaxEdit.js

@@ -0,0 +1,104 @@
+var AjaxEdit = new Class({
+	version: 0.2,
+
+	options: {
+		holderParent: document.body
+	},
+
+	Implements: [Options, Events],
+
+	holder: new Element('div.quick_edit_holder'),
+
+	initialize: function(_options) {
+		this.setOptions(_options);
+		this.holder.addEvents({
+			'click:relay(.open)': function(e){
+				e.preventDefault();
+				location.href = (this.wrapElement.getElement('a') || this.wrapElement).get('href');
+			}.bind(this),
+			'click:relay(.cancel)': function(e){
+				e.preventDefault();
+				this.close();
+			}.bind(this),
+			'click:relay(.save_and_next)': function(e){
+				e.preventDefault();
+				this.submit(this.newEntry ? ['successAndAdd'] : ['successAndChange', 'successAndNext']);
+			}.bind(this),
+			'click:relay(.save)': function(e){
+				e.preventDefault();
+				this.submit(this.newEntry ? ['successAndAdd'] : ['successAndChange']);
+			}.bind(this),
+			'submit:relay(form)': function(e){
+				e.preventDefault();
+				this.submit(this.newEntry ? ['successAndAdd'] : ['successAndChange']);
+			}.bind(this)
+		});
+	},
+
+	startEdit: function(element, wrapElement){
+		this.clean();
+		this.wrapElement = wrapElement ? wrapElement : element;
+		this.wrapElement.addClass('live_edit');
+		this.newEntry = this.wrapElement.hasClass('add_field');
+		
+		this.fireEvent('startRequest');
+		new Request.HTML({
+			method: 'get',
+			evalScripts: false,
+			url: element.get('href'),
+			onSuccess: function(responseTree, responseElements, responseHTML, responseJavaScript){
+				this.injectForm(responseHTML);
+				eval(responseJavaScript);
+			}.bind(this)
+		}).send();
+	},
+
+	submit: function(eventNames){
+		var form = this.holder.getElement('form');
+		this.fireEvent('beforeSubmit');
+
+		new Request.JSON({
+			method: form.get('method'),
+			url: form.get('action'),
+			evalScripts: true,
+			onRequest: function(){
+				this.disableButtons();
+			}.bind(this),
+			onFailure: function(invalidForm){
+				this.injectForm(invalidForm.response);
+				invalidForm.response.stripScripts(function(script){
+					eval(script);
+				});
+			}.bind(this),
+			onSuccess: function(json){
+				if ( ! eventNames.contains('successAndNext')) {
+					this.close();
+				}
+				eventNames.each(function(eventName){
+					this.fireEvent(eventName, [json]);
+				}.bind(this));
+				this.fireEvent('save');
+			}.bind(this)
+		}).send({data: form});
+	},
+
+	disableButtons: function(){
+		this.holder.getElements('.open, .cancel, .save_and_next, .save').set('disabled', 'disabled');
+	},
+
+	clean: function(){
+		document.body.getElements('.live_edit').removeClass('live_edit');
+	},
+
+	close: function(){
+		this.clean();
+		this.holder.dispose();
+	},
+
+	injectForm: function(form){
+		this.holder.innerHTML = form;
+		this.holder.inject(this.options.holderParent);
+		
+		this.fireEvent('formInjected', [this.holder]);		
+	}
+});

data/vendor/assets/javascripts/bhf/classes/Ajaxify.js

@@ -0,0 +1,63 @@
+var Ajaxify = new Class({
+	version: 0.2,
+
+	Implements: [Options, Events],
+
+	options: {
+		events: {
+			loading: {
+				name: 'ajax:loading',
+				text: 'Loading…'
+			},
+			success: {
+				name: 'ajax:success',
+				text: 'Changes successfully saved!'
+			},
+			failure: {
+				name: 'ajax:failure',
+				text: 'Oops, something went wrong…'
+			}
+		},
+		holder: new Element('div#ajax_holder'),
+		fadeOutDuration: 2000
+	},
+
+	initialize: function(_options) {
+		this.setOptions(_options);
+		this.holder = this.options.holder.inject(document.body);
+	},
+	
+	applyEvents: function(el){
+		el = document.id(el || document.body);
+		var apply = function(action, callback) {
+			el.getElements('[data-remote="true"]').addEvent(action, callback);
+		};
+		
+		apply(this.options.events.loading.name, this.loading.bind(this));
+		apply(this.options.events.success.name, this.success.bind(this));
+		apply(this.options.events.failure.name, this.failure.bind(this));
+	},
+
+	loading: function(xhr){
+		this.setMessage('loading', false);
+	},
+	success: function(xhr){
+		this.setMessage('success', true);
+	},
+	failure: function(xhr){
+		this.setMessage('failure', true);
+	},
+
+	setMessage: function(status, fadeOut) {
+		this.holder
+			.set('text', this.options.events[status].text)
+			.set('class', status);
+
+		if (fadeOut) {
+			this.holder.addClass('fadeout');
+			setTimeout(function(){
+				this.holder.erase('class');
+			}.bind(this), this.options.fadeOutDuration);
+		}
+	}
+});