You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
166 lines
6.2 KiB
166 lines
6.2 KiB
2 years ago
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
|
||
|
|
"http://www.w3.org/TR/html4/loose.dtd">
|
||
|
|
<html>
|
||
|
|
|
||
|
|
<head>
|
||
|
|
<title>Toolbar Test</title>
|
||
|
|
<link type="text/css" rel="stylesheet" href="templates/HtmlToolbar.css"/>
|
||
|
|
|
||
|
|
<script type="text/javascript">
|
||
|
|
var djConfig = {
|
||
|
|
isDebug: true,
|
||
|
|
ieClobberMinimal : true
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
<script type="text/javascript" src="../../dojo.js"></script>
|
||
|
|
<script type="text/javascript">
|
||
|
|
dojo.require("dojo.widget.*");
|
||
|
|
dojo.require("dojo.widget.Toolbar");
|
||
|
|
dojo.require("dojo.widget.ColorPalette");
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<script type="text/javascript">
|
||
|
|
|
||
|
|
function img(name) {
|
||
|
|
return dojo.uri.dojoUri("src/widget/templates/buttons/" + name + ".gif").toString();
|
||
|
|
}
|
||
|
|
|
||
|
|
function init(e) {
|
||
|
|
var now = new Date();
|
||
|
|
tc = dojo.widget.createWidget("ToolbarContainer");
|
||
|
|
dojo.byId("markup").appendChild(tc.domNode);
|
||
|
|
tb = dojo.widget.createWidget("Toolbar");
|
||
|
|
tc.addChild(tb);
|
||
|
|
var bg = dojo.widget.createWidget("ToolbarButtonGroup", {
|
||
|
|
name: "justify",
|
||
|
|
defaultButton: "justifyleft",
|
||
|
|
preventDeselect: true
|
||
|
|
});
|
||
|
|
bg.addChild(img("justifyleft"));
|
||
|
|
bg.addChild(img("justifycenter"));
|
||
|
|
bg.addChild(img("justifyright"));
|
||
|
|
bg.addChild(img("justifyfull"));
|
||
|
|
var items = [img("bold"), img("italic"), img("underline"),
|
||
|
|
"|", dojo.widget.createWidget("ToolbarColorDialog", {toggleItem: true, icon: new dojo.widget.Icon(img("backcolor"))}), img("forecolor"),
|
||
|
|
"|", bg, //["justify", img("justifyleft"), img("justifycenter"), img("justifyright"), img("justifyfull")],
|
||
|
|
"|", img("createlink"), img("insertimage"),
|
||
|
|
"|", img("indent"), img("outdent"),
|
||
|
|
img("insertorderedlist"), img("insertunorderedlist"),
|
||
|
|
"|", img("undo"), img("redo")];
|
||
|
|
for(var i = 0; i < items.length; i++) {
|
||
|
|
tb.addChild(items[i], null, {toggleItem:i<3});
|
||
|
|
}
|
||
|
|
//tb.getItem("wikiword").setLabel("WikiWord");
|
||
|
|
var headings = dojo.widget.createWidget("ToolbarSelect", {
|
||
|
|
name: "formatBlock",
|
||
|
|
values: {
|
||
|
|
"Normal": "p",
|
||
|
|
"Heading 1": "h1"
|
||
|
|
}
|
||
|
|
});
|
||
|
|
dojo.event.connect(headings, "onSetValue", function(item, val) {
|
||
|
|
alert(item + "\n" + val);
|
||
|
|
});
|
||
|
|
tb.addChild(headings);
|
||
|
|
var timeSpent = (new Date() - now);
|
||
|
|
dojo.debug("Total build time: " + timeSpent);
|
||
|
|
return timeSpent;
|
||
|
|
}
|
||
|
|
|
||
|
|
dojo.addOnLoad(function(){
|
||
|
|
var total = 0;
|
||
|
|
for(var i = 0; i < 1; i++) {
|
||
|
|
total += init();
|
||
|
|
}
|
||
|
|
dojo.debug("Avg time: " + (total/i));
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
</head>
|
||
|
|
|
||
|
|
<body>
|
||
|
|
<h1>Programatically created toolbar:</h1>
|
||
|
|
<div id="markup"></div>
|
||
|
|
<a href="javascript:tc.enable()">Enable</a> /
|
||
|
|
<a href="javascript:tc.disable()">Disable</a>
|
||
|
|
<br />
|
||
|
|
Justification:
|
||
|
|
<a href="javascript:tc.enable('justify')">Enable</a> /
|
||
|
|
<a href="javascript:tc.disable('justify')">Disable</a>
|
||
|
|
|
||
|
|
<h1>Toolbar from Markup</h1>
|
||
|
|
|
||
|
|
<div id="toolbar1" dojo:type="ToolbarContainer">
|
||
|
|
<div dojo:type="toolbar">
|
||
|
|
<img dojo:type="ToolbarButton" dojo:icon="../../src/widget/templates/buttons/cut.gif"/>
|
||
|
|
<img dojo:type="ToolbarButton" dojo:icon="../../src/widget/templates/buttons/copy.gif"/>
|
||
|
|
<img dojo:type="ToolbarButton" dojo:icon="../../src/widget/templates/buttons/paste.gif"/>
|
||
|
|
|
||
|
|
<span dojo:type="ToolbarSeparator"> </span>
|
||
|
|
|
||
|
|
<img dojo:type="ToolbarButton" dojo:icon="../../src/widget/templates/buttons/bold.gif" toggleItem="true"/>
|
||
|
|
<img dojo:type="ToolbarButton" dojo:icon="../../src/widget/templates/buttons/italic.gif" toggleItem="true"/>
|
||
|
|
<img dojo:type="ToolbarButton" dojo:icon="../../src/widget/templates/buttons/underline.gif" toggleItem="true"/>
|
||
|
|
<img dojo:type="ToolbarButton" dojo:icon="../../src/widget/templates/buttons/strikethrough.gif" toggleItem="true"/>
|
||
|
|
|
||
|
|
<span dojo:type="ToolbarSeparator"> </span>
|
||
|
|
|
||
|
|
<span dojo:type="ToolbarButtonGroup" name="justify" defaultButton="justifyleft" preventDeselect="true">
|
||
|
|
<img dojo:type="ToolbarButton" dojo:icon="../../src/widget/templates/buttons/justifyleft.gif" toggleItem="true" name="justifyleft"/>
|
||
|
|
<img dojo:type="ToolbarButton" dojo:icon="../../src/widget/templates/buttons/justifycenter.gif" toggleItem="true" name="justifycenter"/>
|
||
|
|
<img dojo:type="ToolbarButton" dojo:icon="../../src/widget/templates/buttons/justifyright.gif" toggleItem="true" name="justifyright"/>
|
||
|
|
<img dojo:type="ToolbarButton" dojo:icon="../../src/widget/templates/buttons/justifyfull.gif" toggleItem="true" name="justifyfull"/>
|
||
|
|
</span>
|
||
|
|
|
||
|
|
<span dojo:type="ToolbarSeparator"></span>
|
||
|
|
|
||
|
|
<img dojo:type="ToolbarButton" dojo:icon="../../src/widget/templates/buttons/insertorderedlist.gif"/>
|
||
|
|
<img dojo:type="ToolbarButton" dojo:icon="../../src/widget/templates/buttons/insertunorderedlist.gif"/>
|
||
|
|
<img dojo:type="ToolbarButton" dojo:icon="../../src/widget/templates/buttons/indent.gif"/>
|
||
|
|
<img dojo:type="ToolbarButton" dojo:icon="../../src/widget/templates/buttons/outdent.gif"/>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<h1>dojo Trac #448 Test case</h1>
|
||
|
|
<script>
|
||
|
|
|
||
|
|
function dumpOutput(val) {
|
||
|
|
var obj=document.getElementById("output");
|
||
|
|
obj.innerHTML=obj.innerHTML+" "+val;
|
||
|
|
}
|
||
|
|
|
||
|
|
function toolbarclick(){
|
||
|
|
dumpOutput("onClick")
|
||
|
|
}
|
||
|
|
|
||
|
|
function toolbarmouseover(){
|
||
|
|
dumpOutput("onMouseOver")
|
||
|
|
}
|
||
|
|
|
||
|
|
function toolbarmouseout(){
|
||
|
|
dumpOutput("onMouseOut")
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
</script>
|
||
|
|
|
||
|
|
Test case for dojo Trac #448 - ToolbarItem needs to have handlers defined to work in markup.
|
||
|
|
<br>Supported events: onclick, onmouseover, onmouseout
|
||
|
|
<br>Each event outputs event name string to output outline
|
||
|
|
<br>
|
||
|
|
|
||
|
|
<div dojoType="toolbar">
|
||
|
|
<img dojoType="ToolbarButton" name="toolitem" label="Cut" onMouseOver="toolbarmouseover()" onClick="toolbarclick()" onMouseOut="toolbarmouseout()"icon="../../src/widget/templates/buttons/cut.gif">
|
||
|
|
</img>
|
||
|
|
</div>
|
||
|
|
<div id="output" onclick="this.innerHTML = ''" style="font-size:0.8em;overflow:auto;z-index:300;border:2px solid black;background:#ffffff;float:right;width:500px;height:200px;"></div>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
<hr>
|
||
|
|
<address><a href="mailto:neildev@gmail.com">Neil J</a></address>
|
||
|
|
<!-- Created: Tue Jul 11 03:27:49 EDT 2006 -->
|
||
|
|
<!-- hhmts start -->
|
||
|
|
Last modified: Tue Jul 11 05:32:43 EDT 2006
|
||
|
|
<!-- hhmts end -->
|
||
|
|
</body>
|
||
|
|
</html>
|