Paul Martin
2016-04-30 a502d96a860456ec5e8c96761db70f7cabb74751
commit | author | age
275496 1 attachDocumentEditor = function (editorElement, commitDialogElement)
PM 2 {
3     var edit = require("./prosemirror/dist/edit")
4     require("./prosemirror/dist/inputrules/autoinput")
5     require("./prosemirror/dist/menu/menubar")
6     require("./prosemirror/dist/markdown")
7     var _menu = require("./prosemirror/dist/menu/menu")
8     
9     
10     var content = document.querySelector('#editor');
11     content.style.display = "none";
12     
13     var gitblitCommands = new _menu.MenuCommandGroup("gitblitCommands");
14     var viewCommands = new _menu.MenuCommandGroup("viewCommands");
15     var textCommands = new _menu.MenuCommandGroup("textCommands");
16     var insertCommands = new _menu.MenuCommandGroup("insertCommands");
17     
18     var menuItems = [gitblitCommands, viewCommands, textCommands, _menu.inlineGroup, _menu.blockGroup, _menu.historyGroup, insertCommands];
19     
20     const updateCmd = Object.create(null);
21     
22     updateCmd["GitblitCommit"] = {
23         label: "GitblitCommit",
24         run: function() {
25             commitDialogElement.modal({show:true});
26             editorElement.value = pm.getContent('markdown');
27         },
28         menu: {
29             group: "gitblitCommands", rank: 10,
30             display: {
31                 render: function(cmd, pm) { return renderFontAwesomeIcon(cmd, pm, "fa-save"); }
32             }
33           }
34     };
35     
36     updateCmd["FullScreen"] = {
37     label: "Toggle Fullscreen",
38     derive: "toggle",
39     run: function(pm) {
40         //Maintain the scroll context
41         var initialScroll = window.scrollY;
42         var navs = [document.querySelector("div.repositorynavbar"), document.querySelector("div.navbar"), document.querySelector("div.docnav")];
43         var offset = navs.reduce(function(p, c) { return p + c.offsetHeight; }, 0);
44         navs.forEach(function(e) { e.classList.toggle("forceHide"); });
45         
46         if (!toggleFullScreen(document.documentElement)) {
47             offset = 60;
48         } else {
49             offset -= 60;
50         }
51         
52         pm.signal("commandsChanged");
53         
54         //Browsers don't seem to accept a scrollTo straight after a full screen
55         setTimeout(function(){window.scrollTo(0, Math.max(0,initialScroll - offset));}, 100);
56         
57     },
58      menu: {
59         group: "viewCommands", rank: 11,
60         display: {
61             render: function(cmd, pm) { return renderFontAwesomeIcon(cmd, pm, "fa-arrows-alt"); }
62         }
63       },
64       active: function active(pm) { return getFullScreenElement() ? true : false; }
65     };
66     
67     updateCmd["heading1"] = {
68         derive: "toggle",
69         run: function(pm) {
70             var selection = pm.selection;
71             var from = selection.from;
72             var to = selection.to;
811cf0 73             var attr = {name:"make", level:"1"};
275496 74             
811cf0 75             var node = pm.doc.resolve(from).parent;
275496 76             if (node && node.hasMarkup(pm.schema.nodes.heading, attr)) {
811cf0 77                 return pm.tr.setBlockType(from, to, pm.schema.defaultTextblockType(), {}).apply(pm.apply.scroll);
275496 78             } else {
PM 79                 return pm.tr.setBlockType(from, to, pm.schema.nodes.heading, attr).apply(pm.apply.scroll);
80             }
81             
82         },
83         active: function active(pm) {
811cf0 84             var node = pm.doc.resolve(pm.selection.from).parent;
PM 85             if (node && node.hasMarkup(pm.schema.nodes.heading, {name:"make", level:"1"})) {
275496 86                 return true;
PM 87             }
88             return false;
89         },
90         menu: {
91             group: "textCommands", rank: 1,
92             display: {
93               render: function(cmd, pm) { return renderFontAwesomeIcon(cmd, pm, "fa-header fa-header-x fa-header-1"); }
94             },
95           },
96           select: function(){return true;}
97     };
98     
99     updateCmd["heading2"] = {
100         derive: "toggle",
101         run: function(pm) {
102             var selection = pm.selection;
103             var from = selection.from;
104             var to = selection.to;
811cf0 105             var attr = {name:"make", level:"2"};
275496 106             
811cf0 107             var node = pm.doc.resolve(from).parent;
275496 108             if (node && node.hasMarkup(pm.schema.nodes.heading, attr)) {
811cf0 109                 return pm.tr.setBlockType(from, to, pm.schema.defaultTextblockType(), {}).apply(pm.apply.scroll);
275496 110             } else {
PM 111                 return pm.tr.setBlockType(from, to, pm.schema.nodes.heading, attr).apply(pm.apply.scroll);
112             }
113             
114         },
115         active: function active(pm) {
811cf0 116             var node = pm.doc.resolve(pm.selection.from).parent;
PM 117             if (node && node.hasMarkup(pm.schema.nodes.heading, {name:"make", level:"2"})) {
275496 118                 return true;
PM 119             }
120             return false;
121         },
122         menu: {
123             group: "textCommands", rank: 2,
124             display: {
125               render: function(cmd, pm) { return renderFontAwesomeIcon(cmd, pm, "fa-header fa-header-x fa-header-2"); }
126             },
127           },
128           select: function(){return true;}
129     };
130     
131     updateCmd["heading3"] = {
132         derive: "toggle",
133         run: function(pm) {
134             var selection = pm.selection;
135             var from = selection.from;
136             var to = selection.to;
811cf0 137             var attr = {name:"make", level:"3"};
275496 138             
811cf0 139             var node = pm.doc.resolve(from).parent;
275496 140             if (node && node.hasMarkup(pm.schema.nodes.heading, attr)) {
811cf0 141                 return pm.tr.setBlockType(from, to, pm.schema.defaultTextblockType(), {}).apply(pm.apply.scroll);
275496 142             } else {
PM 143                 return pm.tr.setBlockType(from, to, pm.schema.nodes.heading, attr).apply(pm.apply.scroll);
144             }
145             
146         },
147         active: function active(pm) {
811cf0 148             var node = pm.doc.resolve(pm.selection.from).parent;
PM 149             if (node && node.hasMarkup(pm.schema.nodes.heading, {name:"make", level:"3"})) {
275496 150                 return true;
PM 151             }
152             return false;
153         },
154         menu: {
155             group: "textCommands", rank: 3,
156             display: {
157               render: function(cmd, pm) { return renderFontAwesomeIcon(cmd, pm, "fa-header fa-header-x fa-header-3"); }
158             },
159           },
160           select: function(){return true;}
161     };
162         
163     updateCmd["strong:toggle"] = {
164     menu: {
165         group: "textCommands", rank: 4,
166         display: {
167             render: function(cmd, pm) { return renderFontAwesomeIcon(cmd, pm, "fa-bold"); }
168         }
169       },
170       select: function(){return true;}
171     };
172     
173     updateCmd["em:toggle"] = {
174     menu: {
175         group: "textCommands", rank: 5,
176         display: {
177             render: function(cmd, pm) { return renderFontAwesomeIcon(cmd, pm, "fa-italic"); }
178         }
179       },
180       select: function(){return true;}
181     };
182     
183     updateCmd["code:toggle"] = {
184     menu: {
185         group: "textCommands", rank: 6,
186         display: {
187             render: function(cmd, pm) { return renderFontAwesomeIcon(cmd, pm, "fa-code"); }
188         }
189       },
190       select: function(){return true;}
191     };
192     
193     updateCmd["image:insert"] = {
194     menu: {
195         group: "insertCommands", rank: 1,
196         display: {
197             render: function(cmd, pm) { return renderFontAwesomeIcon(cmd, pm, "fa-picture-o"); }
198         }
199       }
200     };
201     
811cf0 202     updateCmd["selectParentNode"] = {
PM 203     menu: {
204         group: "insertCommands", rank: 10,
205         display: {
206             render: function(cmd, pm) { return renderFontAwesomeIcon(cmd, pm, "fa-arrow-circle-o-left"); }
207         }
208       }
209     };
210     
275496 211     var pm = window.pm = new edit.ProseMirror({
PM 212       place: document.querySelector('#visualEditor'),
213       autoInput: true,
214       doc: content.value,
215       menuBar: { float:true, content: menuItems},
216       commands: edit.CommandSet.default.update(updateCmd),
217       docFormat: "markdown"
218     });
219     
220
221     var scrollStart = document.querySelector(".ProseMirror").offsetTop;
222     
223     
224     var ticking = false;
225     window.addEventListener("scroll", function() {
226         var scrollPosition = window.scrollY;
227         if (!ticking) {
228             window.requestAnimationFrame(function() {
229                 if (!getFullScreenElement() && (scrollPosition > scrollStart)) {
230                     document.querySelector(".ProseMirror-menubar").classList.add("scrolling");
231                 } else {
232                     document.querySelector(".ProseMirror-menubar").classList.remove("scrolling");
233                 }
234                 ticking = false;
235             });
236         }
237         ticking = true;
238     });
239 }
240
241 function renderFontAwesomeIcon(cmd, pm, classNames) {
242     var node = document.createElement("div");
243     node.className = "ProseMirror-icon";
244     var icon = document.createElement("i");
245     icon.setAttribute("class", "fa fa-fw " + classNames);
246     
247     var active = cmd.active(pm);
248     
249     if (active || cmd.spec.invert) node.classList.add("ProseMirror-menu-active");
250     node.appendChild(icon);
251     return node;
252 }
253
254
255
256 function getFullScreenElement() {
257     return document.fullscreenElement || document.mozFullScreenElement || document.webkitFullscreenElement || document.msFullscreenElement;
258 }
259
260 function toggleFullScreen(e) {
261   if (getFullScreenElement()) {
262     if      (document.exitFullscreen)       { document.exitFullscreen(); }
263     else if (document.msExitFullscreen)     { document.msExitFullscreen(); }
264     else if (document.mozCancelFullScreen)  { document.mozCancelFullScreen(); }
265     else if (document.webkitExitFullscreen) { document.webkitExitFullscreen(); }
266     return true;
267   } else {
268     if      (e.requestFullscreen)       { e.requestFullscreen(); }
269     else if (e.msRequestFullscreen)     { e.msRequestFullscreen(); }
270     else if (e.mozRequestFullScreen)    { e.mozRequestFullScreen(); }
271     else if (e.webkitRequestFullscreen) { e.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT); }
272   }
273   return false;
274 }
275
276 commitChanges = function() {
277     document.querySelector('form#documentEditor').submit();
278 }
279