gradient name improvements
Mark MacKay
parent
c4838b129f
commit
65fe5edb70
|
|
@ -829,6 +829,7 @@
|
||||||
<script type="text/javascript" src="js/lib/taphold.js"></script>
|
<script type="text/javascript" src="js/lib/taphold.js"></script>
|
||||||
<script type="text/javascript" src="js/lib/filesaver.js"></script>
|
<script type="text/javascript" src="js/lib/filesaver.js"></script>
|
||||||
<script type="text/javascript" src="js/paste.js"></script>
|
<script type="text/javascript" src="js/paste.js"></script>
|
||||||
|
<script type="text/javascript" src="js/modals.js"></script>
|
||||||
<script type="text/javascript" src="js/start.js"></script>
|
<script type="text/javascript" src="js/start.js"></script>
|
||||||
<!-- endbuild -->
|
<!-- endbuild -->
|
||||||
</body>
|
</body>
|
||||||
|
|
|
||||||
|
|
@ -151,6 +151,8 @@ MD.Canvas = function(){
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
rename(state.get("canvasTitle"));
|
||||||
|
|
||||||
this.resize = resize;
|
this.resize = resize;
|
||||||
this.update = update;
|
this.update = update;
|
||||||
this.rename = rename;
|
this.rename = rename;
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,85 @@
|
||||||
|
// globals
|
||||||
|
const svgCanvas = new $.SvgCanvas(document.getElementById("svgcanvas"));
|
||||||
|
const editor = new MD.Editor();
|
||||||
|
const state = new State();
|
||||||
|
|
||||||
|
editor.modal = {
|
||||||
|
about: new MD.Modal({
|
||||||
|
html: `
|
||||||
|
<h1>About this application</h1>
|
||||||
|
<p>Method Draw is a simple <a href="https://github.com/methodofaction/Method-Draw">open source</a> vector drawing application. Method Draw was forked from <a href="https://github.com/SVG-Edit/svgedit">SVG-Edit</a> several years ago with the goal of improving and modernizing the interface.</p>
|
||||||
|
<p>At this time (2021), the author (<a href="http://method.ac/writing">Mark MacKay</a>) is working on improving stability and improving the codebase, which contains a lot of legacy practices. The goal is to create a vector editor suitable for simple graphic design tasks.</p>
|
||||||
|
`
|
||||||
|
}),
|
||||||
|
source: new MD.Modal({
|
||||||
|
html: `
|
||||||
|
<div id="svg_source_editor">
|
||||||
|
<div id="svg_source_overlay" class="overlay"></div>
|
||||||
|
<div id="svg_source_container">
|
||||||
|
<form>
|
||||||
|
<textarea id="svg_source_textarea" spellcheck="false"></textarea>
|
||||||
|
</form>
|
||||||
|
<div id="tool_source_back" class="toolbar_button">
|
||||||
|
<button id="tool_source_cancel" class="cancel">Cancel</button>
|
||||||
|
<button id="tool_source_save" class="ok">Apply Changes</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>`,
|
||||||
|
js: function(el){
|
||||||
|
el.children[0].classList.add("modal-item-source");
|
||||||
|
el.querySelector("#tool_source_save").addEventListener("click", function(){
|
||||||
|
var saveChanges = function() {
|
||||||
|
svgCanvas.clearSelection();
|
||||||
|
$('#svg_source_textarea').blur();
|
||||||
|
editor.zoom.multiply(1);
|
||||||
|
editor.rulers.update();
|
||||||
|
editor.paintBox.fill.prep();
|
||||||
|
editor.paintBox.stroke.prep();
|
||||||
|
editor.modal.source.close();
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!svgCanvas.setSvgString($('#svg_source_textarea').val())) {
|
||||||
|
$.confirm("There were parsing errors in your SVG source.\nRevert back to original SVG source?", function(ok) {
|
||||||
|
if(!ok) return false;
|
||||||
|
saveChanges();
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
saveChanges();
|
||||||
|
}
|
||||||
|
})
|
||||||
|
el.querySelector("#tool_source_cancel").addEventListener("click", function(){
|
||||||
|
editor.modal.source.close();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}),
|
||||||
|
configure: new MD.Modal({
|
||||||
|
html: `
|
||||||
|
<h1>Configuration</h1>
|
||||||
|
<div id="configuration">
|
||||||
|
<button class="warning">Erase all data</button>
|
||||||
|
</div>
|
||||||
|
</div>`,
|
||||||
|
js: function(el){
|
||||||
|
const input = el.querySelector("#configuration button.warning");
|
||||||
|
input.addEventListener("click", function(){
|
||||||
|
state.clean();
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}),
|
||||||
|
donate: new MD.Modal({
|
||||||
|
html: `
|
||||||
|
<h1>Donate</h1>
|
||||||
|
<p>
|
||||||
|
Method Draw relies on your generous donations for continued development.
|
||||||
|
<a href="https://method.ac/donate/">Donate now</a> if you find this application useful.
|
||||||
|
</p>`
|
||||||
|
}),
|
||||||
|
shortcuts: new MD.Modal({
|
||||||
|
html: `
|
||||||
|
<h1>Shortcuts</h1>
|
||||||
|
<div id="shortcuts"></div>`,
|
||||||
|
js: function(el){
|
||||||
|
el.children[0].classList.add("modal-item-wide");
|
||||||
|
}
|
||||||
|
})
|
||||||
|
};
|
||||||
|
|
@ -1,89 +1,3 @@
|
||||||
// globals
|
|
||||||
const svgCanvas = new $.SvgCanvas(document.getElementById("svgcanvas"));
|
|
||||||
const editor = new MD.Editor();
|
|
||||||
const state = new State();
|
|
||||||
|
|
||||||
editor.modal = {
|
|
||||||
about: new MD.Modal({
|
|
||||||
html: `
|
|
||||||
<h1>About this application</h1>
|
|
||||||
<p>Method Draw is a simple <a href="https://github.com/methodofaction/Method-Draw">open source</a> vector drawing application. Method Draw was forked from <a href="https://github.com/SVG-Edit/svgedit">SVG-Edit</a> several years ago with the goal of improving and modernizing the interface.</p>
|
|
||||||
<p>At this time (2021), the author (<a href="http://method.ac/writing">Mark MacKay</a>) is working on improving stability and improving the codebase, which contains a lot of legacy practices. The goal is to create a vector editor suitable for simple graphic design tasks.</p>
|
|
||||||
`
|
|
||||||
}),
|
|
||||||
source: new MD.Modal({
|
|
||||||
html: `
|
|
||||||
<div id="svg_source_editor">
|
|
||||||
<div id="svg_source_overlay" class="overlay"></div>
|
|
||||||
<div id="svg_source_container">
|
|
||||||
<form>
|
|
||||||
<textarea id="svg_source_textarea" spellcheck="false"></textarea>
|
|
||||||
</form>
|
|
||||||
<div id="tool_source_back" class="toolbar_button">
|
|
||||||
<button id="tool_source_cancel" class="cancel">Cancel</button>
|
|
||||||
<button id="tool_source_save" class="ok">Apply Changes</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>`,
|
|
||||||
js: function(el){
|
|
||||||
el.children[0].classList.add("modal-item-source");
|
|
||||||
el.querySelector("#tool_source_save").addEventListener("click", function(){
|
|
||||||
var saveChanges = function() {
|
|
||||||
svgCanvas.clearSelection();
|
|
||||||
$('#svg_source_textarea').blur();
|
|
||||||
editor.zoom.multiply(1);
|
|
||||||
editor.rulers.update();
|
|
||||||
editor.paintBox.fill.prep();
|
|
||||||
editor.paintBox.stroke.prep();
|
|
||||||
editor.modal.source.close();
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!svgCanvas.setSvgString($('#svg_source_textarea').val())) {
|
|
||||||
$.confirm("There were parsing errors in your SVG source.\nRevert back to original SVG source?", function(ok) {
|
|
||||||
if(!ok) return false;
|
|
||||||
saveChanges();
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
saveChanges();
|
|
||||||
}
|
|
||||||
})
|
|
||||||
el.querySelector("#tool_source_cancel").addEventListener("click", function(){
|
|
||||||
editor.modal.source.close();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}),
|
|
||||||
configure: new MD.Modal({
|
|
||||||
html: `
|
|
||||||
<h1>Configuration</h1>
|
|
||||||
<div id="configuration">
|
|
||||||
<button class="warning">Erase all data</button>
|
|
||||||
</div>
|
|
||||||
</div>`,
|
|
||||||
js: function(el){
|
|
||||||
const input = el.querySelector("#configuration button.warning");
|
|
||||||
input.addEventListener("click", function(){
|
|
||||||
state.clean();
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}),
|
|
||||||
donate: new MD.Modal({
|
|
||||||
html: `
|
|
||||||
<h1>Donate</h1>
|
|
||||||
<p>
|
|
||||||
Method Draw relies on your generous donations for continued development.
|
|
||||||
<a href="https://method.ac/donate/">Donate now</a> if you find this application useful.
|
|
||||||
</p>`
|
|
||||||
}),
|
|
||||||
shortcuts: new MD.Modal({
|
|
||||||
html: `
|
|
||||||
<h1>Shortcuts</h1>
|
|
||||||
<div id="shortcuts"></div>`,
|
|
||||||
js: function(el){
|
|
||||||
el.children[0].classList.add("modal-item-wide");
|
|
||||||
}
|
|
||||||
})
|
|
||||||
};
|
|
||||||
|
|
||||||
editor.keyboard = new MD.Keyboard();
|
editor.keyboard = new MD.Keyboard();
|
||||||
editor.menu = new MD.Menu();
|
editor.menu = new MD.Menu();
|
||||||
editor.toolbar = new MD.Toolbar();
|
editor.toolbar = new MD.Toolbar();
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue