public
Created — forked from balupton/README.md

  • Download Gist
aloha-ui-abstraction.js
JavaScript
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140
(function(window,undefined){
var
Aloha = window.GENTICS.Aloha,
$ = window.jQuery;
Aloha.useLanguge('de');
// ALOHA UI API
Aloha.registerPlugin = function(id, Plugin){
// Normalise ID
Plugin.id = Plugin.id||id;
// Normalise Events
if ( typeof plugin.events === 'function' ) {
Plugin.Events = plugin.events();
}
else {
Plugin.Events = plugin.events;
}
// Normalise Buttons
if ( typeof plugin.buttons === 'function' ) {
Plugin.Buttons = plugin.buttons();
}
else {
Plugin.Buttons = plugin.buttons;
}
// Add the Buttons
$.each(Plugin.Buttons,function(id,Button){
Button.id = Button.id||id;
$.each(Button.where||{},function(tab,group){
Aloha.Toolbar.addButton(
Button,
tab,
group
);
});
});
// Return the Normalised Plugin
return Plugin;
};
// IMAGE PLUGIN
var ImagePlugin = Aloha.registerPlugin('Image', {
assets: [
'style.css'
],
layouts: ['floating','fixed'],
context: ['image'],
buttons: function(){
return {
// Align Left
alignLeft: new Aloha.ui.Button({
css: 'BAL_button_align_left',
size: 'small',
onclick: function(){
var image = ImagePlugin.getImage();
jQuery(image).css('float', 'left');
},
tooltip: 'align.left',
where {
format: 'align'
}
}),
// Insert Element
insertElement: new Aloha.ui.Button({
css: 'BAL_button_insert_element',
size: 'small',
hotkey: 'i',
onclick: function(){
var element = prompt('Which element would you like to insert? (we support zen coding)');
// zen code transform the input
// insert the element
},
tooltip: 'insert.element',
where: {
insert: 'insert
}
}),
// Insert Image
insertImage: new Aloha.ui.Button({
css: 'BAL_button_insert_image', // optional
size: 'small', // optional
hotkey: 'I', // optional
onclick: function(){ // required if you are a button
// insert the image
},
tooltip: 'insert.image',
image: '...',
text: 'insert.image',
attr: {
placeholder: 'for text inputs'
},
where: {
// tab -> group
image: 'image',
insert: 'insert
}
})
}
},
events: function(){
return {
// ...
}
},
getImage: function() {
// Anything unrecognised by registerPlugin will be added to the new plugin object upon creation.
var range = GENTICS.Aloha.Selection.getRangeObject();
var rangeTree = range.getRangeTree();
for (var i = 0 ; i < rangeTree.length ; i++) {
if (rangeTree[i].type == 'full' && rangeTree[i].domobj.nodeName.toLowerCase() == 'img') {
return rangeTree[i].domobj;
}
}
return undefined;
},
init: function(){
/* By the time we reach here, the following should have been completed by Aloha:
* i18n files loaded
* assets/resources loaded
* createScope call fired
* Buttons added
* Events added
*
* Leaving this init function just for custom stuff
*/
 
return true;
}
});
 
})(window);
gistfile2.txt
1 2 3 4 5 6 7 8
Related to Wiki Article:
http://aloha-editor.org/wiki/Migration_to_jQuery_UI
 
And Aloha Editor DevCon Talk:
http://www.livestream.com/alohaeditor/video?clipId=pla_7219285e-1723-430b-84ae-5190e3d3004f&utm_source=lslibrary&utm_medium=ui-thumb
 
Copyright Aloha Editor Team.
Romain and Benjamin

Please sign in to comment on this gist.

Something went wrong with that request. Please try again.