12.5.2 release

ChangeLog

@@ -1,3 +1,9 @@
+14-JAN-2019: 12.5.2
+
+- Adds option to include XML in PDF
+- Replaces app cache with PWA
+- Uses mxGraph 4.1.0 pre 3
+
 09-JAN-2019: 12.5.1
 
 - Fixes label offsets in viewer

VERSION

@@ -1 +1 @@
-12.5.1
+12.5.2

etc/build/build.xml

@@ -294,6 +294,7 @@
 			<filelist dir="${war.dir}/js/sanitizer" files="sanitizer.min.js"/>
 			<filelist dir="${war.dir}/js/cryptojs" files="aes.min.js"/>
 			<filelist dir="${war.dir}/js/deflate" files="pako.min.js"/>
+			<filelist dir="${war.dir}/js/croppie" files="croppie.min.js"/>
 			<filelist dir="${basedir}" files="client.min.js,grapheditor.min.js,sidebar.min.js,.tmp1.js"/>
     	</concat>
 
@@ -389,6 +390,7 @@
 			<filelist dir="${war.dir}/js/sanitizer" files="sanitizer.min.js"/>
 			<filelist dir="${war.dir}/js/cryptojs" files="aes.min.js"/>
 			<filelist dir="${war.dir}/js/deflate" files="pako.min.js"/>
+			<filelist dir="${war.dir}/js/croppie" files="croppie.min.js"/>
 			<filelist dir="${basedir}" files="client.min.js,grapheditor.min.js,sidebar.min.js,.tmp1.js"/>
     	</concat>
 

etc/mxgraph/mxClient.js

@@ -326,17 +326,17 @@ m.setAttribute("visibility","hidden"),m.setAttribute("pointer-events","fill"),m.
 mxSvgCanvas2D.prototype.convertHtml=function(a){if(this.useDomParser){var b=(new DOMParser).parseFromString(a,"text/html");null!=b&&(a=(new XMLSerializer).serializeToString(b.body),"<body"==a.substring(0,5)&&(a=a.substring(a.indexOf(">",5)+1)),"</body>"==a.substring(a.length-7,a.length)&&(a=a.substring(0,a.length-7)))}else{if(null!=document.implementation&&null!=document.implementation.createDocument){var b=document.implementation.createDocument("http://www.w3.org/1999/xhtml","html",null),c=b.createElement("body");
 b.documentElement.appendChild(c);var d=document.createElement("div");d.innerHTML=a;for(a=d.firstChild;null!=a;)d=a.nextSibling,c.appendChild(b.adoptNode(a)),a=d;return c.innerHTML}b=document.createElement("textarea");b.innerHTML=a.replace(/&amp;/g,"&amp;amp;").replace(/&#60;/g,"&amp;lt;").replace(/&#62;/g,"&amp;gt;").replace(/&lt;/g,"&amp;lt;").replace(/&gt;/g,"&amp;gt;").replace(/</g,"&lt;").replace(/>/g,"&gt;");a=b.value.replace(/&/g,"&amp;").replace(/&amp;lt;/g,"&lt;").replace(/&amp;gt;/g,"&gt;").replace(/&amp;amp;/g,
 "&amp;").replace(/<br>/g,"<br />").replace(/<hr>/g,"<hr />").replace(/(<img[^>]+)>/gm,"$1 />")}return a};
-mxSvgCanvas2D.prototype.createDiv=function(a){mxUtils.isNode(a)||(a="<div><div>"+this.convertHtml(a)+"</div></div>");if(mxClient.IS_IE||mxClient.IS_IE11||!document.createElementNS){mxUtils.isNode(a)&&(a="<div><div>"+mxUtils.getXml(a)+"</div></div>");a='<div xmlns="http://www.w3.org/1999/xhtml">'+a+"</div>";if("ActiveXObject"in window){var b=mxUtils.createMsXmlDocument();b.loadXML(a);return b.documentElement}return mxUtils.parseXml(a).documentElement}b=document.createElementNS("http://www.w3.org/1999/xhtml",
+mxSvgCanvas2D.prototype.createDiv=function(a){mxUtils.isNode(a)||(a="<div><div>"+this.convertHtml(a)+"</div></div>");if(mxClient.IS_IE||mxClient.IS_IE11||!document.createElementNS)return mxUtils.isNode(a)&&(a="<div><div>"+mxUtils.getXml(a)+"</div></div>"),mxUtils.parseXml('<div xmlns="http://www.w3.org/1999/xhtml">'+a+"</div>").documentElement;var b=document.createElementNS("http://www.w3.org/1999/xhtml","div");if(mxUtils.isNode(a)){var c=document.createElement("div"),d=c.cloneNode(!1);this.root.ownerDocument!=
-"div");if(mxUtils.isNode(a)){var c=document.createElement("div"),d=c.cloneNode(!1);this.root.ownerDocument!=document?c.appendChild(a.cloneNode(!0)):c.appendChild(a);d.appendChild(c);b.appendChild(d)}else b.innerHTML=a;return b};mxSvgCanvas2D.prototype.updateText=function(a,b,c,d,e,f,g,k,l,m,n){null!=n&&null!=n.firstChild&&null!=n.firstChild.firstChild&&this.updateTextNodes(a,b,c,d,e,f,g,k,l,m,n.firstChild)};
+document?c.appendChild(a.cloneNode(!0)):c.appendChild(a);d.appendChild(c);b.appendChild(d)}else b.innerHTML=a;return b};mxSvgCanvas2D.prototype.updateText=function(a,b,c,d,e,f,g,k,l,m,n){null!=n&&null!=n.firstChild&&null!=n.firstChild.firstChild&&this.updateTextNodes(a,b,c,d,e,f,g,k,l,m,n.firstChild)};
 mxSvgCanvas2D.prototype.addForeignObject=function(a,b,c,d,e,f,g,k,l,m,n,p,q,r,t){q=this.createElement("g");var u=this.createElement("foreignObject");u.setAttribute("style","overflow: visible; text-align: left;");u.setAttribute("pointer-events","none");r.ownerDocument!=document&&(r=mxUtils.importNodeImplementation(u.ownerDocument,r,!0));u.appendChild(r);q.appendChild(u);this.updateTextNodes(a,b,c,d,f,g,k,m,n,p,q);this.root.ownerDocument!=document&&(a=this.createAlternateContent(u,a,b,c,d,e,f,g,k,l,
 m,n,p),null!=a&&(u.setAttribute("requiredFeatures","http://www.w3.org/TR/SVG11/feature#Extensibility"),b=this.createElement("switch"),b.appendChild(u),b.appendChild(a),q.appendChild(b)));t.appendChild(q)};
 mxSvgCanvas2D.prototype.updateTextNodes=function(a,b,c,d,e,f,g,k,l,m,n){var p=this.state.scale;mxSvgCanvas2D.createCss(c,d,e,f,g,k,l,null!=this.state.fontBackgroundColor?this.state.fontBackgroundColor:null,null!=this.state.fontBorderColor?this.state.fontBorderColor:null,"display: flex; align-items: unsafe "+(f==mxConstants.ALIGN_TOP?"flex-start":f==mxConstants.ALIGN_BOTTOM?"flex-end":"center")+"; justify-content: unsafe "+(e==mxConstants.ALIGN_LEFT?"flex-start":e==mxConstants.ALIGN_RIGHT?"flex-end":
 "center")+"; ",this.getTextCss(),p,mxUtils.bind(this,function(c,d,e,f,g){a+=this.state.dx;b+=this.state.dy;var k=n.firstChild,l=k.firstChild,q=l.firstChild,r=(this.rotateHtml?this.state.rotation:0)+(null!=m?m:0),t=(0!=this.foOffset?"translate("+this.foOffset+" "+this.foOffset+")":"")+(1!=p?"scale("+p+")":"");q.firstChild.setAttribute("style",g);q.setAttribute("style",f);k.setAttribute("width",Math.ceil(1/Math.min(1,p)*100)+"%");k.setAttribute("height",Math.ceil(1/Math.min(1,p)*100)+"%");d=Math.round(b+
 d);0>d?k.setAttribute("y",d):(k.removeAttribute("y"),e+="padding-top: "+d+"px; ");l.setAttribute("style",e+"margin-left: "+Math.round(a+c)+"px;");t+=0!=r?"rotate("+r+" "+a+" "+b+")":"";""!=t?n.setAttribute("transform",t):n.removeAttribute("transform");1!=this.state.alpha?n.setAttribute("opacity",this.state.alpha):n.removeAttribute("opacity")}))};
-mxSvgCanvas2D.createCss=function(a,b,c,d,e,f,g,k,l,m,n,p,q){p="box-sizing: border-box; text-align: "+(c==mxConstants.ALIGN_LEFT?"left":c==mxConstants.ALIGN_RIGHT?"right":"center")+"; ";var r=mxUtils.getAlignmentAsPoint(c,d);c="overflow: hidden; ";d="width: 1px; ";var t="height: 1px; ",u=r.x*a,r=r.y*b;g?(d="width: "+Math.round(a)+"px; ",p+="max-height: "+Math.round(b)+"px; ",r=0):"fill"==f?(d="width: "+Math.round(a)+"px; ",t="height: "+Math.round(b)+"px; ",n+="width: 100%; height: 100%; ",p+=d+t):
+mxSvgCanvas2D.createCss=function(a,b,c,d,e,f,g,k,l,m,n,p,q){p="box-sizing: border-box; font-size: 0; text-align: "+(c==mxConstants.ALIGN_LEFT?"left":c==mxConstants.ALIGN_RIGHT?"right":"center")+"; ";var r=mxUtils.getAlignmentAsPoint(c,d);c="overflow: hidden; ";d="width: 1px; ";var t="height: 1px; ",u=r.x*a,r=r.y*b;g?(d="width: "+Math.round(a)+"px; ",p+="max-height: "+Math.round(b)+"px; ",r=0):"fill"==f?(d="width: "+Math.round(a)+"px; ",t="height: "+Math.round(b)+"px; ",n+="width: 100%; height: 100%; ",
-"width"==f?(d="width: "+Math.round(a)+"px; ",n+="width: 100%; ",p+=d,r=0,0<b&&(p+="max-height: "+Math.round(b)+"px; ")):(c="",r=0);b="";null!=k&&(b+="background-color: "+k+"; ");null!=l&&(b+="border: 1px solid "+l+"; ");""==c||g?n+=b:p+=b;e&&0<a?(n+="white-space: normal; word-wrap: "+mxConstants.WORD_WRAP+"; ",d="width: "+Math.round(a)+"px; ",""!=c&&"fill"!=f&&(r=0)):(n+="white-space: nowrap; ",""==c&&(u=0));q(u,r,m+d+t,p+c,n,c)};
+p+=d+t):"width"==f?(d="width: "+Math.round(a)+"px; ",n+="width: 100%; ",p+=d,r=0,0<b&&(p+="max-height: "+Math.round(b)+"px; ")):(c="",r=0);b="";null!=k&&(b+="background-color: "+k+"; ");null!=l&&(b+="border: 1px solid "+l+"; ");""==c||g?n+=b:p+=b;e&&0<a?(n+="white-space: normal; word-wrap: "+mxConstants.WORD_WRAP+"; ",d="width: "+Math.round(a)+"px; ",""!=c&&"fill"!=f&&(r=0)):(n+="white-space: nowrap; ",""==c&&(u=0));q(u,r,m+d+t,p+c,n,c)};
-mxSvgCanvas2D.prototype.getTextCss=function(){var a=this.state,b="display: inline-block; font-size: "+a.fontSize+"px; font-family: "+a.fontFamily+"; color: "+a.fontColor+"; line-height: "+(mxConstants.ABSOLUTE_LINE_HEIGHT?a.fontSize*mxConstants.LINE_HEIGHT+"px":mxConstants.LINE_HEIGHT*this.lineHeightCorrection)+"; pointer-events: "+(this.pointerEvents?this.pointerEventsValue:"none")+"; ";(a.fontStyle&mxConstants.FONT_BOLD)==mxConstants.FONT_BOLD&&(b+="font-weight: bold; ");(a.fontStyle&mxConstants.FONT_ITALIC)==
+mxSvgCanvas2D.prototype.getTextCss=function(){var a=this.state;mxConstants.LINE_HEIGHT*this.lineHeightCorrection;var b="display: inline-block; font-size: "+a.fontSize+"px; font-family: "+a.fontFamily+"; color: "+a.fontColor+"; line-height: 1; pointer-events: "+(this.pointerEvents?this.pointerEventsValue:"none")+"; ";(a.fontStyle&mxConstants.FONT_BOLD)==mxConstants.FONT_BOLD&&(b+="font-weight: bold; ");(a.fontStyle&mxConstants.FONT_ITALIC)==mxConstants.FONT_ITALIC&&(b+="font-style: italic; ");var c=
-mxConstants.FONT_ITALIC&&(b+="font-style: italic; ");var c=[];(a.fontStyle&mxConstants.FONT_UNDERLINE)==mxConstants.FONT_UNDERLINE&&c.push("underline");(a.fontStyle&mxConstants.FONT_STRIKETHROUGH)==mxConstants.FONT_STRIKETHROUGH&&c.push("line-through");0<c.length&&(b+="text-decoration: "+c.join(" ")+"; ");return b};
+[];(a.fontStyle&mxConstants.FONT_UNDERLINE)==mxConstants.FONT_UNDERLINE&&c.push("underline");(a.fontStyle&mxConstants.FONT_STRIKETHROUGH)==mxConstants.FONT_STRIKETHROUGH&&c.push("line-through");0<c.length&&(b+="text-decoration: "+c.join(" ")+"; ");return b};
 mxSvgCanvas2D.prototype.text=function(a,b,c,d,e,f,g,k,l,m,n,p,q){if(this.textEnabled&&null!=e)if(p=null!=p?p:0,this.foEnabled&&"html"==l){var r=this.createDiv(e);null!=r&&(null!=q&&r.setAttribute("dir",q),this.addForeignObject(a,b,c,d,e,f,g,k,l,m,n,p,q,r,this.root))}else this.plainText(a+this.state.dx,b+this.state.dy,c,d,e,f,g,k,m,n,p,q)};
 mxSvgCanvas2D.prototype.createClip=function(a,b,c,d){a=Math.round(a);b=Math.round(b);c=Math.round(c);d=Math.round(d);for(var e="mx-clip-"+a+"-"+b+"-"+c+"-"+d,f=0,g=e+"-"+f;null!=document.getElementById(g);)g=e+"-"+ ++f;clip=this.createElement("clipPath");clip.setAttribute("id",g);e=this.createElement("rect");e.setAttribute("x",a);e.setAttribute("y",b);e.setAttribute("width",c);e.setAttribute("height",d);clip.appendChild(e);return clip};
 mxSvgCanvas2D.prototype.plainText=function(a,b,c,d,e,f,g,k,l,m,n,p){n=null!=n?n:0;k=this.state;var q=k.fontSize,r=this.createElement("g"),t=k.transform||"";this.updateFont(r);0!=n&&(t+="rotate("+n+","+this.format(a*k.scale)+","+this.format(b*k.scale)+")");null!=p&&r.setAttribute("direction",p);m&&0<c&&0<d&&(p=a,n=b,f==mxConstants.ALIGN_CENTER?p-=c/2:f==mxConstants.ALIGN_RIGHT&&(p-=c),"fill"!=l&&(g==mxConstants.ALIGN_MIDDLE?n-=d/2:g==mxConstants.ALIGN_BOTTOM&&(n-=d)),n=this.createClip(p*k.scale-2,
@@ -1033,7 +1033,7 @@ mxGraphView.prototype.updateVertexLabelOffset=function(a){var b=mxUtils.getValue
 mxConstants.ALIGN_CENTER),d=0;c==mxConstants.ALIGN_CENTER?d=.5:c==mxConstants.ALIGN_RIGHT&&(d=1);0!=d&&(a.absoluteOffset.x-=(b*this.scale-a.width)*d)}b=mxUtils.getValue(a.style,mxConstants.STYLE_VERTICAL_LABEL_POSITION,mxConstants.ALIGN_MIDDLE);b==mxConstants.ALIGN_TOP?a.absoluteOffset.y-=a.height:b==mxConstants.ALIGN_BOTTOM&&(a.absoluteOffset.y+=a.height)};mxGraphView.prototype.resetValidationState=function(){this.lastForegroundHtmlNode=this.lastForegroundNode=this.lastHtmlNode=this.lastNode=null};
 mxGraphView.prototype.stateValidated=function(a){var b=this.graph.getModel().isEdge(a.cell)&&this.graph.keepEdgesInForeground||this.graph.getModel().isVertex(a.cell)&&this.graph.keepEdgesInBackground;a=this.graph.cellRenderer.insertStateAfter(a,b?this.lastForegroundNode||this.lastNode:this.lastNode,b?this.lastForegroundHtmlNode||this.lastHtmlNode:this.lastHtmlNode);b?(this.lastForegroundHtmlNode=a[1],this.lastForegroundNode=a[0]):(this.lastHtmlNode=a[1],this.lastNode=a[0])};
 mxGraphView.prototype.updateFixedTerminalPoints=function(a,b,c){this.updateFixedTerminalPoint(a,b,!0,this.graph.getConnectionConstraint(a,b,!0));this.updateFixedTerminalPoint(a,c,!1,this.graph.getConnectionConstraint(a,c,!1))};mxGraphView.prototype.updateFixedTerminalPoint=function(a,b,c,d){a.setAbsoluteTerminalPoint(this.getFixedTerminalPoint(a,b,c,d),c)};
-mxGraphView.prototype.getFixedTerminalPoint=function(a,b,c,d){var e=null;null!=d&&(e=this.graph.getConnectionPoint(b,d,this.graph.isOrthogonal(a)));if(null==e&&null==b){b=this.scale;d=this.translate;var f=a.origin,e=this.graph.getCellGeometry(a.cell).getTerminalPoint(c);null!=e&&(e=new mxPoint(b*(d.x+e.x+f.x),b*(d.y+e.y+f.y)))}return e};
+mxGraphView.prototype.getFixedTerminalPoint=function(a,b,c,d){var e=null;null!=d&&(e=this.graph.getConnectionPoint(b,d,!1));if(null==e&&null==b){b=this.scale;d=this.translate;var f=a.origin,e=this.graph.getCellGeometry(a.cell).getTerminalPoint(c);null!=e&&(e=new mxPoint(b*(d.x+e.x+f.x),b*(d.y+e.y+f.y)))}return e};
 mxGraphView.prototype.updateBoundsFromStencil=function(a){var b=null;if(null!=a&&null!=a.shape&&null!=a.shape.stencil&&"fixed"==a.shape.stencil.aspect){var b=mxRectangle.fromRectangle(a),c=a.shape.stencil.computeAspect(a.style,a.x,a.y,a.width,a.height);a.setRect(c.x,c.y,a.shape.stencil.w0*c.width,a.shape.stencil.h0*c.height)}return b};
 mxGraphView.prototype.updatePoints=function(a,b,c,d){if(null!=a){var e=[];e.push(a.absolutePoints[0]);var f=this.getEdgeStyle(a,b,c,d);if(null!=f){c=this.getTerminalPort(a,c,!0);d=this.getTerminalPort(a,d,!1);var g=this.updateBoundsFromStencil(c),k=this.updateBoundsFromStencil(d);f(a,c,d,b,e);null!=g&&c.setRect(g.x,g.y,g.width,g.height);null!=k&&d.setRect(k.x,k.y,k.width,k.height)}else if(null!=b)for(f=0;f<b.length;f++)null!=b[f]&&(c=mxUtils.clone(b[f]),e.push(this.transformControlPoint(a,c)));b=
 a.absolutePoints;e.push(b[b.length-1]);a.absolutePoints=e}};mxGraphView.prototype.transformControlPoint=function(a,b){if(null!=a&&null!=b){var c=a.origin;return new mxPoint(this.scale*(b.x+this.translate.x+c.x),this.scale*(b.y+this.translate.y+c.y))}return null};

src/main/webapp/cache.manifest

@@ -1,7 +1,7 @@
 CACHE MANIFEST
 
 # THIS FILE WAS GENERATED. DO NOT MODIFY!
-# 01/09/2020 09:53 AM
+# 01/14/2020 02:47 PM
 
 app.html
 index.html?offline=1

src/main/webapp/export3.html

@@ -76,6 +76,12 @@
 				data.xml = Editor.extractGraphModelFromPng('data:image/png;base64,' + data.xml);
 			}
 			
+			//IE11 sends incorrect xml
+			if (data.xml.substring(0, 11) == '<#document>')
+			{
+				data.xml = data.xml.substring(11, data.xml.length - 12);
+			}
+			
 			// Parses XML
 			var doc = mxUtils.parseXml(data.xml);
 			var node = Editor.extractGraphModel(doc.documentElement, true);

src/main/webapp/index.html

@@ -167,6 +167,7 @@
 	<link rel="icon" type="image/png" sizes="32x32" href="images/favicon-32x32.png">
 	<link rel="icon" type="image/png" sizes="16x16" href="images/favicon-16x16.png">
 	<link rel="mask-icon" href="images/safari-pinned-tab.svg" color="#d89000">
+	<link rel="stylesheet" type="text/css" href="js/croppie/croppie.min.css">
     <link rel="stylesheet" type="text/css" href="styles/grapheditor.css">
     <link rel="canonical" href="https://www.draw.io">
 	<link rel="manifest" href="images/manifest.json">

src/main/webapp/js/croppie/croppie.min.css

@@ -0,0 +1,2 @@
+.croppie-container{width:100%;height:100%}.croppie-container .cr-image{z-index:-1;position:absolute;top:0;left:0;transform-origin:0 0;max-height:none;max-width:none}.croppie-container .cr-boundary{position:relative;overflow:hidden;margin:0 auto;z-index:1;width:100%;height:100%}.croppie-container .cr-resizer,.croppie-container .cr-viewport{position:absolute;border:2px solid #fff;margin:auto;top:0;bottom:0;right:0;left:0;box-shadow:0 0 2000px 2000px rgba(0,0,0,.5);z-index:0}.croppie-container .cr-resizer{z-index:2;box-shadow:none;pointer-events:none}.croppie-container .cr-resizer-horisontal,.croppie-container .cr-resizer-vertical{position:absolute;pointer-events:all}.croppie-container .cr-resizer-horisontal::after,.croppie-container .cr-resizer-vertical::after{display:block;position:absolute;box-sizing:border-box;border:1px solid #000;background:#fff;width:10px;height:10px;content:''}.croppie-container .cr-resizer-vertical{bottom:-5px;cursor:row-resize;width:100%;height:10px}.croppie-container .cr-resizer-vertical::after{left:50%;margin-left:-5px}.croppie-container .cr-resizer-horisontal{right:-5px;cursor:col-resize;width:10px;height:100%}.croppie-container .cr-resizer-horisontal::after{top:50%;margin-top:-5px}.croppie-container .cr-original-image{display:none}.croppie-container .cr-vp-circle{border-radius:50%}.croppie-container .cr-overlay{z-index:1;position:absolute;cursor:move;touch-action:none}.croppie-container .cr-slider-wrap{width:75%;margin:15px auto;text-align:center}.croppie-result{position:relative;overflow:hidden}.croppie-result img{position:absolute}.croppie-container .cr-image,.croppie-container .cr-overlay,.croppie-container .cr-viewport{-webkit-transform:translateZ(0);-moz-transform:translateZ(0);-ms-transform:translateZ(0);transform:translateZ(0)}.cr-slider{-webkit-appearance:none;width:300px;max-width:100%;padding-top:8px;padding-bottom:8px;background-color:transparent}.cr-slider::-webkit-slider-runnable-track{width:100%;height:3px;background:rgba(0,0,0,.5);border:0;border-radius:3px}.cr-slider::-webkit-slider-thumb{-webkit-appearance:none;border:none;height:16px;width:16px;border-radius:50%;background:#ddd;margin-top:-6px}.cr-slider:focus{outline:0}.cr-slider::-moz-range-track{width:100%;height:3px;background:rgba(0,0,0,.5);border:0;border-radius:3px}.cr-slider::-moz-range-thumb{border:none;height:16px;width:16px;border-radius:50%;background:#ddd;margin-top:-6px}.cr-slider:-moz-focusring{outline:1px solid #fff;outline-offset:-1px}.cr-slider::-ms-track{width:100%;height:5px;background:0 0;border-color:transparent;border-width:6px 0;color:transparent}.cr-slider::-ms-fill-lower{background:rgba(0,0,0,.5);border-radius:10px}.cr-slider::-ms-fill-upper{background:rgba(0,0,0,.5);border-radius:10px}.cr-slider::-ms-thumb{border:none;height:16px;width:16px;border-radius:50%;background:#ddd;margin-top:1px}.cr-slider:focus::-ms-fill-lower{background:rgba(0,0,0,.5)}.cr-slider:focus::-ms-fill-upper{background:rgba(0,0,0,.5)}.cr-rotate-controls{position:absolute;bottom:5px;left:5px;z-index:1}.cr-rotate-controls button{border:0;background:0 0}.cr-rotate-controls i:before{display:inline-block;font-style:normal;font-weight:900;font-size:22px}.cr-rotate-l i:before{content:'↺'}.cr-rotate-r i:before{content:'↻'}
+/*# sourceMappingURL=croppie.min.css.map */

src/main/webapp/js/diagramly/App.js

@@ -537,12 +537,22 @@ App.main = function(callback, createUi)
 			mxscript('js/stencils.min.js');
 			mxscript('js/extensions.min.js');
 			
+			// Check that service workers are supported
+			if ('serviceWorker' in navigator) {
+			  // Use the window load event to keep the page load performant
+			  window.addEventListener('load', function() {
+			    navigator.serviceWorker.register('/service-worker.js');
+			  });
+			}
+			else if (window.applicationCache != null)
+			{
 				var frame = document.createElement('iframe');
 				frame.setAttribute('width', '0');
 				frame.setAttribute('height', '0');
 				frame.setAttribute('src', 'offline.html');
 				document.body.appendChild(frame);
 			}
+		}
 		
 		// Loads Pusher API
 		if (('ArrayBuffer' in window) && !mxClient.IS_CHROMEAPP && !EditorUi.isElectronApp &&
@@ -5357,7 +5367,7 @@ App.prototype.showAuthDialog = function(peer, showRememberOption, fn, closeFn)
  * readXml argument is used for import. Default is false. The optional
  * readLibrary argument is used for reading libraries. Default is false.
  */
-App.prototype.convertFile = function(url, filename, mimeType, extension, success, error)
+App.prototype.convertFile = function(url, filename, mimeType, extension, success, error, executeRequest)
 {
 	var name = filename;
 	
@@ -5422,9 +5432,18 @@ App.prototype.convertFile = function(url, filename, mimeType, extension, success
 		{
 			try
 			{
-				if (/\.png$/i.test(filename))
+				if (/\.pdf$/i.test(filename))
 				{
-					temp = this.extractGraphModelFromPng(data);
+					var temp = Editor.extractGraphModelFromPdf(data);
+						
+					if (temp != null && temp.length > 0)
+					{
+						success(new LocalFile(this, temp, name, true));
+					}
+				}
+				else if (/\.png$/i.test(filename))
+				{
+					var temp = this.extractGraphModelFromPng(data);
 					
 					if (temp != null)
 					{
@@ -5466,7 +5485,8 @@ App.prototype.convertFile = function(url, filename, mimeType, extension, success
 			}
 		});
 
-		var binary = /\.png$/i.test(filename) || /\.jpe?g$/i.test(filename) || (mimeType != null &&
+		var binary = /\.png$/i.test(filename) || /\.jpe?g$/i.test(filename) ||
+		 	/\.pdf$/i.test(filename) || (mimeType != null &&
 		 	mimeType.substring(0, 6) == 'image/');
 		
 		// NOTE: Cannot force non-binary request via loadUrl so needs separate
@@ -5488,6 +5508,10 @@ App.prototype.convertFile = function(url, filename, mimeType, extension, success
 					    	{
 					    		data = 'data:image/png;base64,' + data;	
 					    	}
+				    		else if (/\.pdf$/i.test(filename))
+					    	{
+					    		data = 'data:application/pdf;base64,' + data;	
+					    	}
 				    		else
 					    	{
 					    		// Workaround for character encoding issues in IE10/11
@@ -5516,6 +5540,10 @@ App.prototype.convertFile = function(url, filename, mimeType, extension, success
 				}
 		    });
 		}
+		else if (executeRequest != null)
+		{
+			executeRequest(url, handleData, error, binary);
+		}
 		else
 		{
 			this.loadUrl(url, handleData, error, binary);

src/main/webapp/js/diagramly/Devel.js

@@ -143,6 +143,9 @@ mxscript(drawDevUrl + 'js/jszip/jszip.min.js');
 //GraphMl Import
 mxscript(drawDevUrl + 'js/diagramly/graphml/mxGraphMlCodec.js');
 
+//Croppie
+mxscript(drawDevUrl + 'js/croppie/croppie.min.js');
+
 //Table Layout
 if (urlParams['tableLayout'] == '1')
 {

src/main/webapp/js/diagramly/Dialogs.js

@@ -4385,7 +4385,7 @@ var ImageDialog = function(editorUi, title, initialValue, fn, ignoreExisting, co
 	    		linkInput.value = image;
 	    	});
 	    	
-	    	editorUi.showDialog(dlg.container, 200, 200, true, true);
+	    	editorUi.showDialog(dlg.container, 300, 380, true, true);
 			dlg.init();
 		});
 		
@@ -7466,114 +7466,101 @@ var CropImageDialog = function(editorUi, image, fn)
 {
 	var div = document.createElement('div');
 	
-	var table = document.createElement('table');
+	var croppieDiv = document.createElement('div');
-	var tbody = document.createElement('tbody');
+	croppieDiv.style.width = '300px';
+	croppieDiv.style.height = '300px';
+	div.appendChild(croppieDiv);
+	var croppie = null;
 	
-	var row = document.createElement('tr');
+	function createCroppie(isCircle)
-	var size = document.createElement('td');
+	{
-	size.style.whiteSpace = 'nowrap';
+		if (croppie != null)
-	size.setAttribute('colspan', '2');
+		{
-	mxUtils.write(size, mxResources.get('loading') + '...');
+			croppie.destroy();
-	row.appendChild(size);
+		}
-	tbody.appendChild(row);
 		
-	var row = document.createElement('tr');
+		if (isCircle)
-	var left = document.createElement('td');
+		{
-	var right = document.createElement('td');
+			croppie = new Croppie(croppieDiv, {
-	table.style.paddingLeft = '6px';
+				viewport: { width: 150, height: 150, type: 'circle' },
+				enableExif: true,
+			    showZoomer: false,
+			    enableResize: false,
+			    enableOrientation: true
+			});
 			
-	mxUtils.write(left, mxResources.get('left') + ':');
+			croppie.bind({
+			    url: image
+			});
+		}
+		else
+		{
+			croppie = new Croppie(croppieDiv, {
+				viewport: { width: 150, height: 150, type: 'square' },
+				enableExif: true,
+			    showZoomer: false,
+			    enableResize: true,
+			    enableOrientation: true
+			});
 			
-	var xInput = document.createElement('input');
+			croppie.bind({
-	xInput.setAttribute('type', 'text');
+			    url: image
-	xInput.style.width = '100px';
+			});
-	xInput.value = '0';
+		}	
+	};
 	
 	this.init = function()
 	{
-		xInput.focus();
+		createCroppie();
-		xInput.select();
 	};
 
-	right.appendChild(xInput);
-
-	row.appendChild(left);
-	row.appendChild(right);
-	
-	tbody.appendChild(row);
-	
-	row = document.createElement('tr');
-	left = document.createElement('td');
-	right = document.createElement('td');
-	
-	mxUtils.write(left, mxResources.get('top') + ':');
-	
-	var yInput = document.createElement('input');
-	yInput.setAttribute('type', 'text');
-	yInput.style.width = '100px';
-	yInput.value = '0';
-
-	right.appendChild(yInput);
-
-	row.appendChild(left);
-	row.appendChild(right);
-	
-	tbody.appendChild(row);
-	
-	row = document.createElement('tr');
-	left = document.createElement('td');
-	right = document.createElement('td');
-	
-	mxUtils.write(left, mxResources.get('right') + ':');
-	
-	var wInput = document.createElement('input');
-	wInput.setAttribute('type', 'text');
-	wInput.style.width = '100px';
-	wInput.value = '0';
-
-	right.appendChild(wInput);
-
-	row.appendChild(left);
-	row.appendChild(right);
-	
-	tbody.appendChild(row);
-	
-	row = document.createElement('tr');
-	left = document.createElement('td');
-	right = document.createElement('td');
-	
-	mxUtils.write(left, mxResources.get('bottom') + ':');
-	
-	var hInput = document.createElement('input');
-	hInput.setAttribute('type', 'text');
-	hInput.style.width = '100px';
-	hInput.value = '0';
-
-	right.appendChild(hInput);
-
-	row.appendChild(left);
-	row.appendChild(right);
-	
-	tbody.appendChild(row);
-	
-	row = document.createElement('tr');
-	left = document.createElement('td');
-	right = document.createElement('td');
-	
-	mxUtils.write(left, mxResources.get('circle') + ':');
-	
-	row.appendChild(left);
-	
 	var circleInput = document.createElement('input');
 	circleInput.setAttribute('type', 'checkbox');
+	circleInput.setAttribute('id', 'croppieCircle');
+	circleInput.style.margin = '5px';
+	div.appendChild(circleInput);
 	
-	right.appendChild(circleInput);
+	var circleLbl = document.createElement('label');
-	row.appendChild(right);
+	circleLbl.setAttribute('for', 'croppieCircle');
+	mxUtils.write(circleLbl, mxResources.get('circle'));
+	div.appendChild(circleLbl);
 	
-	tbody.appendChild(row);
+	var wrap, btnLeft, btnRight, iLeft, iRight;
 
-	table.appendChild(tbody);
+    wrap = document.createElement('div');
-	div.appendChild(table);
+    btnLeft = document.createElement('button');
+    btnRight = document.createElement('button');
+
+    wrap.appendChild(btnLeft);
+    wrap.appendChild(btnRight);
+
+    iLeft = document.createElement('i');
+    iRight = document.createElement('i');
+    btnLeft.appendChild(iLeft);
+    btnRight.appendChild(iRight);
+
+    wrap.className = 'cr-rotate-controls';
+    wrap.style.float = 'right';
+    wrap.style.position = 'inherit';
+    btnLeft.className = 'cr-rotate-l';
+    btnRight.className = 'cr-rotate-r';
+    
+    div.appendChild(wrap);
+
+    btnLeft.addEventListener('click', function () 
+    {
+    	croppie.rotate(-90);
+    });
+    
+    btnRight.addEventListener('click', function () 
+    {
+    	croppie.rotate(90);
+    });
+	
+	mxEvent.addListener(circleInput, 'change', function()
+	{
+		createCroppie(this.checked);
+	});
 	
 	var cancelBtn = mxUtils.button(mxResources.get('cancel'), function()
 	{
@@ -7581,58 +7568,15 @@ var CropImageDialog = function(editorUi, image, fn)
 	});
 	cancelBtn.className = 'geBtn';
 	
-	var imageObj = new Image();
-
 	var applyBtn = mxUtils.button(mxResources.get('apply'), function()
 	{
+		croppie.result({type: 'base64', size: 'original'}).then(function(base64Img) {
+			fn(base64Img);
 			editorUi.hideDialog();
-		
+		});
-		var canvas = document.createElement('canvas');
-		var context = canvas.getContext('2d');
-		var w = imageObj.width;
-		var h = imageObj.height;
-		
-		// draw cropped image
-		var sourceX = parseInt(xInput.value);
-		var sourceY = parseInt(yInput.value);
-		var sourceWidth = Math.max(1, w - sourceX - parseInt(wInput.value));
-		var sourceHeight = Math.max(1, h - sourceY - parseInt(hInput.value));
-		canvas.width = sourceWidth;
-		canvas.height = sourceHeight;
-		
-		if (circleInput.checked)
-		{
-			context.fillStyle = '#000000';
-			context.arc(sourceWidth / 2, sourceHeight / 2, Math.min(sourceWidth / 2,
-				sourceHeight / 2), 0, 2 * Math.PI);
-			context.fill();
-			context.globalCompositeOperation = 'source-in';
-		}
-		
-	    context.drawImage(imageObj, sourceX, sourceY, sourceWidth, sourceHeight, 0, 0, sourceWidth, sourceHeight);
-		fn(canvas.toDataURL());
 	});
 	
 	applyBtn.className = 'geBtn gePrimaryBtn';
-	applyBtn.setAttribute('disabled', 'disabled');
-	
-	imageObj.onload = function()
-	{
-		applyBtn.removeAttribute('disabled');
-		size.innerHTML = '';
-		mxUtils.write(size, mxResources.get('width') + ': ' + imageObj.width + ' ' +
-			mxResources.get('height') + ': ' + imageObj.height);
-	};
-
-	imageObj.src = image;
-	
-	mxEvent.addListener(div, 'keypress', function(e)
-	{
-		if (e.keyCode == 13)
-		{
-			applyBtn.click();
-		}
-	});
 	
 	var buttons = document.createElement('div');
 	buttons.style.marginTop = '20px';
@@ -10117,6 +10061,18 @@ var FontDialog = function(editorUi, curFontname, curUrl, curType, fn)
 	td.style.whiteSpace = 'nowrap';
 	td.setAttribute('align', 'right');
 	
+		
+	if (!editorUi.isOffline())
+	{
+		var helpBtn = mxUtils.button(mxResources.get('help'), function()
+		{
+			editorUi.openLink('https://www.diagrams.net/blog/external-fonts');
+		});
+		
+		helpBtn.className = 'geBtn';	
+		td.appendChild(helpBtn);
+	}
+	
 	var cancelBtn = mxUtils.button(mxResources.get('cancel'), function()
 	{
 		editorUi.hideDialog();

src/main/webapp/js/diagramly/DriveClient.js

@@ -1094,6 +1094,16 @@ DriveClient.prototype.getXmlFile = function(resp, success, error, ignoreMime, re
 							}
 						}
 					}
+					else if (/\.pdf$/i.test(resp.title))
+					{
+						var xml = Editor.extractGraphModelFromPdf(data);
+						
+						if (xml != null && xml.length > 0)
+						{
+							importFile = true;
+							data = xml;
+						}
+					}
 					// Checks for base64 encoded mxfile
 					else if (data.substring(0, 32) == 'data:image/png;base64,PG14ZmlsZS')
 					{
@@ -1151,7 +1161,7 @@ DriveClient.prototype.getXmlFile = function(resp, success, error, ignoreMime, re
 			}
 		}), error, ((resp.mimeType != null && resp.mimeType.substring(0, 6) == 'image/' &&
 			resp.mimeType.substring(0, 9) != 'image/svg')) || /\.png$/i.test(resp.title) ||
-			/\.jpe?g$/i.test(resp.title));
+			/\.jpe?g$/i.test(resp.title) || /\.pdf$/i.test(resp.title));
 	}
 	catch (e)
 	{

src/main/webapp/js/diagramly/DropboxClient.js

@@ -297,7 +297,7 @@ DropboxClient.prototype.getFile = function(path, success, error, asLibrary)
 	var binary = /\.png$/i.test(path);
 
 	if (/^https:\/\//i.test(path) || /\.v(dx|sdx?)$/i.test(path) || /\.gliffy$/i.test(path) ||
-		(!this.ui.useCanvasForExport && binary))
+		 /\.pdf$/i.test(path) || (!this.ui.useCanvasForExport && binary))
 	{
 		var fn = mxUtils.bind(this, function()
 		{

src/main/webapp/js/diagramly/Editor.js

@@ -562,6 +562,136 @@
 		return xml;
 	};
 
+	/**
+	 * Static method for parsing PDF files.
+	 */
+	Editor.extractGraphModelFromPdf = function(base64)
+	{
+		base64 = base64.substring(base64.indexOf(',') + 1);
+
+		// Workaround for invalid character error in Safari
+		var f = (window.atob && !mxClient.IS_SF) ? atob(base64) : Base64.decode(base64, true);
+		var check = '\n/Subject (';
+		var result = null;
+		var curline = '';
+		var checked = 0;
+		var pos = 0;
+		var obj = [];
+		var buf = null;
+		var nr = null;
+		
+		while (pos < f.length)
+		{
+			var b = f.charCodeAt(pos);
+			pos += 1;
+			
+			if (b != 10)
+			{
+				curline += String.fromCharCode(b);
+			}
+			
+			if (b == check.charCodeAt(checked))
+			{
+				checked++;
+			}
+			else
+			{
+				checked = 0;
+			}
+			
+			if (checked == check.length)
+			{
+				var end = f.indexOf(')\n', pos);
+				
+				// Default case is XML inlined in Subject metadata
+				if (end > pos)
+				{
+					result = f.substring(pos, end);
+					
+					break;
+				}
+			}
+			
+			// Creates table for lookup if no inline data is found
+			if (b == 10)
+			{
+				if (curline == 'endobj')
+				{
+					buf = null;
+				}
+				else if (curline.substring(curline.length - 3, curline.length) == 'obj' ||
+					curline == 'xref' || curline == 'trailer')
+				{
+					buf = [];
+					obj[curline.split(' ')[0]] = buf;
+				}
+				else if (buf != null)
+				{
+					buf.push(curline);
+				}
+				
+				curline = '';
+			}
+		}
+		
+		// Extract XML via references
+		if (result == null)
+		{
+			result = Editor.extractGraphModelFromXref(obj);
+		}
+		
+		if (result != null)
+		{
+			result = decodeURIComponent(result.
+					replace(/\\\(/g, "(").
+					replace(/\\\)/g, ")"));
+		}
+		
+		return result;
+	};
+
+	/**
+	 * Static method for extracting Subject via references of the form
+	 * 
+	 * << /Size 33 /Root 20 0 R /Info 1 0 R and 1 0 obj << /Subject 22 0 R
+	 * 
+	 * Where Info is the metadata block and Subject is the data block.
+	 */
+	Editor.extractGraphModelFromXref = function(obj)
+	{
+		var trailer = obj['trailer'];
+		var result = null;
+
+		// Gets Info object
+		if (trailer != null)
+		{
+			var arr = /.* \/Info (\d+) (\d+) R/g.exec(trailer.join('\n'));
+			
+			if (arr != null && arr.length > 0)
+			{
+				var info = obj[arr[1]];
+				
+				if (info != null)
+				{
+					arr = /.* \/Subject (\d+) (\d+) R/g.exec(info.join('\n'));
+				
+					if (arr != null && arr.length > 0)
+					{
+						var subj = obj[arr[1]];
+						
+						if (subj != null)
+						{
+							subj = subj.join('\n');
+							result = subj.substring(1, subj.length - 1);
+						}
+					}
+				}
+			}
+		}
+		
+		return result;
+	};
+	
 	/**
 	 * Extracts the XML from the compressed or non-compressed text chunk.
 	 */

src/main/webapp/js/diagramly/EditorUi.js

@@ -525,7 +525,8 @@
 	 */
 	EditorUi.prototype.isAppCache = function()
 	{
-		return (urlParams['appcache'] == '1' || this.isOfflineApp());
+		return (urlParams['appcache'] == '1' || this.isOfflineApp()) &&
+			!('serviceWorker' in navigator);
 	};
 	
 	/**
@@ -1693,7 +1694,8 @@
 	 * @param {number} dx X-coordinate of the translation.
 	 * @param {number} dy Y-coordinate of the translation.
 	 */
-	EditorUi.prototype.downloadFile = function(format, uncompressed, addShadow, ignoreSelection, currentPage, pageVisible, transparent, scale, border, grid)
+	EditorUi.prototype.downloadFile = function(format, uncompressed, addShadow, ignoreSelection, currentPage,
+		pageVisible, transparent, scale, border, grid, includeXml)
 	{
 		try
 		{
@@ -1794,7 +1796,8 @@
 							this.editor.graph.pageVisible = pageVisible;
 						}
 						
-						var req = this.createDownloadRequest(newTitle, format, ignoreSelection, base64, transparent, currentPage, scale, border, grid);
+						var req = this.createDownloadRequest(newTitle, format, ignoreSelection, base64,
+							transparent, currentPage, scale, border, grid, includeXml);
 						this.editor.graph.pageVisible = prev;
 						
 						return req;
@@ -1818,7 +1821,8 @@
 	 * @param {number} dx X-coordinate of the translation.
 	 * @param {number} dy Y-coordinate of the translation.
 	 */
-	EditorUi.prototype.createDownloadRequest = function(filename, format, ignoreSelection, base64, transparent, currentPage, scale, border, grid)
+	EditorUi.prototype.createDownloadRequest = function(filename, format, ignoreSelection, base64, transparent,
+		currentPage, scale, border, grid, includeXml)
 	{
 		var graph = this.editor.graph;
 		var bounds = graph.getGraphBounds();
@@ -1835,7 +1839,7 @@
 			throw {message: mxResources.get('drawingTooLarge')};
 		}
 		
-		var embed = '0';
+		var embed = (includeXml) ? '1' : '0';
        	
 		if (format == 'pdf' && currentPage == false)
 		{
@@ -3224,6 +3228,17 @@
 								
 								var doImport = mxUtils.bind(this, function(theData, theMimeType)
 								{
+									if (theData != null && theMimeType == 'application/pdf')
+									{
+										var xml = Editor.extractGraphModelFromPdf(theData);
+					
+										if (xml != null && xml.length > 0)
+										{
+											theMimeType = 'text/xml';
+											theData = xml;
+										}
+									}
+									
 									if (theData != null && theMimeType == 'text/xml')
 									{
 										var doc = mxUtils.parseXml(theData);
@@ -6816,7 +6831,8 @@
 		try
 		{
 			var binary = !noBinary && (forceBinary || /(\.png)($|\?)/i.test(url) ||
-				/(\.jpe?g)($|\?)/i.test(url) || /(\.gif)($|\?)/i.test(url));
+				/(\.jpe?g)($|\?)/i.test(url) || /(\.gif)($|\?)/i.test(url) ||
+				/(\.pdf)($|\?)/i.test(url));
 			retry = (retry != null) ? retry : true;
 			
 			var fn = mxUtils.bind(this, function()
@@ -7706,15 +7722,25 @@
 			{
 				var graph = this.editor.graph;
 				
+				// Checks for embedded XML in PDF
+				if (text.substring(0, 28) == 'data:application/pdf;base64,')
+	    		{
+					var xml = Editor.extractGraphModelFromPdf(text);
+					
+					if (xml != null && xml.length > 0)
+					{
+						return this.importXml(xml, dx, dy, crop, true);
+					}
+	    		}
+				
 				// Checks for embedded XML in PNG
 				if (text.substring(0, 22) == 'data:image/png;base64,')
 				{
 					var xml = this.extractGraphModelFromPng(text);
-					var result = this.importXml(xml, dx, dy, crop, true); 
 					
-					if (result.length > 0)
+					if (xml != null && xml.length > 0)
 					{
-						return result;
+						return this.importXml(xml, dx, dy, crop, true);
 					}
 				}
 				
@@ -8329,6 +8355,8 @@
 			var gs = graph.gridSize;
 	
 			fn = (fn != null) ? fn : mxUtils.bind(this, function(data, mimeType, x, y, w, h, filename, done, file)
+			{
+				try
 				{
 					if (data != null && data.substring(0, 10) == '<mxlibrary')
 					{
@@ -8341,6 +8369,13 @@
 					{
 						return this.importFile(data, mimeType, x, y, w, h, filename, done, file, crop, ignoreEmbeddedXml);
 					}
+				}
+				catch (e)
+				{
+					this.handleError(e);
+					
+					return null;
+				}
 			});
 			
 			resultFn = (resultFn != null) ? resultFn : mxUtils.bind(this, function(cells)
@@ -8631,7 +8666,9 @@
 						    		}
 						    		else
 						    		{
-										fn(e.target.result, file.type, x + index * gs, y + index * gs, 240, 160, file.name, function(cells)
+						    			var data = e.target.result;
+						    			
+										fn(data, file.type, x + index * gs, y + index * gs, 240, 160, file.name, function(cells)
 										{
 											barrier(index, function()
 				    	    				{
@@ -8653,7 +8690,7 @@
 		    	    				});
 								}, file);
 							}
-							else if (file.type.substring(0, 5) == 'image')
+							else if (file.type.substring(0, 5) == 'image' || file.type == 'application/pdf')
 							{
 								reader.readAsDataURL(file);
 							}
@@ -10667,6 +10704,10 @@
 								{
 									name = name.substring(0, name.length - 4) + '.drawio';
 								}
+								else if (/(\.pdf)$/i.test(name))
+								{
+									name = name.substring(0, name.length - 4) + '.drawio';
+								}
 								
 								var handleResult = mxUtils.bind(this, function(xml)
 								{
@@ -10797,6 +10838,15 @@
 									{
 										data = this.extractGraphModelFromPng(data);
 									}
+									else if (file.type == 'application/pdf')
+						    		{
+										var xml = Editor.extractGraphModelFromPdf(data);
+										
+										if (xml != null)
+										{
+											data = xml;
+										}
+						    		}
 									
 									this.spinner.stop();
 									this.openLocalFile(data, name, temp);
@@ -10816,7 +10866,9 @@
 						window.openFile = null;
 					});
 					
-					if (file.type.substring(0, 5) === 'image' && file.type.substring(0, 9) !== 'image/svg')
+					if ((file.type.substring(0, 5) === 'image' ||
+						file.type === 'application/pdf') &&
+						file.type.substring(0, 9) !== 'image/svg')
 					{
 						reader.readAsDataURL(file);
 					}
@@ -12876,7 +12928,7 @@
 		
 		if (this.isAppCache())
 		{
-			var appCache = applicationCache;
+			var appCache = window.applicationCache;
 			
 			// NOTE: HTML5 Cache is deprecated
 			if (appCache != null && this.offlineStatus == null)
@@ -12905,7 +12957,6 @@
 					}
 				}));
 				
-				var appCache = window.applicationCache;
 				var lastStatus = null;
 				
 				var updateStatus = mxUtils.bind(this, function()

src/main/webapp/js/diagramly/ElectronApp.js

@@ -222,7 +222,7 @@ mxStencilRegistry.allowEval = false;
 		        {
 		        	var path = paths[0];
 		        	var asImage = /\.png$/i.test(path) || /\.gif$/i.test(path) || /\.jpe?g$/i.test(path);
-		        	var encoding = (asImage || /\.vsdx$/i.test(path) || /\.vssx$/i.test(path)) ?
+		        	var encoding = (asImage || /\.pdf$/i.test(path) || /\.vsdx$/i.test(path) || /\.vssx$/i.test(path)) ?
 		        		'base64' : 'utf-8';
 
 					if (editorUi.spinner.spin(document.body, mxResources.get('loading')))
@@ -278,7 +278,16 @@ mxStencilRegistry.allowEval = false;
 									}
 									else
 									{
-										if (/\.png$/i.test(path))
+										if (/\.pdf$/i.test(path))
+									    {
+											var tmp = Editor.extractGraphModelFromPdf(data);
+											
+											if (tmp != null)
+											{
+												data = tmp;
+											}
+							    		}
+										else if (/\.png$/i.test(path))
 										{
 											var tmp = editorUi.extractGraphModelFromPng(data);
 											
@@ -634,7 +643,7 @@ mxStencilRegistry.allowEval = false;
 		var index = path.lastIndexOf('.png');
 		var isPng = index > -1 && index == path.length - 4;
 		var isVsdx = /\.vsdx$/i.test(path) || /\.vssx$/i.test(path);
-		var encoding = isVsdx? null : (isPng ? 'base64' : 'utf-8');
+		var encoding = isVsdx? null : ((isPng || /\.pdf$/i.test(path)) ? 'base64' : 'utf-8');
 
 		fs.readFile(path, encoding, mxUtils.bind(this, function (e, data)
 		{
@@ -649,7 +658,7 @@ mxStencilRegistry.allowEval = false;
 				fileEntry.name = path.replace(/^.*[\\\/]/, '');
 				fileEntry.type = encoding;
 
-				//VSDX files are imported instead of being open
+				// VSDX and PDF files are imported instead of being opened
 				if (isVsdx)
 				{
 					var name = fileEntry.name;
@@ -694,8 +703,19 @@ mxStencilRegistry.allowEval = false;
 					
 					return;
 				}
+				else if (/\.pdf$/i.test(path))
+			    {
+					var tmp = Editor.extractGraphModelFromPdf('data:application/pdf;base64,' + data);
 					
-				if (isPng)
+					if (tmp != null)
+					{
+						var name = fileEntry.name;
+						fn(null, tmp, null, name.substring(0, name.lastIndexOf('.')) + '.drawio');
+						
+						return;
+					}
+	    		}
+				else if (isPng)
 				{
 					// Detecting png by extension. Would need https://github.com/mscdex/mmmagic
 					// to do it by inspection

src/main/webapp/js/diagramly/GitHubClient.js

@@ -400,7 +400,7 @@ GitHubClient.prototype.getFile = function(path, success, error, asLibrary, check
 	
 	// Handles .vsdx, Gliffy and PNG+XML files by creating a temporary file
 	if (!checkExists && (/\.v(dx|sdx?)$/i.test(path) || /\.gliffy$/i.test(path) ||
-		(!this.ui.useCanvasForExport && binary)))
+		/\.pdf$/i.test(path) || (!this.ui.useCanvasForExport && binary)))
 	{
 		// Should never be null
 		if (this.token != null)

src/main/webapp/js/diagramly/GitLabClient.js

@@ -308,16 +308,34 @@ GitLabClient.prototype.getFile = function(path, success, error, asLibrary, check
 		
 		// Handles .vsdx, Gliffy and PNG+XML files by creating a temporary file
 		if (!checkExists && (/\.v(dx|sdx?)$/i.test(path) || /\.gliffy$/i.test(path) ||
-			(!this.ui.useCanvasForExport && binary)))
+			/\.pdf$/i.test(path) || (!this.ui.useCanvasForExport && binary)))
 		{
 			// Should never be null
 			if (this.token != null)
 			{
-				var url = this.baseUrl + '/projects/' + encodeURIComponent(org + '/' + repo) + '/repository/files/' + encodeURIComponent(ref);
+				// Adds random parameter to bypass cache
+				var rnd = '&t=' + new Date().getTime();
+				var url = this.baseUrl + '/projects/' + encodeURIComponent(org + '/' + repo) +
+					'/repository/files/' + encodeURIComponent(path) + '?ref=' + ref;
 				var tokens = path.split('/');
 				var name = (tokens.length > 0) ? tokens[tokens.length - 1] : path;
 				
-				this.ui.convertFile(url, name, null, this.extension, success, error);
+				this.ui.convertFile(url + rnd, name, null, this.extension, success, error, mxUtils.bind(this, function(url, cb, err)
+				{
+					var req = new mxXmlRequest(url, null, 'GET');
+					
+					this.executeRequest(req, mxUtils.bind(this, function(req)
+					{
+						try
+						{
+							cb(this.getFileContent(JSON.parse(req.getText())));
+						}
+						catch (e)
+						{
+							err(e);
+						}
+					}), err);
+				}));
 			}
 			else
 			{
@@ -353,16 +371,9 @@ GitLabClient.prototype.getFile = function(path, success, error, asLibrary, check
  * @param {number} dx X-coordinate of the translation.
  * @param {number} dy Y-coordinate of the translation.
  */
-GitLabClient.prototype.createGitLabFile = function(org, repo, ref, data, asLibrary, refPos)
+GitLabClient.prototype.getFileContent = function(data)
 {
-	var gitLabUrl = DRAWIO_GITLAB_URL + '/';
-	var htmlUrl = gitLabUrl + org + '/' + repo + '/blob/' + ref + '/' + data.file_path;
-	var downloadUrl = gitLabUrl + org + '/' + repo + '/raw/' + ref + '/' + data.file_path + '?inline=false';
 	var fileName = data.file_name;
-
-	var meta = {'org': org, 'repo': repo, 'ref': ref, 'name': fileName,
-		'path': data.file_path, 'html_url': htmlUrl, 'download_url': downloadUrl,
-		'last_commit_id': data.last_commit_id, 'refPos': refPos};
 	var content = data.content;
 	
 	if (data.encoding === 'base64')
@@ -375,6 +386,10 @@ GitLabClient.prototype.createGitLabFile = function(org, repo, ref, data, asLibra
 		{
 			content = 'data:image/gif;base64,' + content;
 		}
+		else if (/\.pdf$/i.test(fileName))
+		{
+			content = 'data:application/pdf;base64,' + content;
+		}
 		else
 		{
 			if (/\.png$/i.test(fileName))
@@ -397,6 +412,27 @@ GitLabClient.prototype.createGitLabFile = function(org, repo, ref, data, asLibra
 		}
 	}
 	
+	return content;
+};
+
+/**
+ * Translates this point by the given vector.
+ * 
+ * @param {number} dx X-coordinate of the translation.
+ * @param {number} dy Y-coordinate of the translation.
+ */
+GitLabClient.prototype.createGitLabFile = function(org, repo, ref, data, asLibrary, refPos)
+{
+	var gitLabUrl = DRAWIO_GITLAB_URL + '/';
+	var htmlUrl = gitLabUrl + org + '/' + repo + '/blob/' + ref + '/' + data.file_path;
+	var downloadUrl = gitLabUrl + org + '/' + repo + '/raw/' + ref + '/' + data.file_path + '?inline=false';
+	var fileName = data.file_name;
+
+	var meta = {'org': org, 'repo': repo, 'ref': ref, 'name': fileName,
+		'path': data.file_path, 'html_url': htmlUrl, 'download_url': downloadUrl,
+		'last_commit_id': data.last_commit_id, 'refPos': refPos};
+	var content = this.getFileContent(data);
+	
 	return (asLibrary) ? new GitLabLibrary(this.ui, content, meta) : new GitLabFile(this.ui, content, meta);
 };
 

src/main/webapp/js/diagramly/Menus.js

@@ -319,7 +319,7 @@
 					}
 				};
 				
-				var dlgH = 172;
+				var dlgH = 180;
 				
 				if (editorUi.pdfPageExport && !noPages)
 				{
@@ -350,9 +350,21 @@
 					}
 				}
 				
+				var includeOption = !mxClient.IS_CHROMEAPP && !EditorUi.isElectronApp &&
+					editorUi.getServiceName() == 'draw.io';
+				var include = (includeOption) ? editorUi.addCheckbox(div,
+					mxResources.get('includeCopyOfMyDiagram'), true) : null;
+					
+				if (includeOption)
+				{
+					dlgH += 30;
+				}
+				
 				var dlg = new CustomDialog(editorUi, div, mxUtils.bind(this, function()
 				{
-					editorUi.downloadFile('pdf', null, null, !selection.checked, noPages? true : !allPages.checked, !crop.checked, null, null, null, grid.checked);
+					editorUi.downloadFile('pdf', null, null, !selection.checked,
+						noPages? true : !allPages.checked, !crop.checked, null, null,
+						null, grid.checked, include != null && include.checked);
 				}), null, mxResources.get('export'));
 				editorUi.showDialog(dlg.container, 300, dlgH, true, true);
 			}
@@ -1979,6 +1991,10 @@
 				{
 					mime = 'image/gif';
 				}
+				else if (/\.pdf$/i.test(filename))
+				{
+					mime = 'application/pdf';
+				}
 				
 				return mime;
 			});
@@ -3210,9 +3226,9 @@
 					this.addMenuItems(menu, ['-', 'revisionHistory'], parent);
 				}
 				
-				this.addMenuItems(menu, ['-', 'pageSetup', 'print', '-', 'rename', 'save'], parent);
+				this.addMenuItems(menu, ['-', 'pageSetup', 'print', '-', 'rename', urlParams['noSaveBtn'] == '1'? 'saveAndExit' : 'save'], parent);
 				
-				if (urlParams['saveAndExit'] == '1')
+				if (urlParams['saveAndExit'] == '1' && urlParams['noSaveBtn'] != '1')
 				{
 					this.addMenuItems(menu, ['saveAndExit'], parent);
 				}

src/main/webapp/js/diagramly/OneDriveClient.js

@@ -502,7 +502,7 @@ OneDriveClient.prototype.getFile = function(id, success, error, denyConvert, asL
 			
 			// Handles .vsdx, Gliffy and PNG+XML files by creating a temporary file
 			if (/\.v(dx|sdx?)$/i.test(meta.name) || /\.gliffy$/i.test(meta.name) ||
-				(!this.ui.useCanvasForExport && binary))
+				/\.pdf$/i.test(meta.name) || (!this.ui.useCanvasForExport && binary))
 			{
 				var mimeType = (meta.file != null) ? meta.file.mimeType : null;
 				this.ui.convertFile(meta['@microsoft.graph.downloadUrl'], meta.name, mimeType,
@@ -618,7 +618,8 @@ OneDriveClient.prototype.getFile = function(id, success, error, denyConvert, asL
 			    		error(this.parseRequestText(req));
 			    	}
 				}), binary || (meta.file != null && meta.file.mimeType != null &&
-					meta.file.mimeType.substring(0, 6) == 'image/'));
+					(meta.file.mimeType.substring(0, 6) == 'image/' ||
+					meta.file.mimeType == 'application/pdf')));
 			}
 		}
 		else

src/main/webapp/js/diagramly/mxFreehand.js

@@ -19,7 +19,7 @@ function mxFreehand(graph)
 	var autoClose = true;
 	var buffer = []; // Contains the last positions of the mouse cursor
 	var enabled = false;
-	var stopClickEnabled = false;
+	var stopClickEnabled = true
 
 	this.setClosedPath = function(isClosed)//TODO add closed settings
 	{

src/main/webapp/service-worker.js

@@ -0,0 +1,200 @@
+importScripts('https://storage.googleapis.com/workbox-cdn/releases/4.3.1/workbox-sw.js');
+
+if (workbox)
+{
+	// This is replaced in build process
+	workbox.precaching.precacheAndRoute([
+  {
+    "url": "js/app.min.js",
+    "revision": "542275c642a1a222cfb1c92a31aba4cb"
+  },
+  {
+    "url": "index.html",
+    "revision": "0ee7e232e5e7e8cb87df23a7edd625db"
+  },
+  {
+    "url": "open.html",
+    "revision": "cb5b1553e62c4c21fae0a3890bd9bc10"
+  },
+  {
+    "url": "js/shapes.min.js",
+    "revision": "114ed79fe7b406c1b7d034459b989e1d"
+  },
+  {
+    "url": "js/stencils.min.js",
+    "revision": "14ffe15bc8092749f917b927e4a1601a"
+  },
+  {
+    "url": "js/extensions.min.js",
+    "revision": "ee6f86acaeb0ebd635102442adc45380"
+  },
+  {
+    "url": "js/diagramly/ElectronApp.js",
+    "revision": "589bd3c8cf3107a71286adf2db71b4d2"
+  },
+  {
+    "url": "styles/grapheditor.css",
+    "revision": "36c4e00a4c9d48b8344fc6d8592672de"
+  },
+  {
+    "url": "styles/atlas.css",
+    "revision": "40f54334c7a62821dbf1f7c7d8ad62cc"
+  },
+  {
+    "url": "styles/dark.css",
+    "revision": "c7688082f9e2101d8c4150124835070f"
+  },
+  {
+    "url": "favicon.ico",
+    "revision": "fab2d88b37c72d83607527573de45281"
+  },
+  {
+    "url": "mxgraph/css/common.css",
+    "revision": "b5b7280ec98671bb6c3847a36bc7ea12"
+  },
+  {
+    "url": "mxgraph/images/maximize.gif",
+    "revision": "5cd13d6925493ab51e876694cc1c2ec2"
+  },
+  {
+    "url": "mxgraph/images/minimize.gif",
+    "revision": "8957741b9b0f86af9438775f2aadbb54"
+  },
+  {
+    "url": "mxgraph/images/close.gif",
+    "revision": "8b84669812ac7382984fca35de8da48b"
+  },
+  {
+    "url": "mxgraph/images/resize.gif",
+    "revision": "a6477612b3567a34033f9cac6184eed3"
+  },
+  {
+    "url": "mxgraph/images/separator.gif",
+    "revision": "7819742ff106c97da7a801c2372bbbe5"
+  },
+  {
+    "url": "mxgraph/images/window.gif",
+    "revision": "fd9a21dd4181f98052a202a0a01f18ab"
+  },
+  {
+    "url": "mxgraph/images/window-title.gif",
+    "revision": "3fb1d6c43246cdf991a11dfe826dfe99"
+  },
+  {
+    "url": "mxgraph/images/button.gif",
+    "revision": "00759bdc3ad218fa739f584369541809"
+  },
+  {
+    "url": "mxgraph/images/point.gif",
+    "revision": "83a43717b284902442620f61bc4e9fa6"
+  },
+  {
+    "url": "resources/dia.txt",
+    "revision": "be24e2e6df3b5afcdd9267ce112b4aef"
+  },
+  {
+    "url": "images/delete.png",
+    "revision": "5f2350f2fd20f1a229637aed32ed8f29"
+  },
+  {
+    "url": "images/droptarget.png",
+    "revision": "bbf7f563fb6784de1ce96f329519b043"
+  },
+  {
+    "url": "images/help.png",
+    "revision": "9266c6c3915bd33c243d80037d37bf61"
+  },
+  {
+    "url": "images/download.png",
+    "revision": "35418dd7bd48d87502c71b578cc6c37f"
+  },
+  {
+    "url": "images/drawlogo.svg",
+    "revision": "4bf4d14ebcf072d8bd4c5a1c89e88fc6"
+  },
+  {
+    "url": "images/drawlogo-gray.svg",
+    "revision": "0aabacbc0873816e1e09e4736ae44c7d"
+  },
+  {
+    "url": "images/drawlogo-text-bottom.svg",
+    "revision": "f6c438823ab31f290940bd4feb8dd9c2"
+  },
+  {
+    "url": "images/logo-flat.png",
+    "revision": "038070ab43aee6e54a791211859fc67b"
+  },
+  {
+    "url": "images/osa_drive-harddisk.png",
+    "revision": "b954e1ae772087c5b4c6ae797e1f9649"
+  },
+  {
+    "url": "images/osa_database.png",
+    "revision": "c350d9d9b95f37b6cfe798b40ede5fb0"
+  },
+  {
+    "url": "images/glyphicons_star.png",
+    "revision": "148e6c741a354429f2ebb9698024d375"
+  },
+  {
+    "url": "images/logo-confluence.png",
+    "revision": "ed1e55d44ae5eba8f999aba2c93e8331"
+  },
+  {
+    "url": "images/logo-jira.png",
+    "revision": "f8d460555a0d1f87cfd901e940666629"
+  },
+  {
+    "url": "images/clear.gif",
+    "revision": "db13c778e4382e0b55258d0f811d5d70"
+  },
+  {
+    "url": "images/spin.gif",
+    "revision": "487cbb40b9ced439aa1ad914e816d773"
+  },
+  {
+    "url": "images/checkmark.gif",
+    "revision": "ba764ce62f2bf952df5bbc2bb4d381c5"
+  },
+  {
+    "url": "images/favicon-16x16.png",
+    "revision": "1a79d5461a5d2bf21f6652e0ac20d6e5"
+  },
+  {
+    "url": "images/favicon-32x32.png",
+    "revision": "e3b92da2febe70bad5372f6f3474b034"
+  },
+  {
+    "url": "images/android-chrome-192x192.png",
+    "revision": "a886234330ea25d4ba1c47f678b00ef2"
+  },
+  {
+    "url": "images/android-chrome-512x512.png",
+    "revision": "959b5fac2453963ff6d60fb85e4b73fd"
+  },
+  {
+    "url": "images/glyphicons_google.png",
+    "revision": "e1f3ca3b152850edafb5a4040b140a5f"
+  },
+  {
+    "url": "images/glyphicons_facebook.png",
+    "revision": "ebaa4a270c04b83334c75ed2d39d390f"
+  },
+  {
+    "url": "images/glyphicons_twitter.png",
+    "revision": "e78235619e907edae61a962dc5b239af"
+  },
+  {
+    "url": "images/glyphicons_github.png",
+    "revision": "ac57a61489e8b21910bc6c5af921cb94"
+  },
+  {
+    "url": "images/hs.png",
+    "revision": "fefa1a03d92ebad25c88dca94a0b63db"
+  }
+],
+	{
+	  // Ignore all URL parameters.
+	  ignoreURLParametersMatching: [/.*/]
+	});
+}