Menus.js 64 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664166516661667166816691670167116721673167416751676167716781679168016811682168316841685168616871688168916901691169216931694169516961697169816991700170117021703170417051706170717081709171017111712171317141715171617171718171917201721172217231724172517261727172817291730173117321733173417351736173717381739174017411742174317441745174617471748174917501751175217531754175517561757175817591760176117621763176417651766176717681769177017711772177317741775177617771778177917801781178217831784178517861787178817891790179117921793179417951796179717981799180018011802180318041805180618071808180918101811181218131814181518161817181818191820182118221823182418251826182718281829183018311832183318341835183618371838183918401841184218431844184518461847184818491850185118521853185418551856185718581859186018611862186318641865186618671868186918701871187218731874187518761877187818791880188118821883188418851886188718881889189018911892189318941895189618971898189919001901190219031904190519061907190819091910191119121913191419151916191719181919192019211922192319241925192619271928192919301931193219331934193519361937193819391940194119421943194419451946194719481949195019511952195319541955195619571958195919601961196219631964196519661967196819691970197119721973197419751976197719781979198019811982198319841985198619871988198919901991199219931994199519961997199819992000200120022003200420052006200720082009201020112012201320142015201620172018201920202021202220232024202520262027202820292030203120322033203420352036203720382039204020412042204320442045204620472048204920502051205220532054205520562057205820592060206120622063206420652066206720682069207020712072207320742075207620772078207920802081208220832084208520862087208820892090209120922093209420952096209720982099210021012102210321042105210621072108210921102111211221132114211521162117211821192120212121222123212421252126212721282129213021312132213321342135213621372138213921402141214221432144214521462147214821492150215121522153215421552156215721582159216021612162216321642165216621672168216921702171217221732174217521762177217821792180218121822183218421852186218721882189219021912192219321942195
  1. /*
  2. * $Id: Menus.js,v 1.29 2014/02/11 13:56:10 gaudenz Exp $
  3. * Copyright (c) 2006-2014, JGraph Ltd
  4. */
  5. (function()
  6. {
  7. // Adds scrollbars for menus that exceed the page height
  8. var mxPopupMenuShowMenu = mxPopupMenu.prototype.showMenu;
  9. mxPopupMenu.prototype.showMenu = function()
  10. {
  11. mxPopupMenuShowMenu.apply(this, arguments);
  12. this.div.style.overflowY = 'auto';
  13. this.div.style.overflowX = 'hidden';
  14. var h0 = Math.max(document.body.clientHeight, document.documentElement.clientHeight);
  15. this.div.style.maxHeight = (h0 - 10) + 'px';
  16. };
  17. Menus.prototype.addLinkToItem = function(item, href)
  18. {
  19. if (item != null)
  20. {
  21. var link = document.createElement('span');
  22. link.setAttribute('title', mxResources.get('help'));
  23. link.style.cssText = 'color:blue;text-decoration:underline;margin-left:12px;cursor:help;';
  24. var icon = document.createElement('img');
  25. icon.setAttribute('border', '0');
  26. icon.setAttribute('valign', 'bottom');
  27. icon.setAttribute('src', Editor.helpImage);
  28. link.appendChild(icon);
  29. mxEvent.addGestureListeners(link, mxUtils.bind(this, function(evt)
  30. {
  31. this.editorUi.menubar.hideMenu();
  32. window.open(href);
  33. mxEvent.consume(evt);
  34. }));
  35. item.firstChild.nextSibling.appendChild(link);
  36. }
  37. };
  38. var menusInit = Menus.prototype.init;
  39. Menus.prototype.init = function()
  40. {
  41. menusInit.apply(this, arguments);
  42. var editorUi = this.editorUi;
  43. var graph = editorUi.editor.graph;
  44. var isGraphEnabled = mxUtils.bind(graph, graph.isEnabled);
  45. var googleEnabled = ((urlParams['embed'] != '1' && urlParams['gapi'] != '0') ||
  46. (urlParams['embed'] == '1' && urlParams['gapi'] == '1')) && mxClient.IS_SVG &&
  47. isLocalStorage && (document.documentMode == null || document.documentMode >= 10);
  48. var dropboxEnabled = ((urlParams['embed'] != '1' && urlParams['db'] != '0') || (urlParams['embed'] == '1' && urlParams['db'] == '1')) &&
  49. mxClient.IS_SVG && (document.documentMode == null || document.documentMode > 9);
  50. var oneDriveEnabled = (window.location.hostname == 'www.draw.io' || window.location.hostname == 'test.draw.io' ||
  51. window.location.hostname == 'drive.draw.io' || window.location.hostname == 'legacy.draw.io') &&
  52. (((urlParams['embed'] != '1' && urlParams['od'] != '0') || (urlParams['embed'] == '1' &&
  53. urlParams['od'] == '1')) && !navigator.userAgent.match(/(iPad|iPhone|iPod)/g) &&
  54. (navigator.userAgent.indexOf('MSIE') < 0 || document.documentMode >= 10));
  55. if (!editorUi.isOffline())
  56. {
  57. var img = new Image();
  58. img.src = IMAGE_PATH + '/help.png';
  59. }
  60. editorUi.actions.addAction('new...', function()
  61. {
  62. var compact = editorUi.isOffline();
  63. var dlg = new NewDialog(editorUi, compact);
  64. editorUi.showDialog(dlg.container, (compact) ? 350 : 620, (compact) ? 70 : 440, true, true, function(cancel)
  65. {
  66. if (cancel && editorUi.getCurrentFile() == null)
  67. {
  68. editorUi.showSplash();
  69. }
  70. });
  71. dlg.init();
  72. });
  73. editorUi.actions.get('print').funct = function()
  74. {
  75. editorUi.showDialog(new PrintDialog(editorUi).container, 320,
  76. (editorUi.pages != null && editorUi.pages.length > 1) ?
  77. 400 : 340, true, true);
  78. };
  79. editorUi.actions.addAction('open...', function()
  80. {
  81. editorUi.pickFile();
  82. });
  83. editorUi.actions.addAction('close', function()
  84. {
  85. editorUi.fileLoaded(null);
  86. });
  87. editorUi.actions.addAction('editShape...', mxUtils.bind(this, function()
  88. {
  89. var cells = graph.getSelectionCells();
  90. if (graph.getSelectionCount() == 1)
  91. {
  92. var cell = graph.getSelectionCell();
  93. var state = graph.view.getState(cell);
  94. if (state != null && state.shape != null && state.shape.stencil != null)
  95. {
  96. var dlg = new EditShapeDialog(editorUi, cell, mxResources.get('editShape') + ':', 630, 400);
  97. editorUi.showDialog(dlg.container, 640, 480, true, false);
  98. dlg.init();
  99. }
  100. }
  101. }));
  102. editorUi.actions.addAction('revisionHistory...', function()
  103. {
  104. var file = editorUi.getCurrentFile();
  105. if (file == null || (file.constructor != DriveFile && file.constructor != DropboxFile) ||
  106. (editorUi.drive == null && file.constructor == DriveFile) ||
  107. (editorUi.dropbox == null && file.constructor == DropboxFile))
  108. {
  109. editorUi.showError(mxResources.get('error'), mxResources.get('notAvailable'), mxResources.get('ok'));
  110. }
  111. else if (editorUi.spinner.spin(document.body, mxResources.get('loading')))
  112. {
  113. if (file.constructor == DropboxFile)
  114. {
  115. // Limit is maximum number of entries to return
  116. editorUi.dropbox.client.revisions(file.stat.path, {limit: 100}, function(err, stats)
  117. {
  118. editorUi.spinner.stop();
  119. if (err == null)
  120. {
  121. var revs = [];
  122. for (var i = stats.length - 1; i >= 0; i--)
  123. {
  124. (function(stat)
  125. {
  126. revs.push({modifiedDate: stat.clientModifiedAt, fileSize: stat.size, getXml: function(success, error)
  127. {
  128. editorUi.dropbox.client.readFile('/' + file.stat.path, {versionTag: stat.versionTag}, mxUtils.bind(this, function(err2, data)
  129. {
  130. if (err2 == null)
  131. {
  132. success(data);
  133. }
  134. else
  135. {
  136. error(err2);
  137. }
  138. }));
  139. }, getUrl: function()
  140. {
  141. return editorUi.getUrl(window.location.pathname + '?rev=' + stat.versionTag + '&chrome=0&edit=_blank') + window.location.hash;
  142. }});
  143. })(stats[i]);
  144. }
  145. var dlg = new RevisionDialog(editorUi, revs);
  146. editorUi.showDialog(dlg.container, 640, 480, true, true);
  147. dlg.init();
  148. }
  149. else
  150. {
  151. editorUi.handleError(err);
  152. }
  153. });
  154. }
  155. // Google Drive File
  156. else
  157. {
  158. editorUi.drive.executeRequest(gapi.client.drive.revisions.list({'fileId': file.getId()}), function(resp)
  159. {
  160. editorUi.spinner.stop();
  161. for (var i = 0; i < resp.items.length; i++)
  162. {
  163. (function(item)
  164. {
  165. item.getXml = function(success, error)
  166. {
  167. // Workaround for vanished head revision is to use current head revision from descriptor
  168. editorUi.drive.executeRequest(gapi.client.drive.revisions.get({'fileId': file.getId(),
  169. 'revisionId': (resp.items[resp.items.length - 1] === item) ?
  170. file.desc.headRevisionId : item.id}), function(resp)
  171. {
  172. editorUi.drive.getXmlFile(resp, null, function(file2)
  173. {
  174. success(file2.getData());
  175. }, function(resp)
  176. {
  177. error(resp);
  178. });
  179. }, function(resp)
  180. {
  181. error(resp);
  182. });
  183. };
  184. item.getUrl = function()
  185. {
  186. return editorUi.getUrl(window.location.pathname + '?rev=' + item.id + '&chrome=0&edit=_blank') + window.location.hash;
  187. };
  188. })(resp.items[i]);
  189. }
  190. var dlg = new RevisionDialog(editorUi, resp.items);
  191. editorUi.showDialog(dlg.container, 640, 480, true, true);
  192. dlg.init();
  193. }, function(resp)
  194. {
  195. editorUi.spinner.stop();
  196. editorUi.handleError(resp);
  197. });
  198. }
  199. }
  200. });
  201. editorUi.actions.addAction('createRevision', function()
  202. {
  203. editorUi.actions.get('save').funct();
  204. }, null, null, 'Ctrl+S');
  205. editorUi.actions.addAction('upload...', function()
  206. {
  207. var file = editorUi.getCurrentFile();
  208. if (file != null)
  209. {
  210. // Data is pulled from global variable after tab loads
  211. // LATER: Change to use message passing to deal with potential cross-domain
  212. window.drawdata = editorUi.getFileData();
  213. var filename = (file.getTitle() != null) ? file.getTitle() : editorUi.defaultFilename;
  214. window.open(window.location.protocol + '//' + window.location.host + '/?create=drawdata&' +
  215. ((editorUi.mode == App.MODE_DROPBOX) ? 'mode=dropbox&' : '') +
  216. 'title=' + encodeURIComponent(filename));
  217. }
  218. });
  219. if (typeof(MathJax) !== 'undefined')
  220. {
  221. var action = editorUi.actions.addAction('mathematicalTypesetting', function()
  222. {
  223. editorUi.setMathEnabled(!editorUi.isMathEnabled());
  224. });
  225. action.setToggleAction(true);
  226. action.setSelectedCallback(function() { return editorUi.isMathEnabled(); });
  227. action.isEnabled = isGraphEnabled;
  228. }
  229. if (isLocalStorage)
  230. {
  231. var action = editorUi.actions.addAction('showStartScreen', function()
  232. {
  233. mxSettings.setShowStartScreen(!mxSettings.getShowStartScreen());
  234. mxSettings.save();
  235. });
  236. action.setToggleAction(true);
  237. action.setSelectedCallback(function() { return mxSettings.getShowStartScreen(); });
  238. }
  239. var autosaveAction = editorUi.actions.addAction('autosave', function()
  240. {
  241. editorUi.editor.setAutosave(!editorUi.editor.autosave);
  242. });
  243. autosaveAction.setToggleAction(true);
  244. autosaveAction.setSelectedCallback(function()
  245. {
  246. return autosaveAction.isEnabled() && editorUi.editor.autosave;
  247. });
  248. editorUi.actions.addAction('editGeometry...', function()
  249. {
  250. var cells = graph.getSelectionCells();
  251. var vertices = [];
  252. for (var i = 0; i < cells.length; i++)
  253. {
  254. if (graph.getModel().isVertex(cells[i]))
  255. {
  256. vertices.push(cells[i]);
  257. }
  258. }
  259. if (vertices.length > 0)
  260. {
  261. var dlg = new EditGeometryDialog(editorUi, vertices);
  262. editorUi.showDialog(dlg.container, 180, 180, true, true);
  263. dlg.init();
  264. }
  265. }, null, null, 'Ctrl+Shift+M');
  266. var copiedStyles = ['rounded', 'shadow', 'dashed', 'dashPattern', 'fontFamily', 'fontSize', 'fontColor', 'fontStyle', 'align',
  267. 'verticalAlign', 'strokeColor', 'strokeWidth', 'fillColor', 'gradientColor', 'swimlaneFillColor',
  268. 'textOpacity', 'gradientDirection', 'glass', 'labelBackgroundColor', 'labelBorderColor', 'opacity',
  269. 'spacing', 'spacingTop', 'spacingLeft', 'spacingBottom', 'spacingRight'];
  270. editorUi.actions.addAction('copyStyle', function()
  271. {
  272. var state = graph.view.getState(graph.getSelectionCell());
  273. if (graph.isEnabled() && state != null)
  274. {
  275. editorUi.copiedStyle = mxUtils.clone(state.style);
  276. // Handles special case for value "none"
  277. var cellStyle = graph.getModel().getStyle(state.cell);
  278. var tokens = (cellStyle != null) ? cellStyle.split(';') : [];
  279. for (var j = 0; j < tokens.length; j++)
  280. {
  281. var tmp = tokens[j];
  282. var pos = tmp.indexOf('=');
  283. if (pos >= 0)
  284. {
  285. var key = tmp.substring(0, pos);
  286. var value = tmp.substring(pos + 1);
  287. if (editorUi.copiedStyle[key] == null && value == 'none')
  288. {
  289. editorUi.copiedStyle[key] = 'none';
  290. }
  291. }
  292. }
  293. editorUi.copiedEdgeStyle = null;
  294. }
  295. }, null, null, 'Ctrl+Shift+C');
  296. editorUi.actions.addAction('pasteStyle', function()
  297. {
  298. if (graph.isEnabled() && !graph.isSelectionEmpty() && editorUi.copiedStyle != null)
  299. {
  300. graph.getModel().beginUpdate();
  301. try
  302. {
  303. var cells = graph.getSelectionCells();
  304. for (var i = 0; i < cells.length; i++)
  305. {
  306. var state = graph.view.getState(cells[i]);
  307. for (var j = 0; j < copiedStyles.length; j++)
  308. {
  309. var key = copiedStyles[j];
  310. var value = editorUi.copiedStyle[key];
  311. if (state.style[key] != value)
  312. {
  313. graph.setCellStyles(key, value, [cells[i]]);
  314. }
  315. }
  316. }
  317. }
  318. finally
  319. {
  320. graph.getModel().endUpdate();
  321. }
  322. }
  323. }, null, null, 'Ctrl+Shift+V');
  324. editorUi.actions.put('pageBackgroundImage', new Action(mxResources.get('backgroundImage') + '...', function()
  325. {
  326. if (!editorUi.isOffline())
  327. {
  328. var apply = function(image)
  329. {
  330. editorUi.setBackgroundImage(image);
  331. };
  332. var dlg = new BackgroundImageDialog(editorUi, apply);
  333. editorUi.showDialog(dlg.container, 320, 170, true, true);
  334. dlg.init();
  335. }
  336. }));
  337. action = editorUi.actions.put('shadowVisible', new Action(mxResources.get('shadow'), function()
  338. {
  339. graph.setShadowVisible(!graph.shadowVisible);
  340. }));
  341. action.setToggleAction(true);
  342. action.setSelectedCallback(function() { return graph.shadowVisible; });
  343. editorUi.actions.put('about', new Action(mxResources.get('aboutDrawio') + '...', function()
  344. {
  345. editorUi.showDialog(new AboutDialog(editorUi).container, 220, 300, true, true);
  346. }, null, null, 'F1'));
  347. editorUi.actions.addAction('userManual...', function()
  348. {
  349. window.open('https://support.draw.io/display/DO/Draw.io+Online+User+Manual');
  350. });
  351. editorUi.actions.addAction('support...', function()
  352. {
  353. window.open('https://support.draw.io/display/DO/draw.io+Online+Support');
  354. });
  355. editorUi.actions.addAction('exportOptionsDisabled...', function()
  356. {
  357. editorUi.handleError({message: mxResources.get('exportOptionsDisabledDetails')},
  358. mxResources.get('exportOptionsDisabled'));
  359. });
  360. editorUi.actions.addAction('keyboardShortcuts...', function()
  361. {
  362. if (mxClient.IS_CHROMEAPP)
  363. {
  364. window.open('https://www.draw.io/shortcuts.svg');
  365. }
  366. else if (mxClient.IS_SVG)
  367. {
  368. window.open('shortcuts.svg');
  369. }
  370. else
  371. {
  372. window.open('https://www.draw.io/?chrome=0&url=https%3A%2F%2Fwww.draw.io%2Fshortcuts.svg');
  373. }
  374. });
  375. editorUi.actions.addAction('feedback...', function()
  376. {
  377. var dlg = new FeedbackDialog(editorUi);
  378. editorUi.showDialog(dlg.container, 610, 360, true, true);
  379. dlg.init();
  380. });
  381. editorUi.actions.addAction('quickStart...', function()
  382. {
  383. window.open('https://www.youtube.com/watch?v=8OaMWa4R1SE&t=1');
  384. });
  385. // Adds language menu to options only if localStorage is available for
  386. // storing the choice. We do not want to use cookies for older browsers.
  387. // Note that the URL param lang=XX is available for setting the language
  388. // in older browsers. URL param has precedence over the saved setting.
  389. if (mxClient.IS_CHROMEAPP || (isLocalStorage && urlParams['offline'] != '1'))
  390. {
  391. this.put('language', new Menu(mxUtils.bind(this, function(menu, parent)
  392. {
  393. var addLangItem = mxUtils.bind(this, function (id)
  394. {
  395. var lang = (id == '') ? mxResources.get('automatic') : mxLanguageMap[id];
  396. var item = null;
  397. if (lang != '')
  398. {
  399. item = menu.addItem(lang, null, mxUtils.bind(this, function()
  400. {
  401. mxSettings.setLanguage(id);
  402. mxSettings.save();
  403. // Shows dialog in new language
  404. mxClient.language = id;
  405. mxResources.loadDefaultBundle = false;
  406. mxResources.add(RESOURCE_BASE);
  407. editorUi.alert(mxResources.get('restartForChangeRequired'));
  408. }), parent);
  409. if (id == mxLanguage || (id == '' && mxLanguage == null))
  410. {
  411. menu.addCheckmark(item, Editor.checkmarkImage);
  412. }
  413. }
  414. return item;
  415. });
  416. var item = addLangItem('');
  417. menu.addSeparator(parent);
  418. // LATER: Sort menu by language name
  419. for(var langId in mxLanguageMap)
  420. {
  421. addLangItem(langId);
  422. }
  423. })));
  424. // Extends the menubar with the language menu
  425. if (uiTheme != 'atlas')
  426. {
  427. var menusCreateMenuBar = Menus.prototype.createMenubar;
  428. Menus.prototype.createMenubar = function(container)
  429. {
  430. var menubar = menusCreateMenuBar.apply(this, arguments);
  431. if (menubar != null)
  432. {
  433. var langMenu = this.get('language');
  434. if (langMenu != null)
  435. {
  436. var elt = menubar.addMenu('', langMenu.funct);
  437. elt.setAttribute('title', mxResources.get('language'));
  438. elt.style.width = '16px';
  439. elt.style.paddingTop = '2px';
  440. elt.style.paddingLeft = '4px';
  441. elt.innerHTML = '<div class="geIcon geSprite geSprite-globe"/>';
  442. elt.style.zIndex = '1';
  443. elt.style.position = 'absolute';
  444. elt.style.top = '2px';
  445. elt.style.right = '17px';
  446. elt.style.display = 'block';
  447. if (!mxClient.IS_VML)
  448. {
  449. mxUtils.setOpacity(elt, 60);
  450. }
  451. document.body.appendChild(elt);
  452. }
  453. }
  454. return menubar;
  455. };
  456. }
  457. }
  458. this.put('help', new Menu(mxUtils.bind(this, function(menu, parent)
  459. {
  460. if (!mxClient.IS_CHROMEAPP && editorUi.isOffline())
  461. {
  462. this.addMenuItems(menu, ['about']);
  463. }
  464. else
  465. {
  466. // No translation for menu item since help is english only
  467. var item = menu.addItem('Search', null, null, parent, null, null, false);
  468. var form = document.createElement('div');
  469. form.style.display = 'inline';
  470. form.innerHTML = ':<form style="display:inline;margin-left:8px;" id="rw_search_form"' +
  471. 'target="_blank" method="get" action="https://support.draw.io/dosearchsite.action">' +
  472. '<input id="rw_search_query" type="text" name="queryString" size="25"></form>';
  473. item.firstChild.nextSibling.appendChild(form);
  474. item.style.backgroundColor = 'whiteSmoke';
  475. item.style.cursor = 'default';
  476. var realForm = form.getElementsByTagName('form')[0]
  477. var input = form.getElementsByTagName('input')[0];
  478. if (input != null && realForm != null)
  479. {
  480. mxEvent.addListener(realForm, 'submit', function()
  481. {
  482. // Logs search terms for improving search results
  483. if (editorUi.enableLogging)
  484. {
  485. var img = new Image();
  486. var logDomain = window.DRAWIO_LOG_URL != null ? window.DRAWIO_LOG_URL : '';
  487. img.src = logDomain + '/log?severity=CONFIG&msg=helpsearch:' + encodeURIComponent(input.value) + '&v=' + encodeURIComponent(EditorUi.VERSION);
  488. }
  489. // Workaround for blocked submit on iOS/IE11
  490. window.setTimeout(function()
  491. {
  492. editorUi.menubar.hideMenu();
  493. }, 0);
  494. });
  495. mxEvent.addGestureListeners(item, function(evt)
  496. {
  497. if (document.activeElement != input)
  498. {
  499. input.focus();
  500. }
  501. mxEvent.consume(evt);
  502. }, function(evt)
  503. {
  504. mxEvent.consume(evt);
  505. }, function(evt)
  506. {
  507. mxEvent.consume(evt);
  508. });
  509. // Sets initial focus on input element
  510. window.setTimeout(function()
  511. {
  512. input.focus();
  513. }, 0);
  514. }
  515. this.addMenuItems(menu, ['-', 'quickStart', 'userManual', 'keyboardShortcuts', '-']);
  516. if (!mxClient.IS_CHROMEAPP)
  517. {
  518. this.addMenuItems(menu, ['feedback']);
  519. }
  520. this.addMenuItems(menu, ['support', '-', 'about']);
  521. }
  522. if (urlParams['test'] == '1')
  523. {
  524. // For showing the bounding box
  525. mxResources.parse('showBoundingBox=Show bounding box');
  526. this.editorUi.actions.addAction('showBoundingBox', mxUtils.bind(this, function()
  527. {
  528. var b = graph.getGraphBounds();
  529. var tr = graph.view.translate;
  530. var s = graph.view.scale;
  531. graph.insertVertex(parent, null, '', b.x / s - tr.x, b.y / s - tr.y, b.width / s, b.height / s, 'fillColor=none;strokeColor=red;');
  532. }));
  533. this.addMenuItems(menu, ['-', 'showBoundingBox'], parent);
  534. // For testing local XML export
  535. mxResources.parse('testXmlImageExport=XML Image Export');
  536. this.editorUi.actions.addAction('testXmlImageExport', mxUtils.bind(this, function()
  537. {
  538. var bg = '#ffffff';
  539. var scale = 1;
  540. var b = 1;
  541. var imgExport = new mxImageExport();
  542. var bounds = graph.getGraphBounds();
  543. var vs = graph.view.scale;
  544. // New image export
  545. var xmlDoc = mxUtils.createXmlDocument();
  546. var root = xmlDoc.createElement('output');
  547. xmlDoc.appendChild(root);
  548. // Renders graph. Offset will be multiplied with state's scale when painting state.
  549. var xmlCanvas = new mxXmlCanvas2D(root);
  550. xmlCanvas.translate(Math.floor((b / scale - bounds.x) / vs), Math.floor((b / scale - bounds.y) / vs));
  551. xmlCanvas.scale(scale / vs);
  552. var stateCounter = 0;
  553. var canvasSave = xmlCanvas.save;
  554. xmlCanvas.save = function()
  555. {
  556. stateCounter++;
  557. canvasSave.apply(this, arguments);
  558. };
  559. var canvasRestore = xmlCanvas.restore;
  560. xmlCanvas.restore = function()
  561. {
  562. stateCounter--;
  563. canvasRestore.apply(this, arguments);
  564. };
  565. var exportDrawShape = imgExport.drawShape;
  566. imgExport.drawShape = function(state)
  567. {
  568. mxLog.debug('entering shape', state, stateCounter);
  569. exportDrawShape.apply(this, arguments);
  570. mxLog.debug('leaving shape', state, stateCounter);
  571. };
  572. imgExport.drawState(graph.getView().getState(graph.model.root), xmlCanvas);
  573. // Puts request data together
  574. var w = Math.ceil(bounds.width * scale / vs + 2 * b);
  575. var h = Math.ceil(bounds.height * scale / vs + 2 * b);
  576. mxLog.show();
  577. mxLog.debug(mxUtils.getXml(root));
  578. mxLog.debug('stateCounter', stateCounter);
  579. }));
  580. this.addMenuItems(menu, ['testXmlImageExport'], parent);
  581. mxResources.parse('animation=Animation');
  582. this.editorUi.actions.addAction('animation', mxUtils.bind(this, function()
  583. {
  584. if (this.animationWindow == null)
  585. {
  586. // LATER: Check outline window for initial placement
  587. this.animationWindow = new AnimationWindow(this.editorUi, (document.body.offsetWidth - 480) / 2,
  588. 120, 640, 480);
  589. this.animationWindow.window.setVisible(true);
  590. }
  591. else
  592. {
  593. this.animationWindow.window.setVisible(!this.animationWindow.window.isVisible());
  594. }
  595. }));
  596. this.addMenuItems(menu, ['animation'], parent);
  597. mxResources.parse('testShowRtModel=Show RT model');
  598. mxResources.parse('testDebugRtModel=Debug RT model');
  599. mxResources.parse('testDownloadRtModel=Download RT model');
  600. this.editorUi.actions.addAction('testShowRtModel', mxUtils.bind(this, function()
  601. {
  602. if (this.editorUi.getCurrentFile() != null && this.editorUi.getCurrentFile().realtime != null)
  603. {
  604. console.log('bytesUsed', this.editorUi.getCurrentFile().realtime.rtModel.bytesUsed);
  605. console.log('root', this.editorUi.getCurrentFile().realtime.dumpRoot());
  606. this.editorUi.getCurrentFile().realtime.check();
  607. }
  608. }));
  609. this.editorUi.actions.addAction('testDebugRtModel', mxUtils.bind(this, function()
  610. {
  611. gapi.drive.realtime.debug();
  612. }));
  613. this.editorUi.actions.addAction('testDownloadRtModel', mxUtils.bind(this, function()
  614. {
  615. var file = this.editorUi.getCurrentFile();
  616. if (file != null && file.realtime != null &&
  617. editorUi.spinner.spin(document.body, mxResources.get('export')))
  618. {
  619. // LATER: Download full model dump with history
  620. var req = new mxXmlRequest('https://www.googleapis.com/drive/v2/files/' +
  621. file.getHash().substring(1) + '/realtime', null, 'GET');
  622. // Adds auth token
  623. req.setRequestHeaders = function(request)
  624. {
  625. mxXmlRequest.prototype.setRequestHeaders.apply(this, arguments);
  626. var token = gapi.auth.getToken().access_token;
  627. request.setRequestHeader('authorization', 'Bearer ' + token);
  628. };
  629. req.send(function(req)
  630. {
  631. editorUi.spinner.stop();
  632. if (req.getStatus() == 200)
  633. {
  634. editorUi.saveLocalFile(req.getText(), 'realtime.txt', 'text/plain');
  635. }
  636. });
  637. }
  638. }));
  639. if (this.editorUi.getCurrentFile() != null && this.editorUi.getCurrentFile().realtime != null)
  640. {
  641. this.addMenuItems(menu, ['-', 'testShowRtModel', 'testDebugRtModel', 'testDownloadRtModel'], parent);
  642. }
  643. mxResources.parse('testShowConsole=Show Console');
  644. this.editorUi.actions.addAction('testShowConsole', function()
  645. {
  646. if (!mxLog.isVisible())
  647. {
  648. mxLog.show();
  649. }
  650. else
  651. {
  652. mxLog.window.fit();
  653. }
  654. mxLog.window.div.style.zIndex = mxPopupMenu.prototype.zIndex - 1;
  655. });
  656. this.addMenuItems(menu, ['-', 'testShowConsole']);
  657. }
  658. })));
  659. editorUi.actions.addAction('shapes...', function()
  660. {
  661. if (mxClient.IS_CHROMEAPP || !editorUi.isOffline())
  662. {
  663. editorUi.showDialog(new MoreShapesDialog(editorUi, true).container, 640, (isLocalStorage) ?
  664. ((mxClient.IS_IOS) ? 480 : 460) : 440, true, true);
  665. }
  666. else
  667. {
  668. editorUi.showDialog(new MoreShapesDialog(editorUi, false).container, 360, (isLocalStorage) ?
  669. ((mxClient.IS_IOS) ? 300 : 280) : 260, true, true);
  670. }
  671. });
  672. editorUi.actions.addAction('createShape...', function()
  673. {
  674. var file = editorUi.getCurrentFile();
  675. if (urlParams['embed'] == '1' || (file != null && file.isEditable()))
  676. {
  677. var cell = new mxCell('', new mxGeometry(0, 0, 120, 120), editorUi.defaultCustomShapeStyle);
  678. cell.vertex = true;
  679. var dlg = new EditShapeDialog(editorUi, cell, mxResources.get('editShape') + ':', 630, 400);
  680. editorUi.showDialog(dlg.container, 640, 480, true, false);
  681. dlg.init();
  682. }
  683. });
  684. editorUi.actions.put('embedHtml', new Action(mxResources.get('html') + '...', function()
  685. {
  686. var dlg = new EmbedHtmlDialog(editorUi);
  687. editorUi.showDialog(dlg.container, 550, 400, true, true);
  688. dlg.init();
  689. }));
  690. editorUi.actions.put('embedSvg', new Action(mxResources.get('formatSvg') + '...', function()
  691. {
  692. var dlg = new EmbedSvgDialog(editorUi);
  693. editorUi.showDialog(dlg.container, 550, 400, true, true);
  694. dlg.init();
  695. }));
  696. editorUi.actions.put('embedIframe', new Action(mxResources.get('iframe') + '...', function()
  697. {
  698. var dlg = new IframeDialog(editorUi);
  699. editorUi.showDialog(dlg.container, 420, 220, true, true);
  700. dlg.init();
  701. }));
  702. editorUi.actions.put('publishLink', new Action(mxResources.get('link') + '...', function()
  703. {
  704. var dlg = new IframeDialog(editorUi, false, true);
  705. editorUi.showDialog(dlg.container, 420, 200, true, true);
  706. dlg.init();
  707. }));
  708. editorUi.actions.put('embedImage', new Action(mxResources.get('image') + '...', function()
  709. {
  710. var dlg = new EmbedSvgDialog(editorUi, true);
  711. editorUi.showDialog(dlg.container, 550, 400, true, true);
  712. dlg.init();
  713. }));
  714. editorUi.actions.put('liveImage', new Action('Live image...', function()
  715. {
  716. var dlg = new IframeDialog(editorUi, true);
  717. editorUi.showDialog(dlg.container, 420, 180, true, true);
  718. dlg.init();
  719. }));
  720. editorUi.actions.addAction('googleDocs...', function()
  721. {
  722. window.open('http://docsaddon.draw.io');
  723. });
  724. editorUi.actions.addAction('googleSites...', function()
  725. {
  726. var dlg = new GoogleSitesDialog(editorUi);
  727. editorUi.showDialog(dlg.container, 420, 256, true, true);
  728. dlg.init();
  729. });
  730. // Adds plugins menu item in file menu only if localStorage is available for
  731. // storing the plugins.
  732. if (isLocalStorage || mxClient.IS_CHROMEAPP)
  733. {
  734. var action = editorUi.actions.addAction('scratchpad', function()
  735. {
  736. editorUi.toggleScratchpad();
  737. });
  738. action.setToggleAction(true);
  739. action.setSelectedCallback(function() { return editorUi.scratchpad != null; });
  740. editorUi.actions.addAction('plugins...', function()
  741. {
  742. editorUi.showDialog(new PluginsDialog(editorUi).container, 360, 156, true, false);
  743. });
  744. }
  745. var action = editorUi.actions.addAction('search', function()
  746. {
  747. var visible = editorUi.sidebar.isEntryVisible('search');
  748. editorUi.sidebar.showPalette('search', !visible);
  749. if (isLocalStorage)
  750. {
  751. mxSettings.settings.search = !visible;
  752. mxSettings.save();
  753. }
  754. });
  755. action.setToggleAction(true);
  756. action.setSelectedCallback(function() { return editorUi.sidebar.isEntryVisible('search'); });
  757. if (urlParams['embed'] == '1')
  758. {
  759. editorUi.actions.get('save').funct = function(exit)
  760. {
  761. if (graph.isEditing())
  762. {
  763. graph.stopEditing();
  764. }
  765. var data = (urlParams['pages'] == '1' || (editorUi.pages != null && editorUi.pages.length > 1)) ?
  766. editorUi.getFileData(true) : mxUtils.getXml(editorUi.editor.getGraphXml());
  767. if (urlParams['proto'] == 'json')
  768. {
  769. var msg = editorUi.createLoadMessage('save');
  770. msg.xml = data;
  771. if (exit)
  772. {
  773. msg.exit = true;
  774. }
  775. data = JSON.stringify(msg);
  776. }
  777. var parent = window.opener || window.parent;
  778. parent.postMessage(data, '*');
  779. if (urlParams['modified'] != '0')
  780. {
  781. editorUi.editor.modified = false;
  782. }
  783. };
  784. editorUi.actions.addAction('saveAndExit', function()
  785. {
  786. editorUi.actions.get('save').funct(true);
  787. });
  788. editorUi.actions.addAction('exit', function()
  789. {
  790. var fn = function()
  791. {
  792. var msg = (urlParams['proto'] == 'json') ? JSON.stringify({event: 'exit',
  793. modified: editorUi.editor.modified}) : '';
  794. var parent = window.opener || window.parent;
  795. parent.postMessage(msg, '*');
  796. }
  797. if (!editorUi.editor.modified)
  798. {
  799. fn();
  800. }
  801. else
  802. {
  803. editorUi.confirm(mxResources.get('allChangesLost'), fn);
  804. }
  805. });
  806. }
  807. this.put('exportAs', new Menu(mxUtils.bind(this, function(menu, parent)
  808. {
  809. if (editorUi.isExportToCanvas())
  810. {
  811. menu.addItem(mxResources.get('image') + '...', null, mxUtils.bind(this, function()
  812. {
  813. editorUi.showExportDialog(false, mxResources.get('export'),
  814. 'https://support.draw.io/display/DO/Exporting+Files',
  815. mxUtils.bind(this, function(scale, transparentBackground, ignoreSelection, addShadow, editable)
  816. {
  817. var val = parseInt(scale);
  818. if (!isNaN(val) && val > 0)
  819. {
  820. this.editorUi.exportImage(val / 100, transparentBackground, ignoreSelection, addShadow, editable);
  821. }
  822. }));
  823. }), parent);
  824. }
  825. // Disabled for standalone mode in iOS because new tab cannot be closed
  826. else if (!editorUi.isOffline() && (!mxClient.IS_IOS || !navigator.standalone))
  827. {
  828. menu.addItem(mxResources.get('image') + '...', null, mxUtils.bind(this, function()
  829. {
  830. editorUi.showRemoteExportDialog(mxResources.get('export'), null, mxUtils.bind(this, function(ignoreSelection, editable)
  831. {
  832. this.editorUi.downloadFile((editable) ? 'xmlpng' : 'png', null, null, ignoreSelection);
  833. }));
  834. }), parent);
  835. }
  836. menu.addItem(mxResources.get('formatSvg') + '...', null, mxUtils.bind(this, function()
  837. {
  838. editorUi.showExportDialog(true, mxResources.get('export'),
  839. 'https://support.draw.io/display/DO/Exporting+Files',
  840. mxUtils.bind(this, function(scale, transparentBackground, ignoreSelection, addShadow, editable, embedImages)
  841. {
  842. var val = parseInt(scale);
  843. if (!isNaN(val) && val > 0)
  844. {
  845. this.editorUi.exportSvg(val / 100, transparentBackground, ignoreSelection, addShadow, editable, embedImages);
  846. }
  847. }));
  848. }), parent);
  849. menu.addSeparator(parent);
  850. menu.addItem(mxResources.get('formatHtmlEmbedded') + '...', null, mxUtils.bind(this, function()
  851. {
  852. this.editorUi.downloadFile('html');
  853. }), parent);
  854. // Redirects export to PDF to print in Chrome App
  855. if (mxClient.IS_CHROMEAPP)
  856. {
  857. menu.addItem(mxResources.get('formatPdf') + '...', null, this.editorUi.actions.get('print').funct, parent);
  858. }
  859. // Disabled for standalone mode in iOS because new tab cannot be closed
  860. else if (!editorUi.isOffline() && (!mxClient.IS_IOS || !navigator.standalone))
  861. {
  862. menu.addItem(mxResources.get('formatPdf') + '...', null, mxUtils.bind(this, function()
  863. {
  864. var content = document.createElement('div');
  865. content.style.padding = '6px';
  866. var cb2 = document.createElement('input');
  867. cb2.style.marginRight = '8px';
  868. cb2.setAttribute('type', 'checkbox');
  869. if (graph.isSelectionEmpty())
  870. {
  871. cb2.setAttribute('disabled', 'disabled');
  872. }
  873. content.appendChild(cb2);
  874. mxUtils.write(content, mxResources.get('selectionOnly'));
  875. mxUtils.br(content);
  876. var cb = document.createElement('input');
  877. cb.setAttribute('type', 'checkbox');
  878. cb.style.marginTop = '16px';
  879. cb.style.marginRight = '8px';
  880. if (!graph.pageVisible)
  881. {
  882. cb.setAttribute('checked', 'checked');
  883. cb.defaultChecked = true;
  884. }
  885. content.appendChild(cb);
  886. mxUtils.write(content, mxResources.get('crop'));
  887. var dlg = new CustomDialog(editorUi, content, mxUtils.bind(this, function()
  888. {
  889. var prev = graph.pageVisible;
  890. graph.pageVisible = !cb.checked;
  891. this.editorUi.downloadFile('pdf', null, null, !cb2.checked);
  892. graph.pageVisible = prev;
  893. }), null, mxResources.get('export'));
  894. this.editorUi.showDialog(dlg.container, 300, 120, true, true);
  895. }), parent);
  896. }
  897. menu.addSeparator(parent);
  898. menu.addItem(mxResources.get('formatXml') + '...', null, mxUtils.bind(this, function()
  899. {
  900. var noPages = editorUi.pages == null || editorUi.pages.length <= 1;
  901. var content = document.createElement('div');
  902. content.style.padding = '6px';
  903. var cb2 = document.createElement('input');
  904. cb2.style.marginRight = '8px';
  905. cb2.setAttribute('type', 'checkbox');
  906. if (graph.isSelectionEmpty())
  907. {
  908. cb2.setAttribute('disabled', 'disabled');
  909. }
  910. content.appendChild(cb2);
  911. mxUtils.write(content, mxResources.get('selectionOnly'));
  912. var cb = document.createElement('input');
  913. cb.setAttribute('type', 'checkbox');
  914. cb.setAttribute('checked', 'checked');
  915. cb.defaultChecked = true;
  916. cb.style.marginRight = '8px';
  917. cb.style.marginTop = '16px';
  918. mxUtils.br(content);
  919. content.appendChild(cb);
  920. if (noPages)
  921. {
  922. mxUtils.write(content, mxResources.get('compressed'));
  923. }
  924. else
  925. {
  926. mxUtils.write(content, mxResources.get('allPages'));
  927. mxEvent.addListener(cb2, 'change', function()
  928. {
  929. if (cb2.checked)
  930. {
  931. cb.setAttribute('disabled', 'disabled');
  932. }
  933. else
  934. {
  935. cb.removeAttribute('disabled');
  936. }
  937. });
  938. }
  939. var dlg = new CustomDialog(editorUi, content, mxUtils.bind(this, function()
  940. {
  941. editorUi.downloadFile('xml', (noPages) ? !cb.checked : null, null, !cb2.checked,
  942. (!noPages) ? !cb.checked : null);
  943. }), null, mxResources.get('export'));
  944. editorUi.showDialog(dlg.container, 300, 120, true, true);
  945. }), parent);
  946. if (!editorUi.isOffline())
  947. {
  948. menu.addSeparator(parent);
  949. this.addMenuItem(menu, 'export', parent).firstChild.nextSibling.innerHTML = mxResources.get('advanced') + '...';
  950. }
  951. })));
  952. this.editorUi.actions.addAction('chatWindowTitle...', mxUtils.bind(this.editorUi, this.editorUi.toggleChat));
  953. this.put('importFrom', new Menu(function(menu, parent)
  954. {
  955. function importFile(device)
  956. {
  957. if (device && Graph.fileSupport && !mxClient.IS_IE && !mxClient.IS_IE11)
  958. {
  959. var input = document.createElement('input');
  960. input.setAttribute('type', 'file');
  961. mxEvent.addListener(input, 'change', function()
  962. {
  963. if (input.files != null)
  964. {
  965. // Using null for position will disable crop of input file
  966. editorUi.importFiles(input.files, null, null, editorUi.maxImageSize);
  967. }
  968. });
  969. input.click();
  970. }
  971. else
  972. {
  973. window.openNew = false;
  974. window.openKey = 'import';
  975. var prevValue = Editor.useLocalStorage;
  976. Editor.useLocalStorage = !device;
  977. // Closes dialog after open
  978. window.openFile = new OpenFile(function(cancel)
  979. {
  980. editorUi.hideDialog(cancel);
  981. });
  982. window.openFile.setConsumer(function(xml, filename)
  983. {
  984. graph.setSelectionCells(editorUi.importXml(xml));
  985. });
  986. // Removes openFile if dialog is closed
  987. editorUi.showDialog(new OpenDialog(editorUi).container, 360, 220, true, true, function()
  988. {
  989. window.openFile = null;
  990. });
  991. // Extends dialog close to show splash screen
  992. var dlg = editorUi.dialog;
  993. var dlgClose = dlg.close;
  994. editorUi.dialog.close = function(cancel)
  995. {
  996. Editor.useLocalStorage = prevValue;
  997. dlgClose.apply(dlg, arguments);
  998. if (cancel && editorUi.getCurrentFile() == null && urlParams['embed'] != '1')
  999. {
  1000. editorUi.showSplash();
  1001. }
  1002. };
  1003. }
  1004. };
  1005. var doImportFile = mxUtils.bind(this, function(data, mime, filename)
  1006. {
  1007. if (mime == 'image/png')
  1008. {
  1009. editorUi.loadImage(data, mxUtils.bind(this, function(img)
  1010. {
  1011. editorUi.resizeImage(img, data, mxUtils.bind(this, function(data2, w2, h2)
  1012. {
  1013. var s = Math.min(1, Math.min(editorUi.maxImageSize / w2, editorUi.maxImageSize / h2));
  1014. editorUi.importFile(data, mime, 0, 0, Math.round(w2 * s), Math.round(h2 * s), filename, function(cells)
  1015. {
  1016. editorUi.spinner.stop();
  1017. graph.setSelectionCells(cells);
  1018. });
  1019. }), true);
  1020. }));
  1021. }
  1022. else
  1023. {
  1024. editorUi.importFile(data, mime, 0, 0, 0, 0, filename, function(cells)
  1025. {
  1026. editorUi.spinner.stop();
  1027. graph.setSelectionCells(cells);
  1028. });
  1029. }
  1030. });
  1031. function pickFileFromService(service)
  1032. {
  1033. // Drive requires special arguments for libraries and bypassing realtime
  1034. service.pickFile(function(id)
  1035. {
  1036. if (editorUi.spinner.spin(document.body, mxResources.get('loading')))
  1037. {
  1038. if (service == editorUi.dropbox)
  1039. {
  1040. var mime = (/(\.png)$/i.test(id)) ? 'image/png' : 'text/xml';
  1041. editorUi.loadUrl(id, function(data)
  1042. {
  1043. doImportFile(data, mime, id);
  1044. },
  1045. function(resp)
  1046. {
  1047. editorUi.handleError(resp, (resp != null) ? mxResources.get('errorLoadingFile') : null);
  1048. }, mime == 'image/png');
  1049. }
  1050. else
  1051. {
  1052. // NOTE The third argument in getFile says denyConvert to match
  1053. // the existing signature in the original DriveClient which has
  1054. // as slightly different semantic, but works the same way.
  1055. service.getFile(id, function(file)
  1056. {
  1057. var mime = (/(\.png)$/i.test(file.getTitle())) ? 'image/png' : 'text/xml';
  1058. doImportFile(file.getData(), mime, file.getTitle());
  1059. },
  1060. function(resp)
  1061. {
  1062. editorUi.handleError(resp, (resp != null) ? mxResources.get('errorLoadingFile') : null);
  1063. }, true);
  1064. }
  1065. }
  1066. }, true);
  1067. };
  1068. if (editorUi.drive != null)
  1069. {
  1070. // Requires special arguments for libraries and realtime
  1071. menu.addItem(mxResources.get('googleDrive') + '...', null, function()
  1072. {
  1073. pickFileFromService(editorUi.drive);
  1074. }, parent);
  1075. }
  1076. else if (googleEnabled)
  1077. {
  1078. menu.addItem(mxResources.get('googleDrive') + ' (' + mxResources.get('loading') + '...)', null, function()
  1079. {
  1080. // do nothing
  1081. }, parent, null, false);
  1082. }
  1083. if (editorUi.dropbox != null)
  1084. {
  1085. menu.addItem(mxResources.get('dropbox') + '...', null, function()
  1086. {
  1087. pickFileFromService(editorUi.dropbox);
  1088. }, parent);
  1089. }
  1090. else if (dropboxEnabled)
  1091. {
  1092. menu.addItem(mxResources.get('dropbox') + ' (' + mxResources.get('loading') + '...)', null, function()
  1093. {
  1094. // do nothing
  1095. }, parent, null, false);
  1096. }
  1097. if (editorUi.oneDrive != null)
  1098. {
  1099. menu.addItem(mxResources.get('oneDrive') + '...', null, function()
  1100. {
  1101. pickFileFromService(editorUi.oneDrive);
  1102. }, parent);
  1103. }
  1104. else if (oneDriveEnabled)
  1105. {
  1106. menu.addItem(mxResources.get('oneDrive') + ' (' + mxResources.get('loading') + '...)', null, function()
  1107. {
  1108. // do nothing
  1109. }, parent, null, false);
  1110. }
  1111. menu.addSeparator(parent);
  1112. if (isLocalStorage && urlParams['browser'] != '0')
  1113. {
  1114. menu.addItem(mxResources.get('browser') + '...', null, function()
  1115. {
  1116. importFile(false);
  1117. }, parent);
  1118. }
  1119. if (!mxClient.IS_IOS)
  1120. {
  1121. menu.addItem(mxResources.get('device') + '...', null, function()
  1122. {
  1123. importFile(true);
  1124. }, parent);
  1125. }
  1126. if (!editorUi.isOffline())
  1127. {
  1128. menu.addSeparator(parent);
  1129. menu.addItem(mxResources.get('url') + '...', null, function()
  1130. {
  1131. var dlg = new FilenameDialog(editorUi, '', mxResources.get('import'), function(fileUrl)
  1132. {
  1133. if (fileUrl != null && fileUrl.length > 0 && editorUi.spinner.spin(document.body, mxResources.get('loading')))
  1134. {
  1135. var mime = (/(\.png)($|\?)/i.test(fileUrl)) ? 'image/png' : 'text/xml';
  1136. // Uses proxy to avoid CORS issues
  1137. editorUi.loadUrl(PROXY_URL + '?url=' + encodeURIComponent(fileUrl), function(data)
  1138. {
  1139. doImportFile(data, mime, fileUrl);
  1140. },
  1141. function ()
  1142. {
  1143. editorUi.spinner.stop();
  1144. editorUi.handleError(null, mxResources.get('errorLoadingFile'));
  1145. }, mime == 'image/png');
  1146. }
  1147. }, mxResources.get('url'));
  1148. editorUi.showDialog(dlg.container, 300, 80, true, true);
  1149. dlg.init();
  1150. }, parent);
  1151. }
  1152. })).isEnabled = isGraphEnabled;
  1153. this.put('theme', new Menu(mxUtils.bind(this, function(menu, parent)
  1154. {
  1155. var item = menu.addItem(mxResources.get('kennedy'), null, function()
  1156. {
  1157. mxSettings.setUi('');
  1158. mxSettings.save();
  1159. editorUi.alert(mxResources.get('restartForChangeRequired'));
  1160. }, parent);
  1161. if (uiTheme != 'atlas')
  1162. {
  1163. menu.addCheckmark(item, Editor.checkmarkImage);
  1164. }
  1165. item = menu.addItem(mxResources.get('atlas'), null, function()
  1166. {
  1167. mxSettings.setUi('atlas');
  1168. mxSettings.save();
  1169. editorUi.alert(mxResources.get('restartForChangeRequired'));
  1170. }, parent);
  1171. if (uiTheme == 'atlas')
  1172. {
  1173. menu.addCheckmark(item, Editor.checkmarkImage);
  1174. }
  1175. })));
  1176. this.editorUi.actions.addAction('rename...', mxUtils.bind(this, function()
  1177. {
  1178. var file = this.editorUi.getCurrentFile();
  1179. if (file != null)
  1180. {
  1181. var filename = (file.getTitle() != null) ? file.getTitle() : this.editorUi.defaultFilename;
  1182. var dlg = new FilenameDialog(this.editorUi, filename, mxResources.get('rename'), mxUtils.bind(this, function(title)
  1183. {
  1184. if (title != null && title.length > 0 && file != null && this.editorUi.spinner.spin(document.body, mxResources.get('renaming')))
  1185. {
  1186. // Delete old file, save new file in dropbox if autosize is enabled
  1187. file.rename(title, mxUtils.bind(this, function(resp)
  1188. {
  1189. this.editorUi.spinner.stop();
  1190. }),
  1191. mxUtils.bind(this, function(resp)
  1192. {
  1193. this.editorUi.handleError(resp, (resp != null) ? mxResources.get('errorRenamingFile') : null);
  1194. }));
  1195. }
  1196. }), (file.constructor == DriveFile || file.constructor == StorageFile) ?
  1197. mxResources.get('diagramName') : null, function(name)
  1198. {
  1199. if (name != null && name.length > 0)
  1200. {
  1201. return true;
  1202. }
  1203. editorUi.showError(mxResources.get('error'), mxResources.get('invalidName'), mxResources.get('ok'));
  1204. return false;
  1205. });
  1206. this.editorUi.showDialog(dlg.container, 300, 80, true, true);
  1207. dlg.init();
  1208. }
  1209. })).isEnabled = isGraphEnabled;
  1210. editorUi.actions.addAction('makeCopy...', mxUtils.bind(this, function()
  1211. {
  1212. var file = editorUi.getCurrentFile();
  1213. if (file != null)
  1214. {
  1215. var title = (file.getTitle() != null) ? file.getTitle() : editorUi.defaultFilename;
  1216. // Handles extension
  1217. var extension = '';
  1218. var dot = title.lastIndexOf('.');
  1219. if (dot >= 0)
  1220. {
  1221. extension = title.substring(dot);
  1222. title = title.substring(0, dot);
  1223. }
  1224. title = mxResources.get('copyOf', [title]) + extension;
  1225. if (file.constructor == DriveFile)
  1226. {
  1227. var dlg = new CreateDialog(editorUi, title, mxUtils.bind(this, function(newTitle, mode)
  1228. {
  1229. // Mode is "download" if Create button is pressed, means use Google Drive
  1230. if (mode == 'download')
  1231. {
  1232. mode = App.MODE_GOOGLE;
  1233. }
  1234. if (newTitle != null && newTitle.length > 0)
  1235. {
  1236. if (mode == App.MODE_GOOGLE)
  1237. {
  1238. if (editorUi.spinner.spin(document.body, mxResources.get('saving')))
  1239. {
  1240. // Makes sure the latest XML is in the file
  1241. file.save(false, mxUtils.bind(this, function()
  1242. {
  1243. // Saveas does not update the file descriptor in Google Drive
  1244. file.saveAs(newTitle, mxUtils.bind(this, function(resp)
  1245. {
  1246. editorUi.spinner.stop();
  1247. var url = editorUi.getUrl();
  1248. window.openWindow(url + '#G' + resp.id, null, mxUtils.bind(this, function()
  1249. {
  1250. window.location.hash = 'G' + resp.id;
  1251. }));
  1252. }), mxUtils.bind(this, function(resp)
  1253. {
  1254. editorUi.handleError(resp);
  1255. }));
  1256. }), mxUtils.bind(this, function(resp)
  1257. {
  1258. editorUi.handleError(resp);
  1259. }));
  1260. }
  1261. }
  1262. else
  1263. {
  1264. this.editorUi.createFile(newTitle, this.editorUi.getFileData(true), null, mode);
  1265. }
  1266. }
  1267. }), mxUtils.bind(this, function()
  1268. {
  1269. editorUi.hideDialog();
  1270. }), mxResources.get('makeCopy'), mxResources.get('create'), null,
  1271. null, null, null, true);
  1272. editorUi.showDialog(dlg.container, 420, 380, true, true);
  1273. dlg.init();
  1274. }
  1275. else
  1276. {
  1277. // Creates a copy with no predefined storage
  1278. editorUi.editor.editAsNew(editorUi.getEditBlankXml(), title);
  1279. }
  1280. }
  1281. }));
  1282. editorUi.actions.addAction('moveToFolder...', mxUtils.bind(this, function()
  1283. {
  1284. var file = editorUi.getCurrentFile();
  1285. if (file.getMode() == App.MODE_GOOGLE || file.getMode() == App.MODE_ONEDRIVE)
  1286. {
  1287. editorUi.pickFolder(file.getMode(), mxUtils.bind(this, function(folderId)
  1288. {
  1289. if (editorUi.spinner.spin(document.body, mxResources.get('moving')))
  1290. {
  1291. file.move(folderId, mxUtils.bind(this, function(resp)
  1292. {
  1293. editorUi.spinner.stop();
  1294. }), mxUtils.bind(this, function(resp)
  1295. {
  1296. editorUi.handleError(resp);
  1297. }));
  1298. }
  1299. }));
  1300. }
  1301. }));
  1302. editorUi.actions.addAction('imgur...', mxUtils.bind(this, function()
  1303. {
  1304. editorUi.publishImage(mxUtils.bind(editorUi, editorUi.uploadToImgur), function(imgurId)
  1305. {
  1306. window.open('https://imgur.com/' + imgurId);
  1307. });
  1308. }));
  1309. editorUi.actions.addAction('facebook...', mxUtils.bind(this, function()
  1310. {
  1311. editorUi.publishImage(mxUtils.bind(editorUi, editorUi.uploadToImgur), function(imgurId)
  1312. {
  1313. window.open('https://www.facebook.com/sharer.php?p[url]=' + encodeURIComponent('https://imgur.com/' + imgurId) +
  1314. '&p[images][0]=' + encodeURIComponent(imgurId + '.png'));
  1315. });
  1316. }));
  1317. editorUi.actions.addAction('twitter...', mxUtils.bind(this, function()
  1318. {
  1319. editorUi.publishImage(mxUtils.bind(editorUi, editorUi.uploadToImgur), function(imgurId)
  1320. {
  1321. window.open('https://twitter.com/intent/tweet?text=' +
  1322. encodeURIComponent('Check out the diagram I made with draw.io') +
  1323. '&via=drawio&hashtags=madewithdrawio&url=' +
  1324. encodeURIComponent('https://imgur.com/' + imgurId));
  1325. });
  1326. }));
  1327. editorUi.actions.addAction('github...', mxUtils.bind(this, function()
  1328. {
  1329. editorUi.publishImage(mxUtils.bind(editorUi, editorUi.uploadToGithub));
  1330. }));
  1331. this.put('publish', new Menu(mxUtils.bind(this, function(menu, parent)
  1332. {
  1333. // Disable publish in IE9- due to CORS problem when getting image from server
  1334. // which requires cross-domain XHR but XDomainRequest has no custom headers
  1335. // to set content type to form-encoded-data which is needed for the export.
  1336. if (document.documentMode == null || document.documentMode >= 10)
  1337. {
  1338. if (typeof XMLHttpRequest !== 'undefined')
  1339. {
  1340. this.addMenuItems(menu, ['github'], parent);
  1341. }
  1342. this.addMenuItems(menu, ['twitter'], parent);
  1343. this.addMenuItems(menu, ['facebook'], parent);
  1344. this.addMenuItems(menu, ['imgur'], parent);
  1345. }
  1346. if (!navigator.standalone && !editorUi.isOffline())
  1347. {
  1348. this.addMenuItems(menu, ['publishLink'], parent);
  1349. }
  1350. })));
  1351. editorUi.actions.put('offline', new Action(mxResources.get('offline') + '...', function()
  1352. {
  1353. window.open('http://www.draw.io/app')
  1354. }));
  1355. editorUi.actions.put('chromeApp', new Action(mxResources.get('chromeApp') + '...', function()
  1356. {
  1357. window.open('https://chrome.google.com/webstore/detail/drawio-desktop/pebppomjfocnoigkeepgbmcifnnlndla')
  1358. }));
  1359. this.editorUi.actions.addAction('share...', mxUtils.bind(this, function()
  1360. {
  1361. var file = this.editorUi.getCurrentFile();
  1362. if (file != null)
  1363. {
  1364. this.editorUi.drive.showPermissions(file.getId());
  1365. }
  1366. }));
  1367. this.put('embed', new Menu(mxUtils.bind(this, function(menu, parent)
  1368. {
  1369. if (urlParams['test'] == '1')
  1370. {
  1371. this.addMenuItems(menu, ['liveImage', '-'], parent);
  1372. }
  1373. this.addMenuItems(menu, ['embedImage', 'embedSvg', '-', 'embedHtml'], parent);
  1374. if (!navigator.standalone && !editorUi.isOffline())
  1375. {
  1376. this.addMenuItems(menu, ['embedIframe'], parent);
  1377. }
  1378. if (!editorUi.isOffline())
  1379. {
  1380. this.addMenuItems(menu, ['-', 'googleSites', 'googleDocs'], parent);
  1381. }
  1382. })));
  1383. // Overrides arrange menu to add insert submenu
  1384. this.put('arrange', new Menu(mxUtils.bind(this, function(menu, parent)
  1385. {
  1386. this.addMenuItems(menu, ['toFront', 'toBack', '-'], parent);
  1387. this.addSubmenu('direction', menu, parent);
  1388. this.addMenuItems(menu, ['turn', '-'], parent);
  1389. this.addSubmenu('align', menu, parent);
  1390. this.addSubmenu('distribute', menu, parent);
  1391. menu.addSeparator(parent);
  1392. this.addSubmenu('navigation', menu, parent);
  1393. this.addSubmenu('insert', menu, parent);
  1394. this.addSubmenu('layout', menu, parent);
  1395. this.addMenuItems(menu, ['-', 'group', 'ungroup', 'removeFromGroup', '-', 'editGeometry', 'clearWaypoints', 'autosize'], parent);
  1396. })));
  1397. var methods = ['horizontalFlow', 'verticalFlow', '-', 'horizontalTree', 'verticalTree', '-', 'organic', 'circle', '-', 'fromText'];
  1398. var addInsertItem = function(menu, parent, title, method)
  1399. {
  1400. menu.addItem(title, null, mxUtils.bind(this, function()
  1401. {
  1402. if (method == 'fromText')
  1403. {
  1404. var dlg = new ParseDialog(editorUi, title);
  1405. editorUi.showDialog(dlg.container, 620, 420, true, false);
  1406. editorUi.dialog.container.style.overflow = 'auto';
  1407. dlg.init();
  1408. }
  1409. else
  1410. {
  1411. var dlg = new CreateGraphDialog(editorUi, title, method);
  1412. editorUi.showDialog(dlg.container, 620, 420, true, false);
  1413. // Executed after dialog is added to dom
  1414. dlg.init();
  1415. }
  1416. }), parent);
  1417. };
  1418. editorUi.actions.addAction('insertText', function()
  1419. {
  1420. if (graph.isEnabled() && !graph.isCellLocked(graph.getDefaultParent()))
  1421. {
  1422. var pt = graph.getInsertPoint();
  1423. var cell = new mxCell('Text', new mxGeometry(pt.x, pt.y, 40, 20),
  1424. 'text;html=1;resizable=0;autosize=1;align=left;verticalAlign=top;spacingTop=-4;points=[];');
  1425. cell.vertex = true;
  1426. graph.startEditingAtCell(graph.addCell(cell));
  1427. }
  1428. }, null, null, 'Ctrl+Shift+X').isEnabled = isGraphEnabled;
  1429. editorUi.actions.addAction('insertRectangle', function()
  1430. {
  1431. if (graph.isEnabled() && !graph.isCellLocked(graph.getDefaultParent()))
  1432. {
  1433. var pt = graph.getInsertPoint();
  1434. var cell = new mxCell('', new mxGeometry(pt.x, pt.y, 120, 60), 'whiteSpace=wrap;html=1;');
  1435. cell.vertex = true;
  1436. graph.setSelectionCell(graph.addCell(cell));
  1437. }
  1438. }, null, null, 'Ctrl+K').isEnabled = isGraphEnabled;
  1439. editorUi.actions.addAction('insertEllipse', function()
  1440. {
  1441. if (graph.isEnabled() && !graph.isCellLocked(graph.getDefaultParent()))
  1442. {
  1443. var pt = graph.getInsertPoint();
  1444. var cell = new mxCell('', new mxGeometry(pt.x, pt.y, 80, 80), 'ellipse;whiteSpace=wrap;html=1;');
  1445. cell.vertex = true;
  1446. graph.setSelectionCell(graph.addCell(cell));
  1447. }
  1448. }, null, null, 'Ctrl+Shift+K').isEnabled = isGraphEnabled;
  1449. this.put('insert', new Menu(mxUtils.bind(this, function(menu, parent)
  1450. {
  1451. this.addMenuItems(menu, ['insertText', 'insertRectangle', 'insertEllipse', '-', 'insertLink', 'insertImage'], parent);
  1452. menu.addSeparator(parent);
  1453. for (var i = 0; i < methods.length; i++)
  1454. {
  1455. if (methods[i] == '-')
  1456. {
  1457. menu.addSeparator(parent);
  1458. }
  1459. else
  1460. {
  1461. addInsertItem(menu, parent, mxResources.get(methods[i]), methods[i]);
  1462. }
  1463. }
  1464. })));
  1465. this.put('openRecent', new Menu(function(menu, parent)
  1466. {
  1467. var recent = editorUi.getRecent();
  1468. var count = 0;
  1469. if (recent != null)
  1470. {
  1471. for (var i = 0; i < recent.length; i++)
  1472. {
  1473. (function(entry)
  1474. {
  1475. count++;
  1476. var modeKey = entry.mode;
  1477. // Google and oneDrive use different keys
  1478. if (modeKey == App.MODE_GOOGLE)
  1479. {
  1480. modeKey = 'googleDrive';
  1481. }
  1482. else if (modeKey == App.MODE_ONEDRIVE)
  1483. {
  1484. modeKey = 'oneDrive';
  1485. }
  1486. menu.addItem(entry.title + ' (' + mxResources.get(modeKey) + ')', null, function()
  1487. {
  1488. editorUi.loadFile(entry.id);
  1489. }, parent);
  1490. })(recent[i]);
  1491. }
  1492. menu.addSeparator(parent);
  1493. }
  1494. menu.addItem(mxResources.get('reset'), null, function()
  1495. {
  1496. editorUi.resetRecent();
  1497. }, parent);
  1498. }));
  1499. this.put('openFrom', new Menu(function(menu, parent)
  1500. {
  1501. if (editorUi.drive != null)
  1502. {
  1503. menu.addItem(mxResources.get('googleDrive') + '...', null, function()
  1504. {
  1505. editorUi.pickFile(App.MODE_GOOGLE);
  1506. }, parent);
  1507. }
  1508. else if (googleEnabled)
  1509. {
  1510. menu.addItem(mxResources.get('googleDrive') + ' (' + mxResources.get('loading') + '...)', null, function()
  1511. {
  1512. // do nothing
  1513. }, parent, null, false);
  1514. }
  1515. if (editorUi.dropbox != null)
  1516. {
  1517. menu.addItem(mxResources.get('dropbox') + '...', null, function()
  1518. {
  1519. editorUi.pickFile(App.MODE_DROPBOX);
  1520. }, parent);
  1521. }
  1522. else if (dropboxEnabled)
  1523. {
  1524. menu.addItem(mxResources.get('dropbox') + ' (' + mxResources.get('loading') + '...)', null, function()
  1525. {
  1526. // do nothing
  1527. }, parent, null, false);
  1528. }
  1529. if (editorUi.oneDrive != null)
  1530. {
  1531. menu.addItem(mxResources.get('oneDrive') + '...', null, function()
  1532. {
  1533. editorUi.pickFile(App.MODE_ONEDRIVE);
  1534. }, parent);
  1535. }
  1536. else if (oneDriveEnabled)
  1537. {
  1538. menu.addItem(mxResources.get('oneDrive') + ' (' + mxResources.get('loading') + '...)', null, function()
  1539. {
  1540. // do nothing
  1541. }, parent, null, false);
  1542. }
  1543. menu.addSeparator(parent);
  1544. if (isLocalStorage && urlParams['browser'] != '0')
  1545. {
  1546. menu.addItem(mxResources.get('browser') + '...', null, function()
  1547. {
  1548. editorUi.pickFile(App.MODE_BROWSER);
  1549. }, parent);
  1550. }
  1551. if (!mxClient.IS_IOS)
  1552. {
  1553. menu.addItem(mxResources.get('device') + '...', null, function()
  1554. {
  1555. editorUi.pickFile(App.MODE_DEVICE);
  1556. }, parent);
  1557. }
  1558. if (!editorUi.isOffline())
  1559. {
  1560. menu.addSeparator(parent);
  1561. menu.addItem(mxResources.get('url') + '...', null, function()
  1562. {
  1563. var dlg = new FilenameDialog(editorUi, '', mxResources.get('open'), function(fileUrl)
  1564. {
  1565. if (fileUrl != null && fileUrl.length > 0)
  1566. {
  1567. var url = editorUi.getUrl(window.location.pathname + '?url=' + encodeURIComponent(fileUrl));
  1568. if (editorUi.getCurrentFile() == null)
  1569. {
  1570. window.location.href = url;
  1571. }
  1572. else
  1573. {
  1574. window.openWindow(url);
  1575. }
  1576. }
  1577. }, mxResources.get('url'));
  1578. editorUi.showDialog(dlg.container, 300, 80, true, true);
  1579. dlg.init();
  1580. }, parent);
  1581. }
  1582. }));
  1583. this.put('newLibrary', new Menu(function(menu, parent)
  1584. {
  1585. if (editorUi.drive != null)
  1586. {
  1587. menu.addItem(mxResources.get('googleDrive') + '...', null, function()
  1588. {
  1589. editorUi.showLibraryDialog(null, null, null, null, App.MODE_GOOGLE);
  1590. }, parent);
  1591. }
  1592. else if (googleEnabled)
  1593. {
  1594. menu.addItem(mxResources.get('googleDrive') + ' (' + mxResources.get('loading') + '...)', null, function()
  1595. {
  1596. // do nothing
  1597. }, parent, null, false);
  1598. }
  1599. if (editorUi.dropbox != null)
  1600. {
  1601. menu.addItem(mxResources.get('dropbox') + '...', null, function()
  1602. {
  1603. editorUi.showLibraryDialog(null, null, null, null, App.MODE_DROPBOX);
  1604. }, parent);
  1605. }
  1606. else if (dropboxEnabled)
  1607. {
  1608. menu.addItem(mxResources.get('dropbox') + ' (' + mxResources.get('loading') + '...)', null, function()
  1609. {
  1610. // do nothing
  1611. }, parent, null, false);
  1612. }
  1613. if (editorUi.oneDrive != null)
  1614. {
  1615. menu.addItem(mxResources.get('oneDrive') + '...', null, function()
  1616. {
  1617. editorUi.showLibraryDialog(null, null, null, null, App.MODE_ONEDRIVE);
  1618. }, parent);
  1619. }
  1620. else if (oneDriveEnabled)
  1621. {
  1622. menu.addItem(mxResources.get('oneDrive') + ' (' + mxResources.get('loading') + '...)', null, function()
  1623. {
  1624. // do nothing
  1625. }, parent, null, false);
  1626. }
  1627. menu.addSeparator(parent);
  1628. if (isLocalStorage && urlParams['browser'] != '0')
  1629. {
  1630. menu.addItem(mxResources.get('browser') + '...', null, function()
  1631. {
  1632. editorUi.showLibraryDialog(null, null, null, null, App.MODE_BROWSER);
  1633. }, parent);
  1634. }
  1635. if (!mxClient.IS_IOS)
  1636. {
  1637. menu.addItem(mxResources.get('device') + '...', null, function()
  1638. {
  1639. editorUi.showLibraryDialog(null, null, null, null, App.MODE_DEVICE);
  1640. }, parent);
  1641. }
  1642. }));
  1643. this.put('openLibraryFrom', new Menu(function(menu, parent)
  1644. {
  1645. if (editorUi.drive != null)
  1646. {
  1647. menu.addItem(mxResources.get('googleDrive') + '...', null, function()
  1648. {
  1649. editorUi.pickLibrary(App.MODE_GOOGLE);
  1650. }, parent);
  1651. }
  1652. else if (googleEnabled)
  1653. {
  1654. menu.addItem(mxResources.get('googleDrive') + ' (' + mxResources.get('loading') + '...)', null, function()
  1655. {
  1656. // do nothing
  1657. }, parent, null, false);
  1658. }
  1659. if (editorUi.dropbox != null)
  1660. {
  1661. menu.addItem(mxResources.get('dropbox') + '...', null, function()
  1662. {
  1663. editorUi.pickLibrary(App.MODE_DROPBOX);
  1664. }, parent);
  1665. }
  1666. else if (dropboxEnabled)
  1667. {
  1668. menu.addItem(mxResources.get('dropbox') + ' (' + mxResources.get('loading') + '...)', null, function()
  1669. {
  1670. // do nothing
  1671. }, parent, null, false);
  1672. }
  1673. if (editorUi.oneDrive != null)
  1674. {
  1675. menu.addItem(mxResources.get('oneDrive') + '...', null, function()
  1676. {
  1677. editorUi.pickLibrary(App.MODE_ONEDRIVE);
  1678. }, parent);
  1679. }
  1680. else if (oneDriveEnabled)
  1681. {
  1682. menu.addItem(mxResources.get('oneDrive') + ' (' + mxResources.get('loading') + '...)', null, function()
  1683. {
  1684. // do nothing
  1685. }, parent, null, false);
  1686. }
  1687. menu.addSeparator(parent);
  1688. if (isLocalStorage && urlParams['browser'] != '0')
  1689. {
  1690. menu.addItem(mxResources.get('browser') + '...', null, function()
  1691. {
  1692. editorUi.pickLibrary(App.MODE_BROWSER);
  1693. }, parent);
  1694. }
  1695. if (!mxClient.IS_IOS)
  1696. {
  1697. menu.addItem(mxResources.get('device') + '...', null, function()
  1698. {
  1699. editorUi.pickLibrary(App.MODE_DEVICE);
  1700. }, parent);
  1701. }
  1702. if (!editorUi.isOffline())
  1703. {
  1704. menu.addSeparator(parent);
  1705. menu.addItem(mxResources.get('url') + '...', null, function()
  1706. {
  1707. var dlg = new FilenameDialog(editorUi, '', mxResources.get('open'), function(fileUrl)
  1708. {
  1709. if (fileUrl != null && fileUrl.length > 0 && editorUi.spinner.spin(document.body, mxResources.get('loading')))
  1710. {
  1711. // Uses proxy to avoid CORS issues
  1712. mxUtils.get(PROXY_URL + '?url=' + encodeURIComponent(fileUrl), function(req)
  1713. {
  1714. if (req.getStatus() == 200)
  1715. {
  1716. editorUi.spinner.stop();
  1717. try
  1718. {
  1719. editorUi.loadLibrary(new UrlLibrary(this, req.getText(), fileUrl));
  1720. }
  1721. catch (e)
  1722. {
  1723. editorUi.handleError(e, mxResources.get('errorLoadingFile'));
  1724. }
  1725. }
  1726. else
  1727. {
  1728. editorUi.spinner.stop();
  1729. editorUi.handleError(null, mxResources.get('errorLoadingFile'));
  1730. }
  1731. }, function()
  1732. {
  1733. editorUi.spinner.stop();
  1734. editorUi.handleError(null, mxResources.get('errorLoadingFile'));
  1735. });
  1736. }
  1737. }, mxResources.get('url'));
  1738. editorUi.showDialog(dlg.container, 300, 80, true, true);
  1739. dlg.init();
  1740. }, parent);
  1741. }
  1742. }));
  1743. // Overrides view menu to add search and scratchpad
  1744. this.put('view', new Menu(mxUtils.bind(this, function(menu, parent)
  1745. {
  1746. this.addMenuItems(menu, ((this.editorUi.format != null) ? ['formatPanel'] : []).
  1747. concat(['outline', 'layers', '-']));
  1748. this.addMenuItems(menu, ['-', 'search'], parent);
  1749. if (isLocalStorage || mxClient.IS_CHROMEAPP)
  1750. {
  1751. var item = this.addMenuItem(menu, 'scratchpad', parent);
  1752. if (!editorUi.isOffline() || mxClient.IS_CHROMEAPP)
  1753. {
  1754. this.addLinkToItem(item, 'https://support.draw.io/questions/10420280');
  1755. }
  1756. }
  1757. this.addMenuItems(menu, ['shapes', '-', 'pageView', 'pageScale', '-',
  1758. 'scrollbars', 'tooltips', '-',
  1759. 'grid', 'guides'], parent);
  1760. if (mxClient.IS_SVG && (document.documentMode == null || document.documentMode > 9))
  1761. {
  1762. this.addMenuItem(menu, 'shadowVisible', parent);
  1763. }
  1764. this.addMenuItems(menu, ['-', 'connectionArrows', 'connectionPoints', '-',
  1765. 'resetView', 'zoomIn', 'zoomOut'], parent);
  1766. })));
  1767. this.put('extras', new Menu(mxUtils.bind(this, function(menu, parent)
  1768. {
  1769. if (urlParams['embed'] != '1')
  1770. {
  1771. this.addSubmenu('theme', menu, parent);
  1772. menu.addSeparator(parent);
  1773. }
  1774. this.addMenuItems(menu, ['copyConnect', 'collapseExpand', '-'], parent);
  1775. if (typeof(MathJax) !== 'undefined')
  1776. {
  1777. var item = this.addMenuItem(menu, 'mathematicalTypesetting', parent);
  1778. this.addLinkToItem(item, 'https://desk.draw.io/solution/articles/16000032875-how-to-use-mathematical-typesetting-');
  1779. }
  1780. this.addMenuItems(menu, ['autosave', '-', 'createShape', 'editDiagram'], parent);
  1781. menu.addSeparator(parent);
  1782. if (urlParams['embed'] != '1' && isLocalStorage)
  1783. {
  1784. this.addMenuItems(menu, ['showStartScreen'], parent);
  1785. }
  1786. if (!editorUi.isOfflineApp() && urlParams['embed'] != '1')
  1787. {
  1788. this.addMenuItems(menu, ['plugins', '-', 'offline'], parent);
  1789. }
  1790. else
  1791. {
  1792. menu.addSeparator(parent);
  1793. }
  1794. if (!editorUi.isOffline() && !navigator.standalone && urlParams['embed'] != '1')
  1795. {
  1796. this.addMenuItems(menu, ['chromeApp'], parent);
  1797. }
  1798. })));
  1799. this.put('file', new Menu(mxUtils.bind(this, function(menu, parent)
  1800. {
  1801. if (urlParams['embed'] == '1')
  1802. {
  1803. this.addSubmenu('importFrom', menu, parent);
  1804. this.addSubmenu('exportAs', menu, parent);
  1805. this.addSubmenu('embed', menu, parent);
  1806. if (urlParams['libraries'] == '1')
  1807. {
  1808. this.addMenuItems(menu, ['-'], parent);
  1809. this.addSubmenu('newLibrary', menu, parent);
  1810. this.addSubmenu('openLibraryFrom', menu, parent);
  1811. }
  1812. this.addMenuItems(menu, ['-', 'pageSetup', 'print', '-', 'save'], parent);
  1813. if (urlParams['saveAndExit'] == '1')
  1814. {
  1815. this.addMenuItems(menu, ['saveAndExit'], parent);
  1816. }
  1817. this.addMenuItems(menu, ['exit'], parent);
  1818. }
  1819. else
  1820. {
  1821. var file = this.editorUi.getCurrentFile();
  1822. if (file != null && file.constructor == DriveFile)
  1823. {
  1824. if (file.isRestricted())
  1825. {
  1826. this.addMenuItems(menu, ['exportOptionsDisabled'], parent);
  1827. }
  1828. if (file.realtime == null)
  1829. {
  1830. this.addMenuItems(menu, ['save', 'share', '-'], parent);
  1831. }
  1832. else
  1833. {
  1834. if (!file.isAutosave())
  1835. {
  1836. this.addMenuItems(menu, ['save'], parent);
  1837. }
  1838. this.addMenuItems(menu, ['share', 'chatWindowTitle', '-'], parent);
  1839. }
  1840. }
  1841. else
  1842. {
  1843. this.addMenuItems(menu, ['new'], parent);
  1844. }
  1845. this.addSubmenu('openFrom', menu, parent);
  1846. if (isLocalStorage)
  1847. {
  1848. this.addSubmenu('openRecent', menu, parent);
  1849. }
  1850. if (file != null && file.constructor == DriveFile)
  1851. {
  1852. this.addMenuItems(menu, ['new', '-', 'rename', 'makeCopy', 'moveToFolder'], parent);
  1853. }
  1854. else
  1855. {
  1856. this.addMenuItems(menu, ['-', 'save', 'saveAs', '-', 'rename'], parent);
  1857. if (editorUi.isOfflineApp())
  1858. {
  1859. if (!editorUi.isOffline())
  1860. {
  1861. this.addMenuItems(menu, ['upload'], parent);
  1862. }
  1863. }
  1864. else
  1865. {
  1866. this.addMenuItems(menu, ['makeCopy'], parent);
  1867. if (file != null && file.constructor == OneDriveFile)
  1868. {
  1869. this.addMenuItems(menu, ['moveToFolder'], parent);
  1870. }
  1871. }
  1872. }
  1873. menu.addSeparator(parent);
  1874. this.addSubmenu('importFrom', menu, parent);
  1875. this.addSubmenu('exportAs', menu, parent);
  1876. menu.addSeparator(parent);
  1877. this.addSubmenu('embed', menu, parent);
  1878. this.addSubmenu('publish', menu, parent);
  1879. menu.addSeparator(parent);
  1880. this.addSubmenu('newLibrary', menu, parent);
  1881. this.addSubmenu('openLibraryFrom', menu, parent);
  1882. if (file != null && (file.constructor == DriveFile || file.constructor == DropboxFile))
  1883. {
  1884. this.addMenuItems(menu, ['-', 'revisionHistory'], parent);
  1885. }
  1886. if (file != null && file.constructor == DriveFile)
  1887. {
  1888. this.addMenuItems(menu, ['createRevision'], parent);
  1889. }
  1890. this.addMenuItems(menu, ['-', 'pageSetup'], parent);
  1891. // Cannot use print in standalone mode on iOS as we cannot open new windows
  1892. if (!mxClient.IS_IOS || !navigator.standalone)
  1893. {
  1894. this.addMenuItems(menu, ['print'], parent);
  1895. }
  1896. this.addMenuItems(menu, ['-', 'close']);
  1897. }
  1898. })));
  1899. };
  1900. })();