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