some fixes
Mark MacKay
parent
3b177f5d56
commit
d51c609bf5
|
|
@ -4,21 +4,32 @@
|
|||
<meta http-equiv="Content-type" content="text/html;charset=UTF-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="chrome=1"/>
|
||||
<link rel="icon" type="image/png" href="images/logo.png"/>
|
||||
<link rel="stylesheet" href="svg-editor.css" type="text/css"/>
|
||||
<script type="text/javascript" src="jquery.js"></script>
|
||||
<link rel="stylesheet" href="css/method-draw.css" type="text/css"/>
|
||||
<style type="text/css">
|
||||
#browser-not-supported {
|
||||
max-width: 600px;
|
||||
margin: 0 auto;
|
||||
background: #222;
|
||||
color: #eee;
|
||||
font-size: 18px;
|
||||
line-height: 180%;
|
||||
padding: 64px;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #c90;
|
||||
}
|
||||
</style>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
|
||||
<title>Browser does not support SVG | Method Draw</title>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div id="browser-not-supported">
|
||||
<img style="float:left;padding:10px;" src="images/logo.png" width="48" height="48" alt="SVG-edit logo" /><br />
|
||||
<p>Sorry, but your browser does not support SVG. Below is a list of alternate browsers and versions that support SVG and SVG-edit (from <a href="http://caniuse.com/#cats=SVG">caniuse.com</a>).</p>
|
||||
<p>Try the latest version of <a href="http://www.getfirefox.com">Firefox</a>, <a href="http://www.google.com/chrome/">Google Chrome</a>, <a href="http://www.apple.com/safari/download/">Safari</a>, <a href="http://www.opera.com/download/">Opera</a> or <a href="http://windows.microsoft.com/ie9">Internet Explorer</a>.</p>
|
||||
<img src="images/logo.png" width="16" height="16" alt="Method Draw Logo" /><br />
|
||||
<p>Sorry, but your browser does not support SVG. Below is a list of alternate browsers and versions that support SVG and Method Draw.</p>
|
||||
<p>Try the latest version of <a href="http://www.getfirefox.com">Firefox</a>, <a href="http://www.google.com/chrome/">Google Chrome</a>, <a href="http://www.apple.com/safari/download/">Safari</a>, <a href="http://www.opera.com/download/">Opera</a> or <a href="https://www.microsoft.com/en-us/edge">Microsoft Edge</a>.</p>
|
||||
|
||||
<script type="text/javascript">
|
||||
var viewportHeight =(window.innerHeight ? window.innerHeight : $(window).height()) - 140;
|
||||
document.write('<iframe width="100%" height="'+viewportHeight+'" src="http://caniuse.com/#cats=SVG"></iframe>');
|
||||
</script>
|
||||
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -441,7 +441,7 @@ f)}};this.contentW=wb().w;this.contentH=wb().h;this.updateCanvas=function(g,h){d
|
|||
za.selectorParentGroup.setAttribute("transform","translate("+G+","+E+")");return{x:G,y:E,old_x:C,old_y:A,d_x:G-C,d_y:E-A}};this.setBackground=function(g,h){var m=oa("canvasBackground"),C=$(m).find("rect")[0],A=oa("background_image");C.setAttribute("fill",g);if(h){if(!A){A=k.createElementNS(c,"image");na(A,{id:"background_image",width:"100%",height:"100%",preserveAspectRatio:"xMinYMin",style:"pointer-events:none"})}Y(A,h);m.appendChild(A)}else A&&A.parentNode.removeChild(A)};this.cycleElement=function(g){var h=
|
||||
H[0],m=false,C=Za(K||D().getCurrentLayer());if(C.length){if(h==null){g=g?C.length-1:0;m=C[g]}else for(var A=C.length;A--;)if(C[A]==h){g=g?A-1:A+1;if(g>=C.length)g=0;else if(g<0)g=C.length-1;m=C[g];break}mb([m],true);da("selected",H)}};this.clear();this.getPrivateMethods=function(){return{addCommandToHistory:wa,setGradient:Lb,addSvgElementFromJson:U,assignAttributes:na,BatchCommand:qa,call:da,ChangeElementCommand:La,copyElem:lb,ffClone:P,findDefs:hb,findDuplicateGradient:Hb,getElem:oa,getId:ha,getIntersectionList:db,
|
||||
getMouseTarget:Cb,getNextId:V,getPathBBox:ca,getUrlFromAttr:ja,hasMatrixTransform:ia,identifyLayers:yb,InsertElementCommand:Va,isIdentity:svgedit.math.isIdentity,logMatrix:Pa,matrixMultiply:T,MoveElementCommand:Ea,preventClickDefault:Bb,recalculateAllSelectedDimensions:ba,recalculateDimensions:Wa,remapElement:Ra,RemoveElementCommand:Ua,removeUnusedDefElems:Kb,round:kb,runExtensions:ob,sanitizeSvg:Ia,SVGEditTransformList:svgedit.transformlist.SVGTransformList,toString:toString,transformBox:svgedit.math.transformBox,
|
||||
transformListToTransform:ga,transformPoint:M,walkTree:svgedit.utilities.walkTree}}};(function(){if(!window.methodDraw)window.methodDraw=function(a){function n(d,q){var z=e.setSvgString(d)!==false;q=q||a.noop;z?q(true):a.alert("Error: Unable to load SVG data",function(){q(false)})}var e,c={},l=false,u={canvas_expansion:1,dimensions:[580,400],initFill:{color:"fff",opacity:1},initStroke:{width:1.5,color:"000",opacity:1},initOpacity:1,imgPath:"images/",extPath:"extensions/",jGraduatePath:"lib/jgraduate/images/",extensions:[],initTool:"select",wireframe:false,colorPickerCSS:false,gridSnapping:false,
|
||||
transformListToTransform:ga,transformPoint:M,walkTree:svgedit.utilities.walkTree}}};(function(){if(!window.methodDraw)window.methodDraw=function(a){function n(d,q){var z=e.setSvgString(d)!==false;q=q||a.noop;z?q(true):a.alert("Error: Unable to load SVG data",function(){q(false)})}var e,c={},l=false,u={canvas_expansion:1,dimensions:[800,600],initFill:{color:"fff",opacity:1},initStroke:{width:1.5,color:"000",opacity:1},initOpacity:1,imgPath:"images/",extPath:"extensions/",jGraduatePath:"lib/jgraduate/images/",extensions:[],initTool:"select",wireframe:false,colorPickerCSS:false,gridSnapping:false,
|
||||
gridColor:"#000",baseUnit:"px",snappingStep:10,showRulers:svgedit.browser.isTouch()?false:true,show_outside_canvas:false,no_save_warning:true,initFont:"Helvetica, Arial, sans-serif"},b={};c.curConfig=u;c.tool_scale=1;c.setConfig=function(d){a.extend(true,u,d);if(d.extensions)u.extensions=d.extensions};c.setCustomHandlers=function(d){c.ready(function(){if(d.open){a('#tool_open > input[type="file"]').remove();a("#tool_open").show();e.open=d.open}if(d.save){c.show_save_warning=false;e.bind("saved",d.save)}d.pngsave&&
|
||||
e.bind("exported",d.pngsave)})};c.randomizeIds=function(){e.randomizeIds(arguments)};c.init=function(){(function(){var f=window.opener;if(f)try{var s=f.document.createEvent("Event");s.initEvent("methodDrawReady",true,true);f.document.documentElement.dispatchEvent(s)}catch(o){}})();a("body").toggleClass("touch",svgedit.browser.isTouch());a("#canvas_width").val(u.dimensions[0]);a("#canvas_height").val(u.dimensions[1]);var d=function(){a.each(u.extensions,function(){var f=this;a.getScript(u.extPath+
|
||||
f,function(s){if(!s){s=document.createElement("script");s.src=u.extPath+f;document.querySelector("head").appendChild(s)}})})};document.location.protocol==="file:"?setTimeout(d,100):d();a.svgIcons(u.imgPath+"svg_edit_icons.svg",{w:27,h:27,id_match:false,no_img:true,fallback_path:u.imgPath,fallback:{logo:"logo.png",select:"select.png",select_node:"select_node.png",pencil:"pencil.png",pen:"line.png",rect:"square.png",ellipse:"ellipse.png",path:"path.png",text:"text.png",image:"image.png",zoom:"zoom.png",
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@
|
|||
var is_ready = false;
|
||||
var curConfig = {
|
||||
canvas_expansion: 1,
|
||||
dimensions: [580,400],
|
||||
dimensions: [800,600],
|
||||
initFill: {color: 'fff', opacity: 1},
|
||||
initStroke: {width: 1.5, color: '000', opacity: 1},
|
||||
initOpacity: 1,
|
||||
|
|
|
|||
|
|
@ -4,21 +4,32 @@
|
|||
<meta http-equiv="Content-type" content="text/html;charset=UTF-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="chrome=1"/>
|
||||
<link rel="icon" type="image/png" href="images/logo.png"/>
|
||||
<link rel="stylesheet" href="svg-editor.css" type="text/css"/>
|
||||
<script type="text/javascript" src="jquery.js"></script>
|
||||
<link rel="stylesheet" href="css/method-draw.css" type="text/css"/>
|
||||
<style type="text/css">
|
||||
#browser-not-supported {
|
||||
max-width: 600px;
|
||||
margin: 0 auto;
|
||||
background: #222;
|
||||
color: #eee;
|
||||
font-size: 18px;
|
||||
line-height: 180%;
|
||||
padding: 64px;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #c90;
|
||||
}
|
||||
</style>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
|
||||
<title>Browser does not support SVG | Method Draw</title>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div id="browser-not-supported">
|
||||
<img style="float:left;padding:10px;" src="images/logo.png" width="48" height="48" alt="SVG-edit logo" /><br />
|
||||
<p>Sorry, but your browser does not support SVG. Below is a list of alternate browsers and versions that support SVG and SVG-edit (from <a href="http://caniuse.com/#cats=SVG">caniuse.com</a>).</p>
|
||||
<p>Try the latest version of <a href="http://www.getfirefox.com">Firefox</a>, <a href="http://www.google.com/chrome/">Google Chrome</a>, <a href="http://www.apple.com/safari/download/">Safari</a>, <a href="http://www.opera.com/download/">Opera</a> or <a href="http://windows.microsoft.com/ie9">Internet Explorer</a>.</p>
|
||||
<img src="images/logo.png" width="16" height="16" alt="Method Draw Logo" /><br />
|
||||
<p>Sorry, but your browser does not support SVG. Below is a list of alternate browsers and versions that support SVG and Method Draw.</p>
|
||||
<p>Try the latest version of <a href="http://www.getfirefox.com">Firefox</a>, <a href="http://www.google.com/chrome/">Google Chrome</a>, <a href="http://www.apple.com/safari/download/">Safari</a>, <a href="http://www.opera.com/download/">Opera</a> or <a href="https://www.microsoft.com/en-us/edge">Microsoft Edge</a>.</p>
|
||||
|
||||
<script type="text/javascript">
|
||||
var viewportHeight =(window.innerHeight ? window.innerHeight : $(window).height()) - 140;
|
||||
document.write('<iframe width="100%" height="'+viewportHeight+'" src="http://caniuse.com/#cats=SVG"></iframe>');
|
||||
</script>
|
||||
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -441,7 +441,7 @@ f)}};this.contentW=wb().w;this.contentH=wb().h;this.updateCanvas=function(g,h){d
|
|||
za.selectorParentGroup.setAttribute("transform","translate("+G+","+E+")");return{x:G,y:E,old_x:C,old_y:A,d_x:G-C,d_y:E-A}};this.setBackground=function(g,h){var m=oa("canvasBackground"),C=$(m).find("rect")[0],A=oa("background_image");C.setAttribute("fill",g);if(h){if(!A){A=k.createElementNS(c,"image");na(A,{id:"background_image",width:"100%",height:"100%",preserveAspectRatio:"xMinYMin",style:"pointer-events:none"})}Y(A,h);m.appendChild(A)}else A&&A.parentNode.removeChild(A)};this.cycleElement=function(g){var h=
|
||||
H[0],m=false,C=Za(K||D().getCurrentLayer());if(C.length){if(h==null){g=g?C.length-1:0;m=C[g]}else for(var A=C.length;A--;)if(C[A]==h){g=g?A-1:A+1;if(g>=C.length)g=0;else if(g<0)g=C.length-1;m=C[g];break}mb([m],true);da("selected",H)}};this.clear();this.getPrivateMethods=function(){return{addCommandToHistory:wa,setGradient:Lb,addSvgElementFromJson:U,assignAttributes:na,BatchCommand:qa,call:da,ChangeElementCommand:La,copyElem:lb,ffClone:P,findDefs:hb,findDuplicateGradient:Hb,getElem:oa,getId:ha,getIntersectionList:db,
|
||||
getMouseTarget:Cb,getNextId:V,getPathBBox:ca,getUrlFromAttr:ja,hasMatrixTransform:ia,identifyLayers:yb,InsertElementCommand:Va,isIdentity:svgedit.math.isIdentity,logMatrix:Pa,matrixMultiply:T,MoveElementCommand:Ea,preventClickDefault:Bb,recalculateAllSelectedDimensions:ba,recalculateDimensions:Wa,remapElement:Ra,RemoveElementCommand:Ua,removeUnusedDefElems:Kb,round:kb,runExtensions:ob,sanitizeSvg:Ia,SVGEditTransformList:svgedit.transformlist.SVGTransformList,toString:toString,transformBox:svgedit.math.transformBox,
|
||||
transformListToTransform:ga,transformPoint:M,walkTree:svgedit.utilities.walkTree}}};(function(){if(!window.methodDraw)window.methodDraw=function(a){function n(d,q){var z=e.setSvgString(d)!==false;q=q||a.noop;z?q(true):a.alert("Error: Unable to load SVG data",function(){q(false)})}var e,c={},l=false,u={canvas_expansion:1,dimensions:[580,400],initFill:{color:"fff",opacity:1},initStroke:{width:1.5,color:"000",opacity:1},initOpacity:1,imgPath:"images/",extPath:"extensions/",jGraduatePath:"lib/jgraduate/images/",extensions:[],initTool:"select",wireframe:false,colorPickerCSS:false,gridSnapping:false,
|
||||
transformListToTransform:ga,transformPoint:M,walkTree:svgedit.utilities.walkTree}}};(function(){if(!window.methodDraw)window.methodDraw=function(a){function n(d,q){var z=e.setSvgString(d)!==false;q=q||a.noop;z?q(true):a.alert("Error: Unable to load SVG data",function(){q(false)})}var e,c={},l=false,u={canvas_expansion:1,dimensions:[800,600],initFill:{color:"fff",opacity:1},initStroke:{width:1.5,color:"000",opacity:1},initOpacity:1,imgPath:"images/",extPath:"extensions/",jGraduatePath:"lib/jgraduate/images/",extensions:[],initTool:"select",wireframe:false,colorPickerCSS:false,gridSnapping:false,
|
||||
gridColor:"#000",baseUnit:"px",snappingStep:10,showRulers:svgedit.browser.isTouch()?false:true,show_outside_canvas:false,no_save_warning:true,initFont:"Helvetica, Arial, sans-serif"},b={};c.curConfig=u;c.tool_scale=1;c.setConfig=function(d){a.extend(true,u,d);if(d.extensions)u.extensions=d.extensions};c.setCustomHandlers=function(d){c.ready(function(){if(d.open){a('#tool_open > input[type="file"]').remove();a("#tool_open").show();e.open=d.open}if(d.save){c.show_save_warning=false;e.bind("saved",d.save)}d.pngsave&&
|
||||
e.bind("exported",d.pngsave)})};c.randomizeIds=function(){e.randomizeIds(arguments)};c.init=function(){(function(){var f=window.opener;if(f)try{var s=f.document.createEvent("Event");s.initEvent("methodDrawReady",true,true);f.document.documentElement.dispatchEvent(s)}catch(o){}})();a("body").toggleClass("touch",svgedit.browser.isTouch());a("#canvas_width").val(u.dimensions[0]);a("#canvas_height").val(u.dimensions[1]);var d=function(){a.each(u.extensions,function(){var f=this;a.getScript(u.extPath+
|
||||
f,function(s){if(!s){s=document.createElement("script");s.src=u.extPath+f;document.querySelector("head").appendChild(s)}})})};document.location.protocol==="file:"?setTimeout(d,100):d();a.svgIcons(u.imgPath+"svg_edit_icons.svg",{w:27,h:27,id_match:false,no_img:true,fallback_path:u.imgPath,fallback:{logo:"logo.png",select:"select.png",select_node:"select_node.png",pencil:"pencil.png",pen:"line.png",rect:"square.png",ellipse:"ellipse.png",path:"path.png",text:"text.png",image:"image.png",zoom:"zoom.png",
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@
|
|||
var is_ready = false;
|
||||
var curConfig = {
|
||||
canvas_expansion: 1,
|
||||
dimensions: [580,400],
|
||||
dimensions: [800,600],
|
||||
initFill: {color: 'fff', opacity: 1},
|
||||
initStroke: {width: 1.5, color: '000', opacity: 1},
|
||||
initOpacity: 1,
|
||||
|
|
|
|||
16
readme.md
16
readme.md
|
|
@ -4,18 +4,20 @@
|
|||
|
||||
Method Draw is a fork of [SVG Edit](https://github.com/SVG-Edit/svgedit), a web based vector drawing application.
|
||||
|
||||
The purpose of Method Draw is to improve the usability and user experience of SVG Edit. It removes some features such as
|
||||
layers and line-caps/corners in exchange for a more simple and pleasant experience.
|
||||
The purpose of Method Draw is to improve the usability and user experience of SVG Edit. It removes some features such as layers and line-caps/corners in exchange for a more simple and pleasant experience.
|
||||
|
||||
Development takes place in /editor
|
||||
Run this directory on a local webserver such as python -m SimpleHTTPServer
|
||||
Development takes place in `/editor`
|
||||
Run this directory on a local webserver such as `python -m SimpleHTTPServer`
|
||||
|
||||
To deploy:
|
||||
`Make -b` js/css is concatenated and you can deploy the `method-draw` directory anywhere you want.
|
||||
To compile:
|
||||
|
||||
first `make clean`
|
||||
then `make -b`
|
||||
|
||||
Method Draw will be compiled into the `method-draw` directory, which you can then deploy anywhere you choose.
|
||||
|
||||
Method Draw is Copyright (c)
|
||||
Mark MacKay hello@method.ac
|
||||
Mark MacKay [mark@method.ac](mailto:mark@method.ac)
|
||||
|
||||
Published under an MIT License. Enjoy.
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue