Skip to content

Instantly share code, notes, and snippets.

@davglass

davglass/forum-4367.htm

Created October 21, 2009 15:40
Show Gist options
  • Save davglass/215194 to your computer and use it in GitHub Desktop.
Save davglass/215194 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
forum-4367.htm
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Example</title>
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/combo?2.8.0r4/build/reset-fonts-grids/reset-fonts-grids.css&2.8.0r4/build/assets/skins/sam/skin.css">
<style>
.yui-skin-sam .yui-toolbar-container .yui-toolbar-personal {
width: 120px;
}
</style>
</head>
<body class="yui-skin-sam">
<textarea id="editor"></textarea>
<script type="text/javascript" src="http://yui.yahooapis.com/combo?2.8.0r4/build/yahoo-dom-event/yahoo-dom-event.js&2.8.0r4/build/container/container_core-min.js&2.8.0r4/build/menu/menu-min.js&2.8.0r4/build/element/element-min.js&2.8.0r4/build/button/button-min.js&2.8.0r4/build/editor/editor-min.js"></script>
<script>
(function() {
//Generic Handler..
var handleSubClick = function(name, ev, item) {
//Get the menu id and split it.
var label = item.parent.id.split('-');
//Get the menu label
label = label[1];
//Get the button
var button = this.getButtonByValue(label);
//Fake the event with the right data..
this.fireEvent(label + 'Click', {
type: label + 'Click',
target: button.get('element'),
button: {
value: item.value,
button: button
}
});
};
//Create the Editor instance
var myEditor = new YAHOO.widget.Editor('editor', {
height: '300px',
width: '700px',
dompath: true
});
myEditor.on('toolbarLoaded', function() {
//Create the Group
var group = {
group: "mailmerge",
label: "Mail merge fields",
buttons: [
{
type: "select",
label: "Personal details",
//Important that this and the submenu id match up
value: "personal",
menu: [
{
text: "contact details",
value: "contactdetails",
submenu: {
//This has to be something-BUTTON VALUE-something
id: "sub-personal-contact",
itemdata: [
{
text: "first name",
value:"{{first name}}",
//Attach the generic subClick handler
onclick: {
fn: handleSubClick,
//set the scope.
scope: myEditor.toolbar
}
},
{
text: "surname",
value: "{{surname}}",
onclick: {
fn: handleSubClick,
scope: myEditor.toolbar
}
}
]
}
}
]
}
]
};
//Add the group to the Toolbar
myEditor.toolbar.addButtonGroup(group);
//Listen to the event as usual.
myEditor.toolbar.on("personalClick", function(ev) {
this._focusWindow();
this.execCommand("inserthtml", ev.button.value);
}, myEditor, true);
});
myEditor.render();
})();
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment