Aloha Editor is located in: http://alohaeditor-example.local/alohaeditor-0.22.x/aloha/lib/aloha.js
RequireJS (2.0.5) & jQuery (1.7.2) will be loaded directly from http://cdn.aloha-editor.org
Aloha Editor is located in: http://alohaeditor-example.local/alohaeditor-0.22.x/aloha/lib/aloha.js
RequireJS (2.0.5) & jQuery (1.7.2) will be loaded directly from http://cdn.aloha-editor.org
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<meta charset="UTF-8"> | |
<title>Load Aloha Editor with require.js</title> | |
<!-- load the jQuery and require.js libraries --> | |
<script type="text/javascript" src="http://cdn.aloha-editor.org/latest/lib/vendor/jquery-1.7.2.js"></script> | |
<script type="text/javascript" src="http://cdn.aloha-editor.org/latest/lib/require.js"></script> | |
<script> | |
require({ | |
baseUrl: "scripts" | |
}, ["scripts/main.js"]); | |
</script> | |
<script> | |
if (window.Aloha === undefined || window.Aloha === null) { | |
var Aloha = window.Aloha = {}; | |
} | |
Aloha.settings = { | |
locale: 'en', | |
jQuery: jQuery, | |
repositories: { | |
linklist: { | |
data: [ | |
{ name: 'Example', url:'http://example.com', type:'website', weight: 0.50 } | |
] | |
} | |
}, | |
plugins: { | |
load: 'common/ui, common/format, common/link', | |
format: { | |
config : [ 'b', 'i', 'p', 'h1', 'h2', 'h3', 'pre', 'removeFormat' ], | |
} | |
} | |
} | |
</script> | |
<!-- load the Aloha Editor CSS styles --> | |
<link href="/alohaeditor-0.22.x/aloha/css/aloha.css" rel="stylesheet" type="text/css" /> | |
</head> | |
<body> | |
<div class="content-editable"> | |
<p>Aloha World. Click to edit.</p> | |
</div> | |
<script type="text/javascript"> | |
// using aloha.js | |
require({ | |
context: 'aloha', | |
baseUrl: '/alohaeditor-0.22.x/aloha/lib' | |
}, ['aloha'], function (Aloha) { | |
Aloha.ready(function () { | |
Aloha.jQuery('.content-editable').aloha(); | |
}); | |
}); | |
//*/ | |
/*/ using aloha-bare.js | |
require({ | |
context: 'aloha', | |
paths: { | |
aloha: 'aloha-bare' | |
}, | |
baseUrl: '/alohaeditor-0.22.2/aloha/lib' | |
}, ['aloha'], function (Aloha) { | |
Aloha.ready(function () { | |
Aloha.jQuery('#content-editable').aloha(); | |
}); | |
}); | |
//*/ | |
</script> | |
</body> | |
</html> |
$.fn.alpha = function() { | |
return this.append('<p>Alpha: ok</p>'); | |
}; |
$.fn.beta = function() { | |
return this.append('<p>Beta: ok</p>'); | |
}; |
require(["jquery.alpha", "jquery.beta"], function($) { | |
//the jquery.alpha.js and jquery.beta.js plugins have been loaded. | |
jQuery(function() { | |
jQuery('body').alpha().beta(); | |
}); | |
}); |
How could this work given that with requireJS there is no guaranty that JQuery and JQueryui will be loaded when the Aloha.settings are assigned ?
Is it legual to change the settings after aloha is loaded or should they be set before aloha loading ?
What version of Aloha packaging is implied here ? full ? bare ? "normal" ?