Menus.js 73 KB

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