zcy
/
websch
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

gradient name improvements

master
Mark MacKay 2021-06-25 09:51:57 -05:00
parent c4838b129f
commit 65fe5edb70
4 changed files with 88 additions and 86 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/index.html
View File

@ -829,6 +829,7 @@
<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/paste.js"></script>
<script type="text/javascript" src="js/modals.js"></script>
<script type="text/javascript" src="js/start.js"></script>
<!-- endbuild -->
</body>

2
src/js/Canvas.js
View File

@ -151,6 +151,8 @@ MD.Canvas = function(){
}
}
rename(state.get("canvasTitle"));
this.resize = resize;
this.update = update;
this.rename = rename;

85
src/js/modals.js Normal file
View File

@ -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");
}
})
};

86
src/js/start.js
View File

@ -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.menu = new MD.Menu();
editor.toolbar = new MD.Toolbar();