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
<!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> |