我需要在Hallo工具栏中有一个自定义按钮,可以将模式切换为打开。我认为它应该相当简单,但Hallo还没有很多文档,而且我对咖啡脚本的了解并不是最好的。
我已经能够通过使用github页面上给出的模板创建一个基本插件,但无法弄清楚如何让它调用js函数来切换模态。
非常感谢任何帮助。 谢谢!
答案 0 :(得分:1)
所以这就是我最终使用的......很多都是从Hallo附带的“链接”小部件中复制而来的。它非常凌乱,我希望我花时间让它看起来更好,但它有效,而且我很匆忙。我希望它对任何需要相同定制的人都有用。只需将返回值更改为您想要的任何函数。
(function(jQuery) {
return jQuery.widget("IKS.hallocustomimage", {
options: {
editable: null,
uuid: "",
link: true,
image: true,
dialogOpts: {
autoOpen: false,
width: 540,
height: 95,
modal: true,
resizable: false,
draggable: false,
dialogClass: 'hallolink-dialog'
},
buttonCssClass: null
},
populateToolbar: function(toolbar) {
var buttonize, buttonset, dialog, dialogSubmitCb, isEmptyLink, urlInput, widget,
_this = this;
widget = this;
dialog = jQuery("<div id=\"" + "\"><form action=\"#\" method=\"post\" class=\"linkForm\"><input class=\"url\" type=\"text\" name=\"url\"value=\"" + "\" /><input type=\"submit\" id=\"addlinkButton\" value=\"" + "\"/></form></div>");
buttonset = jQuery("<span class=\"" + widget.widgetName + "\"></span>");
buttonize = function(type) {
var button, buttonHolder, id;
id = "" + _this.options.uuid + "-" + type;
buttonHolder = jQuery('<span></span>');
buttonHolder.hallobutton({
label: 'Image',
icon: 'icon-picture',
editable: _this.options.editable,
command: null,
queryState: false,
uuid: _this.options.uuid,
cssClass: _this.options.buttonCssClass
});
buttonset.append(buttonHolder);
button = buttonHolder;
button.on("click", function(event) {
var button_selector, selectionParent;
widget.options.editable.keepActivated(true);
return jQuery(function(){$('#gallery').modal();});
});
};
if (this.options.link) {
buttonize("A");
}
if (this.options.link) {
toolbar.append(buttonset);
buttonset.hallobuttonset();
return dialog.dialog(this.options.dialogOpts);
}
}
});})(jQuery);