gnuside-aloha-rails 0.23.3

data/vendor/assets/javascripts/aloha/plugins/common/ui/lib/text.js

@@ -0,0 +1,33 @@
+define([
+	"jquery",
+	"ui/component"
+],
+function( jQuery, Component ) {
+	/**
+	 * Text component type
+	 * @class
+	 * @extend {Component}
+	 */
+	var Text = Component.extend({
+		/**
+		 * Initializes the text component
+		 * @override
+		 */
+		init: function() {
+			this._super();
+			this.element = jQuery( "<input>" )
+				.bind( "change", jQuery.proxy(function( event ) {
+					this.setValue( event.target.value );
+				}, this ) );
+		},
+
+		// invoked when the user has changed the value
+		/**
+		 * Sets the value of the text field
+		 * @param {string} value
+		 */
+		setValue: function( value ) {}
+	});
+
+	return Text;
+});

data/vendor/assets/javascripts/aloha/plugins/common/ui/lib/toggleButton.js

@@ -0,0 +1,57 @@
+define([
+	'jquery',
+	'ui/button',
+	'jqueryui'
+],
+function( jQuery, Button ) {
+	'use strict';
+
+	var idCounter = 0;
+
+	/**
+	 * ToggleButton control. Extends the Button component type to provide an
+	 * easy way to create buttons that can transition between "checked" and
+	 * "unchecked" states.
+	 *
+	 * @class
+	 * @name ToggleButton
+	 * @extends {Button}
+	 */
+	var ToggleButton = Button.extend({
+
+		_checked: false,
+
+		/**
+		 * Sets the state of the toggleButton and updates its visual display
+		 * accordingly.
+		 *
+		 * @param {boolean} toggled Whether the button is to be set to the
+		 *                          "toggled/checked" state.
+		 */
+		setState: function( toggled ) {
+			// It is very common to set the button state on every
+			// selection change even if the state hasn't changed.
+			// Profiling showed that this is very inefficient.
+			if (this._checked === toggled) {
+				return;
+			}
+			this._checked = toggled;
+			if (toggled) {
+				this.element.addClass("aloha-button-active");
+			} else {
+				this.element.removeClass("aloha-button-active");
+			}
+		},
+
+		getState: function() {
+			return this._checked;
+		},
+
+		_onClick: function() {
+			this.setState( ! this._checked );
+			this.click();
+		}
+	});
+
+	return ToggleButton;
+});

data/vendor/assets/javascripts/aloha/plugins/common/ui/lib/toolbar.js

@@ -0,0 +1,251 @@
+define([
+	'jquery',
+	'aloha/core',
+	'ui/surface',
+	'ui/tab',
+	'ui/floating',
+	'ui/context',
+	'i18n!ui/nls/i18n',
+	'jqueryui'
+], function (
+	$,
+	Aloha,
+	Surface,
+	Tab,
+	floating,
+	Context,
+	i18n
+) {
+	'use strict';
+
+	/**
+	 * The toolbar is configured via `settings.toolbar` and is defined as an
+	 * array of tabs with component groups, where the groups are arrays of
+	 * controls.
+	 *
+	 * There are separate components for each context, but only the components
+	 * for the active context are shown.
+	 *
+	 * As a container for tabs, the toolbar serves to group together groups of
+	 * control components so that they can be shown and hidden together in their
+	 * feature/functional set.  For example groups of table controls would be
+	 * placed in a table tab, groups of list controls in an image tab, and so
+	 * forth.
+	 *
+	 * Toolbar class and manager
+	 *
+	 * @class
+	 * @extends {Surface}
+	 */
+	var Toolbar = Surface.extend({
+		_moveTimeout: null,
+		$_container: null,
+		_tabBySlot: null,
+		_tabs: [],
+
+		/**
+		 * Toolbar constructor.
+		 *
+		 * @param {!Array.<(Object|Array|string)>} tabs
+		 * @constructor
+		 * @override
+		 */
+		_constructor: function (context, tabs) {
+			var tabSettings,
+			    tabInstance,
+			    i,
+			    key;
+			this._super(context);
+			this.$element = $('<div>', {'class': 'aloha-ui aloha-ui-toolbar', 'unselectable': 'on'});
+			this.$_container = Tab.createContainer().appendTo(this.$element);
+			this._tabBySlot = {};
+
+			for (i = 0; i < tabs.length; i++) {
+				tabSettings = tabs[i];
+				tabInstance = new Tab(context, {
+					label: i18n.t(tabSettings.label, tabSettings.label),
+					showOn: tabSettings.showOn,
+					container: this.$_container
+				}, tabSettings.components);
+				for (key in tabInstance._elemBySlot) {
+					if (tabInstance._elemBySlot.hasOwnProperty(key)) {
+						this._tabBySlot[key] = tabInstance;
+					}
+				}
+				this._tabs.push({tab: tabInstance, settings: tabSettings});
+			}
+
+			// Pinning behaviour is global in that if one toolbar is pinned,
+			// then all other toolbars will be pinned to that position.
+			floating.makeFloating(this, Toolbar);
+		},
+
+		adoptInto: function (slot, component) {
+			var tab = this._tabBySlot[slot];
+			return tab && tab.adoptInto(slot, component);
+		},
+
+		getActiveContainer: function () {
+			return this.$_container.data('aloha-active-container');
+		},
+
+		getContainers: function () {
+			return this.$_container.data('aloha-tabs');
+		},
+
+		/**
+		 * Moves the toolbar into the optimal position near the active editable.
+		 *
+		 * @param {number} duration The length of time the moving animation
+		 *                          should run.
+		 */
+		_move: function (duration) {
+			// We need to order the invocation of the floating animation to
+			// occur after the the height of the toolbar's DOM has been
+			// caluclated.
+			var toolbar = this;
+			if (toolbar._moveTimeout) {
+				clearTimeout(toolbar._moveTimeout);
+			}
+			toolbar._moveTimeout = setTimeout(function () {
+				toolbar._moveTimeout = null;
+				if (Aloha.activeEditable && Toolbar.isFloatingMode) {
+					floating.floatSurface(
+						toolbar,
+						Aloha.activeEditable,
+						duration,
+						Toolbar.setFloatingPosition
+					);
+				}
+				// 20ms should be small enough to appear instantaneous to the
+				// user but large enough to avoid doing unnecessary work when
+				// the selection changes multiple times within a short time
+				// frame.
+			}, 20);
+		},
+
+		addPin: function () {
+			var $pin = $('<div class="aloha-ui-pin">');
+			var $element = this.$element;
+			$element.find('.ui-tabs').append($pin);
+			$element.find('.ui-tabs').hover(function () {
+				$element.addClass('aloha-ui-hover');
+			}, function () {
+				$element.removeClass('aloha-ui-hover');
+			});
+
+			if (!Toolbar.isFloatingMode) {
+				$pin.addClass('aloha-ui-pin-down');
+			}
+
+			var surface = this;
+
+			$pin.click(function () {
+				Toolbar.isFloatingMode = !Toolbar.isFloatingMode;
+				var position;
+
+				if (Toolbar.isFloatingMode) {
+					position = {
+						top: Toolbar.pinTop,
+						left: Toolbar.pinLeft
+					};
+				} else {
+					position = surface.$element.offset();
+					position.top -= $(window).scrollTop();
+				}
+
+				Toolbar.setFloatingPosition(position);
+				floating.togglePinSurface(surface, position, Toolbar.isFloatingMode);
+			});
+		},
+
+		/**
+		 * Shows the toolbar.
+		 */
+		show: function () {
+			Toolbar.$surfaceContainer.children().detach();
+			Toolbar.$surfaceContainer.append(this.$element);
+			Toolbar.$surfaceContainer.stop().fadeTo(200, 1);
+			var position = Toolbar.getFloatingPosition();
+			this.$element.stop().css({
+				top: position.top,
+				left: position.left
+			});
+			this._move();
+		},
+
+		/**
+		 * Hides the toolbar.
+		 */
+		hide: function () {
+			Toolbar.$surfaceContainer.stop().fadeOut(200, function () {
+				Toolbar.$surfaceContainer.children().detach();
+			});
+		}
+	});
+
+	$.extend(Toolbar, {
+
+		/**
+		 * An element on which all toolbar surfaces are to be rendered on the
+		 * page.
+		 * @type {jQuery.<HTMLElement>}
+		 */
+		$surfaceContainer: null,
+
+		/**
+		 * Whether or not floating toolbar surfaces should be pinned.
+		 * @type {boolean}
+		 */
+		isFloatingMode: true,
+
+		/**
+		 * Left position of pinned toolbars.
+		 * @type {number}
+		 */
+		pinLeft: 0,
+
+		/**
+		 * Top position of pinned toolbars.
+		 * @type {number}
+		 */
+		pinTop: 0,
+
+		/**
+		 * Initializes the toolbar manager.  Adds the surface container
+		 * element, and sets up floating behaviour settings.
+		 */
+		init: function () {
+			// TODO should use context.js to get the context element
+			Toolbar.$surfaceContainer = $('<div>', {
+				'class': 'aloha aloha-surface aloha-toolbar',
+				'unselectable': 'on'
+			}).hide();
+
+			// In the built aloha.js, init will happend before the body has
+			// finished loading, so we have to defer appending the element.
+			$(function () { Toolbar.$surfaceContainer.appendTo('body'); });
+			Surface.trackRange(Toolbar.$surfaceContainer);
+			var pinState = floating.getPinState();
+			Toolbar.pinTop = pinState.top;
+			Toolbar.pinLeft = pinState.left;
+			Toolbar.isFloatingMode = !pinState.isPinned;
+		},
+
+		setFloatingPosition: function (position) {
+			Toolbar.pinTop = position.top;
+			Toolbar.pinLeft = position.left;
+		},
+
+		getFloatingPosition: function () {
+			return {
+				top: Toolbar.pinTop,
+				left: Toolbar.pinLeft
+			};
+		}
+	});
+
+	Toolbar.init();
+
+	return Toolbar;
+});

data/vendor/assets/javascripts/aloha/plugins/common/ui/lib/ui-plugin.js

@@ -0,0 +1,169 @@
+/* ui-plugin.js is part of Aloha Editor project http://aloha-editor.org
+ *
+ * Aloha Editor is a WYSIWYG HTML5 inline editing library and editor.
+ * Copyright (c) 2010-2012 Gentics Software GmbH, Vienna, Austria.
+ * Contributors http://aloha-editor.org/contribution.php
+ *
+ * Aloha Editor is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU General Public License
+ * as published by the Free Software Foundation; either version 2
+ * of the License, or any later version.
+ *
+ * Aloha Editor is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
+ *
+ * As an additional permission to the GNU GPL version 2, you may distribute
+ * non-source (e.g., minimized or compacted) forms of the Aloha-Editor
+ * source code without the copy of the GNU GPL normally required,
+ * provided you include this license notice and a URL through which
+ * recipients can access the Corresponding Source.
+ */
+/**
+ * The ui/ui-plugin module controls the creation and display of the UI.
+ */
+define('ui/ui-plugin', [
+	'jquery',
+	'aloha',
+	'ui/context',
+	'ui/container',
+	'ui/surface',
+	'ui/toolbar',
+	'ui/scopes',
+	'ui/settings',
+	'PubSub',
+	// Most modules of the ui plugin depend on jquery-ui, but its easy
+	// to forget to add the dependency so we do it here.
+	'jqueryui'
+], function (
+	$,
+	Aloha,
+	Context,
+	Container,
+	Surface,
+	Toolbar,
+	Scopes,
+	Settings,
+	PubSub
+) {
+	'use strict';
+
+	var context = new Context(),
+        toolbar = new Toolbar(context, getToolbarSettings());
+
+	Aloha.bind('aloha-editable-activated', function(event, alohaEvent) {
+		Surface.show(context);
+		Container.showContainersForContext(context, event);
+	});
+
+	Aloha.bind('aloha-editable-deactivated', function (event, alohaEvent) {
+		if (!Surface.suppressHide) {
+			Surface.hide(context);
+		}
+	});
+
+	PubSub.sub('aloha.ui.scope.change', function () {
+		Container.showContainersForContext(context);
+		primaryScopeForegroundTab(Scopes.getPrimaryScope());
+	});
+
+	function getToolbarSettings() {
+		var userSettings = Aloha.settings.toolbar,
+		    defaultSettings = Settings.defaultToolbarSettings;
+		if (!userSettings) {
+			return defaultSettings.tabs;
+		}
+		return Settings.combineToolbarSettings(
+			userSettings.tabs || [],
+			defaultSettings.tabs,
+			userSettings.exclude || []
+		);
+	}
+
+	function primaryScopeForegroundTab() {
+		var tabs = toolbar._tabs,
+		    primaryScope = Scopes.getPrimaryScope(),
+		    settings,
+		    i;
+		for (i = 0; i < tabs.length; i++) {
+			settings = tabs[i].settings;
+			if ('object' === $.type(settings.showOn) && settings.showOn.scope === primaryScope) {
+				tabs[i].tab.foreground();
+				break;
+			}
+		}
+	}
+
+	/**
+	 * Adopts a component instance into the UI.
+	 *
+	 * Usually, the implementation of this method will display the
+	 * component, at a position in the UI given by the slot
+	 * argument.
+	 *
+	 * @param slot
+	 *        A position argument that is interpreted by the UI however it likes.
+	 * @param component
+	 *        An instance of a component to adopt into the given slot.
+	 * @api
+	 */
+	function adoptInto(slot, component) {
+		return toolbar.adoptInto(slot, component);
+	}
+
+	/**
+	 * Shows the toolbar.
+	 *
+	 * By default, the toolbar will be hidden when no editable is
+	 * activated, and shown when an editable is activated. Calling
+	 * this function will show the toolbar regardless of whether an
+	 * editable is activated.
+	 *
+	 * The toolbar will only become visible if tabs are visible as well.
+	 * To make tabs visible, set a scope. For example
+	 * Scopes.setScope('Aloha.continuoustext');		
+	 *
+	 * Please note that the toolbar will not remain visible if an
+	 * editable is subsequently deactivated.
+	 *
+	 * @param {?Object} event
+	 *        An optional event argument that caused the toolbar to be show.
+	 *        Will be passed on to Aloha.settings.toolbar.tabs[i].showOn functions.
+	 * @api
+	 */
+	function showToolbar(event) {
+		Surface.show(context);
+		Container.showContainersForContext(context, event);
+	}
+
+	/**
+	 * This module is part of the Aloha API.
+	 * It is valid to override this module via requirejs to provide a
+	 * custom behaviour. An overriding module must implement all API
+	 * methods. Every member must have an api annotation. No non-api
+	 * members are allowed.
+	 * @api
+	 */
+	return {
+		/**
+		 * Adopts a component instance into the UI.
+		 *
+		 * Usually, the implementation of this method will display the
+		 * component, at a position in the UI given by the slot
+		 * argument.
+		 *
+		 * @param slot
+		 *        A position argument that is interpreted by the UI however it likes.
+		 * @param component
+		 *        An instance of a component to adopt into the given slot.
+		 * @api
+		 */
+		adoptInto: adoptInto,
+		showToolbar: showToolbar
+	};
+});