Link Plugin
The Link Plugin allows you to add hyperlinks to your document, either by specifying them manually or by selecting from repositories using autocompletion.
1 Functional Description
To create a new link, click on the link button. If a text is already entered you have to mark the desired word(s) and click on the link button. Now you can enter a URL of another website, or enter a name of an existing page in your repository. On the Aloha Editor Sidebar you can enter a name for the link and decide in which target the link should be opened. In order to delete a link just click at the linked text and deactivat the link button from the “Format” tab or click on the remove link button on the “Link” tab.
2 Components
- formatLink – will format a given selection as a link by wrapping it in an <a> tag. If the selection is collapsed createLink will be executed
- createLink – will insert a new link tag with an empty href into the dom at the current cursor position
- editLink – allows you to edit an existing link
- unlink – removes an existing link by unwrapping
3 Events
When a link is removed, the link plugin will publish the event ‘aloha.link.remove’ with PubSub:
define(['PubSub'], function (PubSub) {
PubSub.sub('aloha.link.remove', function (eventArgument) {
// eventArgument.range defines the selection when the link was removed
// eventArgument.text contains the link text
});
});
4 Configuration
Aloha.settings.plugins.link = {
// all elements with no specific configuration may insert links
config: ["a"],
editables: {
// No links in the title.
"#top-text": []
},
// Test if the link's href value denotes an external link.
// eg: "ftp://www.example.com" or "//www.example.com"
titleregex: "^([^:]+:)?\/\/",
// The value to set the link's title attribute field to if the link's href
// value matchs `titleregex`.
title: "External link",
// 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");
}
},
// Add additional properties of the link target to the sidebar (if the link
// target is fetched from a repository)
sidebar: [
{
"attr": "path",
"title": {
"en": "Path",
"de": "Pfad"
}
}
],
// Adds an anchor button and an additional text field to the ui for editing the link anchor.
// This enables users to set anchors to pages from the repository.
anchorLinks: true
};
Chapters