rev |
line source |
bsw/jbe@1309
|
1 function ui.field.wysihtml(args)
|
bsw/jbe@1309
|
2
|
bsw/jbe@1309
|
3 local toolbar = {
|
bsw/jbe@1309
|
4 { command = "bold", title ="CTRL+B", icon = "format_bold" },
|
bsw/jbe@1309
|
5 { command = "italic", title ="CTRL+I", icon = "format_italic" },
|
bsw/jbe@1309
|
6 { command = "createLink", icon = "insert_link" },
|
bsw/jbe@1309
|
7 { command = "removeLink", icon = "insert_link", crossed = "\\" },
|
bsw@1502
|
8 { command = "insertImage", icon = "insert_image" },
|
bsw/jbe@1309
|
9 { command = "formatBlock", command_value = "h1", icon = "title", head_level = "1" },
|
bsw/jbe@1309
|
10 { command = "formatBlock", command_value = "h2", icon = "title", head_level = "2" },
|
bsw/jbe@1309
|
11 { command = "formatBlock", command_value = "h3", icon = "title", head_level = "3" },
|
bsw/jbe@1309
|
12 { command = "formatBlock", command_blank = "true", icon = "format_clear" },
|
bsw/jbe@1309
|
13 { command = "insertBlockQuote", icon = "format_quote" },
|
bsw/jbe@1309
|
14 { command = "insertUnorderedList", icon = "format_list_bulleted" },
|
bsw/jbe@1309
|
15 { command = "insertOrderedList", icon = "format_list_numbered" },
|
bsw/jbe@1309
|
16 { command = "outdentList", icon = "format_indent_decrease" },
|
bsw/jbe@1309
|
17 { command = "indentList", icon = "format_indent_increase" },
|
bsw/jbe@1309
|
18 -- { command = "alignLeftStyle", icon = "format_align_left" },
|
bsw/jbe@1309
|
19 -- { command = "alignRightStyle", icon = "format_align_right" },
|
bsw/jbe@1309
|
20 -- { command = "alignCenterStyle", icon = "format_align_center" },
|
bsw/jbe@1309
|
21 { command = "undo", icon = "undo" },
|
bsw/jbe@1309
|
22 { command = "redo", icon = "redo" }
|
bsw/jbe@1309
|
23 }
|
bsw/jbe@1309
|
24
|
bsw/jbe@1309
|
25 slot.put([[
|
bsw/jbe@1309
|
26 <style>
|
bsw/jbe@1309
|
27 #wysihtml-html-button {
|
bsw/jbe@1309
|
28 padding: 2px;
|
bsw/jbe@1309
|
29 vertical-align: bottom;
|
bsw/jbe@1309
|
30 }
|
bsw/jbe@1309
|
31 #wysihtml-html-button.wysihtml-action-active {
|
bsw/jbe@1309
|
32 color: #fff;
|
bsw/jbe@1309
|
33 background: #000;
|
bsw/jbe@1309
|
34 }
|
bsw/jbe@1309
|
35 </style>
|
bsw/jbe@1309
|
36 ]])
|
bsw/jbe@1309
|
37
|
bsw/jbe@1309
|
38 ui.container{ attr = { id = "toolbar", class = "toolbar", style = "display: none;" }, content = function()
|
bsw/jbe@1309
|
39 for i, t in ipairs(toolbar) do
|
bsw/jbe@1309
|
40 ui.tag{ tag = "a", attr = { ["data-wysihtml-command"] = t.command, ["data-wysihtml-command-value"] = t.command_value, ["data-wysihtml-command-blank-value"] = t.command_blank, title = t.shortcut }, content = function()
|
bsw/jbe@1309
|
41 ui.tag{ tag = "i", attr = { class = "material-icons" }, content = t.icon }
|
bsw/jbe@1309
|
42 if t.crossed then
|
bsw/jbe@1309
|
43 ui.tag{ attr = { class = "crossed" }, content = t.crossed }
|
bsw/jbe@1309
|
44 end
|
bsw/jbe@1309
|
45 if t.head_level then
|
bsw/jbe@1309
|
46 ui.tag{ attr = { class = "head_level" }, content = t.head_level }
|
bsw/jbe@1309
|
47 end
|
bsw/jbe@1309
|
48 end }
|
bsw/jbe@1309
|
49 end
|
bsw/jbe@1309
|
50 slot.put([[
|
bsw/jbe@1309
|
51 <div data-wysihtml-dialog="createLink" style="display: none;">
|
bsw/jbe@1309
|
52 <label>
|
bsw/jbe@1309
|
53 Link:
|
bsw/jbe@1309
|
54 <input data-wysihtml-dialog-field="href" value="http://">
|
bsw/jbe@1309
|
55 </label>
|
bsw/jbe@1309
|
56 <a data-wysihtml-dialog-action="save">OK</a> <a data-wysihtml-dialog-action="cancel">Cancel</a>
|
bsw/jbe@1309
|
57 </div>
|
bsw@1502
|
58
|
bsw@1502
|
59 <div data-wysihtml-dialog="insertImage" style="display: none;">
|
bsw@1502
|
60 <label>
|
bsw@1502
|
61 Image:
|
bsw@1502
|
62 <input data-wysihtml-dialog-field="src" value="http://">
|
bsw@1502
|
63 </label>
|
bsw@1502
|
64 <label>
|
bsw@1502
|
65 Align:
|
bsw@1502
|
66 <select data-wysihtml-dialog-field="className">
|
bsw@1502
|
67 <option value="">default</option>
|
bsw@1502
|
68 <option value="wysiwyg-float-left">left</option>
|
bsw@1502
|
69 <option value="wysiwyg-float-right">right</option>
|
bsw@1502
|
70 </select>
|
bsw@1502
|
71 </label>
|
bsw@1502
|
72 <a data-wysihtml-dialog-action="save">OK</a> <a data-wysihtml-dialog-action="cancel">Cancel</a>
|
bsw@1502
|
73 </div>
|
bsw@1502
|
74
|
bsw/jbe@1309
|
75 ]])
|
bsw/jbe@1309
|
76 slot.put([[ <a id="wysihtml-html-button" data-wysihtml-action="change_view">]] .. _"expert editor (HTML)" .. [[</a> ]])
|
bsw/jbe@1309
|
77 end }
|
bsw/jbe@1309
|
78
|
bsw/jbe@1309
|
79 ui.field.text(args)
|
bsw/jbe@1309
|
80
|
bsw/jbe@1309
|
81 ui.tag{ tag = "script", attr = { src = request.get_absolute_baseurl() .. "static/wysihtml/wysihtml.js" }, content = "" }
|
bsw/jbe@1309
|
82 ui.tag{ tag = "script", attr = { src = request.get_absolute_baseurl() .. "static/wysihtml/wysihtml.all-commands.js" }, content = "" }
|
bsw/jbe@1309
|
83 ui.tag{ tag = "script", attr = { src = request.get_absolute_baseurl() .. "static/wysihtml/wysihtml.toolbar.js" }, content = "" }
|
bsw/jbe@1309
|
84 ui.tag{ tag = "script", attr = { src = request.get_absolute_baseurl() .. "static/wysihtml/wysihtml_liquidfeedback_rules.js" }, content = "" }
|
bsw/jbe@1309
|
85 ui.script{ script = [[
|
bsw/jbe@1309
|
86 function initEditor() {
|
bsw/jbe@1309
|
87 var editor = new wysihtml.Editor("]] .. args.attr.id .. [[", {
|
bsw/jbe@1309
|
88 toolbar: "toolbar",
|
bsw/jbe@1309
|
89 parserRules: wysihtmlParserRules,
|
bsw/jbe@1309
|
90 useLineBreaks: true
|
bsw/jbe@1309
|
91 });
|
bsw/jbe@1309
|
92 }
|
bsw/jbe@1309
|
93 if(window.addEventListener){
|
bsw/jbe@1309
|
94 window.addEventListener('load', initEditor, false);
|
bsw/jbe@1309
|
95 } else {
|
bsw/jbe@1309
|
96 window.attachEvent('onload', initEditor);
|
bsw/jbe@1309
|
97 }
|
bsw/jbe@1309
|
98 ]] }
|
bsw/jbe@1309
|
99
|
bsw/jbe@1309
|
100 end
|
bsw/jbe@1309
|
101
|