dijit
Version:
Dijit provides a complete collection of user interface controls based on Dojo, giving you the power to create web applications that are highly optimized for usability, performance, internationalization, accessibility, but above all deliver an incredible u
78 lines (71 loc) • 2.99 kB
HTML
<html lang="en">
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>Editor Test: LinkDialog Plugin</title>
<script type="text/javascript" src="../boilerplate.js"></script>
<script type="text/javascript">
function filterLink () {
return 'Filtered Value';
}
require([
"dojo/parser",
"dijit/Editor",
"dijit/_editor/plugins/LinkDialog",
"dijit/_editor/plugins/ViewSource",
"dojo/domReady!"
], function(parser){
parser.parse();
});
</script>
</head>
<body class="claro" role="main">
<div style="border: 1px dotted black;">
<div id="editor" data-dojo-type="dijit/Editor" data-dojo-props='"aria-label":"editor",extraPlugins:["createLink", "insertImage", "viewSource"]'>
<ol>
<li>The LinkDialog plugin is an 'example' style plugin that shows how to insert basic web links as well as
image tags. This plugin is intended to guide users in writing their own, more complex, link and image handlers
while still providing useful function.</li>
</ol>
<br>
<div><a href="http://www.example.com/example.html" target="_top" id="exampleLink">This is an example link in the page.</a></div>
<br>
<br>
<div><img src="./sample.jpg" alt="Sample Image" id="exampleImage" /></div>
<br>
<br>
</div>
</div>
<p>Editor with <code>allowUnsafeHtml</code> set to <code>true</code></p>
<div style="border: 1px dotted black;">
<div id="editorUnsafe" data-dojo-type="dijit/Editor" data-dojo-props='"aria-label":"editor",extraPlugins:[{name: "createLink", allowUnsafeHtml: true}, "insertImage", "viewSource"]'>
<p>This editor will allow unrestricted HTML in the Description field of links</p>
<br>
</div>
</div>
<p>Editor with custom <code>linkFilter</code> function</p>
<div style="border: 1px dotted black;">
<div id="editorLinkFilter" data-dojo-type="dijit/Editor" data-dojo-props='"aria-label":"editor",extraPlugins:[{name: "createLink", linkFilter: filterLink}, "insertImage", "viewSource"]'>
<p>Links created in this editor will always have a description of "Filtered Value", which is the value returned by the custom <code>linkFilter</code> function.</p>
<br>
</div>
</div>
<p>RTL Editor:</p>
<div style="border: 1px dotted black;">
<div id="reditor" data-dojo-type="dijit/Editor" dir="rtl" data-dojo-props='"aria-label":"reditor",extraPlugins:["createLink", "insertImage"]'>
<ol>
<li>The LinkDialog plugin is an 'example' style plugin that shows how to insert basic web links as well as
image tags. This plugin is intended to guide users in writing their own, more complex, link and image handlers
while still providing useful function.</li>
</ol>
<br>
<div><a href="http://www.example.com/example.html" target="_top" id="rexampleLink">This is an example link in the page.</a></div>
<br>
<br>
<div><img src="./sample.jpg" alt="Sample Image" id="rexampleImage" /></div>
<br>
<br>
</div>
</div>
</body>
</html>