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

- Refactoring: Display inline styles within a template for readability 

(until we may refactor as class swapping)
- Refactoring: Line breaks
master
Brett Zamir 2018-10-24 09:44:43 +08:00
parent a714c122d3
commit 25f02d99f2
10 changed files with 103 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
CHANGES.md
View File

@ -13,6 +13,9 @@
correctly by default anyways) correctly by default anyways)
- Refactoring: Avoid redundant use of \*AttributeNS methods with - Refactoring: Avoid redundant use of \*AttributeNS methods with
`null` value; just use \*Attribute methods without namespace `null` value; just use \*Attribute methods without namespace
- Refactoring: Display inline styles within a template for readability
(until we may refactor as class swapping)
- Refactoring: Line breaks
- Docs: CHANGES clarifications - Docs: CHANGES clarifications
- Docs (JSdoc): Denote optional arguments - Docs (JSdoc): Denote optional arguments
- Docs: More info on `importLocale` for extensions - Docs: More info on `importLocale` for extensions

12
dist/index-es.js vendored
View File

@ -29215,7 +29215,7 @@ editor.init = function () {
if (curr.length && curr[0].id !== 'tool_select') { if (curr.length && curr[0].id !== 'tool_select') {
curr.removeClass('tool_button_current').addClass('tool_button'); curr.removeClass('tool_button_current').addClass('tool_button');
$$b('#tool_select').addClass('tool_button_current').removeClass('tool_button'); $$b('#tool_select').addClass('tool_button_current').removeClass('tool_button');
$$b('#styleoverrides').text('#svgcanvas svg *{cursor:move;pointer-events:all} #svgcanvas svg{cursor:default}'); $$b('#styleoverrides').text("\n #svgcanvas svg * {\n cursor: move;\n pointer-events: all;\n }\n #svgcanvas svg {\n cursor: default;\n }\n ");
} }
svgCanvas.setMode('select'); svgCanvas.setMode('select');
@ -29511,7 +29511,7 @@ editor.init = function () {
var clickSelect = editor.clickSelect = function () { var clickSelect = editor.clickSelect = function () {
if (toolButtonClick('#tool_select')) { if (toolButtonClick('#tool_select')) {
svgCanvas.setMode('select'); svgCanvas.setMode('select');
$$b('#styleoverrides').text('#svgcanvas svg *{cursor:move;pointer-events:all}, #svgcanvas svg{cursor:default}'); $$b('#styleoverrides').text("\n #svgcanvas svg * {\n cursor: move;\n pointer-events: all;\n }\n #svgcanvas svg {\n cursor: default;\n }\n ");
} }
}; };
/** /**
@ -30171,7 +30171,7 @@ editor.init = function () {
return; return;
} }
var rule = '#workarea.wireframe #svgcontent * { stroke-width: ' + 1 / svgCanvas.getZoom() + 'px; }'; var rule = "\n #workarea.wireframe #svgcontent * {\n stroke-width: ".concat(1 / svgCanvas.getZoom(), "px;\n }\n ");
$$b('#wireframe_rules').text(workarea.hasClass('wireframe') ? rule : ''); $$b('#wireframe_rules').text(workarea.hasClass('wireframe') ? rule : '');
}; };
@ -33800,9 +33800,9 @@ editor.init = function () {
step: 50, step: 50,
stepfunc: stepZoom, stepfunc: stepZoom,
stateObj: stateObj, stateObj: stateObj,
callback: changeZoom callback: changeZoom // Set default zoom
}) // Set default zoom
.val(svgCanvas.getZoom() * 100); }).val(svgCanvas.getZoom() * 100);
$$b('#workarea').contextMenu({ $$b('#workarea').contextMenu({
menu: 'cmenu_canvas', menu: 'cmenu_canvas',
inSpeed: 0 inSpeed: 0

2
dist/index-es.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
dist/index-es.min.js.map vendored
View File

File diff suppressed because one or more lines are too long

12
dist/index-umd.js vendored
View File

@ -29221,7 +29221,7 @@
if (curr.length && curr[0].id !== 'tool_select') { if (curr.length && curr[0].id !== 'tool_select') {
curr.removeClass('tool_button_current').addClass('tool_button'); curr.removeClass('tool_button_current').addClass('tool_button');
$$b('#tool_select').addClass('tool_button_current').removeClass('tool_button'); $$b('#tool_select').addClass('tool_button_current').removeClass('tool_button');
$$b('#styleoverrides').text('#svgcanvas svg *{cursor:move;pointer-events:all} #svgcanvas svg{cursor:default}'); $$b('#styleoverrides').text("\n #svgcanvas svg * {\n cursor: move;\n pointer-events: all;\n }\n #svgcanvas svg {\n cursor: default;\n }\n ");
} }
svgCanvas.setMode('select'); svgCanvas.setMode('select');
@ -29517,7 +29517,7 @@
var clickSelect = editor.clickSelect = function () { var clickSelect = editor.clickSelect = function () {
if (toolButtonClick('#tool_select')) { if (toolButtonClick('#tool_select')) {
svgCanvas.setMode('select'); svgCanvas.setMode('select');
$$b('#styleoverrides').text('#svgcanvas svg *{cursor:move;pointer-events:all}, #svgcanvas svg{cursor:default}'); $$b('#styleoverrides').text("\n #svgcanvas svg * {\n cursor: move;\n pointer-events: all;\n }\n #svgcanvas svg {\n cursor: default;\n }\n ");
} }
}; };
/** /**
@ -30177,7 +30177,7 @@
return; return;
} }
var rule = '#workarea.wireframe #svgcontent * { stroke-width: ' + 1 / svgCanvas.getZoom() + 'px; }'; var rule = "\n #workarea.wireframe #svgcontent * {\n stroke-width: ".concat(1 / svgCanvas.getZoom(), "px;\n }\n ");
$$b('#wireframe_rules').text(workarea.hasClass('wireframe') ? rule : ''); $$b('#wireframe_rules').text(workarea.hasClass('wireframe') ? rule : '');
}; };
@ -33806,9 +33806,9 @@
step: 50, step: 50,
stepfunc: stepZoom, stepfunc: stepZoom,
stateObj: stateObj, stateObj: stateObj,
callback: changeZoom callback: changeZoom // Set default zoom
}) // Set default zoom
.val(svgCanvas.getZoom() * 100); }).val(svgCanvas.getZoom() * 100);
$$b('#workarea').contextMenu({ $$b('#workarea').contextMenu({
menu: 'cmenu_canvas', menu: 'cmenu_canvas',
inSpeed: 0 inSpeed: 0

2
dist/index-umd.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
dist/index-umd.min.js.map vendored
View File

File diff suppressed because one or more lines are too long

92
editor/svg-editor.js
View File

@ -1530,7 +1530,9 @@ editor.init = function () {
$.confirm = function (msg, cb) { dbox('confirm', msg, cb); }; $.confirm = function (msg, cb) { dbox('confirm', msg, cb); };
$.process_cancel = function (msg, cb) { dbox('process', msg, cb); }; $.process_cancel = function (msg, cb) { dbox('process', msg, cb); };
$.prompt = function (msg, txt, cb) { dbox('prompt', msg, cb, txt); }; $.prompt = function (msg, txt, cb) { dbox('prompt', msg, cb, txt); };
$.select = function (msg, opts, cb, changeCb, txt, checkbox) { dbox('select', msg, cb, txt, opts, changeCb, checkbox); }; $.select = function (msg, opts, cb, changeCb, txt, checkbox) {
dbox('select', msg, cb, txt, opts, changeCb, checkbox);
};
}()); }());
const setSelectMode = function () { const setSelectMode = function () {
@ -1538,7 +1540,15 @@ editor.init = function () {
if (curr.length && curr[0].id !== 'tool_select') { if (curr.length && curr[0].id !== 'tool_select') {
curr.removeClass('tool_button_current').addClass('tool_button'); curr.removeClass('tool_button_current').addClass('tool_button');
$('#tool_select').addClass('tool_button_current').removeClass('tool_button'); $('#tool_select').addClass('tool_button_current').removeClass('tool_button');
$('#styleoverrides').text('#svgcanvas svg *{cursor:move;pointer-events:all} #svgcanvas svg{cursor:default}'); $('#styleoverrides').text(`
#svgcanvas svg * {
cursor: move;
pointer-events: all;
}
#svgcanvas svg {
cursor: default;
}
`);
} }
svgCanvas.setMode('select'); svgCanvas.setMode('select');
workarea.css('cursor', 'auto'); workarea.css('cursor', 'auto');
@ -1811,7 +1821,15 @@ editor.init = function () {
const clickSelect = editor.clickSelect = function () { const clickSelect = editor.clickSelect = function () {
if (toolButtonClick('#tool_select')) { if (toolButtonClick('#tool_select')) {
svgCanvas.setMode('select'); svgCanvas.setMode('select');
$('#styleoverrides').text('#svgcanvas svg *{cursor:move;pointer-events:all}, #svgcanvas svg{cursor:default}'); $('#styleoverrides').text(`
#svgcanvas svg * {
cursor: move;
pointer-events: all;
}
#svgcanvas svg {
cursor: default;
}
`);
} }
}; };
@ -2436,7 +2454,9 @@ editor.init = function () {
$('#selLayerNames').removeAttr('disabled').val(currentLayerName); $('#selLayerNames').removeAttr('disabled').val(currentLayerName);
// Enable regular menu options // Enable regular menu options
canvMenu.enableContextMenuItems('#delete,#cut,#copy,#move_front,#move_up,#move_down,#move_back'); canvMenu.enableContextMenuItems(
'#delete,#cut,#copy,#move_front,#move_up,#move_down,#move_back'
);
} else { } else {
$('#selLayerNames').attr('disabled', 'disabled'); $('#selLayerNames').attr('disabled', 'disabled');
} }
@ -2446,7 +2466,11 @@ editor.init = function () {
// Test support // Test support
if (supportsNonSS) { return; } if (supportsNonSS) { return; }
const rule = '#workarea.wireframe #svgcontent * { stroke-width: ' + 1 / svgCanvas.getZoom() + 'px; }'; const rule = `
#workarea.wireframe #svgcontent * {
stroke-width: ${1 / svgCanvas.getZoom()}px;
}
`;
$('#wireframe_rules').text(workarea.hasClass('wireframe') ? rule : ''); $('#wireframe_rules').text(workarea.hasClass('wireframe') ? rule : '');
}; };
@ -3072,7 +3096,8 @@ editor.init = function () {
'<span id="' + tool.id + '_label">' + '<span id="' + tool.id + '_label">' +
tool.label + ':</span>' + tool.label + ':</span>' +
'<input id="' + tool.id + '" title="' + tool.title + '<input id="' + tool.id + '" title="' + tool.title +
'" size="' + (tool.size || '4') + '" value="' + (tool.defval || '') + '" type="text"/></label>'; '" size="' + (tool.size || '4') +
'" value="' + (tool.defval || '') + '" type="text"/></label>';
// Creates the tool, hides & adds it, returns the select element // Creates the tool, hides & adds it, returns the select element
@ -3429,7 +3454,8 @@ editor.init = function () {
let str = '<div class="palette_item" data-rgb="none"></div>'; let str = '<div class="palette_item" data-rgb="none"></div>';
$.each(palette, function (i, item) { $.each(palette, function (i, item) {
str += '<div class="palette_item" style="background-color: ' + item + ';" data-rgb="' + item + '"></div>'; str += '<div class="palette_item" style="background-color: ' + item +
';" data-rgb="' + item + '"></div>';
}); });
$('#palette').append(str); $('#palette').append(str);
@ -4594,7 +4620,10 @@ editor.init = function () {
// NOTE: This code is not used yet until I can figure out how to successfully bind ctrl/meta // NOTE: This code is not used yet until I can figure out how to successfully bind ctrl/meta
// in Opera and Chrome // in Opera and Chrome
if (isMac() && !window.opera) { if (isMac() && !window.opera) {
const shortcutButtons = ['tool_clear', 'tool_save', 'tool_source', 'tool_undo', 'tool_redo', 'tool_clone']; const shortcutButtons = [
'tool_clear', 'tool_save', 'tool_source',
'tool_undo', 'tool_redo', 'tool_clone'
];
let i = shortcutButtons.length; let i = shortcutButtons.length;
while (i--) { while (i--) {
const button = document.getElementById(shortcutButtons[i]); const button = document.getElementById(shortcutButtons[i]);
@ -4803,7 +4832,10 @@ editor.init = function () {
$('#image_save_opts [value=embed]').attr('disabled', 'disabled'); $('#image_save_opts [value=embed]').attr('disabled', 'disabled');
$('#image_save_opts input').val(['ref']); $('#image_save_opts input').val(['ref']);
$.pref('img_save', 'ref'); $.pref('img_save', 'ref');
$('#image_opt_embed').css('color', '#666').attr('title', uiStrings.notification.featNotSupported); $('#image_opt_embed').css('color', '#666').attr(
'title',
uiStrings.notification.featNotSupported
);
} }
}); });
}, 1000); }, 1000);
@ -5097,7 +5129,10 @@ editor.init = function () {
// Prevent browser from erroneously repopulating fields // Prevent browser from erroneously repopulating fields
$('input,select').attr('autocomplete', 'off'); $('input,select').attr('autocomplete', 'off');
const dialogSelectors = ['#tool_source_cancel', '#tool_docprops_cancel', '#tool_prefs_cancel', '.overlay']; const dialogSelectors = [
'#tool_source_cancel', '#tool_docprops_cancel',
'#tool_prefs_cancel', '.overlay'
];
/** /**
* Associate all button actions as well as non-button keyboard shortcuts * Associate all button actions as well as non-button keyboard shortcuts
* @namespace {PlainObject} module:SVGEditor~Actions * @namespace {PlainObject} module:SVGEditor~Actions
@ -5122,7 +5157,8 @@ editor.init = function () {
const toolButtons = [ const toolButtons = [
{sel: '#tool_select', fn: clickSelect, evt: 'click', key: ['V', true]}, {sel: '#tool_select', fn: clickSelect, evt: 'click', key: ['V', true]},
{sel: '#tool_fhpath', fn: clickFHPath, evt: 'click', key: ['Q', true]}, {sel: '#tool_fhpath', fn: clickFHPath, evt: 'click', key: ['Q', true]},
{sel: '#tool_line', fn: clickLine, evt: 'click', key: ['L', true], parent: '#tools_line', prepend: true}, {sel: '#tool_line', fn: clickLine, evt: 'click', key: ['L', true],
parent: '#tools_line', prepend: true},
{sel: '#tool_rect', fn: clickRect, evt: 'mouseup', {sel: '#tool_rect', fn: clickRect, evt: 'mouseup',
key: ['R', true], parent: '#tools_rect', icon: 'rect'}, key: ['R', true], parent: '#tools_rect', icon: 'rect'},
{sel: '#tool_square', fn: clickSquare, evt: 'mouseup', {sel: '#tool_square', fn: clickSquare, evt: 'mouseup',
@ -5443,15 +5479,31 @@ editor.init = function () {
}); });
// init SpinButtons // init SpinButtons
$('#rect_rx').SpinButton({min: 0, max: 1000, stateObj, callback: changeRectRadius}); $('#rect_rx').SpinButton({
$('#stroke_width').SpinButton({min: 0, max: 99, smallStep: 0.1, stateObj, callback: changeStrokeWidth}); min: 0, max: 1000, stateObj, callback: changeRectRadius
$('#angle').SpinButton({min: -180, max: 180, step: 5, stateObj, callback: changeRotationAngle}); });
$('#font_size').SpinButton({min: 0.001, stepfunc: stepFontSize, stateObj, callback: changeFontSize}); $('#stroke_width').SpinButton({
$('#group_opacity').SpinButton({min: 0, max: 100, step: 5, stateObj, callback: changeOpacity}); min: 0, max: 99, smallStep: 0.1, stateObj, callback: changeStrokeWidth
$('#blur').SpinButton({min: 0, max: 10, step: 0.1, stateObj, callback: changeBlur}); });
$('#zoom').SpinButton({min: 0.001, max: 10000, step: 50, stepfunc: stepZoom, stateObj, callback: changeZoom}) $('#angle').SpinButton({
// Set default zoom min: -180, max: 180, step: 5, stateObj, callback: changeRotationAngle
.val(svgCanvas.getZoom() * 100); });
$('#font_size').SpinButton({
min: 0.001, stepfunc: stepFontSize, stateObj, callback: changeFontSize
});
$('#group_opacity').SpinButton({
min: 0, max: 100, step: 5, stateObj, callback: changeOpacity
});
$('#blur').SpinButton({
min: 0, max: 10, step: 0.1, stateObj, callback: changeBlur
});
$('#zoom').SpinButton({
min: 0.001, max: 10000, step: 50, stepfunc: stepZoom,
stateObj, callback: changeZoom
// Set default zoom
}).val(
svgCanvas.getZoom() * 100
);
$('#workarea').contextMenu( $('#workarea').contextMenu(
{ {

12
editor/xdomain-svgedit-config-iife.js
View File

@ -29218,7 +29218,7 @@
if (curr.length && curr[0].id !== 'tool_select') { if (curr.length && curr[0].id !== 'tool_select') {
curr.removeClass('tool_button_current').addClass('tool_button'); curr.removeClass('tool_button_current').addClass('tool_button');
$$b('#tool_select').addClass('tool_button_current').removeClass('tool_button'); $$b('#tool_select').addClass('tool_button_current').removeClass('tool_button');
$$b('#styleoverrides').text('#svgcanvas svg *{cursor:move;pointer-events:all} #svgcanvas svg{cursor:default}'); $$b('#styleoverrides').text("\n #svgcanvas svg * {\n cursor: move;\n pointer-events: all;\n }\n #svgcanvas svg {\n cursor: default;\n }\n ");
} }
svgCanvas.setMode('select'); svgCanvas.setMode('select');
@ -29514,7 +29514,7 @@
var clickSelect = editor.clickSelect = function () { var clickSelect = editor.clickSelect = function () {
if (toolButtonClick('#tool_select')) { if (toolButtonClick('#tool_select')) {
svgCanvas.setMode('select'); svgCanvas.setMode('select');
$$b('#styleoverrides').text('#svgcanvas svg *{cursor:move;pointer-events:all}, #svgcanvas svg{cursor:default}'); $$b('#styleoverrides').text("\n #svgcanvas svg * {\n cursor: move;\n pointer-events: all;\n }\n #svgcanvas svg {\n cursor: default;\n }\n ");
} }
}; };
/** /**
@ -30174,7 +30174,7 @@
return; return;
} }
var rule = '#workarea.wireframe #svgcontent * { stroke-width: ' + 1 / svgCanvas.getZoom() + 'px; }'; var rule = "\n #workarea.wireframe #svgcontent * {\n stroke-width: ".concat(1 / svgCanvas.getZoom(), "px;\n }\n ");
$$b('#wireframe_rules').text(workarea.hasClass('wireframe') ? rule : ''); $$b('#wireframe_rules').text(workarea.hasClass('wireframe') ? rule : '');
}; };
@ -33803,9 +33803,9 @@
step: 50, step: 50,
stepfunc: stepZoom, stepfunc: stepZoom,
stateObj: stateObj, stateObj: stateObj,
callback: changeZoom callback: changeZoom // Set default zoom
}) // Set default zoom
.val(svgCanvas.getZoom() * 100); }).val(svgCanvas.getZoom() * 100);
$$b('#workarea').contextMenu({ $$b('#workarea').contextMenu({
menu: 'cmenu_canvas', menu: 'cmenu_canvas',
inSpeed: 0 inSpeed: 0

12
svgedit-config-iife.js
View File

@ -29218,7 +29218,7 @@
if (curr.length && curr[0].id !== 'tool_select') { if (curr.length && curr[0].id !== 'tool_select') {
curr.removeClass('tool_button_current').addClass('tool_button'); curr.removeClass('tool_button_current').addClass('tool_button');
$$b('#tool_select').addClass('tool_button_current').removeClass('tool_button'); $$b('#tool_select').addClass('tool_button_current').removeClass('tool_button');
$$b('#styleoverrides').text('#svgcanvas svg *{cursor:move;pointer-events:all} #svgcanvas svg{cursor:default}'); $$b('#styleoverrides').text("\n #svgcanvas svg * {\n cursor: move;\n pointer-events: all;\n }\n #svgcanvas svg {\n cursor: default;\n }\n ");
} }
svgCanvas.setMode('select'); svgCanvas.setMode('select');
@ -29514,7 +29514,7 @@
var clickSelect = editor.clickSelect = function () { var clickSelect = editor.clickSelect = function () {
if (toolButtonClick('#tool_select')) { if (toolButtonClick('#tool_select')) {
svgCanvas.setMode('select'); svgCanvas.setMode('select');
$$b('#styleoverrides').text('#svgcanvas svg *{cursor:move;pointer-events:all}, #svgcanvas svg{cursor:default}'); $$b('#styleoverrides').text("\n #svgcanvas svg * {\n cursor: move;\n pointer-events: all;\n }\n #svgcanvas svg {\n cursor: default;\n }\n ");
} }
}; };
/** /**
@ -30174,7 +30174,7 @@
return; return;
} }
var rule = '#workarea.wireframe #svgcontent * { stroke-width: ' + 1 / svgCanvas.getZoom() + 'px; }'; var rule = "\n #workarea.wireframe #svgcontent * {\n stroke-width: ".concat(1 / svgCanvas.getZoom(), "px;\n }\n ");
$$b('#wireframe_rules').text(workarea.hasClass('wireframe') ? rule : ''); $$b('#wireframe_rules').text(workarea.hasClass('wireframe') ? rule : '');
}; };
@ -33803,9 +33803,9 @@
step: 50, step: 50,
stepfunc: stepZoom, stepfunc: stepZoom,
stateObj: stateObj, stateObj: stateObj,
callback: changeZoom callback: changeZoom // Set default zoom
}) // Set default zoom
.val(svgCanvas.getZoom() * 100); }).val(svgCanvas.getZoom() * 100);
$$b('#workarea').contextMenu({ $$b('#workarea').contextMenu({
menu: 'cmenu_canvas', menu: 'cmenu_canvas',
inSpeed: 0 inSpeed: 0