Menus.js 63 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120122013201420152016201720182019202020212022202320242025202620272028202920302031203220332034203520362037203820392040204120422043204420452046204720482049205020512052205320542055205620572058205920602061206220632064206520662067206820692070207120722073207420752076207720782079208020812082208320842085208620872088208920902091209220932094209520962097209820992100210121022103210421052106210721082109211021112112211321142115211621172118211921202121212221232124212521262127212821292130213121322133213421352136213721382139214021412142214321442145214621472148214921502151215221532154215521562157215821592160216121622163216421652166216721682169217021712172217321742175217621772178217921802181
  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. (false && editorUi.pages != null && editorUi.pages.length > 1) ?
  77. 300 : 220, 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. img.src = 'https://log.draw.io/log?severity=CONFIG&msg=helpsearch:' + encodeURIComponent(input.value) + '&v=' + encodeURIComponent(EditorUi.VERSION);
  487. }
  488. // Workaround for blocked submit on iOS/IE11
  489. window.setTimeout(function()
  490. {
  491. editorUi.menubar.hideMenu();
  492. }, 0);
  493. });
  494. mxEvent.addGestureListeners(item, function(evt)
  495. {
  496. if (document.activeElement != input)
  497. {
  498. input.focus();
  499. }
  500. mxEvent.consume(evt);
  501. }, function(evt)
  502. {
  503. mxEvent.consume(evt);
  504. }, function(evt)
  505. {
  506. mxEvent.consume(evt);
  507. });
  508. // Sets initial focus on input element
  509. window.setTimeout(function()
  510. {
  511. input.focus();
  512. }, 0);
  513. }
  514. this.addMenuItems(menu, ['-', 'quickStart', 'userManual', 'keyboardShortcuts', '-']);
  515. if (!mxClient.IS_CHROMEAPP)
  516. {
  517. this.addMenuItems(menu, ['feedback']);
  518. }
  519. this.addMenuItems(menu, ['support', '-', 'about']);
  520. }
  521. if (urlParams['test'] == '1')
  522. {
  523. // For showing the bounding box
  524. mxResources.parse('showBoundingBox=Show bounding box');
  525. this.editorUi.actions.addAction('showBoundingBox', mxUtils.bind(this, function()
  526. {
  527. var b = graph.getGraphBounds();
  528. var tr = graph.view.translate;
  529. var s = graph.view.scale;
  530. graph.insertVertex(parent, null, '', b.x / s - tr.x, b.y / s - tr.y, b.width / s, b.height / s, 'fillColor=none;strokeColor=red;');
  531. }));
  532. this.addMenuItems(menu, ['-', 'showBoundingBox'], parent);
  533. // For testing local XML export
  534. mxResources.parse('testXmlImageExport=XML Image Export');
  535. this.editorUi.actions.addAction('testXmlImageExport', mxUtils.bind(this, function()
  536. {
  537. var bg = '#ffffff';
  538. var scale = 1;
  539. var b = 1;
  540. var imgExport = new mxImageExport();
  541. var bounds = graph.getGraphBounds();
  542. var vs = graph.view.scale;
  543. // New image export
  544. var xmlDoc = mxUtils.createXmlDocument();
  545. var root = xmlDoc.createElement('output');
  546. xmlDoc.appendChild(root);
  547. // Renders graph. Offset will be multiplied with state's scale when painting state.
  548. var xmlCanvas = new mxXmlCanvas2D(root);
  549. xmlCanvas.translate(Math.floor((b / scale - bounds.x) / vs), Math.floor((b / scale - bounds.y) / vs));
  550. xmlCanvas.scale(scale / vs);
  551. var stateCounter = 0;
  552. var canvasSave = xmlCanvas.save;
  553. xmlCanvas.save = function()
  554. {
  555. stateCounter++;
  556. canvasSave.apply(this, arguments);
  557. };
  558. var canvasRestore = xmlCanvas.restore;
  559. xmlCanvas.restore = function()
  560. {
  561. stateCounter--;
  562. canvasRestore.apply(this, arguments);
  563. };
  564. var exportDrawShape = imgExport.drawShape;
  565. imgExport.drawShape = function(state)
  566. {
  567. mxLog.debug('entering shape', state, stateCounter);
  568. exportDrawShape.apply(this, arguments);
  569. mxLog.debug('leaving shape', state, stateCounter);
  570. };
  571. imgExport.drawState(graph.getView().getState(graph.model.root), xmlCanvas);
  572. // Puts request data together
  573. var w = Math.ceil(bounds.width * scale / vs + 2 * b);
  574. var h = Math.ceil(bounds.height * scale / vs + 2 * b);
  575. mxLog.show();
  576. mxLog.debug(mxUtils.getXml(root));
  577. mxLog.debug('stateCounter', stateCounter);
  578. }));
  579. this.addMenuItems(menu, ['testXmlImageExport'], parent);
  580. mxResources.parse('animation=Animation');
  581. this.editorUi.actions.addAction('animation', mxUtils.bind(this, function()
  582. {
  583. if (this.animationWindow == null)
  584. {
  585. // LATER: Check outline window for initial placement
  586. this.animationWindow = new AnimationWindow(this.editorUi, (document.body.offsetWidth - 480) / 2,
  587. 120, 640, 480);
  588. this.animationWindow.window.setVisible(true);
  589. }
  590. else
  591. {
  592. this.animationWindow.window.setVisible(!this.animationWindow.window.isVisible());
  593. }
  594. }));
  595. this.addMenuItems(menu, ['animation'], parent);
  596. mxResources.parse('testShowRtModel=Show RT model');
  597. mxResources.parse('testDebugRtModel=Debug RT model');
  598. mxResources.parse('testDownloadRtModel=Download RT model');
  599. this.editorUi.actions.addAction('testShowRtModel', mxUtils.bind(this, function()
  600. {
  601. if (this.editorUi.getCurrentFile() != null && this.editorUi.getCurrentFile().realtime != null)
  602. {
  603. console.log('bytesUsed', this.editorUi.getCurrentFile().realtime.rtModel.bytesUsed);
  604. console.log('root', this.editorUi.getCurrentFile().realtime.dumpRoot());
  605. this.editorUi.getCurrentFile().realtime.check();
  606. }
  607. }));
  608. this.editorUi.actions.addAction('testDebugRtModel', mxUtils.bind(this, function()
  609. {
  610. gapi.drive.realtime.debug();
  611. }));
  612. this.editorUi.actions.addAction('testDownloadRtModel', mxUtils.bind(this, function()
  613. {
  614. var file = this.editorUi.getCurrentFile();
  615. if (file != null && file.realtime != null &&
  616. editorUi.spinner.spin(document.body, mxResources.get('export')))
  617. {
  618. // LATER: Download full model dump with history
  619. var req = new mxXmlRequest('https://www.googleapis.com/drive/v2/files/' +
  620. file.getHash().substring(1) + '/realtime', null, 'GET');
  621. // Adds auth token
  622. req.setRequestHeaders = function(request)
  623. {
  624. mxXmlRequest.prototype.setRequestHeaders.apply(this, arguments);
  625. var token = gapi.auth.getToken().access_token;
  626. request.setRequestHeader('authorization', 'Bearer ' + token);
  627. };
  628. req.send(function(req)
  629. {
  630. editorUi.spinner.stop();
  631. if (req.getStatus() == 200)
  632. {
  633. editorUi.saveLocalFile(req.getText(), 'realtime.txt', 'text/plain');
  634. }
  635. });
  636. }
  637. }));
  638. if (this.editorUi.getCurrentFile() != null && this.editorUi.getCurrentFile().realtime != null)
  639. {
  640. this.addMenuItems(menu, ['-', 'testShowRtModel', 'testDebugRtModel', 'testDownloadRtModel'], parent);
  641. }
  642. mxResources.parse('testShowConsole=Show Console');
  643. this.editorUi.actions.addAction('testShowConsole', function()
  644. {
  645. if (!mxLog.isVisible())
  646. {
  647. mxLog.show();
  648. }
  649. else
  650. {
  651. mxLog.window.fit();
  652. }
  653. mxLog.window.div.style.zIndex = mxPopupMenu.prototype.zIndex - 1;
  654. });
  655. this.addMenuItems(menu, ['-', 'testShowConsole']);
  656. }
  657. })));
  658. editorUi.actions.addAction('shapes...', function()
  659. {
  660. if (mxClient.IS_CHROMEAPP || !editorUi.isOffline())
  661. {
  662. editorUi.showDialog(new MoreShapesDialog(editorUi, true).container, 640, (isLocalStorage) ?
  663. ((mxClient.IS_IOS) ? 480 : 460) : 440, true, true);
  664. }
  665. else
  666. {
  667. editorUi.showDialog(new MoreShapesDialog(editorUi, false).container, 360, (isLocalStorage) ?
  668. ((mxClient.IS_IOS) ? 300 : 280) : 260, true, true);
  669. }
  670. });
  671. editorUi.actions.addAction('createShape...', function()
  672. {
  673. var file = editorUi.getCurrentFile();
  674. if (urlParams['embed'] == '1' || (file != null && file.isEditable()))
  675. {
  676. var cell = new mxCell('', new mxGeometry(0, 0, 120, 120), editorUi.defaultCustomShapeStyle);
  677. cell.vertex = true;
  678. var dlg = new EditShapeDialog(editorUi, cell, mxResources.get('editShape') + ':', 630, 400);
  679. editorUi.showDialog(dlg.container, 640, 480, true, false);
  680. dlg.init();
  681. }
  682. });
  683. editorUi.actions.put('embedHtml', new Action(mxResources.get('html') + '...', function()
  684. {
  685. var dlg = new EmbedHtmlDialog(editorUi);
  686. editorUi.showDialog(dlg.container, 550, 400, true, true);
  687. dlg.init();
  688. }));
  689. editorUi.actions.put('embedSvg', new Action(mxResources.get('formatSvg') + '...', function()
  690. {
  691. var dlg = new EmbedSvgDialog(editorUi);
  692. editorUi.showDialog(dlg.container, 550, 400, true, true);
  693. dlg.init();
  694. }));
  695. editorUi.actions.put('embedIframe', new Action(mxResources.get('iframe') + '...', function()
  696. {
  697. var dlg = new IframeDialog(editorUi);
  698. editorUi.showDialog(dlg.container, 420, 210, true, true);
  699. dlg.init();
  700. }));
  701. editorUi.actions.put('publishLink', new Action(mxResources.get('link') + '...', function()
  702. {
  703. var dlg = new IframeDialog(editorUi, false, true);
  704. editorUi.showDialog(dlg.container, 420, 210, true, true);
  705. dlg.init();
  706. }));
  707. editorUi.actions.put('embedImage', new Action(mxResources.get('image') + '...', function()
  708. {
  709. var dlg = new EmbedSvgDialog(editorUi, true);
  710. editorUi.showDialog(dlg.container, 550, 400, true, true);
  711. dlg.init();
  712. }));
  713. editorUi.actions.put('liveImage', new Action('Live image...', function()
  714. {
  715. var dlg = new IframeDialog(editorUi, true);
  716. editorUi.showDialog(dlg.container, 420, 180, true, true);
  717. dlg.init();
  718. }));
  719. editorUi.actions.addAction('googleDocs...', function()
  720. {
  721. window.open('http://docsaddon.draw.io');
  722. });
  723. editorUi.actions.addAction('googleSites...', function()
  724. {
  725. var dlg = new GoogleSitesDialog(editorUi);
  726. editorUi.showDialog(dlg.container, 420, 256, true, true);
  727. dlg.init();
  728. });
  729. // Adds plugins menu item in file menu only if localStorage is available for
  730. // storing the plugins.
  731. if (isLocalStorage || mxClient.IS_CHROMEAPP)
  732. {
  733. var action = editorUi.actions.addAction('scratchpad', function()
  734. {
  735. editorUi.toggleScratchpad();
  736. });
  737. action.setToggleAction(true);
  738. action.setSelectedCallback(function() { return editorUi.scratchpad != null; });
  739. editorUi.actions.addAction('plugins...', function()
  740. {
  741. editorUi.showDialog(new PluginsDialog(editorUi).container, 360, 156, true, false);
  742. });
  743. }
  744. var action = editorUi.actions.addAction('search', function()
  745. {
  746. var visible = editorUi.sidebar.isEntryVisible('search');
  747. editorUi.sidebar.showPalette('search', !visible);
  748. if (isLocalStorage)
  749. {
  750. mxSettings.settings.search = !visible;
  751. mxSettings.save();
  752. }
  753. });
  754. action.setToggleAction(true);
  755. action.setSelectedCallback(function() { return editorUi.sidebar.isEntryVisible('search'); });
  756. if (urlParams['embed'] == '1')
  757. {
  758. editorUi.actions.get('save').funct = function(exit)
  759. {
  760. if (graph.isEditing())
  761. {
  762. graph.stopEditing();
  763. }
  764. var data = mxUtils.getXml(editorUi.editor.getGraphXml());
  765. if (urlParams['proto'] == 'json')
  766. {
  767. var msg = editorUi.createLoadMessage('save');
  768. msg.xml = data;
  769. if (exit)
  770. {
  771. msg.exit = true;
  772. }
  773. data = JSON.stringify(msg);
  774. }
  775. var parent = window.opener || window.parent;
  776. parent.postMessage(data, '*');
  777. if (urlParams['modified'] != '0')
  778. {
  779. editorUi.editor.modified = false;
  780. }
  781. };
  782. editorUi.actions.addAction('saveAndExit', function()
  783. {
  784. editorUi.actions.get('save').funct(true);
  785. });
  786. editorUi.actions.addAction('exit', function()
  787. {
  788. var fn = function()
  789. {
  790. var msg = (urlParams['proto'] == 'json') ? JSON.stringify({event: 'exit',
  791. modified: editorUi.editor.modified}) : '';
  792. var parent = window.opener || window.parent;
  793. parent.postMessage(msg, '*');
  794. }
  795. if (!editorUi.editor.modified)
  796. {
  797. fn();
  798. }
  799. else
  800. {
  801. editorUi.confirm(mxResources.get('allChangesLost'), fn);
  802. }
  803. });
  804. }
  805. this.put('exportAs', new Menu(mxUtils.bind(this, function(menu, parent)
  806. {
  807. if (editorUi.isExportToCanvas())
  808. {
  809. menu.addItem(mxResources.get('image') + '...', null, mxUtils.bind(this, function()
  810. {
  811. editorUi.showExportDialog(false, mxResources.get('export'),
  812. 'https://support.draw.io/display/DO/Exporting+Files',
  813. mxUtils.bind(this, function(scale, transparentBackground, ignoreSelection, addShadow, editable)
  814. {
  815. var val = parseInt(scale);
  816. if (!isNaN(val) && val > 0)
  817. {
  818. this.editorUi.exportImage(val / 100, transparentBackground, ignoreSelection, addShadow, editable);
  819. }
  820. }));
  821. }), parent);
  822. }
  823. // Disabled for standalone mode in iOS because new tab cannot be closed
  824. else if (!editorUi.isOffline() && (!mxClient.IS_IOS || !navigator.standalone))
  825. {
  826. menu.addItem(mxResources.get('image') + '...', null, mxUtils.bind(this, function()
  827. {
  828. editorUi.showRemoteExportDialog(mxResources.get('export'), null, mxUtils.bind(this, function(ignoreSelection, editable)
  829. {
  830. this.editorUi.downloadFile((editable) ? 'xmlpng' : 'png', null, null, ignoreSelection);
  831. }));
  832. }), parent);
  833. }
  834. menu.addItem(mxResources.get('formatSvg') + '...', null, mxUtils.bind(this, function()
  835. {
  836. editorUi.showExportDialog(true, mxResources.get('export'),
  837. 'https://support.draw.io/display/DO/Exporting+Files',
  838. mxUtils.bind(this, function(scale, transparentBackground, ignoreSelection, addShadow, editable, embedImages)
  839. {
  840. var val = parseInt(scale);
  841. if (!isNaN(val) && val > 0)
  842. {
  843. this.editorUi.exportSvg(val / 100, transparentBackground, ignoreSelection, addShadow, editable, embedImages);
  844. }
  845. }));
  846. }), parent);
  847. menu.addSeparator(parent);
  848. menu.addItem(mxResources.get('formatHtmlEmbedded') + '...', null, mxUtils.bind(this, function()
  849. {
  850. this.editorUi.downloadFile('html');
  851. }), parent);
  852. // Redirects export to PDF to print in Chrome App
  853. if (mxClient.IS_CHROMEAPP)
  854. {
  855. menu.addItem(mxResources.get('formatPdf') + '...', null, this.editorUi.actions.get('print').funct, parent);
  856. }
  857. // Disabled for standalone mode in iOS because new tab cannot be closed
  858. else if (!editorUi.isOffline() && (!mxClient.IS_IOS || !navigator.standalone))
  859. {
  860. menu.addItem(mxResources.get('formatPdf') + '...', null, mxUtils.bind(this, function()
  861. {
  862. var content = document.createElement('div');
  863. content.style.padding = '6px';
  864. var cb2 = document.createElement('input');
  865. cb2.style.marginRight = '8px';
  866. cb2.setAttribute('type', 'checkbox');
  867. if (graph.isSelectionEmpty())
  868. {
  869. cb2.setAttribute('disabled', 'disabled');
  870. }
  871. content.appendChild(cb2);
  872. mxUtils.write(content, mxResources.get('selectionOnly'));
  873. mxUtils.br(content);
  874. var cb = document.createElement('input');
  875. cb.setAttribute('type', 'checkbox');
  876. cb.style.marginTop = '16px';
  877. cb.style.marginRight = '8px';
  878. if (!graph.pageVisible)
  879. {
  880. cb.setAttribute('checked', 'checked');
  881. cb.defaultChecked = true;
  882. }
  883. content.appendChild(cb);
  884. mxUtils.write(content, mxResources.get('crop'));
  885. var dlg = new CustomDialog(editorUi, content, mxUtils.bind(this, function()
  886. {
  887. var prev = graph.pageVisible;
  888. graph.pageVisible = !cb.checked;
  889. this.editorUi.downloadFile('pdf', null, null, !cb2.checked);
  890. graph.pageVisible = prev;
  891. }), null, mxResources.get('export'));
  892. this.editorUi.showDialog(dlg.container, 300, 120, true, true);
  893. }), parent);
  894. }
  895. menu.addSeparator(parent);
  896. menu.addItem(mxResources.get('formatXml') + '...', null, mxUtils.bind(this, function()
  897. {
  898. var noPages = editorUi.pages == null || editorUi.pages.length <= 1;
  899. var content = document.createElement('div');
  900. content.style.padding = '6px';
  901. var cb2 = document.createElement('input');
  902. cb2.style.marginRight = '8px';
  903. cb2.setAttribute('type', 'checkbox');
  904. if (graph.isSelectionEmpty())
  905. {
  906. cb2.setAttribute('disabled', 'disabled');
  907. }
  908. content.appendChild(cb2);
  909. mxUtils.write(content, mxResources.get('selectionOnly'));
  910. var cb = document.createElement('input');
  911. cb.setAttribute('type', 'checkbox');
  912. cb.setAttribute('checked', 'checked');
  913. cb.defaultChecked = true;
  914. cb.style.marginRight = '8px';
  915. cb.style.marginTop = '16px';
  916. mxUtils.br(content);
  917. content.appendChild(cb);
  918. if (noPages)
  919. {
  920. mxUtils.write(content, mxResources.get('compressed'));
  921. }
  922. else
  923. {
  924. mxUtils.write(content, mxResources.get('allPages'));
  925. }
  926. var dlg = new CustomDialog(editorUi, content, mxUtils.bind(this, function()
  927. {
  928. editorUi.downloadFile('xml', (noPages) ? !cb.checked : null, null, !cb2.checked,
  929. (!noPages) ? !cb.checked : null);
  930. }), null, mxResources.get('export'));
  931. editorUi.showDialog(dlg.container, 300, 120, true, true);
  932. }), parent);
  933. if (!editorUi.isOffline())
  934. {
  935. menu.addSeparator(parent);
  936. this.addMenuItem(menu, 'export', parent).firstChild.nextSibling.innerHTML = mxResources.get('advanced') + '...';
  937. }
  938. })));
  939. this.editorUi.actions.addAction('chatWindowTitle...', mxUtils.bind(this.editorUi, this.editorUi.toggleChat));
  940. this.put('importFrom', new Menu(function(menu, parent)
  941. {
  942. function importFile(device)
  943. {
  944. if (device && Graph.fileSupport && !mxClient.IS_IE && !mxClient.IS_IE11)
  945. {
  946. var input = document.createElement('input');
  947. input.setAttribute('type', 'file');
  948. mxEvent.addListener(input, 'change', function()
  949. {
  950. if (input.files != null)
  951. {
  952. // Using null for position will disable crop of input file
  953. editorUi.importFiles(input.files, null, null, editorUi.maxImageSize);
  954. }
  955. });
  956. input.click();
  957. }
  958. else
  959. {
  960. window.openNew = false;
  961. window.openKey = 'import';
  962. var prevValue = Editor.useLocalStorage;
  963. Editor.useLocalStorage = !device;
  964. // Closes dialog after open
  965. window.openFile = new OpenFile(function(cancel)
  966. {
  967. editorUi.hideDialog(cancel);
  968. });
  969. window.openFile.setConsumer(function(xml, filename)
  970. {
  971. graph.setSelectionCells(editorUi.importXml(xml));
  972. });
  973. // Removes openFile if dialog is closed
  974. editorUi.showDialog(new OpenDialog(editorUi).container, 360, 220, true, true, function()
  975. {
  976. window.openFile = null;
  977. });
  978. // Extends dialog close to show splash screen
  979. var dlg = editorUi.dialog;
  980. var dlgClose = dlg.close;
  981. editorUi.dialog.close = function(cancel)
  982. {
  983. Editor.useLocalStorage = prevValue;
  984. dlgClose.apply(dlg, arguments);
  985. if (cancel && editorUi.getCurrentFile() == null && urlParams['embed'] != '1')
  986. {
  987. editorUi.showSplash();
  988. }
  989. };
  990. }
  991. };
  992. var doImportFile = mxUtils.bind(this, function(data, mime, filename)
  993. {
  994. if (mime == 'image/png')
  995. {
  996. editorUi.loadImage(data, mxUtils.bind(this, function(img)
  997. {
  998. editorUi.resizeImage(img, data, mxUtils.bind(this, function(data2, w2, h2)
  999. {
  1000. var s = Math.min(1, Math.min(editorUi.maxImageSize / w2, editorUi.maxImageSize / h2));
  1001. editorUi.importFile(data, mime, 0, 0, Math.round(w2 * s), Math.round(h2 * s), filename, function(cells)
  1002. {
  1003. editorUi.spinner.stop();
  1004. graph.setSelectionCells(cells);
  1005. });
  1006. }), true);
  1007. }));
  1008. }
  1009. else
  1010. {
  1011. editorUi.importFile(data, mime, 0, 0, 0, 0, filename, function(cells)
  1012. {
  1013. editorUi.spinner.stop();
  1014. graph.setSelectionCells(cells);
  1015. });
  1016. }
  1017. });
  1018. function pickFileFromService(service)
  1019. {
  1020. // Drive requires special arguments for libraries and bypassing realtime
  1021. service.pickFile(function(id)
  1022. {
  1023. if (editorUi.spinner.spin(document.body, mxResources.get('loading')))
  1024. {
  1025. if (service == editorUi.dropbox)
  1026. {
  1027. var mime = (/(\.png)$/i.test(id)) ? 'image/png' : 'text/xml';
  1028. editorUi.loadUrl(id, function(data)
  1029. {
  1030. doImportFile(data, mime, id);
  1031. },
  1032. function(resp)
  1033. {
  1034. editorUi.handleError(resp, (resp != null) ? mxResources.get('errorLoadingFile') : null);
  1035. }, mime == 'image/png');
  1036. }
  1037. else
  1038. {
  1039. // NOTE The third argument in getFile says denyConvert to match
  1040. // the existing signature in the original DriveClient which has
  1041. // as slightly different semantic, but works the same way.
  1042. service.getFile(id, function(file)
  1043. {
  1044. var mime = (/(\.png)$/i.test(file.getTitle())) ? 'image/png' : 'text/xml';
  1045. doImportFile(file.getData(), mime, file.getTitle());
  1046. },
  1047. function(resp)
  1048. {
  1049. editorUi.handleError(resp, (resp != null) ? mxResources.get('errorLoadingFile') : null);
  1050. }, true);
  1051. }
  1052. }
  1053. }, true);
  1054. };
  1055. if (editorUi.drive != null)
  1056. {
  1057. // Requires special arguments for libraries and realtime
  1058. menu.addItem(mxResources.get('googleDrive') + '...', null, function()
  1059. {
  1060. pickFileFromService(editorUi.drive);
  1061. }, parent);
  1062. }
  1063. else if (googleEnabled)
  1064. {
  1065. menu.addItem(mxResources.get('googleDrive') + ' (' + mxResources.get('loading') + '...)', null, function()
  1066. {
  1067. // do nothing
  1068. }, parent, null, false);
  1069. }
  1070. if (editorUi.dropbox != null)
  1071. {
  1072. menu.addItem(mxResources.get('dropbox') + '...', null, function()
  1073. {
  1074. pickFileFromService(editorUi.dropbox);
  1075. }, parent);
  1076. }
  1077. else if (dropboxEnabled)
  1078. {
  1079. menu.addItem(mxResources.get('dropbox') + ' (' + mxResources.get('loading') + '...)', null, function()
  1080. {
  1081. // do nothing
  1082. }, parent, null, false);
  1083. }
  1084. if (editorUi.oneDrive != null)
  1085. {
  1086. menu.addItem(mxResources.get('oneDrive') + '...', null, function()
  1087. {
  1088. pickFileFromService(editorUi.oneDrive);
  1089. }, parent);
  1090. }
  1091. else if (oneDriveEnabled)
  1092. {
  1093. menu.addItem(mxResources.get('oneDrive') + ' (' + mxResources.get('loading') + '...)', null, function()
  1094. {
  1095. // do nothing
  1096. }, parent, null, false);
  1097. }
  1098. menu.addSeparator(parent);
  1099. if (isLocalStorage && urlParams['browser'] != '0')
  1100. {
  1101. menu.addItem(mxResources.get('browser') + '...', null, function()
  1102. {
  1103. importFile(false);
  1104. }, parent);
  1105. }
  1106. if (!mxClient.IS_IOS)
  1107. {
  1108. menu.addItem(mxResources.get('device') + '...', null, function()
  1109. {
  1110. importFile(true);
  1111. }, parent);
  1112. }
  1113. if (!editorUi.isOffline())
  1114. {
  1115. menu.addSeparator(parent);
  1116. menu.addItem(mxResources.get('url') + '...', null, function()
  1117. {
  1118. var dlg = new FilenameDialog(editorUi, '', mxResources.get('import'), function(fileUrl)
  1119. {
  1120. if (fileUrl != null && fileUrl.length > 0 && editorUi.spinner.spin(document.body, mxResources.get('loading')))
  1121. {
  1122. var mime = (/(\.png)($|\?)/i.test(fileUrl)) ? 'image/png' : 'text/xml';
  1123. // Uses proxy to avoid CORS issues
  1124. editorUi.loadUrl(PROXY_URL + '?url=' + encodeURIComponent(fileUrl), function(data)
  1125. {
  1126. doImportFile(data, mime, fileUrl);
  1127. },
  1128. function ()
  1129. {
  1130. editorUi.spinner.stop();
  1131. editorUi.handleError(null, mxResources.get('errorLoadingFile'));
  1132. }, mime == 'image/png');
  1133. }
  1134. }, mxResources.get('url'));
  1135. editorUi.showDialog(dlg.container, 300, 80, true, true);
  1136. dlg.init();
  1137. }, parent);
  1138. }
  1139. })).isEnabled = isGraphEnabled;
  1140. this.put('theme', new Menu(mxUtils.bind(this, function(menu, parent)
  1141. {
  1142. var item = menu.addItem(mxResources.get('kennedy'), null, function()
  1143. {
  1144. mxSettings.setUi('');
  1145. mxSettings.save();
  1146. editorUi.alert(mxResources.get('restartForChangeRequired'));
  1147. }, parent);
  1148. if (uiTheme != 'atlas')
  1149. {
  1150. menu.addCheckmark(item, Editor.checkmarkImage);
  1151. }
  1152. item = menu.addItem(mxResources.get('atlas'), null, function()
  1153. {
  1154. mxSettings.setUi('atlas');
  1155. mxSettings.save();
  1156. editorUi.alert(mxResources.get('restartForChangeRequired'));
  1157. }, parent);
  1158. if (uiTheme == 'atlas')
  1159. {
  1160. menu.addCheckmark(item, Editor.checkmarkImage);
  1161. }
  1162. })));
  1163. this.editorUi.actions.addAction('rename...', mxUtils.bind(this, function()
  1164. {
  1165. var file = this.editorUi.getCurrentFile();
  1166. if (file != null)
  1167. {
  1168. var filename = (file.getTitle() != null) ? file.getTitle() : this.editorUi.defaultFilename;
  1169. var dlg = new FilenameDialog(this.editorUi, filename, mxResources.get('rename'), mxUtils.bind(this, function(title)
  1170. {
  1171. if (title != null && title.length > 0 && file != null && this.editorUi.spinner.spin(document.body, mxResources.get('renaming')))
  1172. {
  1173. // Delete old file, save new file in dropbox if autosize is enabled
  1174. file.rename(title, mxUtils.bind(this, function(resp)
  1175. {
  1176. this.editorUi.spinner.stop();
  1177. }),
  1178. mxUtils.bind(this, function(resp)
  1179. {
  1180. this.editorUi.handleError(resp, (resp != null) ? mxResources.get('errorRenamingFile') : null);
  1181. }));
  1182. }
  1183. }), (file.constructor == DriveFile || file.constructor == StorageFile) ?
  1184. mxResources.get('diagramName') : null, function(name)
  1185. {
  1186. if (name != null && name.length > 0)
  1187. {
  1188. return true;
  1189. }
  1190. editorUi.showError(mxResources.get('error'), mxResources.get('invalidName'), mxResources.get('ok'));
  1191. return false;
  1192. });
  1193. this.editorUi.showDialog(dlg.container, 300, 80, true, true);
  1194. dlg.init();
  1195. }
  1196. })).isEnabled = isGraphEnabled;
  1197. editorUi.actions.addAction('makeCopy...', mxUtils.bind(this, function()
  1198. {
  1199. var file = editorUi.getCurrentFile();
  1200. if (file != null)
  1201. {
  1202. var title = (file.getTitle() != null) ? file.getTitle() : editorUi.defaultFilename;
  1203. // Handles extension
  1204. var extension = '';
  1205. var dot = title.lastIndexOf('.');
  1206. if (dot >= 0)
  1207. {
  1208. extension = title.substring(dot);
  1209. title = title.substring(0, dot);
  1210. }
  1211. title = mxResources.get('copyOf', [title]) + extension;
  1212. if (file.constructor == DriveFile)
  1213. {
  1214. var dlg = new CreateDialog(editorUi, title, mxUtils.bind(this, function(newTitle, mode)
  1215. {
  1216. // Mode is "download" if Create button is pressed, means use Google Drive
  1217. if (mode == 'download')
  1218. {
  1219. mode = App.MODE_GOOGLE;
  1220. }
  1221. if (newTitle != null && newTitle.length > 0)
  1222. {
  1223. if (mode == App.MODE_GOOGLE)
  1224. {
  1225. if (editorUi.spinner.spin(document.body, mxResources.get('saving')))
  1226. {
  1227. // Makes sure the latest XML is in the file
  1228. file.save(false, mxUtils.bind(this, function()
  1229. {
  1230. // Saveas does not update the file descriptor in Google Drive
  1231. file.saveAs(newTitle, mxUtils.bind(this, function(resp)
  1232. {
  1233. editorUi.spinner.stop();
  1234. var url = editorUi.getUrl();
  1235. window.openWindow(url + '#G' + resp.id, null, mxUtils.bind(this, function()
  1236. {
  1237. window.location.hash = 'G' + resp.id;
  1238. }));
  1239. }), mxUtils.bind(this, function(resp)
  1240. {
  1241. editorUi.handleError(resp);
  1242. }));
  1243. }), mxUtils.bind(this, function(resp)
  1244. {
  1245. editorUi.handleError(resp);
  1246. }));
  1247. }
  1248. }
  1249. else
  1250. {
  1251. this.editorUi.createFile(newTitle, this.editorUi.getFileData(true), null, mode);
  1252. }
  1253. }
  1254. }), mxUtils.bind(this, function()
  1255. {
  1256. editorUi.hideDialog();
  1257. }), mxResources.get('makeCopy'), mxResources.get('create'), null,
  1258. null, null, null, true);
  1259. editorUi.showDialog(dlg.container, 420, 380, true, true);
  1260. dlg.init();
  1261. }
  1262. else
  1263. {
  1264. // Creates a copy with no predefined storage
  1265. editorUi.editor.editAsNew(editorUi.getEditBlankXml(), title);
  1266. }
  1267. }
  1268. }));
  1269. editorUi.actions.addAction('moveToFolder...', mxUtils.bind(this, function()
  1270. {
  1271. var file = editorUi.getCurrentFile();
  1272. if (file.getMode() == App.MODE_GOOGLE || file.getMode() == App.MODE_ONEDRIVE)
  1273. {
  1274. editorUi.pickFolder(file.getMode(), mxUtils.bind(this, function(folderId)
  1275. {
  1276. if (editorUi.spinner.spin(document.body, mxResources.get('moving')))
  1277. {
  1278. file.move(folderId, mxUtils.bind(this, function(resp)
  1279. {
  1280. editorUi.spinner.stop();
  1281. }), mxUtils.bind(this, function(resp)
  1282. {
  1283. editorUi.handleError(resp);
  1284. }));
  1285. }
  1286. }));
  1287. }
  1288. }));
  1289. editorUi.actions.addAction('imgur...', mxUtils.bind(this, function()
  1290. {
  1291. editorUi.publishImage(mxUtils.bind(editorUi, editorUi.uploadToImgur), function(imgurId)
  1292. {
  1293. window.open('https://imgur.com/' + imgurId);
  1294. });
  1295. }));
  1296. editorUi.actions.addAction('facebook...', mxUtils.bind(this, function()
  1297. {
  1298. editorUi.publishImage(mxUtils.bind(editorUi, editorUi.uploadToImgur), function(imgurId)
  1299. {
  1300. window.open('https://www.facebook.com/sharer.php?p[url]=' + encodeURIComponent('https://imgur.com/' + imgurId) +
  1301. '&p[images][0]=' + encodeURIComponent(imgurId + '.png'));
  1302. });
  1303. }));
  1304. editorUi.actions.addAction('twitter...', mxUtils.bind(this, function()
  1305. {
  1306. editorUi.publishImage(mxUtils.bind(editorUi, editorUi.uploadToImgur), function(imgurId)
  1307. {
  1308. window.open('https://twitter.com/intent/tweet?text=' +
  1309. encodeURIComponent('Check out the diagram I made with draw.io') +
  1310. '&via=drawio&hashtags=madewithdrawio&url=' +
  1311. encodeURIComponent('https://imgur.com/' + imgurId));
  1312. });
  1313. }));
  1314. editorUi.actions.addAction('github...', mxUtils.bind(this, function()
  1315. {
  1316. editorUi.publishImage(mxUtils.bind(editorUi, editorUi.uploadToGithub));
  1317. }));
  1318. this.put('publish', new Menu(mxUtils.bind(this, function(menu, parent)
  1319. {
  1320. // Disable publish in IE9- due to CORS problem when getting image from server
  1321. // which requires cross-domain XHR but XDomainRequest has no custom headers
  1322. // to set content type to form-encoded-data which is needed for the export.
  1323. if (document.documentMode == null || document.documentMode >= 10)
  1324. {
  1325. if (typeof XMLHttpRequest !== 'undefined')
  1326. {
  1327. this.addMenuItems(menu, ['github'], parent);
  1328. }
  1329. this.addMenuItems(menu, ['twitter'], parent);
  1330. this.addMenuItems(menu, ['facebook'], parent);
  1331. this.addMenuItems(menu, ['imgur'], parent);
  1332. }
  1333. if (!navigator.standalone && !editorUi.isOffline())
  1334. {
  1335. this.addMenuItems(menu, ['publishLink'], parent);
  1336. }
  1337. })));
  1338. editorUi.actions.put('offline', new Action(mxResources.get('offline') + '...', function()
  1339. {
  1340. window.open('http://www.draw.io/app')
  1341. }));
  1342. editorUi.actions.put('chromeApp', new Action(mxResources.get('chromeApp') + '...', function()
  1343. {
  1344. window.open('https://chrome.google.com/webstore/detail/drawio-desktop/pebppomjfocnoigkeepgbmcifnnlndla')
  1345. }));
  1346. this.editorUi.actions.addAction('share...', mxUtils.bind(this, function()
  1347. {
  1348. var file = this.editorUi.getCurrentFile();
  1349. if (file != null)
  1350. {
  1351. this.editorUi.drive.showPermissions(file.getId());
  1352. }
  1353. }));
  1354. this.put('embed', new Menu(mxUtils.bind(this, function(menu, parent)
  1355. {
  1356. if (urlParams['test'] == '1')
  1357. {
  1358. this.addMenuItems(menu, ['liveImage', '-'], parent);
  1359. }
  1360. this.addMenuItems(menu, ['embedImage', 'embedSvg', '-', 'embedHtml'], parent);
  1361. if (!navigator.standalone && !editorUi.isOffline())
  1362. {
  1363. this.addMenuItems(menu, ['embedIframe'], parent);
  1364. }
  1365. if (!editorUi.isOffline())
  1366. {
  1367. this.addMenuItems(menu, ['-', 'googleSites', 'googleDocs'], parent);
  1368. }
  1369. })));
  1370. // Overrides arrange menu to add insert submenu
  1371. this.put('arrange', new Menu(mxUtils.bind(this, function(menu, parent)
  1372. {
  1373. this.addMenuItems(menu, ['toFront', 'toBack', '-'], parent);
  1374. this.addSubmenu('direction', menu, parent);
  1375. this.addMenuItems(menu, ['turn', '-'], parent);
  1376. this.addSubmenu('align', menu, parent);
  1377. this.addSubmenu('distribute', menu, parent);
  1378. menu.addSeparator(parent);
  1379. this.addSubmenu('navigation', menu, parent);
  1380. this.addSubmenu('insert', menu, parent);
  1381. this.addSubmenu('layout', menu, parent);
  1382. this.addMenuItems(menu, ['-', 'group', 'ungroup', 'removeFromGroup', '-', 'editGeometry', 'clearWaypoints', 'autosize'], parent);
  1383. })));
  1384. var methods = ['horizontalFlow', 'verticalFlow', '-', 'horizontalTree', 'verticalTree', '-', 'organic', 'circle', '-', 'fromText'];
  1385. var addInsertItem = function(menu, parent, title, method)
  1386. {
  1387. menu.addItem(title, null, mxUtils.bind(this, function()
  1388. {
  1389. if (method == 'fromText')
  1390. {
  1391. var dlg = new ParseDialog(editorUi, title);
  1392. editorUi.showDialog(dlg.container, 620, 420, true, false);
  1393. editorUi.dialog.container.style.overflow = 'auto';
  1394. dlg.init();
  1395. }
  1396. else
  1397. {
  1398. var dlg = new CreateGraphDialog(editorUi, title, method);
  1399. editorUi.showDialog(dlg.container, 620, 420, true, false);
  1400. // Executed after dialog is added to dom
  1401. dlg.init();
  1402. }
  1403. }), parent);
  1404. };
  1405. editorUi.actions.addAction('insertText', function()
  1406. {
  1407. if (graph.isEnabled() && !graph.isCellLocked(graph.getDefaultParent()))
  1408. {
  1409. var pt = graph.getInsertPoint();
  1410. var cell = new mxCell('Text', new mxGeometry(pt.x, pt.y, 40, 20),
  1411. 'text;html=1;resizable=0;autosize=1;align=left;verticalAlign=top;spacingTop=-4;points=[];');
  1412. cell.vertex = true;
  1413. graph.startEditingAtCell(graph.addCell(cell));
  1414. }
  1415. }, null, null, 'Ctrl+Shift+X').isEnabled = isGraphEnabled;
  1416. editorUi.actions.addAction('insertRectangle', function()
  1417. {
  1418. if (graph.isEnabled() && !graph.isCellLocked(graph.getDefaultParent()))
  1419. {
  1420. var pt = graph.getInsertPoint();
  1421. var cell = new mxCell('', new mxGeometry(pt.x, pt.y, 120, 60), 'whiteSpace=wrap;html=1;');
  1422. cell.vertex = true;
  1423. graph.setSelectionCell(graph.addCell(cell));
  1424. }
  1425. }, null, null, 'Ctrl+K').isEnabled = isGraphEnabled;
  1426. editorUi.actions.addAction('insertEllipse', function()
  1427. {
  1428. if (graph.isEnabled() && !graph.isCellLocked(graph.getDefaultParent()))
  1429. {
  1430. var pt = graph.getInsertPoint();
  1431. var cell = new mxCell('', new mxGeometry(pt.x, pt.y, 80, 80), 'ellipse;whiteSpace=wrap;html=1;');
  1432. cell.vertex = true;
  1433. graph.setSelectionCell(graph.addCell(cell));
  1434. }
  1435. }, null, null, 'Ctrl+Shift+K').isEnabled = isGraphEnabled;
  1436. this.put('insert', new Menu(mxUtils.bind(this, function(menu, parent)
  1437. {
  1438. this.addMenuItems(menu, ['insertText', 'insertRectangle', 'insertEllipse', '-', 'insertLink', 'insertImage'], parent);
  1439. menu.addSeparator(parent);
  1440. for (var i = 0; i < methods.length; i++)
  1441. {
  1442. if (methods[i] == '-')
  1443. {
  1444. menu.addSeparator(parent);
  1445. }
  1446. else
  1447. {
  1448. addInsertItem(menu, parent, mxResources.get(methods[i]), methods[i]);
  1449. }
  1450. }
  1451. })));
  1452. this.put('openRecent', new Menu(function(menu, parent)
  1453. {
  1454. var recent = editorUi.getRecent();
  1455. var count = 0;
  1456. if (recent != null)
  1457. {
  1458. for (var i = 0; i < recent.length; i++)
  1459. {
  1460. (function(entry)
  1461. {
  1462. count++;
  1463. var modeKey = entry.mode;
  1464. // Google and oneDrive use different keys
  1465. if (modeKey == App.MODE_GOOGLE)
  1466. {
  1467. modeKey = 'googleDrive';
  1468. }
  1469. else if (modeKey == App.MODE_ONEDRIVE)
  1470. {
  1471. modeKey = 'oneDrive';
  1472. }
  1473. menu.addItem(entry.title + ' (' + mxResources.get(modeKey) + ')', null, function()
  1474. {
  1475. editorUi.loadFile(entry.id);
  1476. }, parent);
  1477. })(recent[i]);
  1478. }
  1479. menu.addSeparator(parent);
  1480. }
  1481. menu.addItem(mxResources.get('reset'), null, function()
  1482. {
  1483. editorUi.resetRecent();
  1484. }, parent);
  1485. }));
  1486. this.put('openFrom', new Menu(function(menu, parent)
  1487. {
  1488. if (editorUi.drive != null)
  1489. {
  1490. menu.addItem(mxResources.get('googleDrive') + '...', null, function()
  1491. {
  1492. editorUi.pickFile(App.MODE_GOOGLE);
  1493. }, parent);
  1494. }
  1495. else if (googleEnabled)
  1496. {
  1497. menu.addItem(mxResources.get('googleDrive') + ' (' + mxResources.get('loading') + '...)', null, function()
  1498. {
  1499. // do nothing
  1500. }, parent, null, false);
  1501. }
  1502. if (editorUi.dropbox != null)
  1503. {
  1504. menu.addItem(mxResources.get('dropbox') + '...', null, function()
  1505. {
  1506. editorUi.pickFile(App.MODE_DROPBOX);
  1507. }, parent);
  1508. }
  1509. else if (dropboxEnabled)
  1510. {
  1511. menu.addItem(mxResources.get('dropbox') + ' (' + mxResources.get('loading') + '...)', null, function()
  1512. {
  1513. // do nothing
  1514. }, parent, null, false);
  1515. }
  1516. if (editorUi.oneDrive != null)
  1517. {
  1518. menu.addItem(mxResources.get('oneDrive') + '...', null, function()
  1519. {
  1520. editorUi.pickFile(App.MODE_ONEDRIVE);
  1521. }, parent);
  1522. }
  1523. else if (oneDriveEnabled)
  1524. {
  1525. menu.addItem(mxResources.get('oneDrive') + ' (' + mxResources.get('loading') + '...)', null, function()
  1526. {
  1527. // do nothing
  1528. }, parent, null, false);
  1529. }
  1530. menu.addSeparator(parent);
  1531. if (isLocalStorage && urlParams['browser'] != '0')
  1532. {
  1533. menu.addItem(mxResources.get('browser') + '...', null, function()
  1534. {
  1535. editorUi.pickFile(App.MODE_BROWSER);
  1536. }, parent);
  1537. }
  1538. if (!mxClient.IS_IOS)
  1539. {
  1540. menu.addItem(mxResources.get('device') + '...', null, function()
  1541. {
  1542. editorUi.pickFile(App.MODE_DEVICE);
  1543. }, parent);
  1544. }
  1545. if (!editorUi.isOffline())
  1546. {
  1547. menu.addSeparator(parent);
  1548. menu.addItem(mxResources.get('url') + '...', null, function()
  1549. {
  1550. var dlg = new FilenameDialog(editorUi, '', mxResources.get('open'), function(fileUrl)
  1551. {
  1552. if (fileUrl != null && fileUrl.length > 0)
  1553. {
  1554. var url = editorUi.getUrl(window.location.pathname + '?url=' + encodeURIComponent(fileUrl));
  1555. if (editorUi.getCurrentFile() == null)
  1556. {
  1557. window.location.href = url;
  1558. }
  1559. else
  1560. {
  1561. window.openWindow(url);
  1562. }
  1563. }
  1564. }, mxResources.get('url'));
  1565. editorUi.showDialog(dlg.container, 300, 80, true, true);
  1566. dlg.init();
  1567. }, parent);
  1568. }
  1569. }));
  1570. this.put('newLibrary', new Menu(function(menu, parent)
  1571. {
  1572. if (editorUi.drive != null)
  1573. {
  1574. menu.addItem(mxResources.get('googleDrive') + '...', null, function()
  1575. {
  1576. editorUi.showLibraryDialog(null, null, null, null, App.MODE_GOOGLE);
  1577. }, parent);
  1578. }
  1579. else if (googleEnabled)
  1580. {
  1581. menu.addItem(mxResources.get('googleDrive') + ' (' + mxResources.get('loading') + '...)', null, function()
  1582. {
  1583. // do nothing
  1584. }, parent, null, false);
  1585. }
  1586. if (editorUi.dropbox != null)
  1587. {
  1588. menu.addItem(mxResources.get('dropbox') + '...', null, function()
  1589. {
  1590. editorUi.showLibraryDialog(null, null, null, null, App.MODE_DROPBOX);
  1591. }, parent);
  1592. }
  1593. else if (dropboxEnabled)
  1594. {
  1595. menu.addItem(mxResources.get('dropbox') + ' (' + mxResources.get('loading') + '...)', null, function()
  1596. {
  1597. // do nothing
  1598. }, parent, null, false);
  1599. }
  1600. if (editorUi.oneDrive != null)
  1601. {
  1602. menu.addItem(mxResources.get('oneDrive') + '...', null, function()
  1603. {
  1604. editorUi.showLibraryDialog(null, null, null, null, App.MODE_ONEDRIVE);
  1605. }, parent);
  1606. }
  1607. else if (oneDriveEnabled)
  1608. {
  1609. menu.addItem(mxResources.get('oneDrive') + ' (' + mxResources.get('loading') + '...)', null, function()
  1610. {
  1611. // do nothing
  1612. }, parent, null, false);
  1613. }
  1614. menu.addSeparator(parent);
  1615. if (isLocalStorage && urlParams['browser'] != '0')
  1616. {
  1617. menu.addItem(mxResources.get('browser') + '...', null, function()
  1618. {
  1619. editorUi.showLibraryDialog(null, null, null, null, App.MODE_BROWSER);
  1620. }, parent);
  1621. }
  1622. if (!mxClient.IS_IOS)
  1623. {
  1624. menu.addItem(mxResources.get('device') + '...', null, function()
  1625. {
  1626. editorUi.showLibraryDialog(null, null, null, null, App.MODE_DEVICE);
  1627. }, parent);
  1628. }
  1629. }));
  1630. this.put('openLibraryFrom', new Menu(function(menu, parent)
  1631. {
  1632. if (editorUi.drive != null)
  1633. {
  1634. menu.addItem(mxResources.get('googleDrive') + '...', null, function()
  1635. {
  1636. editorUi.pickLibrary(App.MODE_GOOGLE);
  1637. }, parent);
  1638. }
  1639. else if (googleEnabled)
  1640. {
  1641. menu.addItem(mxResources.get('googleDrive') + ' (' + mxResources.get('loading') + '...)', null, function()
  1642. {
  1643. // do nothing
  1644. }, parent, null, false);
  1645. }
  1646. if (editorUi.dropbox != null)
  1647. {
  1648. menu.addItem(mxResources.get('dropbox') + '...', null, function()
  1649. {
  1650. editorUi.pickLibrary(App.MODE_DROPBOX);
  1651. }, parent);
  1652. }
  1653. else if (dropboxEnabled)
  1654. {
  1655. menu.addItem(mxResources.get('dropbox') + ' (' + mxResources.get('loading') + '...)', null, function()
  1656. {
  1657. // do nothing
  1658. }, parent, null, false);
  1659. }
  1660. if (editorUi.oneDrive != null)
  1661. {
  1662. menu.addItem(mxResources.get('oneDrive') + '...', null, function()
  1663. {
  1664. editorUi.pickLibrary(App.MODE_ONEDRIVE);
  1665. }, parent);
  1666. }
  1667. else if (oneDriveEnabled)
  1668. {
  1669. menu.addItem(mxResources.get('oneDrive') + ' (' + mxResources.get('loading') + '...)', null, function()
  1670. {
  1671. // do nothing
  1672. }, parent, null, false);
  1673. }
  1674. menu.addSeparator(parent);
  1675. if (isLocalStorage && urlParams['browser'] != '0')
  1676. {
  1677. menu.addItem(mxResources.get('browser') + '...', null, function()
  1678. {
  1679. editorUi.pickLibrary(App.MODE_BROWSER);
  1680. }, parent);
  1681. }
  1682. if (!mxClient.IS_IOS)
  1683. {
  1684. menu.addItem(mxResources.get('device') + '...', null, function()
  1685. {
  1686. editorUi.pickLibrary(App.MODE_DEVICE);
  1687. }, parent);
  1688. }
  1689. if (!editorUi.isOffline())
  1690. {
  1691. menu.addSeparator(parent);
  1692. menu.addItem(mxResources.get('url') + '...', null, function()
  1693. {
  1694. var dlg = new FilenameDialog(editorUi, '', mxResources.get('open'), function(fileUrl)
  1695. {
  1696. if (fileUrl != null && fileUrl.length > 0 && editorUi.spinner.spin(document.body, mxResources.get('loading')))
  1697. {
  1698. // Uses proxy to avoid CORS issues
  1699. mxUtils.get(PROXY_URL + '?url=' + encodeURIComponent(fileUrl), function(req)
  1700. {
  1701. if (req.getStatus() == 200)
  1702. {
  1703. editorUi.spinner.stop();
  1704. try
  1705. {
  1706. editorUi.loadLibrary(new UrlLibrary(this, req.getText(), fileUrl));
  1707. }
  1708. catch (e)
  1709. {
  1710. editorUi.handleError(e, mxResources.get('errorLoadingFile'));
  1711. }
  1712. }
  1713. else
  1714. {
  1715. editorUi.spinner.stop();
  1716. editorUi.handleError(null, mxResources.get('errorLoadingFile'));
  1717. }
  1718. }, function()
  1719. {
  1720. editorUi.spinner.stop();
  1721. editorUi.handleError(null, mxResources.get('errorLoadingFile'));
  1722. });
  1723. }
  1724. }, mxResources.get('url'));
  1725. editorUi.showDialog(dlg.container, 300, 80, true, true);
  1726. dlg.init();
  1727. }, parent);
  1728. }
  1729. }));
  1730. // Overrides view menu to add search and scratchpad
  1731. this.put('view', new Menu(mxUtils.bind(this, function(menu, parent)
  1732. {
  1733. this.addMenuItems(menu, ((this.editorUi.format != null) ? ['formatPanel'] : []).
  1734. concat(['outline', 'layers', '-']));
  1735. this.addMenuItems(menu, ['-', 'search'], parent);
  1736. if (isLocalStorage || mxClient.IS_CHROMEAPP)
  1737. {
  1738. var item = this.addMenuItem(menu, 'scratchpad', parent);
  1739. if (!editorUi.isOffline() || mxClient.IS_CHROMEAPP)
  1740. {
  1741. this.addLinkToItem(item, 'https://support.draw.io/questions/10420280');
  1742. }
  1743. }
  1744. this.addMenuItems(menu, ['shapes', '-', 'pageView', 'pageScale', '-',
  1745. 'scrollbars', 'tooltips', '-',
  1746. 'grid', 'guides'], parent);
  1747. if (mxClient.IS_SVG && (document.documentMode == null || document.documentMode > 9))
  1748. {
  1749. this.addMenuItem(menu, 'shadowVisible', parent);
  1750. }
  1751. this.addMenuItems(menu, ['-', 'connectionArrows', 'connectionPoints', '-',
  1752. 'resetView', 'zoomIn', 'zoomOut'], parent);
  1753. })));
  1754. this.put('extras', new Menu(mxUtils.bind(this, function(menu, parent)
  1755. {
  1756. if (urlParams['embed'] != '1')
  1757. {
  1758. this.addSubmenu('theme', menu, parent);
  1759. menu.addSeparator(parent);
  1760. }
  1761. this.addMenuItems(menu, ['copyConnect', 'collapseExpand', '-'], parent);
  1762. if (typeof(MathJax) !== 'undefined')
  1763. {
  1764. var item = this.addMenuItem(menu, 'mathematicalTypesetting', parent);
  1765. this.addLinkToItem(item, 'https://desk.draw.io/solution/articles/16000032875-how-to-use-mathematical-typesetting-');
  1766. }
  1767. this.addMenuItems(menu, ['autosave', '-', 'createShape', 'editDiagram'], parent);
  1768. menu.addSeparator(parent);
  1769. if (urlParams['embed'] != '1' && isLocalStorage)
  1770. {
  1771. this.addMenuItems(menu, ['showStartScreen'], parent);
  1772. }
  1773. if (!editorUi.isOfflineApp() && urlParams['embed'] != '1')
  1774. {
  1775. this.addMenuItems(menu, ['plugins', '-', 'offline'], parent);
  1776. }
  1777. else
  1778. {
  1779. menu.addSeparator(parent);
  1780. }
  1781. if (!editorUi.isOffline() && !navigator.standalone && urlParams['embed'] != '1')
  1782. {
  1783. this.addMenuItems(menu, ['chromeApp'], parent);
  1784. }
  1785. })));
  1786. this.put('file', new Menu(mxUtils.bind(this, function(menu, parent)
  1787. {
  1788. if (urlParams['embed'] == '1')
  1789. {
  1790. this.addSubmenu('importFrom', menu, parent);
  1791. this.addSubmenu('exportAs', menu, parent);
  1792. this.addSubmenu('embed', menu, parent);
  1793. if (urlParams['libraries'] == '1')
  1794. {
  1795. this.addMenuItems(menu, ['-'], parent);
  1796. this.addSubmenu('newLibrary', menu, parent);
  1797. this.addSubmenu('openLibraryFrom', menu, parent);
  1798. }
  1799. this.addMenuItems(menu, ['-', 'pageSetup', 'print', '-', 'save'], parent);
  1800. if (urlParams['saveAndExit'] == '1')
  1801. {
  1802. this.addMenuItems(menu, ['saveAndExit'], parent);
  1803. }
  1804. this.addMenuItems(menu, ['exit'], parent);
  1805. }
  1806. else
  1807. {
  1808. var file = this.editorUi.getCurrentFile();
  1809. if (file != null && file.constructor == DriveFile)
  1810. {
  1811. if (file.isRestricted())
  1812. {
  1813. this.addMenuItems(menu, ['exportOptionsDisabled'], parent);
  1814. }
  1815. if (file.realtime == null)
  1816. {
  1817. this.addMenuItems(menu, ['save', 'share', '-'], parent);
  1818. }
  1819. else
  1820. {
  1821. if (!file.isAutosave())
  1822. {
  1823. this.addMenuItems(menu, ['save'], parent);
  1824. }
  1825. this.addMenuItems(menu, ['share', 'chatWindowTitle', '-'], parent);
  1826. }
  1827. }
  1828. else
  1829. {
  1830. this.addMenuItems(menu, ['new'], parent);
  1831. }
  1832. this.addSubmenu('openFrom', menu, parent);
  1833. if (isLocalStorage)
  1834. {
  1835. this.addSubmenu('openRecent', menu, parent);
  1836. }
  1837. if (file != null && file.constructor == DriveFile)
  1838. {
  1839. this.addMenuItems(menu, ['new', '-', 'rename', 'makeCopy', 'moveToFolder'], parent);
  1840. }
  1841. else
  1842. {
  1843. this.addMenuItems(menu, ['-', 'save', 'saveAs', '-', 'rename'], parent);
  1844. if (editorUi.isOfflineApp())
  1845. {
  1846. if (!editorUi.isOffline())
  1847. {
  1848. this.addMenuItems(menu, ['upload'], parent);
  1849. }
  1850. }
  1851. else
  1852. {
  1853. this.addMenuItems(menu, ['makeCopy'], parent);
  1854. if (file != null && file.constructor == OneDriveFile)
  1855. {
  1856. this.addMenuItems(menu, ['moveToFolder'], parent);
  1857. }
  1858. }
  1859. }
  1860. menu.addSeparator(parent);
  1861. this.addSubmenu('importFrom', menu, parent);
  1862. this.addSubmenu('exportAs', menu, parent);
  1863. menu.addSeparator(parent);
  1864. this.addSubmenu('embed', menu, parent);
  1865. this.addSubmenu('publish', menu, parent);
  1866. menu.addSeparator(parent);
  1867. this.addSubmenu('newLibrary', menu, parent);
  1868. this.addSubmenu('openLibraryFrom', menu, parent);
  1869. if (file != null && (file.constructor == DriveFile || file.constructor == DropboxFile))
  1870. {
  1871. this.addMenuItems(menu, ['-', 'revisionHistory'], parent);
  1872. }
  1873. if (file != null && file.constructor == DriveFile)
  1874. {
  1875. this.addMenuItems(menu, ['createRevision'], parent);
  1876. }
  1877. this.addMenuItems(menu, ['-', 'pageSetup'], parent);
  1878. // Cannot use print in standalone mode on iOS as we cannot open new windows
  1879. if (!mxClient.IS_IOS || !navigator.standalone)
  1880. {
  1881. this.addMenuItems(menu, ['print'], parent);
  1882. }
  1883. this.addMenuItems(menu, ['-', 'close']);
  1884. }
  1885. })));
  1886. };
  1887. })();