basic aloha working / saving

This commit is contained in:
Sanj 2012-09-10 14:31:27 +05:30
parent d27465f8c9
commit c624eda6f8
1395 changed files with 306722 additions and 47 deletions

View File

@ -1,6 +1,6 @@
from django.db import models
from tagging.fields import TagField
from ox.django.fileds import DictField
from ox.django.fields import DictField
from tagging.models import Tag
from django.contrib.auth.models import User, Group, Permission
import os

View File

@ -0,0 +1,159 @@
lib/aloha.js
----------------
lib/util/json2.js
lib/aloha/rangy-core.js
lib/util/class.js
lib/util/lang.js
lib/aloha/ecma5shims.js
lib/util/dom.js
lib/aloha/pluginmanager.js
lib/aloha/core.js
lib/aloha/console.js
lib/util/range.js
lib/util/arrays.js
lib/util/strings.js
lib/vendor/pubsub/js/pubsub-unminified.js
lib/aloha/engine.js
lib/aloha/selection.js
lib/aloha/markup.js
lib/aloha/observable.js
lib/aloha/registry.js
lib/aloha/contenthandlermanager.js
lib/aloha/editable.js
lib/aloha/plugin.js
lib/aloha/command.js
lib/aloha/jquery.aloha.js
lib/aloha/sidebar.js
lib/util/position.js
lib/aloha/repositorymanager.js
lib/aloha/repository.js
lib/aloha/repositoryobjects.js
lib/aloha.js
plugins/common/ui/lib/context.js
plugins/common/ui/lib/scopes.js
plugins/common/ui/lib/container.js
plugins/common/ui/lib/surface.js
plugins/common/ui/lib/component.js
lib/vendor/jquery-ui-1.9m6.js
plugins/common/ui/lib/tab.js
plugins/common/ui/lib/subguarded.js
lib/vendor/amplify.store.js
plugins/common/ui/lib/floating.js
lib/i18n.js
plugins/common/ui/nls/i18n.js
i18n!ui/nls/i18n
plugins/common/ui/lib/toolbar.js
lib/util/maps.js
lib/util/functions.js
lib/util/trees.js
plugins/common/ui/lib/settings.js
plugins/common/ui/lib/ui-plugin.js
plugins/common/ui/lib/ui.js
plugins/common/ui/vendor/jquery-ui-autocomplete-html.js
plugins/common/ui/lib/port-helper-attribute-field.js
plugins/common/ui/lib/utils.js
plugins/common/ui/lib/button.js
plugins/common/ui/lib/toggleButton.js
plugins/common/link/nls/i18n.js
i18n!link/nls/i18n
lib/aloha/nls/i18n.js
i18n!aloha/nls/i18n
plugins/common/link/lib/../extra/linklist.js
plugins/common/link/lib/link-plugin.js
plugins/common/ui/lib/dialog.js
plugins/common/ui/lib/multiSplit.js
plugins/common/ui/lib/port-helper-multi-split.js
plugins/common/table/nls/i18n.js
i18n!table/nls/i18n
plugins/common/table/lib/table-create-layer.js
plugins/common/table/lib/table-plugin-utils.js
plugins/common/table/lib/table-cell.js
plugins/common/table/lib/table-selection.js
plugins/common/table/lib/table.js
plugins/common/table/lib/table-plugin.js
plugins/common/format/nls/i18n.js
i18n!format/nls/i18n
plugins/common/format/lib/format-plugin.js
plugins/common/list/nls/i18n.js
i18n!list/nls/i18n
plugins/common/list/lib/list-plugin.js
plugins/common/image/nls/i18n.js
i18n!image/nls/i18n
plugins/common/image/lib/image-floatingMenu.js
plugins/common/image/vendor/jcrop/jquery.jcrop.min.js
plugins/common/image/vendor/mousewheel/mousewheel.js
plugins/common/image/lib/image-plugin.js
plugins/common/highlighteditables/lib/highlighteditables-plugin.js
plugins/common/dom-to-xhtml/lib/dom-to-xhtml.js
plugins/common/dom-to-xhtml/lib/dom-to-xhtml-plugin.js
plugins/common/contenthandler/lib/wordcontenthandler.js
plugins/common/contenthandler/lib/genericcontenthandler.js
plugins/common/contenthandler/lib/oembedcontenthandler.js
lib/vendor/sanitize.js
plugins/common/contenthandler/lib/sanitizecontenthandler.js
plugins/common/contenthandler/lib/blockelementcontenthandler.js
plugins/common/contenthandler/lib/contenthandler-plugin.js
plugins/common/characterpicker/nls/i18n.js
i18n!characterpicker/nls/i18n
plugins/common/characterpicker/lib/characterpicker-plugin.js
plugins/common/commands/lib/inserthtml.js
plugins/common/commands/lib/commands-plugin.js
plugins/common/block/lib/blockmanager.js
plugins/common/block/lib/editormanager.js
plugins/common/block/lib/sidebarattributeeditor.js
plugins/common/block/lib/block.js
plugins/common/block/lib/blockcontenthandler.js
plugins/common/block/lib/editor.js
plugins/common/block/lib/block-plugin.js
plugins/common/align/nls/i18n.js
i18n!align/nls/i18n
plugins/common/align/lib/align-plugin.js
plugins/common/abbr/nls/i18n.js
i18n!abbr/nls/i18n
plugins/common/abbr/lib/abbr-plugin.js
plugins/common/horizontalruler/nls/i18n.js
i18n!horizontalruler/nls/i18n
plugins/common/horizontalruler/lib/horizontalruler-plugin.js
plugins/common/undo/vendor/undo.js
plugins/common/undo/vendor/diff_match_patch_uncompressed.js
plugins/common/undo/lib/undo-plugin.js
plugins/common/paste/lib/paste-plugin.js
plugins/extra/toc/nls/i18n.js
i18n!toc/nls/i18n
plugins/extra/toc/lib/toc-plugin.js
plugins/extra/cite/nls/i18n.js
i18n!cite/nls/i18n
plugins/extra/cite/lib/cite-plugin.js
plugins/extra/flag-icons/lib/flag-icons-plugin.js
plugins/extra/numerated-headers/nls/i18n.js
i18n!numerated-headers/nls/i18n
plugins/extra/numerated-headers/lib/numerated-headers-plugin.js
plugins/extra/formatlesspaste/lib/formatlesshandler.js
plugins/extra/formatlesspaste/nls/i18n.js
i18n!formatlesspaste/nls/i18n
plugins/extra/formatlesspaste/lib/formatlesspaste-plugin.js
lib/vendor/class.js
lib/vendor/jquery.jstree.js
lib/vendor/jquery.jqgrid.js
lib/vendor/jquery.layout.js
lib/vendor/repository-browser/js/repository-browser-unminified.js
plugins/extra/linkbrowser/nls/i18n.js
i18n!linkbrowser/nls/i18n
plugins/extra/linkbrowser/lib/linkbrowser-plugin.js
plugins/extra/imagebrowser/nls/i18n.js
i18n!imagebrowser/nls/i18n
plugins/extra/imagebrowser/lib/imagebrowser-plugin.js
plugins/common/ui/lib/menuButton.js
plugins/extra/ribbon/lib/ribbon-plugin.js
plugins/extra/wai-lang/nls/i18n.js
i18n!wai-lang/nls/i18n
plugins/extra/wai-lang/lib/languages.js
plugins/extra/wai-lang/lib/wai-lang-plugin.js
plugins/extra/headerids/nls/i18n.js
i18n!headerids/nls/i18n
plugins/extra/headerids/lib/headerids-plugin.js
plugins/extra/metaview/nls/i18n.js
i18n!metaview/nls/i18n
plugins/extra/metaview/lib/metaview-plugin.js
plugins/extra/listenforcer/lib/listenforcer-plugin.js

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,54 @@
.aloha-block-CompanyBlock .aloha-block-inner {
border-bottom:1px dotted #CCC;
position:relative;
}
.stock-quote-overlay {
position:absolute;
top:20px;
left:0;
width:229px;
height:158px;
box-shadow:0 0 5px #333;
z-index:1000;
background-repeat:no-repeat;
background-color: #FFF;
}
.stock-quote-overlay.company-MSFT {
background-image:url('../img/stock-quote-msft.gif');
}
.stock-quote-overlay.company-AAPL {
background-image:url('../img/stock-quote-aapl.gif');
}
.aloha-block:hover > .block-draghandle-topleft,
.aloha-block-active > .block-draghandle-topleft {
display:block;
}
.block-draghandle-topleft {
position:absolute;
left:-1px;
top:-13px;
width:44px;
height:12px;
overflow:hidden;
display:none;
background:url(../img/toolbar-draghandle.gif);
border-top:1px solid #CCC;
border-left:1px solid #CCC;
border-right:1px solid #CCC;
border-top-left-radius:5px;
border-top-right-radius:5px;
}
.block-draghandle-topleft a {
padding: 0 2px;
font-size: 11px;
text-decoration: none;
color: #777;
display: block;
}
.block-draghandle-topleft a span {
color: #710909;
font-weight: bold;
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.4 KiB

View File

@ -0,0 +1,310 @@
/* block.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.
*/
define([
'jquery',
'block/block',
'block/blockmanager',
'blockdemo/vendor/underscore'
], function(jQuery, block, BlockManager, vcardTemplate) {
var CompanyBlock = block.AbstractBlock.extend({
title: 'Company',
getSchema: function() {
return {
symbol: {
type: 'string',
label: 'Stock Quote Name'
}
};
},
init: function($element, postProcessFn) {
var that = this;
$element.mouseover(function() {
$element.append('<span class="stock-quote-overlay company-' + that.attr('symbol') + '"></span>');
});
$element.mouseout(function() {
$element.find('.stock-quote-overlay').remove();
});
postProcessFn();
},
update: function($element, postProcessFn) {
// Mapping Stock-Symbol -- Company Name (Fake!)
switch (this.attr('symbol')) {
case 'MSFT':
$element.html('Microsoft');
break;
case 'AAPL':
$element.html('Apple Inc.');
break;
default:
$element.html(this.attr('symbol'));
}
postProcessFn();
}
});
var EditableProductTeaserBlock = block.AbstractBlock.extend({
title: 'product teaser',
getSchema: function() {
return {
'price': {
type: 'number',
label: 'Price'
}
}
},
update: function($element, postProcessFn) {
$element.html('<span class="aloha-editable">' + this.attr('title') + '</span> <strong class="price">(' + this.attr('price') + ')</strong>');
postProcessFn();
}
});
var ProductTeaserBlock = block.AbstractBlock.extend({
title: 'product teaser',
getSchema: function() {
return {
'title': {
type: 'string',
label: 'Product Title'
},
'price': {
type: 'number',
label: 'Price'
}
}
},
update: function($element, postProcessFn) {
$element.html(this.attr('title') + ' <span class="price">(' + this.attr('price') + ' &euro;)</span>');
postProcessFn();
}
});
var ImageBlock = block.AbstractBlock.extend({
title: 'Image',
getSchema: function() {
return {
'image': {
type: 'string',
label: 'Image URI'
},
'position': {
type: 'select',
label: 'Position',
values: [{
key: '',
label: 'No Float'
}, {
key: 'left',
label: 'Float left'
}, {
key: 'right',
label: 'Float right'
}]
}
}
},
init: function($element, postProcessFn) {
this.attr('image', $element.find('img').attr('src'));
postProcessFn();
},
update: function($element, postProcessFn) {
if (this.attr('position') === 'right') {
$element.css('float', 'right');
} else if (this.attr('position') === 'left') {
$element.css('float', 'left');
} else {
$element.css('float', '');
}
$element.find('img').attr('src', this.attr('image'));
postProcessFn();
}
});
var EditableImageBlock = ImageBlock.extend({
});
var NewsBlock = block.AbstractBlock.extend({
title: 'News',
getSchema: function() {
var that = this;
return {
'news': {
type: 'button',
buttonLabel: 'Change news',
callback: function() {
var numberOfNewsArticles = Math.floor((Math.random()*6)+1);
alert('Will render ' + numberOfNewsArticles + ' news articles. (This is a placeholder for selecting news articles)');
that.attr('numberofarticles', numberOfNewsArticles);
}
}
}
},
update: function($element, postProcessFn) {
var numberOfArticlesToBeCreated = this.attr('numberofarticles') - $element.find('.newselement').length;
if (numberOfArticlesToBeCreated > 0) {
// Insert specified number of articles
for (var i=0; i<numberOfArticlesToBeCreated; i++) {
$element.find('.newselement').first().clone().appendTo($element);
}
} else if (numberOfArticlesToBeCreated < 0) {
// Delete articles
$element.find('.newselement').slice(numberOfArticlesToBeCreated).remove();
}
postProcessFn();
}
});
var SortableNewsBlock = NewsBlock.extend({
title: 'Sortable News',
init: function($element, postProcessFn) {
var that = this;
$element.sortable({
stop: function() {
that._fixScrollPositionBugsInIE();
},
cancel: '.aloha-block-handle'
});
postProcessFn();
}
});
var ColumnBlock = block.AbstractBlock.extend({
title: 'Columns',
getSchema: function() {
return {
'columns': {
type: 'number',
label: 'Number of Columns',
range: {
min: 1,
max: 4,
step: 1
}
}
}
},
init: function($element, postProcessFn) {
this.calculateColumnWidths($element);
postProcessFn();
},
update: function($element, postProcessFn) {
this.updateDataAttributesFromColumnContents($element);
var numberOfColumns = parseInt(this.attr('columns'));
var columnDifference = numberOfColumns - $element.children('.column').length;
if (columnDifference < 0) {
// we need to remove the last N columns
$element.children('.column').slice(columnDifference).remove();
} else {
// add new columns
for (var i=0; i<columnDifference; i++) {
var $column = this.getNewColumn();
if (this.attr('column-contents-' + (numberOfColumns - columnDifference + i))) {
$column.html(this.attr('column-contents-' + (numberOfColumns - columnDifference + i)));
} else {
$column.html('Some content');
}
$element.append($column);
this.postProcessColumn($column);
}
}
this.calculateColumnWidths($element);
this.$element.children('.clear').remove();
this.$element.append(jQuery('<div class="clear" />'));
postProcessFn();
},
getNewColumn: function() {
return jQuery('<div class="column aloha-editable" />');
},
postProcessColumn: function($column) {
},
updateDataAttributesFromColumnContents: function($element) {
var that = this;
$element.children('.column').each(function(i, el) {
that.attr('column-contents-' + i, jQuery(el).html());
});
},
calculateColumnWidths: function($element) {
var numberOfColumns = $element.children('.column').length;
$element.children('.column').css('width', Math.floor(100 / numberOfColumns) + '%');
}
});
var UneditableColumnBlock = ColumnBlock.extend({
init: function($element, postProcessFn) {
var that = this;
this.calculateColumnWidths($element);
$element.children('.column').each(function() {
that.postProcessColumn(jQuery(this));
})
postProcessFn();
},
getNewColumn: function() {
return jQuery('<div class="column aloha-block-collection" />');
},
postProcessColumn: function($column) {
var $button = $column.children('button.addNewBlock');
if ($button.length === 0) {
$button = jQuery('<button class="addNewBlock">Add new block</button>');
$column.append($button);
}
$button.click(function() {
var $newBlock = jQuery('<div>Test</div>');
$newBlock.insertBefore($button);
$newBlock.alohaBlock({
});
});
}
});
return {
CompanyBlock: CompanyBlock,
EditableProductTeaserBlock: EditableProductTeaserBlock,
ProductTeaserBlock: ProductTeaserBlock,
ImageBlock: ImageBlock,
EditableImageBlock: EditableImageBlock,
NewsBlock: NewsBlock,
SortableNewsBlock: SortableNewsBlock,
ColumnBlock: ColumnBlock,
UneditableColumnBlock: UneditableColumnBlock
};
});

View File

@ -0,0 +1,47 @@
/* blockdemo-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.
*/
define([
'aloha/plugin',
'block/blockmanager',
'blockdemo/block',
'css!blockdemo/css/block.css'
], function(Plugin, BlockManager, block) {
return Plugin.create('blockdemo', {
init: function() {
BlockManager.registerBlockType('ProductTeaserBlock', block.ProductTeaserBlock);
BlockManager.registerBlockType('CompanyBlock', block.CompanyBlock);
BlockManager.registerBlockType('EditableProductTeaserBlock', block.EditableProductTeaserBlock);
BlockManager.registerBlockType('ImageBlock', block.ImageBlock);
BlockManager.registerBlockType('EditableImageBlock', block.EditableImageBlock);
BlockManager.registerBlockType('NewsBlock', block.NewsBlock);
BlockManager.registerBlockType('SortableNewsBlock', block.SortableNewsBlock);
BlockManager.registerBlockType('ColumnBlock', block.ColumnBlock);
BlockManager.registerBlockType('UneditableColumnBlock', block.UneditableColumnBlock);
}
});
});

View File

@ -0,0 +1,14 @@
<a class="url fn n" href="<%= url %>">
<span class="given-name"><%= firstname %></span>
<span class="family-name"><%= lastname %></span>
</a>
<a class="email" href="mailto:<%= email %>"><%= email %></a>
<% if (org) { %>
<div class="org"><%= org %></div>
<% } %>
<div class="adr">
<div class="street-address">123 Example street</div>
<span class="locality">San Francisco</span>, <span class="region">CA </span> <span class="postal-code">12345</span>
<span class="country-name">United States</span>
</div>
<div class="tel">555-555-5555</div>

View File

@ -0,0 +1,807 @@
// Underscore.js 1.1.6
// (c) 2011 Jeremy Ashkenas, DocumentCloud Inc.
// Underscore is freely distributable under the MIT license.
// Portions of Underscore are inspired or borrowed from Prototype,
// Oliver Steele's Functional, and John Resig's Micro-Templating.
// For all details and documentation:
// http://documentcloud.github.com/underscore
(function() {
// Baseline setup
// --------------
// Establish the root object, `window` in the browser, or `global` on the server.
var root = this;
// Save the previous value of the `_` variable.
var previousUnderscore = root._;
// Establish the object that gets returned to break out of a loop iteration.
var breaker = {};
// Save bytes in the minified (but not gzipped) version:
var ArrayProto = Array.prototype, ObjProto = Object.prototype, FuncProto = Function.prototype;
// Create quick reference variables for speed access to core prototypes.
var slice = ArrayProto.slice,
unshift = ArrayProto.unshift,
toString = ObjProto.toString,
hasOwnProperty = ObjProto.hasOwnProperty;
// All **ECMAScript 5** native function implementations that we hope to use
// are declared here.
var
nativeForEach = ArrayProto.forEach,
nativeMap = ArrayProto.map,
nativeReduce = ArrayProto.reduce,
nativeReduceRight = ArrayProto.reduceRight,
nativeFilter = ArrayProto.filter,
nativeEvery = ArrayProto.every,
nativeSome = ArrayProto.some,
nativeIndexOf = ArrayProto.indexOf,
nativeLastIndexOf = ArrayProto.lastIndexOf,
nativeIsArray = Array.isArray,
nativeKeys = Object.keys,
nativeBind = FuncProto.bind;
// Create a safe reference to the Underscore object for use below.
var _ = function(obj) { return new wrapper(obj); };
// Export the Underscore object for **CommonJS**, with backwards-compatibility
// for the old `require()` API. If we're not in CommonJS, add `_` to the
// global object.
if (typeof module !== 'undefined' && module.exports) {
module.exports = _;
_._ = _;
} else {
root._ = _;
}
// Current version.
_.VERSION = '1.1.6';
// Collection Functions
// --------------------
// The cornerstone, an `each` implementation, aka `forEach`.
// Handles objects implementing `forEach`, arrays, and raw objects.
// Delegates to **ECMAScript 5**'s native `forEach` if available.
var each = _.each = _.forEach = function(obj, iterator, context) {
if (obj == null) return;
if (nativeForEach && obj.forEach === nativeForEach) {
obj.forEach(iterator, context);
} else if (_.isNumber(obj.length)) {
for (var i = 0, l = obj.length; i < l; i++) {
if (iterator.call(context, obj[i], i, obj) === breaker) return;
}
} else {
for (var key in obj) {
if (hasOwnProperty.call(obj, key)) {
if (iterator.call(context, obj[key], key, obj) === breaker) return;
}
}
}
};
// Return the results of applying the iterator to each element.
// Delegates to **ECMAScript 5**'s native `map` if available.
_.map = function(obj, iterator, context) {
var results = [];
if (obj == null) return results;
if (nativeMap && obj.map === nativeMap) return obj.map(iterator, context);
each(obj, function(value, index, list) {
results[results.length] = iterator.call(context, value, index, list);
});
return results;
};
// **Reduce** builds up a single result from a list of values, aka `inject`,
// or `foldl`. Delegates to **ECMAScript 5**'s native `reduce` if available.
_.reduce = _.foldl = _.inject = function(obj, iterator, memo, context) {
var initial = memo !== void 0;
if (obj == null) obj = [];
if (nativeReduce && obj.reduce === nativeReduce) {
if (context) iterator = _.bind(iterator, context);
return initial ? obj.reduce(iterator, memo) : obj.reduce(iterator);
}
each(obj, function(value, index, list) {
if (!initial && index === 0) {
memo = value;
initial = true;
} else {
memo = iterator.call(context, memo, value, index, list);
}
});
if (!initial) throw new TypeError("Reduce of empty array with no initial value");
return memo;
};
// The right-associative version of reduce, also known as `foldr`.
// Delegates to **ECMAScript 5**'s native `reduceRight` if available.
_.reduceRight = _.foldr = function(obj, iterator, memo, context) {
if (obj == null) obj = [];
if (nativeReduceRight && obj.reduceRight === nativeReduceRight) {
if (context) iterator = _.bind(iterator, context);
return memo !== void 0 ? obj.reduceRight(iterator, memo) : obj.reduceRight(iterator);
}
var reversed = (_.isArray(obj) ? obj.slice() : _.toArray(obj)).reverse();
return _.reduce(reversed, iterator, memo, context);
};
// Return the first value which passes a truth test. Aliased as `detect`.
_.find = _.detect = function(obj, iterator, context) {
var result;
any(obj, function(value, index, list) {
if (iterator.call(context, value, index, list)) {
result = value;
return true;
}
});
return result;
};
// Return all the elements that pass a truth test.
// Delegates to **ECMAScript 5**'s native `filter` if available.
// Aliased as `select`.
_.filter = _.select = function(obj, iterator, context) {
var results = [];
if (obj == null) return results;
if (nativeFilter && obj.filter === nativeFilter) return obj.filter(iterator, context);
each(obj, function(value, index, list) {
if (iterator.call(context, value, index, list)) results[results.length] = value;
});
return results;
};
// Return all the elements for which a truth test fails.
_.reject = function(obj, iterator, context) {
var results = [];
if (obj == null) return results;
each(obj, function(value, index, list) {
if (!iterator.call(context, value, index, list)) results[results.length] = value;
});
return results;
};
// Determine whether all of the elements match a truth test.
// Delegates to **ECMAScript 5**'s native `every` if available.
// Aliased as `all`.
_.every = _.all = function(obj, iterator, context) {
var result = true;
if (obj == null) return result;
if (nativeEvery && obj.every === nativeEvery) return obj.every(iterator, context);
each(obj, function(value, index, list) {
if (!(result = result && iterator.call(context, value, index, list))) return breaker;
});
return result;
};
// Determine if at least one element in the object matches a truth test.
// Delegates to **ECMAScript 5**'s native `some` if available.
// Aliased as `any`.
var any = _.some = _.any = function(obj, iterator, context) {
iterator || (iterator = _.identity);
var result = false;
if (obj == null) return result;
if (nativeSome && obj.some === nativeSome) return obj.some(iterator, context);
each(obj, function(value, index, list) {
if (result = iterator.call(context, value, index, list)) return breaker;
});
return result;
};
// Determine if a given value is included in the array or object using `===`.
// Aliased as `contains`.
_.include = _.contains = function(obj, target) {
var found = false;
if (obj == null) return found;
if (nativeIndexOf && obj.indexOf === nativeIndexOf) return obj.indexOf(target) != -1;
any(obj, function(value) {
if (found = value === target) return true;
});
return found;
};
// Invoke a method (with arguments) on every item in a collection.
_.invoke = function(obj, method) {
var args = slice.call(arguments, 2);
return _.map(obj, function(value) {
return (method.call ? method || value : value[method]).apply(value, args);
});
};
// Convenience version of a common use case of `map`: fetching a property.
_.pluck = function(obj, key) {
return _.map(obj, function(value){ return value[key]; });
};
// Return the maximum element or (element-based computation).
_.max = function(obj, iterator, context) {
if (!iterator && _.isArray(obj)) return Math.max.apply(Math, obj);
var result = {computed : -Infinity};
each(obj, function(value, index, list) {
var computed = iterator ? iterator.call(context, value, index, list) : value;
computed >= result.computed && (result = {value : value, computed : computed});
});
return result.value;
};
// Return the minimum element (or element-based computation).
_.min = function(obj, iterator, context) {
if (!iterator && _.isArray(obj)) return Math.min.apply(Math, obj);
var result = {computed : Infinity};
each(obj, function(value, index, list) {
var computed = iterator ? iterator.call(context, value, index, list) : value;
computed < result.computed && (result = {value : value, computed : computed});
});
return result.value;
};
// Sort the object's values by a criterion produced by an iterator.
_.sortBy = function(obj, iterator, context) {
return _.pluck(_.map(obj, function(value, index, list) {
return {
value : value,
criteria : iterator.call(context, value, index, list)
};
}).sort(function(left, right) {
var a = left.criteria, b = right.criteria;
return a < b ? -1 : a > b ? 1 : 0;
}), 'value');
};
// Use a comparator function to figure out at what index an object should
// be inserted so as to maintain order. Uses binary search.
_.sortedIndex = function(array, obj, iterator) {
iterator || (iterator = _.identity);
var low = 0, high = array.length;
while (low < high) {
var mid = (low + high) >> 1;
iterator(array[mid]) < iterator(obj) ? low = mid + 1 : high = mid;
}
return low;
};
// Safely convert anything iterable into a real, live array.
_.toArray = function(iterable) {
if (!iterable) return [];
if (iterable.toArray) return iterable.toArray();
if (_.isArray(iterable)) return iterable;
if (_.isArguments(iterable)) return slice.call(iterable);
return _.values(iterable);
};
// Return the number of elements in an object.
_.size = function(obj) {
return _.toArray(obj).length;
};
// Array Functions
// ---------------
// Get the first element of an array. Passing **n** will return the first N
// values in the array. Aliased as `head`. The **guard** check allows it to work
// with `_.map`.
_.first = _.head = function(array, n, guard) {
return (n != null) && !guard ? slice.call(array, 0, n) : array[0];
};
// Returns everything but the first entry of the array. Aliased as `tail`.
// Especially useful on the arguments object. Passing an **index** will return
// the rest of the values in the array from that index onward. The **guard**
// check allows it to work with `_.map`.
_.rest = _.tail = function(array, index, guard) {
return slice.call(array, (index == null) || guard ? 1 : index);
};
// Get the last element of an array.
_.last = function(array) {
return array[array.length - 1];
};
// Trim out all falsy values from an array.
_.compact = function(array) {
return _.filter(array, function(value){ return !!value; });
};
// Return a completely flattened version of an array.
_.flatten = function(array) {
return _.reduce(array, function(memo, value) {
if (_.isArray(value)) return memo.concat(_.flatten(value));
memo[memo.length] = value;
return memo;
}, []);
};
// Return a version of the array that does not contain the specified value(s).
_.without = function(array) {
var values = slice.call(arguments, 1);
return _.filter(array, function(value){ return !_.include(values, value); });
};
// Produce a duplicate-free version of the array. If the array has already
// been sorted, you have the option of using a faster algorithm.
// Aliased as `unique`.
_.uniq = _.unique = function(array, isSorted) {
return _.reduce(array, function(memo, el, i) {
if (0 == i || (isSorted === true ? _.last(memo) != el : !_.include(memo, el))) memo[memo.length] = el;
return memo;
}, []);
};
// Produce an array that contains every item shared between all the
// passed-in arrays.
_.intersect = function(array) {
var rest = slice.call(arguments, 1);
return _.filter(_.uniq(array), function(item) {
return _.every(rest, function(other) {
return _.indexOf(other, item) >= 0;
});
});
};
// Zip together multiple lists into a single array -- elements that share
// an index go together.
_.zip = function() {
var args = slice.call(arguments);
var length = _.max(_.pluck(args, 'length'));
var results = new Array(length);
for (var i = 0; i < length; i++) results[i] = _.pluck(args, "" + i);
return results;
};
// If the browser doesn't supply us with indexOf (I'm looking at you, **MSIE**),
// we need this function. Return the position of the first occurrence of an
// item in an array, or -1 if the item is not included in the array.
// Delegates to **ECMAScript 5**'s native `indexOf` if available.
// If the array is large and already in sort order, pass `true`
// for **isSorted** to use binary search.
_.indexOf = function(array, item, isSorted) {
if (array == null) return -1;
var i, l;
if (isSorted) {
i = _.sortedIndex(array, item);
return array[i] === item ? i : -1;
}
if (nativeIndexOf && array.indexOf === nativeIndexOf) return array.indexOf(item);
for (i = 0, l = array.length; i < l; i++) if (array[i] === item) return i;
return -1;
};
// Delegates to **ECMAScript 5**'s native `lastIndexOf` if available.
_.lastIndexOf = function(array, item) {
if (array == null) return -1;
if (nativeLastIndexOf && array.lastIndexOf === nativeLastIndexOf) return array.lastIndexOf(item);
var i = array.length;
while (i--) if (array[i] === item) return i;
return -1;
};
// Generate an integer Array containing an arithmetic progression. A port of
// the native Python `range()` function. See
// [the Python documentation](http://docs.python.org/library/functions.html#range).
_.range = function(start, stop, step) {
if (arguments.length <= 1) {
stop = start || 0;
start = 0;
}
step = arguments[2] || 1;
var len = Math.max(Math.ceil((stop - start) / step), 0);
var idx = 0;
var range = new Array(len);
while(idx < len) {
range[idx++] = start;
start += step;
}
return range;
};
// Function (ahem) Functions
// ------------------
// Create a function bound to a given object (assigning `this`, and arguments,
// optionally). Binding with arguments is also known as `curry`.
// Delegates to **ECMAScript 5**'s native `Function.bind` if available.
// We check for `func.bind` first, to fail fast when `func` is undefined.
_.bind = function(func, obj) {
if (func.bind === nativeBind && nativeBind) return nativeBind.apply(func, slice.call(arguments, 1));
var args = slice.call(arguments, 2);
return function() {
return func.apply(obj, args.concat(slice.call(arguments)));
};
};
// Bind all of an object's methods to that object. Useful for ensuring that
// all callbacks defined on an object belong to it.
_.bindAll = function(obj) {
var funcs = slice.call(arguments, 1);
if (funcs.length == 0) funcs = _.functions(obj);
each(funcs, function(f) { obj[f] = _.bind(obj[f], obj); });
return obj;
};
// Memoize an expensive function by storing its results.
_.memoize = function(func, hasher) {
var memo = {};
hasher || (hasher = _.identity);
return function() {
var key = hasher.apply(this, arguments);
return hasOwnProperty.call(memo, key) ? memo[key] : (memo[key] = func.apply(this, arguments));
};
};
// Delays a function for the given number of milliseconds, and then calls
// it with the arguments supplied.
_.delay = function(func, wait) {
var args = slice.call(arguments, 2);
return setTimeout(function(){ return func.apply(func, args); }, wait);
};
// Defers a function, scheduling it to run after the current call stack has
// cleared.
_.defer = function(func) {
return _.delay.apply(_, [func, 1].concat(slice.call(arguments, 1)));
};
// Internal function used to implement `_.throttle` and `_.debounce`.
var limit = function(func, wait, debounce) {
var timeout;
return function() {
var context = this, args = arguments;
var throttler = function() {
timeout = null;
func.apply(context, args);
};
if (debounce) clearTimeout(timeout);
if (debounce || !timeout) timeout = setTimeout(throttler, wait);
};
};
// Returns a function, that, when invoked, will only be triggered at most once
// during a given window of time.
_.throttle = function(func, wait) {
return limit(func, wait, false);
};
// Returns a function, that, as long as it continues to be invoked, will not
// be triggered. The function will be called after it stops being called for
// N milliseconds.
_.debounce = function(func, wait) {
return limit(func, wait, true);
};
// Returns a function that will be executed at most one time, no matter how
// often you call it. Useful for lazy initialization.
_.once = function(func) {
var ran = false, memo;
return function() {
if (ran) return memo;
ran = true;
return memo = func.apply(this, arguments);
};
};
// Returns the first function passed as an argument to the second,
// allowing you to adjust arguments, run code before and after, and
// conditionally execute the original function.
_.wrap = function(func, wrapper) {
return function() {
var args = [func].concat(slice.call(arguments));
return wrapper.apply(this, args);
};
};
// Returns a function that is the composition of a list of functions, each
// consuming the return value of the function that follows.
_.compose = function() {
var funcs = slice.call(arguments);
return function() {
var args = slice.call(arguments);
for (var i=funcs.length-1; i >= 0; i--) {
args = [funcs[i].apply(this, args)];
}
return args[0];
};
};
// Returns a function that will only be executed after being called N times.
_.after = function(times, func) {
return function() {
if (--times < 1) { return func.apply(this, arguments); }
};
};
// Object Functions
// ----------------
// Retrieve the names of an object's properties.
// Delegates to **ECMAScript 5**'s native `Object.keys`
_.keys = nativeKeys || function(obj) {
if (obj !== Object(obj)) throw new TypeError('Invalid object');
var keys = [];
for (var key in obj) if (hasOwnProperty.call(obj, key)) keys[keys.length] = key;
return keys;
};
// Retrieve the values of an object's properties.
_.values = function(obj) {
return _.map(obj, _.identity);
};
// Return a sorted list of the function names available on the object.
// Aliased as `methods`
_.functions = _.methods = function(obj) {
return _.filter(_.keys(obj), function(key){ return _.isFunction(obj[key]); }).sort();
};
// Extend a given object with all the properties in passed-in object(s).
_.extend = function(obj) {
each(slice.call(arguments, 1), function(source) {
for (var prop in source) {
if (source[prop] !== void 0) obj[prop] = source[prop];
}
});
return obj;
};
// Fill in a given object with default properties.
_.defaults = function(obj) {
each(slice.call(arguments, 1), function(source) {
for (var prop in source) {
if (obj[prop] == null) obj[prop] = source[prop];
}
});
return obj;
};
// Create a (shallow-cloned) duplicate of an object.
_.clone = function(obj) {
return _.isArray(obj) ? obj.slice() : _.extend({}, obj);
};
// Invokes interceptor with the obj, and then returns obj.
// The primary purpose of this method is to "tap into" a method chain, in
// order to perform operations on intermediate results within the chain.
_.tap = function(obj, interceptor) {
interceptor(obj);
return obj;
};
// Perform a deep comparison to check if two objects are equal.
_.isEqual = function(a, b) {
// Check object identity.
if (a === b) return true;
// Different types?
var atype = typeof(a), btype = typeof(b);
if (atype != btype) return false;
// Basic equality test (watch out for coercions).
if (a == b) return true;
// One is falsy and the other truthy.
if ((!a && b) || (a && !b)) return false;
// Unwrap any wrapped objects.
if (a._chain) a = a._wrapped;
if (b._chain) b = b._wrapped;
// One of them implements an isEqual()?
if (a.isEqual) return a.isEqual(b);
// Check dates' integer values.
if (_.isDate(a) && _.isDate(b)) return a.getTime() === b.getTime();
// Both are NaN?
if (_.isNaN(a) && _.isNaN(b)) return false;
// Compare regular expressions.
if (_.isRegExp(a) && _.isRegExp(b))
return a.source === b.source &&
a.global === b.global &&
a.ignoreCase === b.ignoreCase &&
a.multiline === b.multiline;
// If a is not an object by this point, we can't handle it.
if (atype !== 'object') return false;
// Check for different array lengths before comparing contents.
if (a.length && (a.length !== b.length)) return false;
// Nothing else worked, deep compare the contents.
var aKeys = _.keys(a), bKeys = _.keys(b);
// Different object sizes?
if (aKeys.length != bKeys.length) return false;
// Recursive comparison of contents.
for (var key in a) if (!(key in b) || !_.isEqual(a[key], b[key])) return false;
return true;
};
// Is a given array or object empty?
_.isEmpty = function(obj) {
if (_.isArray(obj) || _.isString(obj)) return obj.length === 0;
for (var key in obj) if (hasOwnProperty.call(obj, key)) return false;
return true;
};
// Is a given value a DOM element?
_.isElement = function(obj) {
return !!(obj && obj.nodeType == 1);
};
// Is a given value an array?
// Delegates to ECMA5's native Array.isArray
_.isArray = nativeIsArray || function(obj) {
return toString.call(obj) === '[object Array]';
};
// Is a given variable an arguments object?
_.isArguments = function(obj) {
return !!(obj && hasOwnProperty.call(obj, 'callee'));
};
// Is a given value a function?
_.isFunction = function(obj) {
return !!(obj && obj.constructor && obj.call && obj.apply);
};
// Is a given value a string?
_.isString = function(obj) {
return !!(obj === '' || (obj && obj.charCodeAt && obj.substr));
};
// Is a given value a number?
_.isNumber = function(obj) {
return !!(obj === 0 || (obj && obj.toExponential && obj.toFixed));
};
// Is the given value `NaN`? `NaN` happens to be the only value in JavaScript
// that does not equal itself.
_.isNaN = function(obj) {
return obj !== obj;
};
// Is a given value a boolean?
_.isBoolean = function(obj) {
return obj === true || obj === false;
};
// Is a given value a date?
_.isDate = function(obj) {
return !!(obj && obj.getTimezoneOffset && obj.setUTCFullYear);
};
// Is the given value a regular expression?
_.isRegExp = function(obj) {
return !!(obj && obj.test && obj.exec && (obj.ignoreCase || obj.ignoreCase === false));
};
// Is a given value equal to null?
_.isNull = function(obj) {
return obj === null;
};
// Is a given variable undefined?
_.isUndefined = function(obj) {
return obj === void 0;
};
// Utility Functions
// -----------------
// Run Underscore.js in *noConflict* mode, returning the `_` variable to its
// previous owner. Returns a reference to the Underscore object.
_.noConflict = function() {
root._ = previousUnderscore;
return this;
};
// Keep the identity function around for default iterators.
_.identity = function(value) {
return value;
};
// Run a function **n** times.
_.times = function (n, iterator, context) {
for (var i = 0; i < n; i++) iterator.call(context, i);
};
// Add your own custom functions to the Underscore object, ensuring that
// they're correctly added to the OOP wrapper as well.
_.mixin = function(obj) {
each(_.functions(obj), function(name){
addToWrapper(name, _[name] = obj[name]);
});
};
// Generate a unique integer id (unique within the entire client session).
// Useful for temporary DOM ids.
var idCounter = 0;
_.uniqueId = function(prefix) {
var id = idCounter++;
return prefix ? prefix + id : id;
};
// By default, Underscore uses ERB-style template delimiters, change the
// following template settings to use alternative delimiters.
_.templateSettings = {
evaluate : /<%([\s\S]+?)%>/g,
interpolate : /<%=([\s\S]+?)%>/g
};
// JavaScript micro-templating, similar to John Resig's implementation.
// Underscore templating handles arbitrary delimiters, preserves whitespace,
// and correctly escapes quotes within interpolated code.
_.template = function(str, data) {
var c = _.templateSettings;
var tmpl = 'var __p=[],print=function(){__p.push.apply(__p,arguments);};' +
'with(obj||{}){__p.push(\'' +
str.replace(/\\/g, '\\\\')
.replace(/'/g, "\\'")
.replace(c.interpolate, function(match, code) {
return "'," + code.replace(/\\'/g, "'") + ",'";
})
.replace(c.evaluate || null, function(match, code) {
return "');" + code.replace(/\\'/g, "'")
.replace(/[\r\n\t]/g, ' ') + "__p.push('";
})
.replace(/\r/g, '\\r')
.replace(/\n/g, '\\n')
.replace(/\t/g, '\\t')
+ "');}return __p.join('');";
var func = new Function('obj', tmpl);
return data ? func(data) : func;
};
// The OOP Wrapper
// ---------------
// If Underscore is called as a function, it returns a wrapped object that
// can be used OO-style. This wrapper holds altered versions of all the
// underscore functions. Wrapped objects may be chained.
var wrapper = function(obj) { this._wrapped = obj; };
// Expose `wrapper.prototype` as `_.prototype`
_.prototype = wrapper.prototype;
// Helper function to continue chaining intermediate results.
var result = function(obj, chain) {
return chain ? _(obj).chain() : obj;
};
// A method to easily add functions to the OOP wrapper.
var addToWrapper = function(name, func) {
wrapper.prototype[name] = function() {
var args = slice.call(arguments);
unshift.call(args, this._wrapped);
return result(func.apply(_, args), this._chain);
};
};
// Add all of the Underscore functions to the wrapper object.
_.mixin(_);
// Add all mutator Array functions to the wrapper.
each(['pop', 'push', 'reverse', 'shift', 'sort', 'splice', 'unshift'], function(name) {
var method = ArrayProto[name];
wrapper.prototype[name] = function() {
method.apply(this._wrapped, arguments);
return result(this._wrapped, this._chain);
};
});
// Add all accessor Array functions to the wrapper.
each(['concat', 'join', 'slice'], function(name) {
var method = ArrayProto[name];
wrapper.prototype[name] = function() {
return result(method.apply(this._wrapped, arguments), this._chain);
};
});
// Start chaining a wrapped Underscore object.
wrapper.prototype.chain = function() {
this._chain = true;
return this;
};
// Extracts the result from a wrapped and chained object.
wrapper.prototype.value = function() {
return this._wrapped;
};
})();

View File

@ -0,0 +1,245 @@
body {
font-family: sans-serif;
background-image: url("../common/background.png");
}
#bodyContent {
font-size:0.8em;
}
p {
margin-bottom: 10px;
}
h1, h2, h3, h4, h5, h6 {
font-family: sans-serif;
color: #1c94c4;
border-bottom:1px solid #AAAAAA;
padding-bottom:0.17em;
padding-top:0.5em;
}
h1 { font-size: 188%; }
h2 {
font-size: 150%;
margin-bottom: 14px;
}
h3 {
font-size: 132%;
margin-bottom: 10px;
padding-bottom: 0;
border-bottom: none;
}
h4 { font-size: 116%; }
h5 { font-size: 100%; }
h6 { font-size: 80%; }
#main {
width: 50%;
position: absolute;
top: 10%;
left: 25%;
padding: 30px;
background-color: white;
border-radius: 10px;
color: #444444;
-moz-border-radius: 10px;
box-shadow: 5px 5px rgba(0,0,0,0.3);
-webkit-box-shadow: 5px 5px rgba(0,0,0,0.3);
-moz-box-shadow: 5px 5px rgba(0,0,0,0.3);
}
a.aloha {
background: url(../common/external-link-ltr-icon.png) no-repeat 100% 50%;
padding: 0px 13px 0px 0px;
}
/* Abbreviation styling */
abbr, acronym
{
border-bottom: .1em dotted;
cursor: help;
}
/* A basic table styling */
.aloha_example table
{
padding: 0;
margin: 0;
border-collapse: collapse;
border: 1px solid #333;
color: #000;
}
.aloha_example table caption
{
caption-side: bottom;
font-size: 0.8em;
font-style: italic;
text-align: right;
padding: 0.5em 0;
}
.aloha_example table th,
.aloha_example table td
{
border: 1px solid #666;
padding: 0.5em;
text-align: left;
}
.aloha_example th {
background-color: #dfd;
}
table caption
{
caption-side: bottom;
font-size: 0.8em;
font-style: italic;
text-align: right;
padding: 0.5em 0;
}
#main ol, ul {
list-style-position: inside;
}
#main ol {
list-style-type: decimal;
}
#main ul {
list-style-type: disc;
}
/**
* basic table styles
*/
.hor-minimalist-a
{
background: #fff;
border-collapse: collapse;
text-align: left;
}
.hor-minimalist-a th
{
font-size: 130%;
font-weight: normal;
padding: 10px 8px;
border-bottom: 2px solid #6678b1;
}
.hor-minimalist-a td
{
padding: 9px 8px 0px 8px;
}
.hor-minimalist-a tbody tr:hover td
{
color: #009;
}
.box-table-a
{
text-align: left;
border-collapse: collapse;
}
.box-table-a th
{
font-size: 115%;
font-weight: normal;
padding: 8px;
background: #b9c9fe;
border-top: 4px solid #aabcfe;
border-bottom: 1px solid #fff;
}
.box-table-a td
{
padding: 8px;
background: #e8edff;
border-bottom: 1px solid #fff;
border-top: 1px solid transparent;
}
.box-table-a tr:hover td
{
background: #d0dafd;
}
.hor-zebra
{
text-align: left;
border-collapse: collapse;
}
.hor-zebra th
{
font-size: 130%;
font-weight: bold;
padding: 10px 8px;
border-bottom: 2px solid #6678b1;
}
.hor-zebra td
{
padding: 8px;
}
.hor-zebra tr:nth-child(2n+1) td
{
background: #e8edff;
}
td.bigbold {
font-size: 200%;
font-weight: bold;
}
td.redwhite {
background-color: red;
color: white;
font-weight: bold;
}
.vcard {
max-width: 300px;
padding: 8px;
border: 1px solid #ddd;
background-color: #eee;
border-radius: 8px;
}
.vcard .n {
font-size: 124%;
text-decoration: none;
font-weight: bold;
}
.vcard .n,
.vcard .email,
.vcard .org {
display: block;
margin: 0 0 5px 0;
}
.vcard .org {
font-weight: bold;
font-style: italic;
}
.customhandles {
width:200px;
height:100px;
}
.no-aloha-area {
background-color: #DDD;
background-image: -webkit-repeating-linear-gradient(45deg, transparent, transparent 35px, rgba(255,255,255,.5) 35px, rgba(255,255,255,.5) 70px);
background-image: -moz-repeating-linear-gradient(45deg, transparent, transparent 35px, rgba(255,255,255,.5) 35px, rgba(255,255,255,.5) 70px);
}
.columnBlock, .uneditableColumnBlock {
width: 100%;
}
.columnBlock .column,
.uneditableColumnBlock .column {
float:left;
}
.columnBlock .clear,
.uneditableColumnBlock .clear {
clear:both;
}

View File

@ -0,0 +1,355 @@
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Aloha Block Plugin Testcase</title>
<script language="javascript">
Aloha = window.Aloha || {};
Aloha.settings = {
logLevels: {'error': true, 'warn': true, 'info': false, 'debug': false},
errorhandling : true,
plugins: {
block: {
defaults : {
'.default-block': {
},
'.columnBlock': {
'aloha-block-type': 'ColumnBlock'
},
'.uneditableColumnBlock': {
'aloha-block-type': 'UneditableColumnBlock'
},
'.product-teaser': {
'aloha-block-type': 'ProductTeaserBlock'
},
'.company': {
'aloha-block-type': 'CompanyBlock'
},
'.imageBlock': {
'aloha-block-type': 'ImageBlock'
},
'.editableImageBlock': {
'aloha-block-type': 'EditableImageBlock'
},
'.news-block': {
'aloha-block-type': 'NewsBlock'
},
'.sortable-news-block': {
'aloha-block-type': 'SortableNewsBlock'
},
'.editable-product-teaser': {
'aloha-block-type': 'EditableProductTeaserBlock'
}
}
}
},
bundles: {
// Path for custom bundle relative from require.js path
user: '../demo/block'
}
};
</script>
<script src="../../lib/require.js"></script>
<script src="../../lib/aloha.js" data-aloha-plugins="common/ui,common/format,common/paste,common/block,user/blockdemo,common/table,common/highlighteditables"></script>
<link rel="stylesheet" href="../../css/aloha.css" type="text/css">
<link rel="stylesheet" href="index.css" type="text/css">
<style>
</style>
</head>
<body>
<div id="main">
<h1 id="title">Aloha, Blocks!</h1>
<p>This example demoes the following use cases:<br />
<table border="1">
<thead>
<tr>
<th>Editable/Non-Editable</th>
<th>Inline/Block-Level</th>
<th>inside editable/outside editable</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<tr>
<td>non-editable</td>
<td>block-level</td>
<td>outside editable</td>
<td><a href="#non-block-outside">Tested</a></td>
</tr>
<tr>
<td>non-editable</td>
<td>block-level</td>
<td>inside editable</td>
<td><a href="#non-block-inside">Tested</a></td>
</tr>
<tr>
<td>non-editable</td>
<td>inline</td>
<td>outside editable</td>
<td><a href="#non-inline-outside">Tested</a></td>
</tr>
<tr>
<td>non-editable</td>
<td>inline</td>
<td>inside editable</td>
<td><a href="#non-inline-inside">Tested</a></td>
</tr>
<tr>
<td>editable</td>
<td>block-level</td>
<td>outside editable</td>
<td><a href="#edit-block-outside">Tested</a></td>
</tr>
<tr>
<td>editable</td>
<td>block-level</td>
<td>inside editable</td>
<td><a href="#edit-block-inside">Tested</a></td>
</tr>
<tr>
<td>editable</td>
<td>inline</td>
<td>outside editable</td>
<td>-- not relevant --</td>
</tr>
<tr>
<td>editable</td>
<td>inline</td>
<td>inside editable</td>
<td>-- not relevant --</td>
</tr>
</tbody>
</table>
<ul>
<li>A block which has sortable contents - <a href="#sortable-news-block">Tested</a></li>
<li>Nested blocks with editable in between - <a href="#nested-blocks-editable">Tested</a></li>
<li><b>Block Collections</b>: Nested blocks WITHOUT editable in between - <a href="#nested-blocks-noeditable">Tested</a></li>
<li><b>Block Collections</b>: Nested blocks WITHOUT editable in between (inside outer editable) - <a href="#nested-blocks-noeditable2">Tested</a></li>
</ul>
</p>
<div id="bodyContent">
<h2><a name="non-block-outside"></a>(1)Non-editable (2)"Block"-Element Blocks (3)outside editable</h2>
<div class="no-aloha-area">
<h3>DefaultRenderer</h3>
<div class="default-block">
<p>This is a default aloha block without special type, which uses the <strong>DefaultRenderer</strong>. It
is not editable and embedded as a "block" element.</p>
</div>
<h3>News Listing example</h3>
<div class="news-block" data-numberofarticles="2">
<div class="newselement">
<h4>News Title 1</h4>
<p>Drosera brevifolia (the dwarf, small or red sundew), is a carnivorous plant of the family Droseraceae and is the smallest sundew species native to the United States. This species differs considerably from the pink sundew, Drosera capillaris, by its wedge-shaped leaves, and distinctly deeper red to reddish purple color, noticeable when side by side with D. capillaris.</p>
</div>
<div class="newselement">
<h4>News Title 2</h4>
<p>Bednarz studied Slavic studies, theatre and Eastern Europe history at universities in Hamburg, Wien and Moskow. His dissertation at university was over russian author Anton Chekhov. Since 1967 Bednarz worked for German television as Correspondent in Poland (19711977) and in Soviet Union (1977-1982). Later he was television presenter of german tv-programme Monitor on German broadcaster Westdeutscher Rundfunk. During these years Bednarz wrote several books over Eastern Europe countries and over the south of South America.</p>
</div>
</div>
</div>
<h2><a name="non-block-inside"></a>(1)Non-editable (2)"Block"-Element Blocks (3)inside editable</h2>
<div id="content" class="article">
<p>Blocks can be embedded right inside an editable. "Block" element blocks are not very differen from inline element blocks. A simple example is the DefaultRenderer block type, which renders and stores the initial markup. Try copy and pasting or dragging it around!
</p>
<h3>DefaultRenderer</h3>
<div class="default-block">
<p>This is a default aloha block without special type, which uses the <strong>DefaultRenderer</strong>. It
is not editable and embedded as a "block" element.</p>
</div>
<h3>News Listing example</h3>
<div class="news-block" data-numberofarticles="2">
<div class="newselement">
<h4>News Title 1</h4>
<p>Drosera brevifolia (the dwarf, small or red sundew), is a carnivorous plant of the family Droseraceae and is the smallest sundew species native to the United States. This species differs considerably from the pink sundew, Drosera capillaris, by its wedge-shaped leaves, and distinctly deeper red to reddish purple color, noticeable when side by side with D. capillaris.</p>
</div>
<div class="newselement">
<h4>News Title 2</h4>
<p>Bednarz studied Slavic studies, theatre and Eastern Europe history at universities in Hamburg, Wien and Moskow. His dissertation at university was over russian author Anton Chekhov. Since 1967 Bednarz worked for German television as Correspondent in Poland (19711977) and in Soviet Union (1977-1982). Later he was television presenter of german tv-programme Monitor on German broadcaster Westdeutscher Rundfunk. During these years Bednarz wrote several books over Eastern Europe countries and over the south of South America.</p>
</div>
</div>
<h3><a name="sortable-news-block"></a>Sortable News Listing example</h3>
<div class="sortable-news-block" data-numberofarticles="2">
<div class="newselement">
<h4>News Title 1</h4>
<p>Drosera brevifolia (the dwarf, small or red sundew), is a carnivorous plant of the family Droseraceae and is the smallest sundew species native to the United States. This species differs considerably from the pink sundew, Drosera capillaris, by its wedge-shaped leaves, and distinctly deeper red to reddish purple color, noticeable when side by side with D. capillaris.</p>
</div>
<div class="newselement">
<h4>News Title 2</h4>
<p>Bednarz studied Slavic studies, theatre and Eastern Europe history at universities in Hamburg, Wien and Moskow. His dissertation at university was over russian author Anton Chekhov. Since 1967 Bednarz worked for German television as Correspondent in Poland (19711977) and in Soviet Union (1977-1982). Later he was television presenter of german tv-programme Monitor on German broadcaster Westdeutscher Rundfunk. During these years Bednarz wrote several books over Eastern Europe countries and over the south of South America.</p>
</div>
</div>
<h3>Table</h3>
<table><thead><tr><th>Test1</th><th>Test2</th></tr></thead>
<tbody><tr><td>Foo</td><td>Bar</td></tr></tbody></table>
</div>
<h2><a name="non-inline-outside"></a>(1)Non-editable (2)Inline Blocks (3)outside editable</h2>
<div class="no-aloha-area">
<h3>Inline Element</h3>
<p><b>This is the Product Teaser Example:</b> Try our new <span class="product-teaser" data-sku="2423423" data-title="Big can of fresh Aloha soup" data-price="27">Big can of fresh Aloha soup <span class="price">(27 €)</span></span>, it tastes delicious!</p>
<p>Some other content here...</p>
<p><b>Stock Quote example:</b> When you hover over the name of the <span class="company" data-symbol="MSFT">Microsoft</span> company, the stock quotes are shown.</p>
<p>Some more content...</p>
<h3>Floating Element</h3>
<p><span class="imageBlock" data-position="right" style="float:right"><img src="blockdemo/img/stock-quote-aapl.gif" /></span>
Super Dodge Ball Advance,<span class="default-block">Some Text</span> released in Japan as Bakunetsu Dodgeball Fighters (爆熱ドッジボールファイターズ?, "Bakunetsu" meaning "Burning Heat"), dodge ball game based on the Super Dodge Ball. While based on the original Super Dodge Ball series, the game does not feature the Kunio-kun characters from the original game due to copyrights issues, as developer Million did not obtain the rights to the Kunio-kun characters until the following year.[citation needed] However, the game uses a remixed version of opening and ending songs from Technos Japan Corp's Super Dodge Ball games.
from WikipediaSuper Dodge Ball Advance, released in Japan as Bakunetsu Dodgeball Fighters (爆熱ドッジボールファイターズ?, "Bakunetsu" meaning "Burning Heat"), dodge ball game based on the Super Dodge Ball. While based on the original Super Dodge Ball series, the game does not feature the Kunio-kun characters from the original game due to copyrights issues, as developer Million did not obtain the rights to the Kunio-kun characters until the following year.[citation needed] However, the game uses a remixed version of opening and ending songs from Technos Japan Corp's Super Dodge Ball games.
from Wikipedia
</p>
<p>
Super Dodge Ball Advance, released in Japan as Bakunetsu Dodgeball Fighters (爆熱ドッジボールファイターズ?, "Bakunetsu" meaning "Burning Heat"), dodge ball game based on the Super Dodge Ball. While based on the original Super Dodge Ball series, the game does not feature the Kunio-kun characters from the original game due to copyrights issues, as developer Million did not obtain the rights to the Kunio-kun characters until the following year.[citation needed] However, the game uses a remixed version of opening and ending songs from Technos Japan Corp's Super Dodge Ball games.
from Wikipedia
</p>
</div>
<h2><a name="non-inline-inside"></a>(1)Non-editable (2)Inline Blocks (3)inside editable</h2>
<div id="teaser" class="shorttext">
<h3>Inline Element</h3>
<p><b>This is the Product Teaser Example:</b> Try our new <span class="product-teaser" data-sku="2423423" data-title="Big can of fresh Aloha soup" data-price="27">Big can of fresh Aloha soup <span class="price">(27 €)</span></span>, it tastes delicious!</p>
<p>Some other content here...</p>
<p><b>Stock Quote example:</b> When you hover over the name of the <span class="company" data-symbol="MSFT">Microsoft</span> company, the stock quotes are shown.</p>
<p>Some more content...</p>
<h3>Floating Element</h3>
<p><span class="imageBlock" data-position="right" style="float:right"><img src="blockdemo/img/stock-quote-aapl.gif" /></span>
Super Dodge Ball Advance,<span class="default-block">Some Text</span> released in Japan as Bakunetsu Dodgeball Fighters (爆熱ドッジボールファイターズ?, "Bakunetsu" meaning "Burning Heat"), dodge ball game based on the Super Dodge Ball. While based on the original Super Dodge Ball series, the game does not feature the Kunio-kun characters from the original game due to copyrights issues, as developer Million did not obtain the rights to the Kunio-kun characters until the following year.[citation needed] However, the game uses a remixed version of opening and ending songs from Technos Japan Corp's Super Dodge Ball games.
from WikipediaSuper Dodge Ball Advance, released in Japan as Bakunetsu Dodgeball Fighters (爆熱ドッジボールファイターズ?, "Bakunetsu" meaning "Burning Heat"), dodge ball game based on the Super Dodge Ball. While based on the original Super Dodge Ball series, the game does not feature the Kunio-kun characters from the original game due to copyrights issues, as developer Million did not obtain the rights to the Kunio-kun characters until the following year.[citation needed] However, the game uses a remixed version of opening and ending songs from Technos Japan Corp's Super Dodge Ball games.
from Wikipedia
</p>
<p>
Super Dodge Ball Advance, released in Japan as Bakunetsu Dodgeball Fighters (爆熱ドッジボールファイターズ?, "Bakunetsu" meaning "Burning Heat"), dodge ball game based on the Super Dodge Ball. While based on the original Super Dodge Ball series, the game does not feature the Kunio-kun characters from the original game due to copyrights issues, as developer Million did not obtain the rights to the Kunio-kun characters until the following year.[citation needed] However, the game uses a remixed version of opening and ending songs from Technos Japan Corp's Super Dodge Ball games.
from Wikipedia
</p>
</div>
<h2><a name="edit-block-outside"></a>(1)editable (2)"Block"-Element Blocks (3)outside editable</h2>
<div class="no-aloha-area">
<div class="editableImageBlock">
<img src="blockdemo/img/stock-quote-aapl.gif" />
<div class="aloha-editable">This Image Caption is editable through Aloha.</div>
</div>
<p>Williams, and other pilots who worked for British Airways claimed that their holiday pay was too low, because it only reflected his fixed salary, and not his bonuses. Williams' comprised a fixed annual salary, a "flying pay supplement" that went up the more he flew, and a "time away from base" which went up the more he was away from home. The flying and time away allowances were capped. Properly construed, his contract suggested that his holiday pay would be at the rate of only his fixed salary. Williams, however, contended that this was contrary to the Civil Aviation Working Time Directive,[1] as implemented by the Civil Aviation (Working Time) Regulations 2004,[2] (sector-specific implementations with the same objective as the Working Time Directive and the Working Time Regulations 1998 in this respect). In absence of particular provisions, the pay while on leave should be "normal remuneration". British Airways contended that because the Employment Rights Act 1996 sections 221 to 224 did not have provisions on how to determine a week's pay, the rate should be determined with reference to the contract.
The Employment Appeal Tribunal allowed Williams' claim, but this was reversed in the Court of Appeal.[3] The Supreme Court made a reference to the European Court of Justice.</p>
</div>
<h2><a name="edit-block-inside"></a>(1)editable (2)"Block"-Element Blocks (3)inside editable</h2>
<div class="textcontent"><p>Williams, and other pilots who worked for British Airways claimed that their holiday pay was too low, because it only reflected his fixed salary, and not his bonuses. Williams' comprised a fixed annual salary, a "flying pay supplement" that went up the more he flew, and a "time away from base" which went up the more he was away from home. The flying and time away allowances were capped. Properly construed, his contract suggested that his holiday pay would be at the rate of only his fixed salary. Williams, however, contended that this was contrary to the Civil Aviation Working Time Directive,[1] as implemented by the Civil Aviation (Working Time) Regulations 2004,[2] (sector-specific implementations with the same objective as the Working Time Directive and the Working Time Regulations 1998 in this respect). In absence of particular provisions, the pay while on leave should be "normal remuneration". British Airways contended that because the Employment Rights Act 1996 sections 221 to 224 did not have provisions on how to determine a week's pay, the rate should be determined with reference to the contract.
The Employment Appeal Tribunal allowed Williams' claim, but this was reversed in the Court of Appeal.[3] The Supreme Court made a reference to the European Court of Justice.</p>
<div class="editableImageBlock">
<img src="blockdemo/img/stock-quote-aapl.gif" />
<div class="aloha-editable">This Image Caption is editable through Aloha.</div>
</div>
<p>Williams, and other pilots who worked for British Airways claimed that their holiday pay was too low, because it only reflected his fixed salary, and not his bonuses. Williams' comprised a fixed annual salary, a "flying pay supplement" that went up the more he flew, and a "time away from base" which went up the more he was away from home. The flying and time away allowances were capped. Properly construed, his contract suggested that his holiday pay would be at the rate of only his fixed salary. Williams, however, contended that this was contrary to the Civil Aviation Working Time Directive,[1] as implemented by the Civil Aviation (Working Time) Regulations 2004,[2] (sector-specific implementations with the same objective as the Working Time Directive and the Working Time Regulations 1998 in this respect). In absence of particular provisions, the pay while on leave should be "normal remuneration". British Airways contended that because the Employment Rights Act 1996 sections 221 to 224 did not have provisions on how to determine a week's pay, the rate should be determined with reference to the contract.
The Employment Appeal Tribunal allowed Williams' claim, but this was reversed in the Court of Appeal.[3] The Supreme Court made a reference to the European Court of Justice.</p>
<p>Williams, and other pilots who worked for British Airways claimed that their holiday pay was too low, because it only reflected his fixed salary, and not his bonuses. Williams' comprised a fixed annual salary, a "flying pay supplement" that went up the more he flew, and a "time away from base" which went up the more he was away from home. The flying and time away allowances were capped. Properly construed, his contract suggested that his holiday pay would be at the rate of only his fixed salary. Williams, however, contended that this was contrary to the Civil Aviation Working Time Directive,[1] as implemented by the Civil Aviation (Working Time) Regulations 2004,[2] (sector-specific implementations with the same objective as the Working Time Directive and the Working Time Regulations 1998 in this respect). In absence of particular provisions, the pay while on leave should be "normal remuneration". British Airways contended that because the Employment Rights Act 1996 sections 221 to 224 did not have provisions on how to determine a week's pay, the rate should be determined with reference to the contract.
The Employment Appeal Tribunal allowed Williams' claim, but this was reversed in the Court of Appeal.[3] The Supreme Court made a reference to the European Court of Justice.</p>
</div>
<hr /><hr /><hr />
<h2><a name="nested-blocks-editable"></a>Block which contains a variable number of editable columns</h2>
<h3>The following CMS systems use Aloha:</h3>
<div class="columnBlock" data-columns="3">
<div class="column aloha-editable">
<h2>TYPO3 Phoenix</h2>
<p>TYPO3 Phoenix is the next-generation Open Source CMS system built on FLOW3. FLOW3 is a <b>PHP-based</b> Enterprise Web Framework suitable for large applications.</p>
<p>This is some test with a nested block: <span class="company" data-symbol="MSFT">Microsoft</span> -- curious if it works!</p>
</div>
<div class="column aloha-editable">
<p>&nbsp;</p>
</div>
<div class="column aloha-editable">
<h2>Gentics Content.Node</h2>
<p>Gentics Content.Node is a leading CMS for big organizations and governments. The team behind Content.Node puts a lot of work into Aloha.</p>
<p>Here follows a non-editable block</p>
<div class="default-block">
<p>This is a default aloha block without special type, which uses the <strong>DefaultRenderer</strong>. It
is not editable and embedded as a "block" element.</p>
</div>
<p>Some more text with the <span class="company" data-symbol="AAPL">Apple</span> stocks</p>
</div>
<div class="clear"></div>
</div>
<hr />
<h2><a name="nested-blocks-noeditable"></a>Block which contains nested blocks (without editables in between)</h2>
<div class="uneditableColumnBlock" data-columns="2">
<div class="column aloha-block-collection">
<h2>TYPO3 Phoenix</h2>
<p>TYPO3 Phoenix is the next-generation Open Source CMS system built on FLOW3. FLOW3 is a <b>PHP-based</b> Enterprise Web Framework suitable for large applications.</p>
<p>This is some test with a nested block: <span class="company" data-symbol="MSFT">Microsoft</span> -- curious if it works!</p>
</div>
<div class="column aloha-block-collection">
<h2>Gentics Content.Node</h2>
<p>Gentics Content.Node is a leading CMS for big organizations and governments. The team behind Content.Node puts a lot of work into Aloha.</p>
<p>Here follows a non-editable block</p>
<div class="default-block">
<p>This is a default aloha block without special type, which uses the <strong>DefaultRenderer</strong>. It
is not editable and embedded as a "block" element.</p>
</div>
<p>Some more text with the <span class="company" data-symbol="AAPL">Apple</span> stocks</p>
</div>
<div class="clear"></div>
</div>
<hr />
<h2><a name="nested-blocks-noeditable2"></a>Block which contains nested blocks (without editables in between); all inside an outer editable</h2>
<div class="textcontent">
<h4>Some editable content before</h2>
<div class="uneditableColumnBlock" data-columns="2">
<div class="column aloha-block-collection">
<h2>TYPO3 Phoenix</h2>
<p>TYPO3 Phoenix is the next-generation Open Source CMS system built on FLOW3. FLOW3 is a <b>PHP-based</b> Enterprise Web Framework suitable for large applications.</p>
<p>This is some test with a nested block: <span class="company" data-symbol="MSFT">Microsoft</span> -- curious if it works!</p>
</div>
<div class="column aloha-block-collection">
<h2>Gentics Content.Node</h2>
<p>Gentics Content.Node is a leading CMS for big organizations and governments. The team behind Content.Node puts a lot of work into Aloha.</p>
<p>Here follows a non-editable block</p>
<div class="default-block">
<p>This is a default aloha block without special type, which uses the <strong>DefaultRenderer</strong>. It
is not editable and embedded as a "block" element.</p>
</div>
<p>Some more text with the <span class="company" data-symbol="AAPL">Apple</span> stocks</p>
</div>
<div class="clear"></div>
</div>
<p>Some editable content after</p>
</div>
<hr />
<h2>Inline-Editable elements (not officially supported)</h2>
<p>Here follows the <b>editable product teaser example</b>: Try our new <span class="editable-product-teaser" data-sku="2423423" data-title="Big can of fresh Aloha soup" data-price="27"><span class="aloha-editable">Big can of fresh Aloha soup</span> (27 €)</span> - which enables some great stuff.
</div>
</div>
<script type="text/javascript">
Aloha.ready( function() {
Aloha.jQuery('#title').aloha();
Aloha.jQuery('#teaser').aloha();
Aloha.jQuery('#content').aloha();
Aloha.jQuery('.textcontent').aloha();
});
</script>
</body>
</html>

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 640 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 747 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 640 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 640 B

View File

@ -0,0 +1,109 @@
<!doctype html>
<!--[if lt IE 7 ]> <html lang="en" class="no-js ie6"> <![endif]-->
<!--[if IE 7 ]> <html lang="en" class="no-js ie7"> <![endif]-->
<!--[if IE 8 ]> <html lang="en" class="no-js ie8"> <![endif]-->
<!--[if IE 9 ]> <html lang="en" class="no-js ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!-->
<html lang="en" class="no-js"> <!--<![endif]-->
<head>
<title>The Aloha Editor Captioned Image Demo</title>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="description" content="The Aloha Editor Captioned Image Demo">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="shortcut icon" href="/favicon.ico">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="stylesheet" href="../../css/aloha.css" type="text/css">
<style>#content { margin: 30px; }</style>
<script src="../../lib/vendor/jquery-1.7.2.js"></script>
<script src="../../lib/require.js"></script>
<script>
var Aloha = {
settings: {
jQuery: $,
toolbar: {
tabs: [{
label: 'Captioned Image',
showOn: { scope: 'Aloha.captionedimage' },
components: [ 'imgFloatLeft', 'imgFloatRight', 'imgFloatClear' ]
}]
},
plugins: {
captionedImage: {
/*
render: function (properties, callback, error) {
error({message: 'noop'});
}
*/
}
}
}
};
</script>
<script src="../../lib/aloha.js"
data-aloha-plugins="common/ui,
common/format,
common/block,
extra/captioned-image"></script>
</head>
<body>
<div id="content">
<div class="aloha-captioned-image"
data-source="http://www.aloha-editor.org/images/aloha-editor-logo.png"></div>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris
convallis nisl eu mi posuere et congue metus posuere. Etiam sodales
tristique urna, malesuada accumsan erat laoreet vel. Aliquam
tincidunt porttitor mi, faucibus molestie mauris vestibulum ac.
Fusce sollicitudin, nibh nec iaculis egestas, ligula tellus iaculis
augue, quis faucibus nisl libero ac nulla. Vestibulum ante ipsum
primis in faucibus orci luctus et ultrices posuere cubilia Curae;
Nunc pulvinar luctus eros, ut laoreet enim aliquam vel.
</p>
<img src="http://www.aloha-editor.org/logo/Aloha%20Editor%20HTML5%20sticker%20transparent%20256.png"
alt="Sample alt text"
data-caption="Short caption."
class="aloha-captioned-image" />
<p>
Vestibulum molestie velit volutpat magna molestie non condimentum
metus tincidunt. Curabitur imperdiet lacus eget est hendrerit in
aliquam elit hendrerit. Nullam porttitor urna ac ante volutpat
feugiat semper quam volutpat. Donec auctor odio ut dui lobortis
euismod imperdiet purus pellentesque. Quisque lacinia sem ac lacus
commodo eu congue nisl porttitor. Aenean et velit quis urna
porttitor dignissim consequat eu lectus. Nam interdum elit a lacus
blandit porttitor. Integer id libero sed lectus tempus pulvinar ac
sit amet lacus. Curabitur lobortis magna a est ultrices sagittis
non eget nibh. In lobortis arcu odio.
</p>
<div class="aloha-captioned-image"
data-source="http://www.aloha-editor.org/images/aloha-editor-logo.png"
data-caption="Praesent commodo molestie adipiscing. Mauris
lorem justo, tincidunt eget iaculis et, fermentum nec odio."></div>
<p>
Praesent commodo molestie adipiscing. Mauris lorem justo, tincidunt eget iaculis et, fermentum nec odio. Ut pulvinar tristique quam, ut congue diam accumsan eleifend. Nulla sagittis tincidunt lacus, sit amet condimentum nibh ornare quis. Nulla ac nibh eu nunc rhoncus consectetur nec et velit. Cras nec dolor non felis placerat lobortis ut vitae ante. Curabitur at lectus non sem ultricies dictum.
</p>
<p>
Vivamus eu tellus id elit sollicitudin varius. Donec suscipit, risus eget vehicula eleifend, turpis felis hendrerit quam, eget tincidunt orci massa non lacus. Morbi commodo vestibulum fermentum. Pellentesque ut urna in nisi suscipit posuere. Vivamus at erat vitae nisl mollis luctus vel sit amet eros. Proin sodales adipiscing velit, id ultricies magna egestas ut. Aenean et eros magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus id elit at neque dictum aliquam. Nunc adipiscing, risus vel eleifend luctus, ligula libero blandit diam, at vehicula odio nibh eu elit.
</p>
<p>
Nulla sit amet turpis mauris, quis tincidunt quam. Sed vestibulum consequat ligula, sed ullamcorper ipsum placerat eget. Morbi ut magna luctus justo gravida rutrum id ac odio. Maecenas et ipsum dolor, ullamcorper pretium lacus. Pellentesque et tellus velit, in luctus massa. Nulla facilisi. Ut convallis pellentesque elit in egestas.
</p>
<p>
Curabitur semper ultricies eros sit amet egestas. Donec pellentesque tincidunt arcu vel facilisis. Curabitur vitae purus odio, ac pulvinar massa. Phasellus malesuada congue volutpat. Maecenas elit nibh, mattis fringilla viverra nec, pretium dapibus lacus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam dui velit, ullamcorper ac tincidunt non, dapibus ornare diam. Etiam mattis adipiscing turpis, sed interdum turpis tincidunt eget. Proin sodales, ante sit amet porta vehicula, est mauris porttitor neque, ut mollis eros risus feugiat urna. In fringilla dui ut mauris lobortis vulputate. Integer gravida, turpis ut viverra dictum, nulla turpis lobortis quam, eu vehicula sapien est ac tortor. Maecenas congue pretium vehicula. Phasellus vel quam sit amet elit lacinia vehicula in elementum purus. Phasellus tempor mauris eu felis tristique blandit. Curabitur egestas mi a leo sollicitudin tristique. Praesent imperdiet turpis quam, bibendum suscipit turpis.
</p>
</div>
<script type="text/javascript">
Aloha.ready( function(){
Aloha.jQuery('#content').aloha();
});
</script>
<!--[if lt IE 7 ]>
<script src="js/libs/dd_belatedpng.js"></script>
<script> DD_belatedPNG.fix('img, .png_bg');</script>
<![endif]-->
</body>
</html>

View File

@ -0,0 +1,25 @@
<?xml version="1.0"?>
<!DOCTYPE cross-domain-policy SYSTEM "http://www.adobe.com/xml/dtds/cross-domain-policy.dtd">
<cross-domain-policy>
<!-- Read this: www.adobe.com/devnet/articles/crossdomain_policy_file_spec.html -->
<!-- Most restrictive policy: -->
<site-control permitted-cross-domain-policies="none"/>
<!-- Least restrictive policy: -->
<!--
<site-control permitted-cross-domain-policies="all"/>
<allow-access-from domain="*" to-ports="*" secure="false"/>
<allow-http-request-headers-from domain="*" headers="*" secure="false"/>
-->
<!--
If you host a crossdomain.xml file with allow-access-from domain=“*”
and dont understand all of the points described here, you probably
have a nasty security vulnerability. ~ simon willison
-->
</cross-domain-policy>

View File

@ -0,0 +1,541 @@
/* ==== Scroll down to find where to put your styles :) ==== */
/* HTML5 ✰ Boilerplate */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
ins { background-color: #ff9; color: #000; text-decoration: none; }
mark { background-color: #ff9; color: #000; font-style: italic; font-weight: bold; }
del { text-decoration: line-through; }
abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; }
table { border-collapse: collapse; border-spacing: 0; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
input, select { vertical-align: middle; }
body { font:13px/1.231 sans-serif; *font-size:small; }
select, input, textarea, button { font:99% sans-serif; }
pre, code, kbd, samp { font-family: monospace, sans-serif; }
html { overflow-y: scroll; }
a:hover, a:active { outline: none; }
ul, ol { margin-left: 2em; }
ol { list-style-type: decimal; }
nav ul, nav li { margin: 0; list-style:none; list-style-image: none; }
small { font-size: 85%; }
strong, th { font-weight: bold; }
td { vertical-align: top; }
sub, sup { font-size: 75%; line-height: 0; position: relative; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; padding: 15px; }
textarea { overflow: auto; }
.ie6 legend, .ie7 legend { margin-left: -7px; }
input[type="radio"] { vertical-align: text-bottom; }
input[type="checkbox"] { vertical-align: bottom; }
.ie7 input[type="checkbox"] { vertical-align: baseline; }
.ie6 input { vertical-align: text-bottom; }
label, input[type="button"], input[type="submit"], input[type="image"], button { cursor: pointer; }
button, input, select, textarea { margin: 0; }
input:valid, textarea:valid { }
input:invalid, textarea:invalid { border-radius: 1px; -moz-box-shadow: 0px 0px 5px red; -webkit-box-shadow: 0px 0px 5px red; box-shadow: 0px 0px 5px red; }
.no-boxshadow input:invalid, .no-boxshadow textarea:invalid { background-color: #f0dddd; }
/*
::-moz-selection{ background: #FF5E99; color:#fff; text-shadow: none; }
::selection { background:#FF5E99; color:#fff; text-shadow: none; }
a:link { -webkit-tap-highlight-color: #FF5E99; }
*/
button { width: auto; overflow: visible; }
.ie7 img { -ms-interpolation-mode: bicubic; }
body, select, input, textarea { color: #444; }
h1, h2, h3, h4, h5, h6 { font-weight: bold; color: #333333; }
a, a:active, a:visited { color: #607890; }
a:hover { color: #036; }
/* ==== Aloha Editor Boilerplate Styles ==== */
/* ========================================= */
/*
::-moz-selection{ background: #b7d7fc; color:#fff; text-shadow: none; }
::selection { background:#b7d7fc; color:#fff; text-shadow: none; }
a:link { -webkit-tap-highlight-color: #b7d7fc; }
*/
html, body {
font-family: Georgia, serif;
color: #555555;
height: 100%;
}
body {
text-align: center;
font-size: 1.05em;
line-height: 1.5em;
}
em, i {
font-style: italic;
}
b {
font-weight: bold;
}
i {
font-style: italic;
}
a,
a:link,
a:visited {
color: #0C53A4;
text-decoration: none;
}
a:hover,
a:focus,
a:active {
text-decoration: none;
border-bottom: 1px solid #0C53A4;
}
table {
border: 1px solid black;
border-collapse: collapse;
border-spacing: 0px;
}
table td, th {
padding: 10px;
border: 1px solid black;
}
table tr:nth-child(even) {
background: #eee;
}
table th {
padding: 10px;
font-weight: bold;
font-size: 120%;
background: #333;
color: #fff;
}
caption {
caption-side: bottom;
font-size: 0.8em;
font-style: italic;
text-align: right;
padding: 0.5em 0;
}
h1,
#content h1 {
margin: 1.6em 0 0.8em 0;
font-size: 167%;
}
h2,
#content h2 {
margin: 1.4em 0 0.7em 0;
font-size: 146.5%;
}
h3,
#content h3 {
margin: 1.2em 0 0.6em 0;
font-size: 131%;
}
h4,
#content h4 {
margin: 1em 0 0.5em 0;
font-size: 120%;
}
h5,
#content h5 {
margin: 0.8em 0 0.4em 0;
font-size: 110%;
}
h6,
#content h6 {
margin: 0.6em 0 0.3em 0;
font-size: 100%;
}
#content pre {
margin: 1em 0 1em 0;
padding: 0.5em 0.5em 0.5em 1.5em;
background-color: #fff;
font-size: 90%;
line-height: 1.3em;
}
#content ol {
list-style-type: lower-alpha;
padding-left: 1.45em;
}
#content ul {
padding-left: 1.15em;
list-style-type: circle;
}
#whole-site {
width: 970px;
margin: 0 auto 0 auto;
text-align: left;
height: 100%;
}
#container {
width: 100%;
float: left;
/*
box-shadow: 0 -40px 40px #BBBBBB;
-moz-box-shadow: 0 -40px 40px #BBBBBB;
-webkit-box-shadow: 0 -40px 40px #BBBBBB;
*/
background: #ffffff;
min-height: 100%;
}
#editor-logo {
border: 0;
float: left;
margin: 20px 0 0 7px;
}
#editor-logo img {
width: 200px;
margin-top: -15px;
margin-bottom: -15px;
}
#top-text {
float: right;
margin: 50px 20px 0 0;
font-size: 93%;
font-style: italic;
}
#header {
width: 100%;
clear: both;
float: left;
}
#navigation {
clear: both;
float: left;
margin: 20px 0 20px 0;
width: 100%;
height: 34px;
}
#navigation ul {
_border: 1px solid;
_border-color: #E5E5E5 #DBDBDB #D2D2D2;
_box-shadow: 0 0 5px #888;
-moz-box-shadow: 0 0 3px #333;
_-webkit-box-shadow: 0 0 3px #333;
border-radius: 4px;
-moz-border-radius: 4px;
-mwebkit-border-radius: 4px;
background: url(../img/navigation-bg.png) left top repeat-x;
_font-family: 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, Arial, Verdana, sans-serif;
font-size: 1em;
clear: both;
float: left;
width: 100%;
filter:alpha(opacity=90);
-moz-opacity:.90;
opacity:.90;
list-style: none;
padding: 0;
margin:0;
}
#navigation li {
margin: 0 1em 0 0;
float: left;
}
#navigation li:first-child {
margin-left: 20px;
}
#navigation li a {
border-bottom: 0;
padding: 0.4em;
color: #eee;
display: block;
line-height: 1.5em;
font-size: 0.9em;
}
#navigation li a:hover,
#navigation li a:active,
#navigation li a:focus {
color: #000;
background: url(../img/navigation-bg-hover.png) left top repeat-x;
}
/*** Main & Content ***/
#main {
width: 100%;
clear: both;
}
#content {
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-o-border-radius: 5px;
-khtml-border-radius: 5px;
-webkit-box-shadow: rgba(0, 0, 0, 0.4) 0 1px 3px;
-moz-box-shadow: rgba(0, 0, 0, 0.4) 0 1px 3px;
box-shadow: rgba(0, 0, 0, 0.4) 0 1px 3px;
border: 1px solid;
border-color: #E5E5E5 #DBDBDB #D2D2D2;
background: -webkit-gradient(linear, left top, left bottom, from(#eee), to(#cae7f6));
background: -moz-linear-gradient(top, #afa, #eee);
float: left;
clear: both;
width: 60%;
padding: 20px;
max-width: 930px;
}
/*** STAGE ***/
/* Stage area general */
.stage-item {
display: none;
}
#main .stage-area {
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-o-border-radius: 5px;
-khtml-border-radius: 5px;
-webkit-box-shadow: rgba(0, 0, 0, 0.4) 0 1px 3px;
-moz-box-shadow: rgba(0, 0, 0, 0.4) 0 1px 3px;
box-shadow: rgba(0, 0, 0, 0.4) 0 1px 3px;
border: 1px solid;
border-color: #E5E5E5 #DBDBDB #D2D2D2;
width: 100%;
height: 305px;
_background: url(../img/stage-bg.png) left top repeat-x;
position: relative;
overflow: hidden;
float: left;
clear: both;
margin: 0 0 20px 0;
}
#main .stage-switcher {
width: 205px;
height: 100%;
display: block;
background: url(../img/stage-switcher-bg.png) right top repeat-y;
margin: 0;
padding: 0;
position: absolute;
right: 0px;
top: 0px;
z-index: 4;
}
#main .stage-switcher li {
margin: 0;
padding: 0;
list-style: none;
_background: url(../img/stage-switcher-tab-bg.png) right top no-repeat;
height: 52px;
width: 100%;
position: relative;
cursor: pointer;
filter:alpha(opacity=83);
-moz-opacity:.83;
opacity:.83;
}
#main .stage-switcher li.hover {
background-image: url(../img/stage-switcher-tab-bg-hover.png);
}
#main .stage-switcher li.active {
background-image: url(../img/stage-switcher-tab-bg-active.png);
}
#main .stage-switcher .stage-icon {
position: absolute;
background-position: 50% 50%;
background-repeat: no-repeat;
width: 32px;
height: 36px;
display: block;
left: 16px;
top: 9px;
}
#main .stage-switcher h2 {
font-size: 1em;
color: #fff;
margin: 0 0 0 55px;
padding: 6px 0 0 0;
font-weight: bold;
}
#main .stage-switcher p, #main .stage-switcher li.active p {
color: #fff;
margin: 0 0 0 55px;
font-size: 11px;
line-height: 1em;
}
/* Stage area content */
#main .stage-area .new-version,
#main .stage-area .full-image,
#main .stage-area .small-image {
margin: 0 47px 0 0;
float: left;
position: absolute;
left: 47px;
top: 33px;
z-index: 3;
}
#main .stage-area .full-image,
#main .stage-area .small-image {
left: 0px;
top: 0px;
height: 100%;
}
#main .stage-area .full-image img,
#main .stage-area .small-image img {
position: absolute;
right: 0px;
bottom: 0px;
z-index: -1;
}
#main .stage-area .new-version h3,
#main .stage-area .full-image h3,
#main .stage-area .small-image h3 {
font-size: 116%;
font-weight: bold;
margin: 0;
padding: 0;
line-height: 1.2em;
}
#main .stage-area .new-version h2,
#main .stage-area .full-image h2,
#main .stage-area .small-image h2 {
font-size: 28px;
color: #0C53A4;
font-weight: normal;
margin: 0;
padding: 0;
text-transform: uppercase;
}
#main .stage-area .new-version p,
#main .stage-area .full-image p,
#main .stage-area .small-image p {
margin: 12px 47px 0 0;
line-height: 1.4em;
}
#main .stage-area .small-image .area-content {
min-width: 400px;
float: left;
margin: 33px 160px 0 47px;
}
#main .stage-area .full-image .area-content {
min-width: 400px;
float: left;
margin: 33px 400px 0 47px;
}
#main .stage-area .left-area .area-content {
width: 215px;
}
#main .stage-area .area-content .aloha-textbox {
color: #000;
padding: 15px;
/* background: black;
filter:alpha(opacity=70);
-moz-opacity:.70;
opacity:.70;
-moz-box-shadow: 0 0 5px #fff;
-webkit-box-shadow: 0 0 5px #fff;
box-shadow: 0 0 5px #fff;
border: solid 1px #eee;
*/
}
footer {
clear: both;
float: left;
height: 20px;
}
#aloha-loading {
font-family: Arial, Verdana;
font-size: 0.7em;
padding-left: 15px;
margin-left: 410px;
position: relative;
background: #ddd;
top:-3px;
position: absolute;
width: 150px;
border-radius: 3px;
-moz-border-radius: 3px;
-mwebkit-border-radius: 3px;
-moz-box-shadow: 0 0 3px #ccc;
-webkit-box-shadow: 0 0 3px #ccc;
box-shadow: 0 0 3px #ccc;
border: solid 1px #ccc;
}
#aloha-loading img {
position: relative;
top:5px;
}
#references {
float:left;
padding-left: 30px;
font-size: 70%;
}
/* ========================================= */
/* ========================================= */
.ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; }
.hidden { display: none; visibility: hidden; }
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
.invisible { visibility: hidden; }
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }
span[role=annotation] { margin-right: 10px; }
@media all and (orientation:portrait) {
}
@media all and (orientation:landscape) {
}
@media screen and (max-device-width: 480px) {
/* html { -webkit-text-size-adjust:none; -ms-text-size-adjust:none; } */
}
@media print {
* { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important;
-ms-filter: none !important; }
a, a:visited { color: #444 !important; text-decoration: underline; }
a[href]:after { content: " (" attr(href) ")"; }
abbr[title]:after { content: " (" attr(title) ")"; }
.ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }
pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
thead { display: table-header-group; }
tr, img { page-break-inside: avoid; }
@page { margin: 0.5cm; }
p, h2, h3 { orphans: 3; widows: 3; }
h2, h3{ page-break-after: avoid; }
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 539 B

View File

@ -0,0 +1,43 @@
/* the humans responsible & colophon */
/* humanstxt.org */
/* TEAM */
Project Leader: Haymo Meran
Site: http://aloha-editor.org
Twitter: @alohaeditor
Location: Hacker Dojo, Mountain View, CA, USA
/* THANKS */
Berit Jensen (http://networkteam.de)
/* SITE */
Standards: HTML5, CSS3
Components: Modernizr, jQuery, Aloha Editor
Software:
-o/-
+oo//-
:ooo+//:
-ooooo///-
/oooooo//:
:ooooooo+//-
-+oooooooo///-
-://////////////+oooooooooo++////////////::
:+ooooooooooooooooooooooooooooooooooooo+:::-
-/+ooooooooooooooooooooooooooooooo+/::////:-
-:+oooooooooooooooooooooooooooo/::///////:-
--/+ooooooooooooooooooooo+::://////:-
-:+ooooooooooooooooo+:://////:--
/ooooooooooooooooo+//////:-
-ooooooooooooooooooo////-
/ooooooooo+oooooooooo//:
:ooooooo+/::/+oooooooo+//-
-oooooo/::///////+oooooo///-
/ooo+::://////:---:/+oooo//:
-o+/::///////:- -:/+o+//-
:-:///////:- -:/://
-////:- --//:
-- -:

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 414 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 344 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 569 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 501 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 311 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 484 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 52 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 516 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 436 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 473 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 655 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 165 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 230 B

View File

@ -0,0 +1,297 @@
<!doctype html>
<!--[if lt IE 7 ]> <html lang="en" class="no-js ie6"> <![endif]-->
<!--[if IE 7 ]> <html lang="en" class="no-js ie7"> <![endif]-->
<!--[if IE 8 ]> <html lang="en" class="no-js ie8"> <![endif]-->
<!--[if IE 9 ]> <html lang="en" class="no-js ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html lang="en" class="no-js"> <!--<![endif]-->
<head>
<title>The Aloha Editor Boilerplate - Just another demo page</title>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="description" content="The Aloha Editor Boilerplate - Just another demo page">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="shortcut icon" href="/favicon.ico">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<!--
Load the CSS styles for Aloha Editor
-->
<link rel="stylesheet" href="../../css/aloha.css" type="text/css">
<style>
/* Basic Styling for Sidebar */
.aloha-sidebar {
position: fixed;
right: 0;
top: 0;
width: 250px;
height: 100%;
border: 1px solid #000;
border-width: 0 0 0 1px;
background-color: #fff;
padding: 10px;
}
.aloha-panel {
border: 1px solid #000;
}
.aloha-panel-title {
background-color: #000;
color: #fff;
padding: 5px 10px;
}
.aloha-panel-content {
padding: 5px 10px;
}
</style>
<!--
All configuration for Aloha Editor for this demo is stored in js/aloha-config.js
It can also be placed inline here before loading Aloha Editor itself.
-->
<script src="js/aloha-config.js"></script>
<script src="../../lib/vendor/jquery-1.7.2.js"></script>
<script src="../../lib/require.js"></script>
<script>
Aloha.settings.jQuery = $.noConflict(true);
</script>
<!--
Load the Aloha Editor library.
The plugin list could also be added to the configuration.
-->
<script src="../../lib/aloha.js"
data-aloha-plugins="common/ui,
common/format,
common/table,
common/list,
common/link,
common/highlighteditables,
common/undo,
common/contenthandler,
common/paste,
extra/cite,
common/characterpicker,
common/commands,
common/block,
common/image,
common/abbr,
common/horizontalruler,
common/align,
extra/formatlesspaste,
extra/toc,
extra/headerids,
extra/listenforcer,
extra/metaview,
extra/numerated-headers,
extra/ribbon,
extra/wai-lang,
extra/flag-icons,
extra/linkbrowser,
extra/imagebrowser,
extra/cite"></script>
<!--
Application specific code
-->
<script src="ribbon-example.js"></script>
<link rel="stylesheet" href="css/style.css">
<script src="js/aloha-boilerplate.js"></script>
</head>
<body>
<div id="whole-site">
<div id="aloha-loading"><span>Loading Aloha Editor</span> <img src="img/loading1.gif" title="Loading Aloha Editor ..."/></div>
<div id="container">
<div id="header">
<a id="editor-logo" href="#"><img src="img/aloha-editor-logo.png" alt="Aloha Editor" /></a>
<p id="top-text">The Aloha Boilerplate.</p>
</div>
<div id="navigation">
<ul>
<li><a href="#">formatting</a></li>
<li><a href="#">images</a></li>
<li><a href="#">tables</a></li>
<li><a href="#">boxes</a></li>
<li><a href="#">comments</a></li>
</ul>
</div>
<div id="main" role="main">
<!-- Stage area start -->
<div class="stage-area">
<ul class="stage-switcher">
<li class="stage">
<span class="stage-icon" style="background-image: url(img/stage-icon-formats.png);"></span>
<h2>Formatting</h2>
<p>Bold, headlines, ...</p>
<div class="small-image stage-item">
<img src="img/stage-bg-formats.png" alt="" />
<div class="area-content">
<div class="aloha-textbox">
<p><b>Bold or headlines, whatever you might want</b></p>
<h2>Formatting content</h2>
<p>Editing any content with Aloha Editor is similar to editing with state of the art word processors on your desktop. No need to learn any HTML, Wiki or other markup language. The option dialogs have been designed for users not for techies. Writing content has never been that easy.</p>
<p><a href="#">More about content formatting</a></p>
</div>
</div>
</div>
</li>
<li class="stage">
<span class="stage-icon" style="background-image: url(img/stage-icon-images.png);"></span>
<h2>Images</h2>
<p>Placing, scaling ...</p>
<div class="full-image stage-item">
<img src="img/stage-bg-images.png" alt="" />
<div class="area-content">
<h3>Place and edit images with Aloha</h3>
<h2>Image-Editing</h2>
<p><img src="http://aloha-editor.org/logo/Aloha%20Editor%20HTML5%20sticker%20transparent%20128.png" title="Aloha Editor" alt="Aloha Editor" /> Editing any content with Aloha Editor is similar to editing with state of the art word processors on your desktop. No need to learn any HTML, Wiki or other markup language. The option dialogs have been designed for users not for techies. Writing content has never been that easy.</p>
<p><a href="#">Digg into placing/editing of images</a></p>
</div>
</div>
</li>
<li class="stage">
<span class="stage-icon" style="background-image: url(img/stage-icon-tables.png);"></span>
<h2>Tables</h2>
<p>All you might put into tables</p>
<div class="full-image stage-item">
<img src="img/stage-bg-tables.png" alt="" />
<div class="area-content">
<h3>Create and edit tables the way you want them to be</h3>
<h2>Table Stuff</h2>
<p>Editing any content with Aloha Editor is similar to editing with state of the art word processors on your desktop. No need to learn any HTML, Wiki or other markup language. The option dialogs have been designed for users not for techies. Writing content has never been that easy.</p>
<p><a href="#">Try out table editing</a></p>
</div>
</div>
</li>
<li class="stage">
<span class="stage-icon" style="background-image: url(img/stage-icon-boxes.png);"></span>
<h2>Boxes</h2>
<p>You may edit dynamic boxes</p>
<div class="full-image stage-item">
<img src="img/stage-bg-boxes.png" alt="" />
<div class="area-content">
<h3>You can edit dynamic content</h3>
<h2>Edit jQuery stuff</h2>
<p>Your imagination ist the limit. Edit every content even if it is dynamic.</p>
<p><a href="#">Try out jQuery boxes</a></p>
</div>
</div>
</li>
<li class="stage">
<span class="stage-icon" style="background-image: url(img/stage-icon-comments.png);"></span>
<h2>Comments</h2>
<p>threaded inline comments</p>
<div class="full-image stage-item">
<img src="img/stage-bg-comments.png" alt="" />
<div class="area-content">
<h3>Threaded inline enterprise commenting</h3>
<h2>Increase collaboration</h2>
<p>Your imagination ist the limit. Does more content fill the box and move it to the right?</p>
<p><a href="#">Try out jQuery boxes</a></p>
</div>
</div>
</li>
</ul>
</div>
<!-- Stage area end -->
<div id="content">
<p>Here you'll find some <b>example content</b> to show Aloha's <i>possibilities</i> regarding any kind of formatting.</p>
<h1>Headline 1</h1>
<h2>Headline 2</h2>
<h3>Headline 3</h3>
<h4>Headline 4</h4>
<h5>Headline 5</h5>
<h6>Headline 6</h6>
<p>Here we test, a <a title="" href="http://aloha-editor.org">link</a> and other formattings such as
<b>bold</b>, <i>italic</i> or <del>deleted text</del>. You may also use formattings for maths 2
<sup>2</sup> = 4 or chemical formulas like CO<sub>2</sub>.
Or you may edit tables as you do in office products.</p>
<table summary="demo content for aloha tables">
<tbody>
<tr><td >This</td><td >is</td><td>a</td><td>demo</td></tr>
<tr><td>table</td><td colspan=2 rowspan=2>with</td><td>an</td></tr>
<tr><td>awesome</td><td>column</td></tr>
<tr><td>and</td><td>row</td><td>span</td><td>!</td></tr>
</tbody>
<caption>describe the table</caption>
</table>
<p>To describe code you would use fixed style <i>pre</i></p>
<pre>
&lt;script&gt;
// make content editable
$('#content').aloha();
$('.top-text').aloha();
&lt;/script&gt;
</pre>
<ul>
<li>List entry
<ul>
<li>List entry</li>
<li>List entry
<ul>
<li>List entry</li>
<li>List entry</li>
</ul>
</li>
</ul>
</li>
<li>List entry</li>
<li>List entry</li>
<li>List entry</li>
</ul>
<p><br/></p>
<ol>
<li>List entry
<ol>
<li>List entry</li>
<li>List entry
<ol>
<li>List entry</li>
<li>List entry</li>
</ol>
</li>
</ol>
</li>
<li>List entry</li>
<li>List entry</li>
<li>List entry</li>
</ol>
<p>For better sematical understanding and <abbr title="Web Accessibility Initiative">WAI</abbr> compatibility you can describe abbreviations
like <abbr title="Hyper Text Markup Language">HTML</abbr> and
<abbr title="Cascading Style Sheets">CSS</abbr>.
</p>
<p><img class="inline-image" src="http://aloha-editor.org/logo/Aloha%20Editor%20HTML5%20technology%20128.png" alt="Aloha Editor" title="Aloha Editor" /></p>
<p>More Demos: <a href="http://aloha-editor.org/demos/" title="Aloha Editor Demos"> http://aloha-editor.org/demos/</a></p>
</div>
<div id="references">
<img src="http://aloha-editor.org/logo/Aloha%20Editor%20logo%20text%20128.png" alt="Aloha Editor" title="Aloha Editor" /><br />
&middot; Ask a <a href="http://getsatisfaction.com/aloha_editor">question</a><br />
&middot; Read the <a href="http://aloha-editor.org/guides">guides</a><br />
&middot; Report an <a href="https://github.com/alohaeditor/Aloha-Editor/issues">issue</a><br />
<br />
Aloha Editor <a href="http://aloha-editor.org">website</a><br />
</div>
</div>
</div>
<script type="text/javascript">
Aloha.ready( function(){
var $ = Aloha.jQuery;
// register all editable areas
$('#top-text').aloha();
$('#content').aloha();
$('.area-content').aloha();
// hide loading div
$('#aloha-loading').hide();
$('#aloha-loading span').html('Loading Plugins');
});
</script>
</div>
<!--[if lt IE 7 ]>
<script src="js/libs/dd_belatedpng.js"></script>
<script> DD_belatedPNG.fix('img, .png_bg');</script>
<![endif]-->
</body>
</html>

View File

@ -0,0 +1,56 @@
Aloha.ready(function() {
Aloha.require( ['aloha', 'jquery'], function( Aloha, $) {
$.fn.alohaStage = function() {
var switcher = this.find('ul.stage-switcher'),
me = this,
current,
showNext = function() {
var nextTab;
if (!me.currentTab) {
nextTab = switcher.find('li').first();
} else {
nextTab = me.currentTab.next();
if (nextTab.length == 0) {
nextTab = switcher.find('li').first();
}
}
nextTab.click();
};
switcher.children('li').each(function() {
var $this = $(this),
editable = $this.find('.area-content'), // make stage switcher available thru editable
item = $this.find('.stage-item').detach();
editable[0].tab = $this;
item.hide();
item.appendTo(switcher.parent());
$this.click(function(event) {
if (me.currentTab) me.currentTab.removeClass('active');
me.currentTab = $this;
$this.addClass('active');
if (current && current != item ) {
if (current) current.fadeOut(500);
}
item.fadeIn(500);
current = item;
});
$this.mouseover(function() {
$this.addClass('hover');
});
$this.mouseout(function() {
$this.removeClass('hover');
});
});
showNext();
switcher.animate({right: -150}, {queue: false});
switcher.mouseenter(function() {
switcher.animate({right: 0}, {queue: false});
});
switcher.mouseleave(function() {
switcher.animate({right: -150}, {queue: false});
});
};
$('.stage-area').alohaStage();
});
});

View File

@ -0,0 +1,173 @@
( function ( window, undefined ) {
var Aloha = window.Aloha || ( window.Aloha = {} );
Aloha.settings = {
logLevels: { 'error': true, 'warn': true, 'info': true, 'debug': false, 'deprecated': true },
errorhandling: false,
ribbon: {enable: true},
locale: 'en',
repositories: {
linklist: {
data: [
{ name: 'Aloha Editor Developers Wiki', url:'https://github.com/alohaeditor/Aloha-Editor/wiki', type:'website', weight: 0.50 },
{ name: 'Aloha Editor - The HTML5 Editor', url:'http://aloha-editor.com', type:'website', weight: 0.90 },
{ name: 'Aloha Editor Demo', url:'http://www.aloha-editor.com/demos.html', type:'website', weight: 0.75 },
{ name: 'Aloha Editor Wordpress Demo', url:'http://www.aloha-editor.com/demos/wordpress-demo/index.html', type:'website', weight: 0.75 },
{ name: 'Aloha Editor Logo', url:'http://www.aloha-editor.com/images/aloha-editor-logo.png', type:'image', weight: 0.10 }
]
}
},
plugins: {
format: {
// all elements with no specific configuration get this configuration
//config: [ 'b', 'i', 'p', 'sub', 'sup', 'del', 'title', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'pre', 'removeFormat' ],
editables: {
// no formatting allowed for title
'#top-text': []
}
},
list: {
// all elements with no specific configuration get an UL, just for fun :)
config: [ 'ul', 'ol' ],
editables: {
// Even if this is configured it is not set because OL and UL are not allowed in H1.
'#top-text': []
}
},
listenforcer: {
editables: [ '.aloha-enforce-lists' ]
},
abbr: {
// all elements with no specific configuration get an UL, just for fun :)
config: [ 'abbr' ],
editables: {
// Even if this is configured it is not set because OL and UL are not allowed in H1.
'#top-text': []
}
},
link: {
// all elements with no specific configuration may insert links
config: [ 'a' ],
hotKey: {
// use ctrl+l instead of ctrl+k as hotkey for inserting a link
//insertLink: 'ctrl+l'
},
editables: {
// No links in the title.
'#top-text': []
},
// all links that match the targetregex will get set the target
// e.g. ^(?!.*aloha-editor.com).* matches all href except aloha-editor.com
targetregex: '^(?!.*aloha-editor.com).*',
// this target is set when either targetregex matches or not set
// e.g. _blank opens all links in new window
target: '_blank',
// the same for css class as for target
cssclassregex: '^(?!.*aloha-editor.com).*',
cssclass: 'aloha',
// use all resources of type website for autosuggest
objectTypeFilter: ['website'],
// handle change of href
onHrefChange: function ( obj, href, item ) {
var jQuery = Aloha.require( 'jquery' );
if ( item ) {
jQuery( obj ).attr( 'data-name', item.name );
} else {
jQuery( obj ).removeAttr( 'data-name' );
}
}
},
table: {
// all elements with no specific configuration are not allowed to insert tables
config: [ 'table' ],
editables: {
// Don't allow tables in top-text
'#top-text': [ '' ]
},
summaryinsidebar: true,
// [{name:'green', text:'Green', tooltip:'Green is cool', iconClass:'GENTICS_table GENTICS_button_green', cssClass:'green'}]
tableConfig: [
{ name: 'hor-minimalist-a' },
{ name: 'box-table-a' },
{ name: 'hor-zebra' },
],
columnConfig: [
{ name: 'table-style-bigbold', iconClass: 'aloha-button-col-bigbold' },
{ name: 'table-style-redwhite', iconClass: 'aloha-button-col-redwhite' }
],
rowConfig: [
{ name: 'table-style-bigbold', iconClass: 'aloha-button-row-bigbold' },
{ name: 'table-style-redwhite', iconClass: 'aloha-button-row-redwhite' }
]
},
image: {
config:{
'fixedAspectRatio' : false,
'maxWidth' : 600,
'minWidth' : 20,
'maxHeight' : 600,
'minHeight' : 20,
'globalselector' : '.global',
'ui': {
'oneTab': true
}
},
'fixedAspectRatio' : false,
'maxWidth' : 600,
'minWidth' : 20,
'maxHeight' : 600,
'minHeight' : 20,
'globalselector' : '.global',
'ui': {
'oneTab' : true,
'align' : false,
'margin' : false
}
},
cite: {
referenceContainer: '#references'
},
formatlesspaste :{
formatlessPasteOption : true,
strippedElements : [
"em",
"strong",
"small",
"s",
"cite",
"q",
"dfn",
"abbr",
"time",
"code",
"var",
"samp",
"kbd",
"sub",
"sup",
"i",
"b",
"u",
"mark",
"ruby",
"rt",
"rp",
"bdi",
"bdo",
"ins",
"del"]
},
'numerated-headers': {
config: {
// default true
// numeratedactive will also accept "true" and "1" as true values
// false and "false" for false
numeratedactive: false,
// if the headingselector is empty, the button will not be shown at all
headingselector: 'h1, h2, h3, h4, h5, h6', // default: all
baseobjectSelector: 'body' // if not set: Aloha.activeEditable
}
}
}
};
} )( window );

File diff suppressed because one or more lines are too long

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,168 @@
Aloha.ready(function(){
if (!Aloha.isPluginLoaded('ribbon')) {
return;
}
Aloha.require(["ribbon/ribbon-plugin", "ui/ui", "ui/menuButton", 'ui/dialog'], function(Ribbon, Ui, MenuButton, Dialog){
Ui.adopt("insertTag", MenuButton, {
text: "X",
menu: [
{ text: "Z",
menu: [ { text: "one two", click: function(){console.log("Q");}, iconUrl: '../../plugins/extra/wai-lang/img/button.png' },
{ text: "three four five", click: function(){console.log("W");} } ],
iconUrl: '../../plugins/extra/wai-lang/img/button.png'},
{ text: "V sdf asdf as fasd fasfd asfasf asf",
menu: [ { text: "Q asd fas fasf as faw awe ftasf asd sad f", click: function(){console.log("Q");} },
{ text: "W", click: function(){console.log("W");} } ] }
],
iconUrl: '../../plugins/extra/wai-lang/img/button.png'
});
Ribbon.addButton({
text: "split button",
menu: [
{
text: "action with submenu",
menu: [
{
text: "submenu only",
menu: [{ text: "action only", click: function(){ console.log("action only"); } }]
},
{
text: "action only",
click: function() {
console.log("action only");
}
}
],
click: function(){
console.log("action with submenu");
}
}
],
click: function(){
console.log("split button");
},
iconUrl: '../../plugins/extra/wai-lang/img/button.png'
});
Ribbon.show();
Ribbon.addButton({
text: "menu button",
menu: [
{
text: "action with submenu",
menu: [
{
text: "submenu only",
menu: [{
text: "action only",
click: function(){ console.log("action only"); }
}]
},
{
text: "action only x x x x x x",
click: function() {
console.log("action only");
}
}
],
click: function(){
console.log("action with submenu");
}
}
]
});
Ribbon.addButton({
menu: [
{
text: "action with submenu",
menu: [
{
text: "submenu only",
menu: [{
text: "action only",
click: function(){ console.log("action only"); },
iconUrl: '../../plugins/extra/wai-lang/img/button.png'
}],
iconUrl: '../../plugins/extra/wai-lang/img/button.png'
},
{
text: "action only",
click: function() {
console.log("action only");
},
iconUrl: '../../plugins/extra/wai-lang/img/button.png'
}
],
click: function(){
console.log("action with submenu");
},
iconUrl: '../../plugins/extra/wai-lang/img/button.png'
}
],
iconUrl: '../../plugins/extra/wai-lang/img/button.png'
});
Ribbon.addButton({
text: "split button2",
menu: [
{
text: "action with submenu",
menu: [
{
text: "submenu only",
menu: [{ text: "action only", click: function(){ console.log("action only"); } }]
},
{
text: "action only",
click: function() {
console.log("action only");
}
}
],
click: function(){
console.log("action with submenu");
}
}
],
click: function(){
console.log("split button");
}
});
Ribbon.addButton({
text: 'confirm',
click: function() {
Dialog.confirm({
text: "Do you want to X?"
});
}
});
Ribbon.addButton({
text: 'alert',
click: function() {
Dialog.alert({
text: "X happened!"
});
}
});
Ribbon.addButton({
text: 'progress',
click: function() {
var progress = Dialog.progress({
text: "X is in progress...",
value: 0
});
var percent = 0;
var interval = setInterval(function() {
percent += 10;
progress(percent);
if (percent == 100) {
clearInterval(interval);
}
}, 1000);
}
});
});
});

View File

@ -0,0 +1,5 @@
# www.robotstxt.org/
# www.google.com/support/webmasters/bin/answer.py?hl=en&answer=156449
User-agent: *

View File

@ -0,0 +1,49 @@
// Bind to Aloha Ready Event
Aloha.ready( function() {
var $ = jQuery = Aloha.jQuery;
$('.edit').aloha();
var button = jQuery('#bold');
button.attr( 'disabled',
( Aloha.queryCommandSupported( 'bold' ) &&
Aloha.queryCommandEnabled( 'bold' ) )
);
button.click( function() {
Aloha.execCommand( 'bold', false, '' );
updateBoldColor();
});
Aloha.bind('aloha-selection-changed aloha-command-executed', function() {
updateBoldColor();
});
function updateBoldColor() {
if ( Aloha.queryCommandIndeterm( 'bold' ) ) {
button.css( 'background-color', 'yellow' );
return;
}
button.css( 'background-color',
Aloha.queryCommandState( 'bold' ) ? 'lightgreen' : 'orange'
);
}
// update the color on startup
updateBoldColor();
var
range = Aloha.createRange(),
begin = jQuery( 'p' ),
end = jQuery( 'i' );
//setStart and setEnd take dom node and the offset as parameters
range.setStart( begin.get(0), 0);
range.setEnd( end.get(0), 1);
//add the range to the selection
Aloha.getSelection().removeAllRanges();
Aloha.getSelection().addRange( range );
Aloha.execCommand( 'bold', false, '' );
});

View File

@ -0,0 +1,24 @@
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Aloha commands</title>
<script src="../../lib/aloha.js"></script>
</head>
<body>
<h1>Testing Aloha Editor commands</h1>
<button id="bold">Bold</button>
<div class="edit">This is some content</div>
<div class="edit">
<h1>Hello there</h1>
<p>{Some content to <i>select}</i> with Aloha selection.</p>
</div>
<script src="commands-demo.js"></script>
</body>
</html>

Binary file not shown.

After

Width:  |  Height:  |  Size: 251 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 279 B

View File

@ -0,0 +1,91 @@
body {
font-family: sans-serif;
}
body {
background-image: url("./background.png");
}
#bodyContent {
font-size:0.9em;
}
h1, h2, h3, h4, h5, h6 {
font-family: sans-serif;
padding-bottom:0.1em;
padding-top:0.5em;
}
h1 {
border-bottom:1px solid #AAAAAA;
}
h1 { font-size: 188%; }
h2 { font-size: 150%; }
h3 { font-size: 132%; }
h4 { font-size: 116%; }
h5 { font-size: 100%; }
h6 { font-size: 80%; }
#main {
width: 650px;
margin-top: 40px;
margin-left: auto ;
margin-right: auto ;
padding: 70px;
background-color: white;
border-radius: 1px;
-moz-border-radius: 1px;
box-shadow: 5px 5px rgba(0,0,0,0.3);
-webkit-box-shadow: 5px 5px rgba(0,0,0,0.3);
-moz-box-shadow: 5px 5px rgba(0,0,0,0.3);
}
a.external {
background: url("./external-link-ltr-icon.png") no-repeat 100% 50%;
padding: 0px 13px 0px 0px;
}
abbr, acronym
{
border-bottom: .1em dotted;
cursor: help;
}
/* A basic table styling */
table
{
padding: 0;
margin: 0;
border-collapse: collapse;
border: 1px solid #333;
color: #000;
}
table caption
{
caption-side: bottom;
font-size: 0.8em;
font-style: italic;
text-align: right;
padding: 0.5em 0;
}
table th, table td
{
border: 1px solid #666;
padding: 0.5em;
text-align: left;
}
#main ul,
#main ol {
margin:0 1.5em 1.5em 1.5em;
}
#main ul li {
list-style-type:disc;
}
#main ol li {
list-style-type:decimal;
}

View File

@ -0,0 +1,10 @@
Aloha Editor Demo
Demo implementation
Reset Session Store:
http://my-aloha-editor-demo.com/app/read-from-session.php?cmd=reset&pageId=0
- dont't name editable class to edit something "aloha-editable" (it's used by the core)
- class at links are removed (not so good)

View File

@ -0,0 +1,139 @@
(function(window, undefined) {
if (window.Aloha === undefined || window.Aloha === null) {
var Aloha = window.Aloha = {};
}
Aloha.settings = {
logLevels: {'error': true, 'warn': true, 'info': true, 'debug': false, 'deprecated': true},
errorhandling : false,
ribbon: false,
locale: 'en',
floatingmenu: {
width: 630
},
bundles: {
// Path for custom bundle relative from Aloha.settings.baseUrl usually path of aloha.js
cmsplugin: '../../../aloha-plugins'
},
repositories: {
linklist: {
data: [
{ name: 'Aloha Developers Wiki', url:'http://www.aloha-editor.com/wiki', type:'website', weight: 0.50 },
{ name: 'Aloha Editor - The HTML5 Editor', url:'http://aloha-editor.com', type:'website', weight: 0.90 },
{ name: 'Aloha Demo', url:'http://www.aloha-editor.com/demos.html', type:'website', weight: 0.75 },
{ name: 'Aloha Wordpress Demo', url:'http://www.aloha-editor.com/demos/wordpress-demo/index.html', type:'website', weight: 0.75 },
{ name: 'Aloha Logo', url:'http://www.aloha-editor.com/images/aloha-editor-logo.png', type:'image', weight: 0.10 }
]
}
},
plugins: {
format: {
// all elements with no specific configuration get this configuration
config : [ 'b', 'i', 'p', 'sub', 'sup', 'del', 'title', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'pre', 'removeFormat' ],
editables : {
// no formatting allowed for title
'#top-text' : [ ]
}
},
list: {
// all elements with no specific configuration get an UL, just for fun :)
config : [ 'ul', 'ol' ],
editables : {
// Even if this is configured it is not set because OL and UL are not allowed in H1.
'#top-text' : [ ]
}
},
abbr: {
// all elements with no specific configuration get an UL, just for fun :)
config : [ 'abbr' ],
editables : {
// Even if this is configured it is not set because OL and UL are not allowed in H1.
'#top-text' : [ ]
}
},
link: {
// all elements with no specific configuration may insert links
config : [ 'a' ],
editables : {
// No links in the title.
'#top-text' : [ ]
},
// all links that match the targetregex will get set the target
// e.g. ^(?!.*aloha-editor.com).* matches all href except aloha-editor.com
targetregex : '^(?!.*aloha-editor.com).*',
// this target is set when either targetregex matches or not set
// e.g. _blank opens all links in new window
target : '_blank',
// the same for css class as for target
cssclassregex : '^(?!.*aloha-editor.com).*',
cssclass : 'aloha',
// use all resources of type website for autosuggest
objectTypeFilter: ['website'],
// handle change of href
onHrefChange: function( obj, href, item ) {
var jQuery = Aloha.require('jquery');
if ( item ) {
jQuery(obj).attr('data-name', item.name);
} else {
jQuery(obj).removeAttr('data-name');
}
}
},
table: {
// all elements with no specific configuration are not allowed to insert tables
config : [ 'table' ],
editables : {
// Don't allow tables in top-text
'#top-text' : [ '' ]
},
summaryinsidebar : true,
// [{name:'green', text:'Green', tooltip:'Green is cool', iconClass:'GENTICS_table GENTICS_button_green', cssClass:'green'}]
tableConfig : [
{name:'hor-minimalist-a'},
{name:'box-table-a'},
{name:'hor-zebra'},
],
columnConfig : [
{name: 'table-style-bigbold', iconClass: 'aloha-button-col-bigbold'},
{name: 'table-style-redwhite', iconClass: 'aloha-button-col-redwhite'}
],
rowConfig : [
{name: 'table-style-bigbold', iconClass: 'aloha-button-row-bigbold'},
{name: 'table-style-redwhite', iconClass: 'aloha-button-row-redwhite'}
]
},
image: {
config :{
'fixedAspectRatio': true,
'maxWidth': 600,
'minWidth': 20,
'maxHeight': 600,
'minHeight': 20,
'globalselector': '.global',
'ui': {
'oneTab': true
}
},
/*'fixedAspectRatio': false,
'maxWidth': 600,
'minWidth': 20,
'maxHeight': 600,
'minHeight': 20,
'globalselector': '.global',
'ui': {
'oneTab': true,
'align': false,
'margin': false
}*/
},
cite: {
referenceContainer: '#references'
},
formatlesspaste :{
formatlessPasteOption : true
}
}
};
})(window);

View File

@ -0,0 +1,139 @@
(function(window, undefined) {
if (window.Aloha === undefined || window.Aloha === null) {
var Aloha = window.Aloha = {};
}
Aloha.settings = {
logLevels: {'error': true, 'warn': true, 'info': true, 'debug': false, 'deprecated': true},
errorhandling : false,
ribbon: false,
locale: 'en',
floatingmenu: {
width: 630
},
bundles: {
// Path for custom bundle relative from Aloha.settings.baseUrl usually path of aloha.js
cmsplugin: '../../../aloha-plugins'
},
repositories: {
linklist: {
data: [
{ name: 'Aloha Developers Wiki', url:'http://www.aloha-editor.com/wiki', type:'website', weight: 0.50 },
{ name: 'Aloha Editor - The HTML5 Editor', url:'http://aloha-editor.com', type:'website', weight: 0.90 },
{ name: 'Aloha Demo', url:'http://www.aloha-editor.com/demos.html', type:'website', weight: 0.75 },
{ name: 'Aloha Wordpress Demo', url:'http://www.aloha-editor.com/demos/wordpress-demo/index.html', type:'website', weight: 0.75 },
{ name: 'Aloha Logo', url:'http://www.aloha-editor.com/images/aloha-editor-logo.png', type:'image', weight: 0.10 }
]
}
},
plugins: {
format: {
// all elements with no specific configuration get this configuration
config : [ 'b', 'i', 'p', 'sub', 'sup', 'del', 'title', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'pre', 'removeFormat' ],
editables : {
// no formatting allowed for title
'#top-text' : [ ]
}
},
list: {
// all elements with no specific configuration get an UL, just for fun :)
config : [ 'ul', 'ol' ],
editables : {
// Even if this is configured it is not set because OL and UL are not allowed in H1.
'#top-text' : [ ]
}
},
abbr: {
// all elements with no specific configuration get an UL, just for fun :)
config : [ 'abbr' ],
editables : {
// Even if this is configured it is not set because OL and UL are not allowed in H1.
'#top-text' : [ ]
}
},
link: {
// all elements with no specific configuration may insert links
config : [ 'a' ],
editables : {
// No links in the title.
'#top-text' : [ ]
},
// all links that match the targetregex will get set the target
// e.g. ^(?!.*aloha-editor.com).* matches all href except aloha-editor.com
targetregex : '^(?!.*aloha-editor.com).*',
// this target is set when either targetregex matches or not set
// e.g. _blank opens all links in new window
target : '_blank',
// the same for css class as for target
cssclassregex : '^(?!.*aloha-editor.com).*',
cssclass : 'aloha',
// use all resources of type website for autosuggest
objectTypeFilter: ['website'],
// handle change of href
onHrefChange: function( obj, href, item ) {
var jQuery = Aloha.require('jquery');
if ( item ) {
jQuery(obj).attr('data-name', item.name);
} else {
jQuery(obj).removeAttr('data-name');
}
}
},
table: {
// all elements with no specific configuration are not allowed to insert tables
config : [ 'table' ],
editables : {
// Don't allow tables in top-text
'#top-text' : [ '' ]
},
summaryinsidebar : true,
// [{name:'green', text:'Green', tooltip:'Green is cool', iconClass:'GENTICS_table GENTICS_button_green', cssClass:'green'}]
tableConfig : [
{name:'hor-minimalist-a'},
{name:'box-table-a'},
{name:'hor-zebra'},
],
columnConfig : [
{name: 'table-style-bigbold', iconClass: 'aloha-button-col-bigbold'},
{name: 'table-style-redwhite', iconClass: 'aloha-button-col-redwhite'}
],
rowConfig : [
{name: 'table-style-bigbold', iconClass: 'aloha-button-row-bigbold'},
{name: 'table-style-redwhite', iconClass: 'aloha-button-row-redwhite'}
]
},
image: {
config :{
'fixedAspectRatio': true,
'maxWidth': 600,
'minWidth': 20,
'maxHeight': 600,
'minHeight': 20,
'globalselector': '.global',
'ui': {
'oneTab': true
}
},
/*'fixedAspectRatio': false,
'maxWidth': 600,
'minWidth': 20,
'maxHeight': 600,
'minHeight': 20,
'globalselector': '.global',
'ui': {
'oneTab': true,
'align': false,
'margin': false
}*/
},
cite: {
referenceContainer: '#references'
},
formatlesspaste :{
formatlessPasteOption : true
}
}
};
})(window);

View File

@ -0,0 +1,21 @@
(function(window, undefined) {
if (window.Aloha === undefined || window.Aloha === null) {
var Aloha = window.Aloha = {};
}
/*
This is a minimal Aloha Editor configuration
In this Aloha Editor Demo Demo we add a custom plugin.
This plugin is located in our own specific plugin bundle.
*/
Aloha.settings = {
logLevels: { 'error': true, 'warn': true, 'info': true, 'debug': true, 'deprecated': true },
locale: 'en',
bundles: {
// Path for custom bundle relative from Aloha.settings.baseUrl usually path of aloha.js
cmsplugin: '../demo/demo-app/app/aloha-plugins'
}
};
})(window);

View File

@ -0,0 +1,19 @@
(function(window, undefined) {
if (window.Aloha === undefined || window.Aloha === null) {
var Aloha = window.Aloha = {};
}
/*
This is a minimal Aloha Editor configuration
In this Aloha Editor Demo Demo we add a custom plugin.
This plugin is located in our own specific plugin bundle.
*/
Aloha.settings = {
bundles: {
// Path for custom bundle relative from Aloha.settings.baseUrl usually path of aloha.js
cmsplugin: '../../../aloha-plugins'
}
};
})(window);

View File

@ -0,0 +1,6 @@
Download the latest version of Aloha Editor (v0.20.x) from http://aloha-editor.org and extract the archive here.
Check that you have the following structure:
app/aloha-editor/aloha/lib/aloha.js
( and app/aloha-editor/aloha/css/aloha.css )

View File

@ -0,0 +1,93 @@
/**
* Aloha Link List Repository
* --------------------------
* A simple demo repository of links
*/
define( [ 'jquery', 'aloha/repository' ],
function ( jQuery, repository ) {
new ( repository.extend( {
_constructor: function () {
this._super( 'cmslinklist' );
},
urlset: [
{ name: 'Aloha Editor Demo', url: 'http://aloha-editor.org/demo/nano-cms', type: 'website' }
],
/**
* initalize LinkList, parse all links, build folder structure and add
* additional properties to the items
*/
init: function () {
var that = this;
// Add ECMA262-5 Array method filter if not supported natively.
// But we will be very conservative and add to this single array
// object so that we do not tamper with the native Array prototype
// object
if ( !( 'filter' in Array.prototype ) ) {
this.urlset.filter = function ( filter, that /*opt*/ ) {
var other = [],
v,
i = 0,
n = this.length;
for ( ; i < n; i++ ) {
if ( i in this && filter.call( that, v = this[ i ], i, this ) ) {
other.push( v );
}
}
return other;
};
}
jQuery.ajax({ type: "GET",
dataType: "json",
async: false,
url: 'app/demo-app-linklist.php',
success: function(data) {
//console.log('lookup data', data);
var items = [];
if (data.length) {
that.urlset = data;
}
},
error: function(data) {
//console.log('lookup error', data);
}
});
this.repositoryName = 'AlohaCMSLinklist';
},
/**
* Searches a repository for object items matching query if
* objectTypeFilter. If none is found it returns null.
*
* @param {Object} p
* @param {Function} callback
* @return {null|Array}
*/
query: function ( p, callback ) {
// Not supported; filter, orderBy, maxItems, skipcount, renditionFilter
var r = new RegExp( p.queryString, 'i' );
var d = this.urlset.filter( function ( e, i, a ) {
return (
( !p.queryString || e.name.match( r ) || e.url.match( r ) ) &&
( !p.objectTypeFilter || ( !p.objectTypeFilter.length ) || jQuery.inArray( e.type, p.objectTypeFilter ) > -1 ) &&
true
);
} );
callback.call( this, d );
},
} ) )();
} );

View File

@ -0,0 +1,32 @@
define( [
'aloha',
'jquery',
'aloha/plugin',
'../../cms/extra/cms-linklist' // custom linklist
], function ( Aloha, jQuery, Plugin ) {
var GENTICS = window.GENTICS;
/**
* register the plugin with unique name
*/
return Plugin.create( 'cms-plugin', {
/**
* Initialize the plugin and set initialize flag on true
*/
init: function () {
// do nothing
},
/**
* toString method
* @return string
*/
toString: function () {
return 'cms-plugin';
}
} );
} );

View File

@ -0,0 +1,17 @@
body {
padding-top: 60px;
}
#save-page, #edit-page {
display: none; // does not work with jquery hide/show (and twitter bootstrap)
}
.cms-actions {
font-size: 10px;
}
#footer {
margin-top: 17px;
padding-top: 17px;
border-top: 1px solid #eee;
}

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,75 @@
<?php
/**
* provide aloha link suggestion
*/
/*
// also possible: use the lookup filter here to not send a json with 10000s of entries
$lookup = false;
if (isset($_REQUEST['lookup'])) {
$lookup = $_REQUEST['lookup'];
}
*/
// read all available files
$results = array();
// all pages
$files = get_files( '../' );
$results = array_merge($results, $files);
// all uploads
$files = get_files( '../uploads/' );
$results = array_merge($results, $files);
header('Content-Type:text/javascript');
if (count($results) > 0) {
$out = '[';
foreach ($results as $result) {
$out .= '{"url":"'.$result['link'].'","name":"'.$result['title'].'","type":"'.$result['type'].'"},';
}
$out = substr($out, 0, -1);
$out .= ']';
echo $out;
}
/**
* helper functions
*/
function get_files( $dir = '../', $dir_path = false) {
$files = scandir( $dir );
$result = array();
if ( empty($dir_path) ) {
$dir_path = substr($dir, 1, 0);
}
foreach ( $files as $file ) {
$data = false;
if ( $file === '.' || $file === '..' ) {
continue;
} else if (is_file($dir.$file)) {
$data['link'] = $dir_path.$file;
$data['title'] = nice_file_title($file); // read title from html, image/auto meta data ...
$data['type'] = 'website'; // check what type the file is -- now just use 'website'
array_push($result, $data);
}
}
return $result;
}
function nice_file_title($title) {
$ext = pathinfo($title, PATHINFO_EXTENSION);
$search = array("-", "_", "+", ".".$ext);
$title = trim(str_replace($search, " ", $title));
$title = $title.' ('.strtolower($ext).')';
return $title;
}

View File

@ -0,0 +1 @@

View File

@ -0,0 +1,39 @@
// We don't need to wait for Aloha in this case;
// Just get the data from our backend database and write the saved HTML into the DOM
// Note: In this Example we don't care about SEO / non JavaScript devices!
$(document).ready(function() {
// get the current page URL / ID and all Aloha Editables for that page
var backend = 'session', // session, db -- no file backend for reading needed
pageId = window.location.pathname;
if ( backend == 'file' ) {
return false;
}
// read the data from our database backend
var request = jQuery.ajax({
url: "app/read-from-" + backend + ".php",
type: "POST",
data: {
pageId : pageId
},
dataType: "json"
});
request.done(function(msg) {
// insert all content into the coresponding html container
jQuery.each(msg, function() {
// Aloha is not ready yet so we just alter the DOM
jQuery('#'+this.contentId).html(this.content);
});
});
request.fail(function(jqXHR, textStatus) {
jQuery("#log p").html( "Request failed: " + textStatus );
alert("Request failed: " + textStatus );
});
});

View File

@ -0,0 +1,45 @@
// Aloha is ready;
// Listen to the 'aloha-editable-deactivated' event and save the data to our backend
Aloha.ready(function() {
Aloha.require( ['aloha', 'jquery'], function( Aloha, jQuery) {
// start: save content on deactivation of an Aloha Editable
Aloha.bind('aloha-editable-deactivated', function() {
var backend = 'session', // session, db, file
content = Aloha.activeEditable.getContents(), // this is the cleaned content of the last active editable
contentId = Aloha.activeEditable.getId(), // this HTML ID of the DOM element
pageId = window.location.pathname; // page URL / ID
// textarea handling -- html id is "xy" and will be "xy-aloha" for the aloha editable
if ( contentId.match(/-aloha$/gi) ) {
contentId = contentId.replace( /-aloha/gi, '' );
}
// send the data to our save.php backend script
var request = jQuery.ajax({
url: "app/save-to-" + backend + ".php",
type: "POST",
data: {
content : content,
contentId : contentId,
pageId : pageId
},
dataType: "html"
});
request.done(function(msg) {
// everything was fine; content saved
jQuery("#log p").html( msg );
});
request.fail(function(jqXHR, textStatus) {
// there was a problem; content not saved
jQuery("#log p").html( "Request failed: " + textStatus );
});
});
// end: save content on deactivation of an Aloha Editable
});
});

View File

@ -0,0 +1,124 @@
/* ==========================================================
* bootstrap-alerts.js v1.4.0
* http://twitter.github.com/bootstrap/javascript.html#alerts
* ==========================================================
* Copyright 2011 Twitter, Inc.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
* ========================================================== */
!function( $ ){
"use strict"
/* CSS TRANSITION SUPPORT (https://gist.github.com/373874)
* ======================================================= */
var transitionEnd
$(document).ready(function () {
$.support.transition = (function () {
var thisBody = document.body || document.documentElement
, thisStyle = thisBody.style
, support = thisStyle.transition !== undefined || thisStyle.WebkitTransition !== undefined || thisStyle.MozTransition !== undefined || thisStyle.MsTransition !== undefined || thisStyle.OTransition !== undefined
return support
})()
// set CSS transition event type
if ( $.support.transition ) {
transitionEnd = "TransitionEnd"
if ( $.browser.webkit ) {
transitionEnd = "webkitTransitionEnd"
} else if ( $.browser.mozilla ) {
transitionEnd = "transitionend"
} else if ( $.browser.opera ) {
transitionEnd = "oTransitionEnd"
}
}
})
/* ALERT CLASS DEFINITION
* ====================== */
var Alert = function ( content, options ) {
if (options == 'close') return this.close.call(content)
this.settings = $.extend({}, $.fn.alert.defaults, options)
this.$element = $(content)
.delegate(this.settings.selector, 'click', this.close)
}
Alert.prototype = {
close: function (e) {
var $element = $(this)
, className = 'alert-message'
$element = $element.hasClass(className) ? $element : $element.parent()
e && e.preventDefault()
$element.removeClass('in')
function removeElement () {
$element.remove()
}
$.support.transition && $element.hasClass('fade') ?
$element.bind(transitionEnd, removeElement) :
removeElement()
}
}
/* ALERT PLUGIN DEFINITION
* ======================= */
$.fn.alert = function ( options ) {
if ( options === true ) {
return this.data('alert')
}
return this.each(function () {
var $this = $(this)
, data
if ( typeof options == 'string' ) {
data = $this.data('alert')
if (typeof data == 'object') {
return data[options].call( $this )
}
}
$(this).data('alert', new Alert( this, options ))
})
}
$.fn.alert.defaults = {
selector: '.close'
}
$(document).ready(function () {
new Alert($('body'), {
selector: '.alert-message[data-alert] .close'
})
})
}( window.jQuery || window.ender );

View File

@ -0,0 +1,64 @@
/* ============================================================
* bootstrap-buttons.js v1.4.0
* http://twitter.github.com/bootstrap/javascript.html#buttons
* ============================================================
* Copyright 2011 Twitter, Inc.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
* ============================================================ */
!function( $ ){
"use strict"
function setState(el, state) {
var d = 'disabled'
, $el = $(el)
, data = $el.data()
state = state + 'Text'
data.resetText || $el.data('resetText', $el.html())
$el.html( data[state] || $.fn.button.defaults[state] )
setTimeout(function () {
state == 'loadingText' ?
$el.addClass(d).attr(d, d) :
$el.removeClass(d).removeAttr(d)
}, 0)
}
function toggle(el) {
$(el).toggleClass('active')
}
$.fn.button = function(options) {
return this.each(function () {
if (options == 'toggle') {
return toggle(this)
}
options && setState(this, options)
})
}
$.fn.button.defaults = {
loadingText: 'loading...'
}
$(function () {
$('body').delegate('.btn[data-toggle]', 'click', function () {
$(this).button('toggle')
})
})
}( window.jQuery || window.ender );

View File

@ -0,0 +1,55 @@
/* ============================================================
* bootstrap-dropdown.js v1.4.0
* http://twitter.github.com/bootstrap/javascript.html#dropdown
* ============================================================
* Copyright 2011 Twitter, Inc.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
* ============================================================ */
!function( $ ){
"use strict"
/* DROPDOWN PLUGIN DEFINITION
* ========================== */
$.fn.dropdown = function ( selector ) {
return this.each(function () {
$(this).delegate(selector || d, 'click', function (e) {
var li = $(this).parent('li')
, isActive = li.hasClass('open')
clearMenus()
!isActive && li.toggleClass('open')
return false
})
})
}
/* APPLY TO STANDARD DROPDOWN ELEMENTS
* =================================== */
var d = 'a.menu, .dropdown-toggle'
function clearMenus() {
$(d).parent('li').removeClass('open')
}
$(function () {
$('html').bind("click", clearMenus)
$('body').dropdown( '[data-dropdown] a.menu, [data-dropdown] .dropdown-toggle' )
})
}( window.jQuery || window.ender );

View File

@ -0,0 +1,260 @@
/* =========================================================
* bootstrap-modal.js v1.4.0
* http://twitter.github.com/bootstrap/javascript.html#modal
* =========================================================
* Copyright 2011 Twitter, Inc.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
* ========================================================= */
!function( $ ){
"use strict"
/* CSS TRANSITION SUPPORT (https://gist.github.com/373874)
* ======================================================= */
var transitionEnd
$(document).ready(function () {
$.support.transition = (function () {
var thisBody = document.body || document.documentElement
, thisStyle = thisBody.style
, support = thisStyle.transition !== undefined || thisStyle.WebkitTransition !== undefined || thisStyle.MozTransition !== undefined || thisStyle.MsTransition !== undefined || thisStyle.OTransition !== undefined
return support
})()
// set CSS transition event type
if ( $.support.transition ) {
transitionEnd = "TransitionEnd"
if ( $.browser.webkit ) {
transitionEnd = "webkitTransitionEnd"
} else if ( $.browser.mozilla ) {
transitionEnd = "transitionend"
} else if ( $.browser.opera ) {
transitionEnd = "oTransitionEnd"
}
}
})
/* MODAL PUBLIC CLASS DEFINITION
* ============================= */
var Modal = function ( content, options ) {
this.settings = $.extend({}, $.fn.modal.defaults, options)
this.$element = $(content)
.delegate('.close', 'click.modal', $.proxy(this.hide, this))
if ( this.settings.show ) {
this.show()
}
return this
}
Modal.prototype = {
toggle: function () {
return this[!this.isShown ? 'show' : 'hide']()
}
, show: function () {
var that = this
this.isShown = true
this.$element.trigger('show')
escape.call(this)
backdrop.call(this, function () {
var transition = $.support.transition && that.$element.hasClass('fade')
that.$element
.appendTo(document.body)
.show()
if (transition) {
that.$element[0].offsetWidth // force reflow
}
that.$element.addClass('in')
transition ?
that.$element.one(transitionEnd, function () { that.$element.trigger('shown') }) :
that.$element.trigger('shown')
})
return this
}
, hide: function (e) {
e && e.preventDefault()
if ( !this.isShown ) {
return this
}
var that = this
this.isShown = false
escape.call(this)
this.$element
.trigger('hide')
.removeClass('in')
$.support.transition && this.$element.hasClass('fade') ?
hideWithTransition.call(this) :
hideModal.call(this)
return this
}
}
/* MODAL PRIVATE METHODS
* ===================== */
function hideWithTransition() {
// firefox drops transitionEnd events :{o
var that = this
, timeout = setTimeout(function () {
that.$element.unbind(transitionEnd)
hideModal.call(that)
}, 500)
this.$element.one(transitionEnd, function () {
clearTimeout(timeout)
hideModal.call(that)
})
}
function hideModal (that) {
this.$element
.hide()
.trigger('hidden')
backdrop.call(this)
}
function backdrop ( callback ) {
var that = this
, animate = this.$element.hasClass('fade') ? 'fade' : ''
if ( this.isShown && this.settings.backdrop ) {
var doAnimate = $.support.transition && animate
this.$backdrop = $('<div class="modal-backdrop ' + animate + '" />')
.appendTo(document.body)
if ( this.settings.backdrop != 'static' ) {
this.$backdrop.click($.proxy(this.hide, this))
}
if ( doAnimate ) {
this.$backdrop[0].offsetWidth // force reflow
}
this.$backdrop.addClass('in')
doAnimate ?
this.$backdrop.one(transitionEnd, callback) :
callback()
} else if ( !this.isShown && this.$backdrop ) {
this.$backdrop.removeClass('in')
$.support.transition && this.$element.hasClass('fade')?
this.$backdrop.one(transitionEnd, $.proxy(removeBackdrop, this)) :
removeBackdrop.call(this)
} else if ( callback ) {
callback()
}
}
function removeBackdrop() {
this.$backdrop.remove()
this.$backdrop = null
}
function escape() {
var that = this
if ( this.isShown && this.settings.keyboard ) {
$(document).bind('keyup.modal', function ( e ) {
if ( e.which == 27 ) {
that.hide()
}
})
} else if ( !this.isShown ) {
$(document).unbind('keyup.modal')
}
}
/* MODAL PLUGIN DEFINITION
* ======================= */
$.fn.modal = function ( options ) {
var modal = this.data('modal')
if (!modal) {
if (typeof options == 'string') {
options = {
show: /show|toggle/.test(options)
}
}
return this.each(function () {
$(this).data('modal', new Modal(this, options))
})
}
if ( options === true ) {
return modal
}
if ( typeof options == 'string' ) {
modal[options]()
} else if ( modal ) {
modal.toggle()
}
return this
}
$.fn.modal.Modal = Modal
$.fn.modal.defaults = {
backdrop: false
, keyboard: false
, show: false
}
/* MODAL DATA- IMPLEMENTATION
* ========================== */
$(document).ready(function () {
$('body').delegate('[data-controls-modal]', 'click', function (e) {
e.preventDefault()
var $this = $(this).data('show', true)
$('#' + $this.attr('data-controls-modal')).modal( $this.data() )
})
})
}( window.jQuery || window.ender );

View File

@ -0,0 +1,90 @@
/* ===========================================================
* bootstrap-popover.js v1.4.0
* http://twitter.github.com/bootstrap/javascript.html#popover
* ===========================================================
* Copyright 2011 Twitter, Inc.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
* =========================================================== */
!function( $ ) {
"use strict"
var Popover = function ( element, options ) {
this.$element = $(element)
this.options = options
this.enabled = true
this.fixTitle()
}
/* NOTE: POPOVER EXTENDS BOOTSTRAP-TWIPSY.js
========================================= */
Popover.prototype = $.extend({}, $.fn.twipsy.Twipsy.prototype, {
setContent: function () {
var $tip = this.tip()
$tip.find('.title')[this.options.html ? 'html' : 'text'](this.getTitle())
$tip.find('.content > *')[this.options.html ? 'html' : 'text'](this.getContent())
$tip[0].className = 'popover'
}
, hasContent: function () {
return this.getTitle() || this.getContent()
}
, getContent: function () {
var content
, $e = this.$element
, o = this.options
if (typeof this.options.content == 'string') {
content = $e.attr(this.options.content)
} else if (typeof this.options.content == 'function') {
content = this.options.content.call(this.$element[0])
}
return content
}
, tip: function() {
if (!this.$tip) {
this.$tip = $('<div class="popover" />')
.html(this.options.template)
}
return this.$tip
}
})
/* POPOVER PLUGIN DEFINITION
* ======================= */
$.fn.popover = function (options) {
if (typeof options == 'object') options = $.extend({}, $.fn.popover.defaults, options)
$.fn.twipsy.initWith.call(this, options, Popover, 'popover')
return this
}
$.fn.popover.defaults = $.extend({} , $.fn.twipsy.defaults, {
placement: 'right'
, content: 'data-content'
, template: '<div class="arrow"></div><div class="inner"><h3 class="title"></h3><div class="content"><p></p></div></div>'
})
$.fn.twipsy.rejectAttrOptions.push( 'content' )
}( window.jQuery || window.ender );

View File

@ -0,0 +1,107 @@
/* =============================================================
* bootstrap-scrollspy.js v1.4.0
* http://twitter.github.com/bootstrap/javascript.html#scrollspy
* =============================================================
* Copyright 2011 Twitter, Inc.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
* ============================================================== */
!function ( $ ) {
"use strict"
var $window = $(window)
function ScrollSpy( topbar, selector ) {
var processScroll = $.proxy(this.processScroll, this)
this.$topbar = $(topbar)
this.selector = selector || 'li > a'
this.refresh()
this.$topbar.delegate(this.selector, 'click', processScroll)
$window.scroll(processScroll)
this.processScroll()
}
ScrollSpy.prototype = {
refresh: function () {
this.targets = this.$topbar.find(this.selector).map(function () {
var href = $(this).attr('href')
return /^#\w/.test(href) && $(href).length ? href : null
})
this.offsets = $.map(this.targets, function (id) {
return $(id).offset().top
})
}
, processScroll: function () {
var scrollTop = $window.scrollTop() + 10
, offsets = this.offsets
, targets = this.targets
, activeTarget = this.activeTarget
, i
for (i = offsets.length; i--;) {
activeTarget != targets[i]
&& scrollTop >= offsets[i]
&& (!offsets[i + 1] || scrollTop <= offsets[i + 1])
&& this.activateButton( targets[i] )
}
}
, activateButton: function (target) {
this.activeTarget = target
this.$topbar
.find(this.selector).parent('.active')
.removeClass('active')
this.$topbar
.find(this.selector + '[href="' + target + '"]')
.parent('li')
.addClass('active')
}
}
/* SCROLLSPY PLUGIN DEFINITION
* =========================== */
$.fn.scrollSpy = function( options ) {
var scrollspy = this.data('scrollspy')
if (!scrollspy) {
return this.each(function () {
$(this).data('scrollspy', new ScrollSpy( this, options ))
})
}
if ( options === true ) {
return scrollspy
}
if ( typeof options == 'string' ) {
scrollspy[options]()
}
return this
}
$(document).ready(function () {
$('body').scrollSpy('[data-scrollspy] li > a')
})
}( window.jQuery || window.ender );

View File

@ -0,0 +1,80 @@
/* ========================================================
* bootstrap-tabs.js v1.4.0
* http://twitter.github.com/bootstrap/javascript.html#tabs
* ========================================================
* Copyright 2011 Twitter, Inc.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
* ======================================================== */
!function( $ ){
"use strict"
function activate ( element, container ) {
container
.find('> .active')
.removeClass('active')
.find('> .dropdown-menu > .active')
.removeClass('active')
element.addClass('active')
if ( element.parent('.dropdown-menu') ) {
element.closest('li.dropdown').addClass('active')
}
}
function tab( e ) {
var $this = $(this)
, $ul = $this.closest('ul:not(.dropdown-menu)')
, href = $this.attr('href')
, previous
, $href
if ( /^#\w+/.test(href) ) {
e.preventDefault()
if ( $this.parent('li').hasClass('active') ) {
return
}
previous = $ul.find('.active a').last()[0]
$href = $(href)
activate($this.parent('li'), $ul)
activate($href, $href.parent())
$this.trigger({
type: 'change'
, relatedTarget: previous
})
}
}
/* TABS/PILLS PLUGIN DEFINITION
* ============================ */
$.fn.tabs = $.fn.pills = function ( selector ) {
return this.each(function () {
$(this).delegate(selector || '.tabs li > a, .pills > li > a', 'click', tab)
})
}
$(document).ready(function () {
$('body').tabs('ul[data-tabs] li > a, ul[data-pills] > li > a')
})
}( window.jQuery || window.ender );

View File

@ -0,0 +1,321 @@
/* ==========================================================
* bootstrap-twipsy.js v1.4.0
* http://twitter.github.com/bootstrap/javascript.html#twipsy
* Adapted from the original jQuery.tipsy by Jason Frame
* ==========================================================
* Copyright 2011 Twitter, Inc.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
* ========================================================== */
!function( $ ) {
"use strict"
/* CSS TRANSITION SUPPORT (https://gist.github.com/373874)
* ======================================================= */
var transitionEnd
$(document).ready(function () {
$.support.transition = (function () {
var thisBody = document.body || document.documentElement
, thisStyle = thisBody.style
, support = thisStyle.transition !== undefined || thisStyle.WebkitTransition !== undefined || thisStyle.MozTransition !== undefined || thisStyle.MsTransition !== undefined || thisStyle.OTransition !== undefined
return support
})()
// set CSS transition event type
if ( $.support.transition ) {
transitionEnd = "TransitionEnd"
if ( $.browser.webkit ) {
transitionEnd = "webkitTransitionEnd"
} else if ( $.browser.mozilla ) {
transitionEnd = "transitionend"
} else if ( $.browser.opera ) {
transitionEnd = "oTransitionEnd"
}
}
})
/* TWIPSY PUBLIC CLASS DEFINITION
* ============================== */
var Twipsy = function ( element, options ) {
this.$element = $(element)
this.options = options
this.enabled = true
this.fixTitle()
}
Twipsy.prototype = {
show: function() {
var pos
, actualWidth
, actualHeight
, placement
, $tip
, tp
if (this.hasContent() && this.enabled) {
$tip = this.tip()
this.setContent()
if (this.options.animate) {
$tip.addClass('fade')
}
$tip
.remove()
.css({ top: 0, left: 0, display: 'block' })
.prependTo(document.body)
pos = $.extend({}, this.$element.offset(), {
width: this.$element[0].offsetWidth
, height: this.$element[0].offsetHeight
})
actualWidth = $tip[0].offsetWidth
actualHeight = $tip[0].offsetHeight
placement = maybeCall(this.options.placement, this, [ $tip[0], this.$element[0] ])
switch (placement) {
case 'below':
tp = {top: pos.top + pos.height + this.options.offset, left: pos.left + pos.width / 2 - actualWidth / 2}
break
case 'above':
tp = {top: pos.top - actualHeight - this.options.offset, left: pos.left + pos.width / 2 - actualWidth / 2}
break
case 'left':
tp = {top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left - actualWidth - this.options.offset}
break
case 'right':
tp = {top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left + pos.width + this.options.offset}
break
}
$tip
.css(tp)
.addClass(placement)
.addClass('in')
}
}
, setContent: function () {
var $tip = this.tip()
$tip.find('.twipsy-inner')[this.options.html ? 'html' : 'text'](this.getTitle())
$tip[0].className = 'twipsy'
}
, hide: function() {
var that = this
, $tip = this.tip()
$tip.removeClass('in')
function removeElement () {
$tip.remove()
}
$.support.transition && this.$tip.hasClass('fade') ?
$tip.bind(transitionEnd, removeElement) :
removeElement()
}
, fixTitle: function() {
var $e = this.$element
if ($e.attr('title') || typeof($e.attr('data-original-title')) != 'string') {
$e.attr('data-original-title', $e.attr('title') || '').removeAttr('title')
}
}
, hasContent: function () {
return this.getTitle()
}
, getTitle: function() {
var title
, $e = this.$element
, o = this.options
this.fixTitle()
if (typeof o.title == 'string') {
title = $e.attr(o.title == 'title' ? 'data-original-title' : o.title)
} else if (typeof o.title == 'function') {
title = o.title.call($e[0])
}
title = ('' + title).replace(/(^\s*|\s*$)/, "")
return title || o.fallback
}
, tip: function() {
return this.$tip = this.$tip || $('<div class="twipsy" />').html(this.options.template)
}
, validate: function() {
if (!this.$element[0].parentNode) {
this.hide()
this.$element = null
this.options = null
}
}
, enable: function() {
this.enabled = true
}
, disable: function() {
this.enabled = false
}
, toggleEnabled: function() {
this.enabled = !this.enabled
}
, toggle: function () {
this[this.tip().hasClass('in') ? 'hide' : 'show']()
}
}
/* TWIPSY PRIVATE METHODS
* ====================== */
function maybeCall ( thing, ctx, args ) {
return typeof thing == 'function' ? thing.apply(ctx, args) : thing
}
/* TWIPSY PLUGIN DEFINITION
* ======================== */
$.fn.twipsy = function (options) {
$.fn.twipsy.initWith.call(this, options, Twipsy, 'twipsy')
return this
}
$.fn.twipsy.initWith = function (options, Constructor, name) {
var twipsy
, binder
, eventIn
, eventOut
if (options === true) {
return this.data(name)
} else if (typeof options == 'string') {
twipsy = this.data(name)
if (twipsy) {
twipsy[options]()
}
return this
}
options = $.extend({}, $.fn[name].defaults, options)
function get(ele) {
var twipsy = $.data(ele, name)
if (!twipsy) {
twipsy = new Constructor(ele, $.fn.twipsy.elementOptions(ele, options))
$.data(ele, name, twipsy)
}
return twipsy
}
function enter() {
var twipsy = get(this)
twipsy.hoverState = 'in'
if (options.delayIn == 0) {
twipsy.show()
} else {
twipsy.fixTitle()
setTimeout(function() {
if (twipsy.hoverState == 'in') {
twipsy.show()
}
}, options.delayIn)
}
}
function leave() {
var twipsy = get(this)
twipsy.hoverState = 'out'
if (options.delayOut == 0) {
twipsy.hide()
} else {
setTimeout(function() {
if (twipsy.hoverState == 'out') {
twipsy.hide()
}
}, options.delayOut)
}
}
if (!options.live) {
this.each(function() {
get(this)
})
}
if (options.trigger != 'manual') {
binder = options.live ? 'live' : 'bind'
eventIn = options.trigger == 'hover' ? 'mouseenter' : 'focus'
eventOut = options.trigger == 'hover' ? 'mouseleave' : 'blur'
this[binder](eventIn, enter)[binder](eventOut, leave)
}
return this
}
$.fn.twipsy.Twipsy = Twipsy
$.fn.twipsy.defaults = {
animate: true
, delayIn: 0
, delayOut: 0
, fallback: ''
, placement: 'above'
, html: false
, live: false
, offset: 0
, title: 'title'
, trigger: 'hover'
, template: '<div class="twipsy-arrow"></div><div class="twipsy-inner"></div>'
}
$.fn.twipsy.rejectAttrOptions = [ 'title' ]
$.fn.twipsy.elementOptions = function(ele, options) {
var data = $(ele).data()
, rejects = $.fn.twipsy.rejectAttrOptions
, i = rejects.length
while (i--) {
delete data[rejects[i]]
}
return $.extend({}, options, data)
}
}( window.jQuery || window.ender );

View File

@ -0,0 +1,170 @@
/*
Aloha Editor Demo
The following files should act as a simple example how to use Aloha Editor with a backend to store and read data.
Theres no user authentication so use this scripts just for educational purposes. Not for production Sites!
*/
/** load style sheets **/
/*
Bootstrap CSS
This is part of the Twitter Bootstrap Toolkit used for a nice look and feel
See: http://twitter.github.com/bootstrap/
*/
loadCSS('app/css/bootstrap.css');
/*
This file includes all application specific styles for the UI
*/
loadCSS('app/css/aloha-editor-demo.css');
/** load javascripts **/
/*
jQuery
Here we add our own jQuery version for demonstration usage.
You can also just use the jQuery version delivered with Aloha Editor.
*/
loadJS('app/js/jquery-1.7.min.js');
/*
Load scripts to prepare a demo page
eg. load the navigation and show / hide page elements where aloha is not needed...
*/
setTimeout(function() {
loadJS('app/js/demo-app-prepare.js');
}, 100);
/*
Aloha Editor
First we add our configuration.
The configuration is not needed by default but handy to configure Aloha to your needs.
The second step is to include aloha.js and define the desired plugins in the "data-aloha-plugins" attribute.
In this Demo we also load a custom plugin from our Aloha Editor Demo bundle (defined in the configuration).
And the final step is to include the needed stylesheet for Aloha Editor.
*/
// we need all running on a server (ajax stuff)
if ( document.location.href.match(/^file:\/\//gi ) ) {
alert( 'This demo needs to run on a server over http:// not file:// ' );
}
// check for aloha environment
// local app version
//var alohaEditorPath = 'app/aloha-editor/aloha/';
//loadJS('app/aloha-config/minimal.js');
// config for demo-app in aloha dev github repos
var alohaEditorPath = '../../';
loadJS('app/aloha-config/minimal-demo.js');
loadJS( alohaEditorPath + 'lib/aloha.js', 'common/format, \
common/table, \
common/list, \
common/link, \
common/highlighteditables, \
common/block, \
common/undo, \
common/commands, \
common/paste, \
common/abbr, \
common/image, \
common/contenthandler, \
extra/browser, \
extra/linkbrowser, \
cmsplugin/cms');
loadCSS( alohaEditorPath + 'css/aloha.css');
setTimeout(function() {
/*
This file handles some functionality for our "Aloha Editor Demo"
We provide functionality to edit / save changes of a page (all editables at once)
...
*/
loadJS('app/js/demo-app.js');
/*
In this file we handle the storage of content edited with Aloha Editor.
When an editable is deactivated the content of that editable is sent to the server.
On the server a PHP backend script saves the data to our database (sqlite).
Note: There's no user authentication available! Use it not on production sites.
Note: If you don't want to enable saving on every deactivation of an editable
you can disable this script and use the "save button" provided with demo-app.js
*/
// uncomment if you want to save to the backend after every deactivation of an editable
//loadJS('app/js/aloha-save-to-backend.js');
/*
In this file we handle reading of content for editables from a database / session.
When a page is loaded we read the data for all editables for that page from a database and update the HTML.
On the server we read the database and send the results to the client.
Note: This just shows how it can be used and we do not care about SEO / disabled JavaScript on the client.
*/
// uncomment if you use the store to file backend
loadJS('app/js/aloha-read-from-backend.js');
}, 400);
/**
* helpers ++++++++++++++++++++++++++++++++++++++++++++++++++++++++
*/
/**
* insert a css script tag into the head of a html page
*/
function loadCSS( href, media ) {
var headID = document.getElementsByTagName("head")[0];
var cssNode = document.createElement('link');
cssNode.type = 'text/css';
cssNode.rel = 'stylesheet';
cssNode.href = href;
if ( media ) {
cssNode.media = media;
}
headID.appendChild(cssNode);
}
/**
* insert a js script tag into the head of a html page
*/
function loadJS( src, plugins ) {
var headID = document.getElementsByTagName("head")[0];
var newScript = document.createElement('script');
newScript.type = 'text/javascript';
newScript.src = src;
if ( plugins ) {
newScript.setAttribute('data-aloha-plugins', plugins);
}
headID.appendChild(newScript);
}
/**
* check if a file exists
*/
function fileExists( url ) {
oHttp = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");
oHttp.open("HEAD", url, false);
oHttp.send();
return ( oHttp.status == 404 ) ? false : true;
}

View File

@ -0,0 +1,41 @@
$(document).ready(function() {
// here jQuery 1.7 (non Aloha) is used
//console.log('jQuery: ' + $().jquery);
// hide the save and edit button on startup
$('#save-page').hide();
$('#edit-page').hide();
// hide the log message container
$("#log").hide();
// load navigation
$("#navigation").load("./sitemap.html #sitemap li");
// and set active navigation item
setTimeout("setActiveNavItem()",100);
// load title
$("#brand").load("./sitemap.html #brand a");
// load footer
$("#footer").load("./sitemap.html #footer p");
});
function setActiveNavItem() {
$(".nav li").each(function() {
if (getFilename($(this).find('a').attr('href')) == getFilename(window.location.pathname)) {
$(this).addClass( 'active' );
}
});
}
function getFilename( path ) {
var filename = './',
index = path.lastIndexOf("/");
if ( index ) {
filename = path.substr( index );
}
return filename.toLowerCase();
}

View File

@ -0,0 +1,62 @@
// Aloha Editor Demo logic
Aloha.ready(function() {
Aloha.require( ['aloha', 'jquery' ], function( Aloha, jQuery ) {
// here jQuery 1.6 from Aloha is used
//console.log('Aloha jQuery: ' + jQuery().jquery);
// Aloha is fully loaded. hide loading message
jQuery('#aloha-loading').hide();
// un-/comment to activate all editables on page load
//jQuery('.aloha-editor-demo-editable').aloha();
// un-/comment to activate editables with edit-button on the page
jQuery('#edit-page').show();
jQuery('#save-page').bind('click', function() {
//alert('Save the page content. To be done.');
//console.log('save page');
jQuery('.aloha-editor-demo-editable').mahalo();
jQuery('.aloha-editor-demo-editable').each(function() {
var content = this.innerHTML;
var contentId = this.id;
var pageId = window.location.pathname;
//console.log(pageId + ' -- ' + contentId + ' content: ' + content);
var request = jQuery.ajax({
url: "app/save-to-session.php",
type: "POST",
data: {
content : content,
contentId : contentId,
pageId : pageId
},
dataType: "html"
});
request.done(function(msg) {
jQuery("#log").html( msg );
});
request.fail(function(jqXHR, textStatus) {
alert( "Request failed: " + textStatus );
});
});
jQuery('#edit-page').show();
jQuery('#save-page').hide();
});
jQuery('#edit-page').bind('click', function() {
jQuery('.aloha-editor-demo-editable').aloha();
jQuery('#edit-page').hide();
jQuery('#save-page').show();
});
});
});

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,109 @@
<?php
/**
* JavaScript-like HTML DOM Element
*
* This class extends PHP's DOMElement to allow
* users to get and set the innerHTML property of
* HTML elements in the same way it's done in
* JavaScript.
*
* Example usage:
* @code
* require_once 'JSLikeHTMLElement.php';
* header('Content-Type: text/plain');
* $doc = new DOMDocument();
* $doc->registerNodeClass('DOMElement', 'JSLikeHTMLElement');
* $doc->loadHTML('<div><p>Para 1</p><p>Para 2</p></div>');
* $elem = $doc->getElementsByTagName('div')->item(0);
*
* // print innerHTML
* echo $elem->innerHTML; // prints '<p>Para 1</p><p>Para 2</p>'
* echo "\n\n";
*
* // set innerHTML
* $elem->innerHTML = '<a href="http://fivefilters.org">FiveFilters.org</a>';
* echo $elem->innerHTML; // prints '<a href="http://fivefilters.org">FiveFilters.org</a>'
* echo "\n\n";
*
* // print document (with our changes)
* echo $doc->saveXML();
* @endcode
*
* @author Keyvan Minoukadeh - http://www.keyvan.net - keyvan@keyvan.net
* @see http://fivefilters.org (the project this was written for)
*/
class JSLikeHTMLElement extends DOMElement
{
/**
* Used for setting innerHTML like it's done in JavaScript:
* @code
* $div->innerHTML = '<h2>Chapter 2</h2><p>The story begins...</p>';
* @endcode
*/
public function __set($name, $value) {
if ($name == 'innerHTML') {
// first, empty the element
for ($x=$this->childNodes->length-1; $x>=0; $x--) {
$this->removeChild($this->childNodes->item($x));
}
// $value holds our new inner HTML
if ($value != '') {
$f = $this->ownerDocument->createDocumentFragment();
// appendXML() expects well-formed markup (XHTML)
$result = @$f->appendXML($value); // @ to suppress PHP warnings
if ($result) {
if ($f->hasChildNodes()) $this->appendChild($f);
} else {
// $value is probably ill-formed
$f = new DOMDocument();
$value = mb_convert_encoding($value, 'HTML-ENTITIES', 'UTF-8');
// Using <htmlfragment> will generate a warning, but so will bad HTML
// (and by this point, bad HTML is what we've got).
// We use it (and suppress the warning) because an HTML fragment will
// be wrapped around <html><body> tags which we don't really want to keep.
// Note: despite the warning, if loadHTML succeeds it will return true.
$result = @$f->loadHTML('<htmlfragment>'.$value.'</htmlfragment>');
if ($result) {
$import = $f->getElementsByTagName('htmlfragment')->item(0);
foreach ($import->childNodes as $child) {
$importedNode = $this->ownerDocument->importNode($child, true);
$this->appendChild($importedNode);
}
} else {
// oh well, we tried, we really did. :(
// this element is now empty
}
}
}
} else {
$trace = debug_backtrace();
trigger_error('Undefined property via __set(): '.$name.' in '.$trace[0]['file'].' on line '.$trace[0]['line'], E_USER_NOTICE);
}
}
/**
* Used for getting innerHTML like it's done in JavaScript:
* @code
* $string = $div->innerHTML;
* @endcode
*/
public function __get($name)
{
if ($name == 'innerHTML') {
$inner = '';
foreach ($this->childNodes as $child) {
$inner .= $this->ownerDocument->saveXML($child);
}
return $inner;
}
$trace = debug_backtrace();
trigger_error('Undefined property via __get(): '.$name.' in '.$trace[0]['file'].' on line '.$trace[0]['line'], E_USER_NOTICE);
return null;
}
public function __toString()
{
return '['.$this->tagName.']';
}
}

View File

@ -0,0 +1,66 @@
<?php
$dbFile = 'db.sqlite';
error_log("\n\n".'###### read from DB '.$dbFile, 3, "demo-app.log");
// create table 'aloha' and insert sample data if SQLite dbFile does not exist
if ( !file_exists($dbFile) ) {
error_log("\n".'SQLite Database does not exist '.$dbFile, 3, "demo-app.log");
try {
$db = new SQLiteDatabase($dbFile, 0666, $error);
$db->query("BEGIN;
CREATE TABLE aloha (
id INTEGER PRIMARY KEY,
pageId CHAR(255),
contentId CHAR(255),
content TEXT
);
INSERT INTO aloha
(id, pageId, contentId, content)
VALUES
(NULL, NULL, NULL, 'Click to edit');
COMMIT;");
error_log("\n".'SQLite Database created '.$dbFile, 3, "demo-app.log");
} catch (Exception $e) {
die($error);
}
} else {
// db already exists
$db = new SQLiteDatabase($dbFile, 0666, $error);
}
// check if we have already a data set for this and save data
// XSS handling required
$pageId = sqlite_escape_string($_REQUEST['pageId']);
$query = "SELECT * FROM aloha
WHERE
pageId = '".$pageId."';";
$result = $db->query($query, $error);
$exists = false;
$data = array();
while($result->valid()) {
$exists = true;
$row=$result->current();
$data[] = $row;
$result->next();
error_log("\n".'data available for page '.$pageId, 3, "demo-app.log");
}
error_log("\n".'error: '.print_r($data, true), 3, "demo-app.log");
if ( !empty($error) ) {
error_log("\n".'error: '.print_r($error, true), 3, "demo-app.log");
} else {
print_r(json_encode($data));
}
?>

View File

@ -0,0 +1,41 @@
<?php
session_start();
error_log("\n\n".'###### read from session ', 3, "demo-app.log");
// XSS handling required
$pageId = $_REQUEST['pageId'];
$cmd = false;
if (!empty($_REQUEST['cmd'])) {
$cmd = $_REQUEST['cmd'];
}
if ($cmd == 'reset') {
session_destroy();
}
$data = false;
$json_data = false;
if (!empty($_SESSION[md5($pageId)])) {
$data = $_SESSION[md5($pageId)];
foreach($data as $k => $v) {
$json_data[$k] = unserialize($v);
}
}
if (!empty($data)) {
error_log("\n".'data available for page '.$pageId, 3, "demo-app.log");
}
if ( !empty($error) ) {
error_log("\n".'error: '.print_r($error, true), 3, "demo-app.log");
} else {
print_r(json_encode($json_data));
}
?>

View File

@ -0,0 +1,86 @@
<?php
$dbFile = 'db.sqlite';
error_log("\n\n".'###### save to db '.$dbFile, 3, "demo-app.log");
// create table 'aloha' and insert sample data if SQLite dbFile does not exist
if ( !file_exists($dbFile) ) {
error_log("\n".'SQLite Database does not exist '.$dbFile, 3, "demo-app.log");
try {
$db = new SQLiteDatabase($dbFile, 0666, $error);
$db->query("BEGIN;
CREATE TABLE aloha (
id INTEGER PRIMARY KEY,
pageId CHAR(255),
contentId CHAR(255),
content TEXT
);
INSERT INTO aloha
(id, pageId, contentId, content)
VALUES
(NULL, NULL, NULL, 'Click to edit');
COMMIT;");
error_log("\n".'SQLite Database created '.$dbFile, 3, "demo-app.log");
} catch (Exception $e) {
die($error);
}
} else {
// db already exists
$db = new SQLiteDatabase($dbFile, 0666, $error);
}
// check if we have already a data set for this
// XSS handling required
$pageId = sqlite_escape_string($_REQUEST['pageId']);
$contentId = sqlite_escape_string($_REQUEST['contentId']);
$content = sqlite_escape_string($_REQUEST['content']);
$query = "SELECT id FROM aloha
WHERE
pageId = '".$pageId."'
AND contentId = '".$contentId."';";
$result = $db->query($query, $error);
$exists = false;
if($result->valid()) {
$exists = true;
$row=$result->current();
}
if ($exists == true) {
error_log("\n".'update data for page '.$pageId.' and contentId '.$contentId, 3, "demo-app.log");
$query = "BEGIN;
UPDATE aloha SET
content = '".$content."'
WHERE
id = ".$row['id'].";
COMMIT;";
} else {
error_log("\n".'insert data for page '.$pageId.' and contentId '.$contentId, 3, "demo-app.log");
$query = "BEGIN;
INSERT INTO aloha
(id, pageId, contentId, content)
VALUES
(NULL, '".$pageId."', '".$contentId."', '".$content."');
COMMIT;";
}
$db->query($query, $error);
if ( !empty($error) ) {
error_log("\n".'error: '.print_r($error, true), 3, "demo-app.log");
} else {
echo 'Content saved.';
}
?>

View File

@ -0,0 +1,45 @@
<?php
require_once 'lib/JSLikeHTMLElement.php';
// Save Data
// XSS handling required
$pageId = $_REQUEST['pageId'];
$contentId = $_REQUEST['contentId'];
$content = $_REQUEST['content'];
error_log("\n\n".'###### save as file '.$pageId, 3, "demo-app.log");
$filePath = preg_replace('%^(/*)[^/]+%', '$2..', $pageId);
$pageContent = file_get_contents($filePath);
$error = false;
$doc = new DOMDocument();
//$doc->resolveExternals = true;
$doc->registerNodeClass('DOMElement', 'JSLikeHTMLElement');
if (!$doc->loadHTML($pageContent)) {
$error = 'Could not load HTML';
} else {
$elem = $doc->getElementById($contentId);
//error_log("\n innerhtml: ".print_r($elem->innerHTML, true), 3, "demo-app.log");
// set innerHTML
$elem->innerHTML = $content;
if (!file_put_contents($filePath, $doc->saveHTML())) {
$error = 'Could not update file.';
}
}
if ( !empty($error) ) {
error_log("\nerror: ".print_r($error, true), 3, "demo-app.log");
} else {
echo 'Content saved.';
}
?>

View File

@ -0,0 +1,28 @@
<?php
session_start();
error_log("\n\n".'###### save to session ', 3, "demo-app.log");
// XSS handling required
$pageId = $_REQUEST['pageId'];
$contentId = $_REQUEST['contentId'];
$content = $_REQUEST['content'];
$data = false;
if (!empty($pageId)) {
$contentItemId = md5($pageId.'#'.$contentId);
$data['id'] = $contentItemId;
$data['pageId'] = $pageId;
$data['contentId'] = $contentId;
$data['content'] = $content;
$_SESSION[md5($pageId)][$contentItemId] = serialize($data);
}
if ( !empty($error) ) {
error_log("\n".'error: '.print_r($error, true), 3, "demo-app.log");
} else {
echo 'Content saved.';
}
?>

View File

@ -0,0 +1,102 @@
<!DOCTYPE html>
<html lang="en"><head><meta charset="utf-8"><title>Aloha Editor Demo</title><meta name="description" content="Aloha Editor Demo"><meta name="author" content="Aloha Editor Team"><script src="app/js/demo-app-load.js"></script><!-- Le HTML5 shim, for IE6-8 support of HTML elements --><!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]--></head><body>
<div class="topbar">
<div class="fill">
<div class="container">
<span id="brand"><a class="brand" href="#">Aloha Editor Demo</a></span>
<ul class="nav" id="navigation">
<li class="active"><a href="./">Home</a></li>
<li><a href="./">Sitemap</a></li>
</ul>
<a id="edit-page" href="#"><span class="label notice">Edit</span></a>
<a id="save-page" href="#"><span class="label warning">Save</span></a>
</div>
</div>
</div>
<div class="container">
<div id="aloha-loading" class="alert-message notice">
<p>Loading Aloha Editor</p>
</div>
<!-- Main hero unit for a primary marketing message or call to action -->
<div class="hero-unit">
<h2>Feedback</h2>
<p>Send us your feedback. This shows how to use Aloha Editor with texarea.</p>
<form>
<fieldset><legend>How do you like Aloha Editor?</legend>
<div class="clearfix">
<label for="">Name</label>
<div class="input">
<input type="text" size="30" name="xlInput" id="xlInput" class="xlarge"></div>
</div> <!-- /clearfix -->
<fieldset><div class="clearfix">
<label for="prependedInput">Twitter ID</label>
<div class="input">
<div class="input-prepend">
<span class="add-on">@</span>
<input type="text" size="16" name="prependedInput" id="prependedInput" class="medium"></div>
</div>
</div> <!-- /clearfix -->
<div class="clearfix">
<label for="prependedInput2">Like Aloha Editor?</label>
<div class="input">
<div class="input-prepend">
<label class="add-on"><input type="checkbox" value="" id="" name=""></label>
<input type="text" size="16" name="prependedInput2" id="prependedInput2" class="medium"></div>
</div>
</div> <!-- /clearfix -->
</fieldset><fieldset><div class="clearfix">
<label id="optionsCheckboxes">List of Options</label>
<div class="input">
<ul class="inputs-list"><li>
<label>
<input type="checkbox" value="option1" name="optionsCheckboxes"><span>I like to use Aloha Editor</span>
</label>
</li>
<li>
<label>
<input type="checkbox" value="option2" name="optionsCheckboxes"><span>I like to support Aloha Editor</span>
</label>
</li>
<li>
<label class="disabled">
<input type="checkbox" disabled value="option2" name="optionsCheckboxes"><span>I like an invitation for the next hackathon.</span>
</label>
</li>
</ul><span class="help-block">
<strong>Note:</strong> Labels surround all the options for much larger click areas and a more usable form.
</span>
</div>
</div> <!-- /clearfix -->
<div class="clearfix">
<label for="textarea">Message</label>
<div class="input">
<textarea name="textarea" id="textarea" class="xxlarge aloha-editor-demo-editable"></textarea><span class="help-block">
Write about your experience with Aloha Editor.</span>
</div> </div> <!-- /clearfix -->
<div class="actions">
<button class="btn primary" type="submit">Send feedback</button>&nbsp;<button class="btn" type="reset">Cancel</button>
</div>
</fieldset></fieldset></form>
</div>
<div id="footer"><p>Aloha Editor Demo</p>
</div><!-- /container -->
<script type="text/javascript">
Aloha.ready( function(){
var $ = Aloha.jQuery;
// disable edit button
setTimeout(function() {
$('#edit-page').hide();
}, 1000);
});
</script>
</div></body></html>

View File

@ -0,0 +1,82 @@
<!DOCTYPE html>
<html lang="en"><head><meta charset="utf-8"><title>Aloha Editor Demo</title><meta name="description" content="Aloha Editor Demo"><meta name="author" content="Aloha Editor Team">
<script type="text/javascript" src="app/js/demo-app-load.js"></script>
<!-- Le HTML5 shim, for IE6-8 support of HTML elements --><!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head><body>
<div class="topbar">
<div class="fill">
<div class="container">
<span id="brand"><a class="brand" href="#">Aloha Editor Demo</a></span>
<ul class="nav" id="navigation">
<li class="active"><a href="./">Home</a></li>
<li><a href="./">Sitemap</a></li>
</ul>
<a id="edit-page" href="#"><span class="label notice">Edit</span></a>
<a id="save-page" href="#"><span class="label warning">Save</span></a>
</div>
</div>
</div>
<div class="container">
<div id="aloha-loading" class="alert-message notice">
<p>Loading Aloha Editor</p>
</div>
<!-- Main hero unit for a primary marketing message or call to action -->
<div id="data-head" class="hero-unit aloha-editor-demo-editable">
<h1>Aloha, world!</h1>
<p>This is a demo application using Aloha Editor to edit content using contentEditables.</p>
<p>You can download the source code with Aloha Editor on <a href="http://github.com/alohaeditor">github</a>. In this demo application you can store the changes to a backend (database, session, file).</p>
<p><a class="btn primary large" href="./feedback.html">Send Feedback &raquo;</a></p>
</div>
<!-- Example row of columns -->
<div class="row">
<div id="data-1" class="span4 aloha-editor-demo-editable">
<h2>Web Page</h2>
<p>See how easy it is to edit web pages with Aloha Editor.</p>
<p>We provide you with examples to integrate Aloha Editor in your system. Learn how to connect your backend to store edited content and create a Aloha Plugin for your own link suggestions.</p>
<a class="btn" href="./page.html">View demo &raquo;</a>
</div>
<div class="row">
<div id="data-2" class="span4 aloha-editor-demo-editable">
<h2>Article</h2>
<p>Edit a 3 column text with Aloha Editor and see the result in realtime.</p>
<p>This shows what you can do with modern web technologies like CSS3 and HTML5.</p>
<a class="btn" href="./mobydick.html">View demo &raquo;</a>
</div>
<div class="row">
<div id="data-3" class="span4 aloha-editor-demo-editable">
<h2>CMS Textarea</h2>
<p>Replace your existing CMS WYSIWYG Editor with Aloha. With Aloha Editor you can also use traditional textareas.</p>
<a class="btn" href="./textarea.html">View demo &raquo;</a>
</div>
<div class="row">
<div id="data-4" class="span4 aloha-editor-demo-editable">
<h2>Download Aloha</h2>
<p>Download Aloha Editor from our website.</p>
<a class="btn" href="http://aloha-editor.org">Download &raquo;</a>
</div>
</div>
<div id="footer"><p>Aloha Editor Demo</p>
</div><!-- /container -->
</body></html>

View File

@ -0,0 +1,111 @@
<!DOCTYPE html>
<html lang="en"><head><meta charset="utf-8"><title>Aloha Editor Demo</title><meta name="description" content="Aloha Editor Demo"><meta name="author" content="Aloha Editor Team"><script type="text/javascript" src="app/js/demo-app-load.js"></script><!-- Le HTML5 shim, for IE6-8 support of HTML elements --><!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]--><!--
Author: Joshua Kelly (http://www.kmsm.ca/)
--><link href="http://kernest.com/fonts/komika-axis.css" media="screen" rel="stylesheet" type="text/css"><style type="text/css">
#multicolumnElement {
-webkit-column-width:300px;
-webkit-column-gap:20px;
-moz-column-width:300px;
-moz-column-gap:20px;
column-width:300px;
column-gap:20px;
width:940px;
height: 700px;
margin: 0 auto;
}
h1 {
font-family: 'Komika Axis';
line-height: 140%;
text-rendering: optimizeLegibility;
margin:20px auto;
font-size:10.5em;
color: #2a719e;
text-align:center;
}
.p-intro {
font-size: 1.5em;
line-height: 1.3em;
text-align:left !important;
}
p {
font-family: georgia;
font-size: 1em;
line-height: 1.4em;
text-align: justify;
}
NO.p-intro:first-letter {
color: #5499c5;
display: inline;
float: left;
font-size: 4em;
margin: 0px;
padding: 0.2em 0.1em 0 0.1em;
text-transform: capitalize;
font-family: 'Komika Axis';
}
img {
display: block;
width: 300px;
overflow: visible;
}
</style></head><body>
<div class="topbar">
<div class="fill">
<div class="container">
<span id="brand"><a class="brand" href="#">Aloha Editor Demo</a></span>
<ul class="nav" id="navigation">
<li class="active"><a href="./">Home</a></li>
<li><a href="./">Sitemap</a></li>
</ul>
<a id="edit-page" href="#"><span class="label notice">Edit</span></a>
<a id="save-page" href="#"><span class="label warning">Save</span></a>
</div>
</div>
</div>
<div class="container">
<div id="aloha-loading" class="alert-message notice">
<p>Loading Aloha Editor</p>
</div>
<h1 id="page-title" class="aloha-editor-demo-editable">Moby Dick</h1>
<!-- Main hero unit for a primary marketing message or call to action -->
<div id="multicolumnElement" class="aloha-editor-demo-editable"><p class="p-intro">Call me Ishmael. Some years ago - never mind how long precisely - having little or no money in my purse, and nothing particular to interest me on shore, I thought I would sail about a little and see the watery part of the world.</p>
<p>It is a way I have of driving off the spleen, and regulating the circulation. Whenever I find myself growing grim about the mouth; whenever it is a damp, drizzly November in my soul; whenever I find myself involuntarily pausing before coffin warehouses, and bringing up the rear of every funeral I meet; and especially whenever my hypos get such an upper hand of me, that it requires a strong moral principle to prevent me from deliberately stepping into the street, and methodically knocking people's hats off - then, I account it high time to get to sea as soon as I can. This is my substitute for pistol and ball. With a philosophical flourish Cato throws himself upon his sword; I quietly take to the ship. There is nothing surprising in this. If they but knew it, almost all men in their degree, some time or other, cherish very nearly the same feelings towards the ocean with me.</p>
<p>There now is your insular city of the Manhattoes, belted round by wharves as Indian isles by coral reefs - commerce surrounds it with her surf. Right and left, the streets take you waterward. Its extreme down-town is the battery, where that noble mole is washed by waves, and cooled by breezes, which a few hours previous were out of sight of land. Look at the crowds of water-gazers there.</p>
<img src="uploads/moby-dick.jpg"><p>Circumambulate the city of a dreamy Sabbath afternoon. Go from Corlears Hook to Coenties Slip, and from thence, by Whitehall northward. What do you see? - Posted like silent sentinels all around the town, stand thousands upon thousands of mortal men fixed in ocean reveries. Some leaning against the spiles; some seated upon the pier-heads; some looking over the bulwarks of ships from China; some high aloft in the rigging, as if striving to get a still better seaward peep. But these are all landsmen; of week days pent up in lath and plaster - tied to counters, nailed to benches, clinched to desks. How then is this? Are the green fields gone? What do they here?</p>
<p>But look! here come more crowds, pacing straight for the water, and seemingly bound for a dive. Strange! Nothing will content them but the extremest limit of the land; loitering under the shady lee of yonder warehouses will not suffice. No. They must get just as nigh the water as they possibly can without falling in. And there they stand - miles of them - leagues. Inlanders all, they come from lanes and alleys, streets and avenues, - north, east, south, and west. Yet here they all unite. Tell me, does the magnetic virtue of the needles of the compasses of all those ships attract them thither?</p>
<p>Once more. Say, you are in the country; in some high land of lakes. Take almost any path you please, and ten to one it carries you down in a dale, and leaves you there by a pool in the stream. There is magic in it. Let the most absent- minded of men be plunged in his deepest reveries - stand that man on his legs, set his feet a-going, and he will infallibly lead you to water, if water there be in all that region. Should you ever be athirst in the great American desert, try this experiment, if your caravan happen to be supplied with a metaphysical professor. Yes, as every one knows, meditation and water are wedded for ever.</p>
<p>But here is an artist. He desires to paint you the dreamiest, shadiest, quietest, most enchanting bit of romantic landscape in all the valley of the Saco. What is the chief element he employs? There stand his trees, each with a hollow trunk, as if a hermit and a crucifix were within; and here sleeps his meadow, and there sleep his cattle; and up from yonder cottage goes a sleepy smoke. Deep into distant woodlands winds a mazy way, reaching to overlapping spurs of mountains bathed in their hill-side blue. But though the picture lies thus tranced, and though this pine-tree shakes down its sighs like leaves upon this shepherd's head, yet all were vain, unless the shepherd's eye were fixed upon the magic stream before him.</p>
</div>
</div>
<div id="footer"><p>Aloha Editor Demo</p>
</div><!-- /container -->
</body></html>

View File

@ -0,0 +1,60 @@
<!DOCTYPE html>
<html lang="en"><head><meta charset="utf-8"><title>Aloha Editor Demo</title><meta name="description" content="Aloha Editor Demo"><meta name="author" content="Aloha Editor Team">
<script type="text/javascript" src="app/js/demo-app-load.js"></script>
<!-- Le HTML5 shim, for IE6-8 support of HTML elements --><!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head><body>
<div class="topbar">
<div class="fill">
<div class="container">
<span class="aloha-editor-demo-editable"><a class="brand" href="#">Aloha Editor Demo</a></span>
<ul class="nav" id="navigation">
<li class="active"><a href="./">Home</a></li>
<li><a href="./">Sitemap</a></li>
</ul>
<a id="edit-page" href="#"><span class="label notice">Edit</span></a>
<a id="save-page" href="#"><span class="label warning">Save</span></a>
</div>
</div>
</div>
<div class="container">
<div id="aloha-loading" class="alert-message notice">
<p>Loading Aloha Editor</p>
</div>
<!-- Main hero unit for a primary marketing message or call to action -->
<div id="data-head" class="hero-unit aloha-editor-demo-editable">
<h1>Aloha, world!</h1>
<p>This is a demo application using Aloha Editor to edit content using contentEditables</p>
<p>Vestibulum id ligula porta felis euismod semper. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit.</p>
<p><a class="btn primary large">Learn more &raquo;</a></p>
</div>
<!-- Example row of columns -->
<div class="row">
<div id="data-1" class="span-one-third aloha-editor-demo-editable">
<h2>Heading one</h2>
<p>Edit this text.</p>
<p><a class="btn" href="#">View details &raquo;</a></p>
</div>
<div id="data-2" class="span-two-thirds aloha-editor-demo-editable"><h2>Heading two</h2><p>Edit this text.</p>
<a class="btn" href="#">View details &raquo;</a>
</div>
</div>
<div id="footer"><p>Aloha Editor Demo</p>
</div><!-- /container -->
</body></html>

View File

@ -0,0 +1,50 @@
<!DOCTYPE html>
<html lang="en"><head><meta charset="utf-8"><title>Aloha Editor Demo</title><meta name="description" content="Aloha Editor Demo"><meta name="author" content="Aloha Editor Team"><script src="app/js/demo-app-load.js"></script><!-- Le HTML5 shim, for IE6-8 support of HTML elements --><!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]--></head><body>
<div class="topbar">
<div class="fill">
<div class="container">
<span id="brand"><a class="brand" href="./">Aloha Editor Demo</a></span>
<ul class="nav" id="navigation"><li class="active"><a href="./">Home</a></li>
<li><a href="./">Sitemap</a></li>
</ul>
<a id="edit-page" href="#"><span class="label notice">Edit</span></a>
<a id="save-page" href="#"><span class="label warning">Save</span></a>
</div>
</div>
</div>
<div class="container">
<div id="aloha-loading" class="alert-message notice">
<p>Loading Aloha Editor</p>
</div>
<!-- Main hero unit for a primary marketing message or call to action -->
<div class="hero-unit">
<h2>Sitemap</h2>
<p>This is the main Navigation used for your pages.</p>
<div id="sitemap-container" class="aloha-editor-demo-editable">
<ul id="sitemap">
<li><a href="./">Home</a></li>
<li><a href="./page.html" class="aloha-link-text">Page</a></li>
<li><a href="./mobydick.html" class="aloha-link-text">Article</a></li>
<li><a href="./textarea.html" class="aloha-link-text">Textarea</a></li>
<li><a href="./feedback.html" class="aloha-link-text">Feedback</a></li>
<li><a href="http://github.com/alohaeditor" target="_blank" class="aloha-link-text">Github</a></li>
<li><a href="http://aloha-editor.org" target="_blank" class="aloha-link-text">Website</a></li>
</ul>
</div>
</div>
<div class="aloha-editor-demo-editable" id="footer"><p>Aloha Editor Demo App | Q4/2011</p>
</div><!-- /container -->
</div></body></html>

View File

@ -0,0 +1,73 @@
<!DOCTYPE html>
<html lang="en"><head><meta charset="utf-8"><title>Aloha Editor Demo</title><meta name="description" content="Aloha Editor Demo"><meta name="author" content="Aloha Editor Team"><script src="app/js/demo-app-load.js"></script><!-- Le HTML5 shim, for IE6-8 support of HTML elements --><!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]--></head><body>
<div class="topbar">
<div class="fill">
<div class="container">
<span id="brand"><a class="brand" href="#">Aloha Editor Demo</a></span>
<ul class="nav" id="navigation">
<li class="active"><a href="./">Home</a></li>
<li><a href="./">Sitemap</a></li>
</ul>
<a id="edit-page" href="#"><span class="label notice">Edit</span></a>
<a id="save-page" href="#"><span class="label warning">Save</span></a>
</div>
</div>
</div>
<div class="container">
<div id="aloha-loading" class="alert-message notice">
<p>Loading Aloha Editor</p>
</div>
<!-- Main hero unit for a primary marketing message or call to action -->
<div class="hero-unit">
<h2>CMS Input form</h2>
<p>This shows how to use Aloha Editor with texareas.</p>
<form>
<fieldset><legend>MyCMS | create new content page</legend>
<div class="clearfix">
<label for="">Title</label>
<div class="input">
<input type="text" size="30" name="xlInput" id="xlInput" class="xlarge"></div>
</div> <!-- /clearfix -->
<fieldset>
<div class="clearfix">
<label for="textarea">Page Body</label>
<div class="input">
<textarea name="textarea" id="textarea" rows="10" class="xxlarge aloha-editor-demo-editable"></textarea><span class="help-block">
The page body of your content page.</span>
</div> </div> <!-- /clearfix -->
<div class="actions">
<button class="btn primary" type="submit">Save Changes</button>&nbsp;<button class="btn" type="reset">Cancel</button>
</div>
</fieldset></fieldset></form>
</div>
<div id="footer"><p>Aloha Editor Demo</p>
</div><!-- /container -->
<script type="text/javascript">
Aloha.ready( function(){
var $ = Aloha.jQuery;
// register all editable areas
$('#textarea').aloha();
// disable edit button
setTimeout(function() {
$('#edit-page').hide();
}, 700);
});
</script>
</div></body></html>

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 24 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.9 KiB

View File

@ -0,0 +1,56 @@
editable impress
============
inline editable impress.js with Aloha Editor.
click to edit the content of a slide.
all is stored in a session. if you want to reset it use:
http://your-install-url/app/?cmd=reset
Aloha Editor
============
The world's most advanced browser HTML5 based WYSIWYG editor lets you experience a whole new way of editing. It's faster than existing technologies and offers unprecedented WYSIWYG functionalities.
[Aloha Editor](http://Aloha-Editor.org) by @gentics
impress.js
============
It's a presentation framework based on the power of CSS3 transforms and
transitions in modern browsers and inspired by the idea behind prezi.com.
### 0.1 ([browse](https://github.com/bartaz/impress.js/tree/0.1), [zip](https://github.com/bartaz/impress.js/zipball/0.1), [tar](https://github.com/bartaz/impress.js/tarball/0.1))
First release.
Contains basic functionality for step placement and transitions between them
with simple fallback for non-supporting browsers.
DEMO
------
[impress.js demo](http://bartaz.github.com/impress.js) by @bartaz
[What the Heck is Responsive Web Design](http://johnpolacek.github.com/WhatTheHeckIsResponsiveWebDesign-impressjs/) by John Polacek [@johnpolacek](http://twitter.com/johnpolacek)
If you have used impress.js in your presentation and would like to have it listed here,
please contact me via GitHub or send me a pull request to updated `README.md` file.
LICENSE
---------
Copyright 2011-2012 Bartek Szopka. Released under MIT License.

Some files were not shown because too many files have changed in this diff Show More