From eba9dee54c8961b539f0de0c75583fe8b394a4d8 Mon Sep 17 00:00:00 2001 From: Brett Zamir Date: Wed, 16 May 2018 14:01:27 +0800 Subject: [PATCH] - Linting (ESLint): Finish `editor/svg-editor.js`; unfinished: `editor/svgcanvas.js` - Fix: Restore save alert --- editor/svg-editor.js | 2220 +++++++++++++++++++++--------------------- 1 file changed, 1100 insertions(+), 1120 deletions(-) diff --git a/editor/svg-editor.js b/editor/svg-editor.js index 97da2544..b9dfe93b 100644 --- a/editor/svg-editor.js +++ b/editor/svg-editor.js @@ -1,4 +1,4 @@ -/* eslint-disable no-var */ +/* eslint-disable no-var, standard/no-callback-literal */ /* globals svgEditor:true, widget, svgedit, jQuery, $, DOMParser, FileReader */ /* * svg-editor.js @@ -22,8 +22,7 @@ TODOS 1. JSDoc */ -(function() { - +(function () { if (window.svgEditor) { return; } @@ -204,7 +203,7 @@ window.svgEditor = (function ($) { if (success) { callback(true); } else { - $.alert(uiStrings.notification.errorLoadingSVG, function() { + $.alert(uiStrings.notification.errorLoadingSVG, function () { callback(false); }); } @@ -280,11 +279,9 @@ window.svgEditor = (function ($) { if (val) { defaultPrefs[key] = String(val); // Convert to string for FF (.value fails in Webkit) } - } - else if (window.widget) { + } else if (window.widget) { defaultPrefs[key] = widget.preferenceForKey(storeKey); - } - else { + } else { var result = document.cookie.match(new RegExp('(?:^|;\\s*)' + Utils.preg_quote(encodeURIComponent(storeKey)) + '=([^;]+)')); defaultPrefs[key] = result ? decodeURIComponent(result[1]) : ''; } @@ -315,13 +312,11 @@ window.svgEditor = (function ($) { function extendOrAdd (cfgObj, key, val) { if (cfgObj[key] && typeof cfgObj[key] === 'object') { $.extend(true, cfgObj[key], val); - } - else { + } else { cfgObj[key] = val; } - return; } - $.each(opts, function(key, val) { + $.each(opts, function (key, val) { if (opts.hasOwnProperty(key)) { // Only allow prefs defined in defaultPrefs if (defaultPrefs.hasOwnProperty(key)) { @@ -333,12 +328,10 @@ window.svgEditor = (function ($) { } if (cfgCfg.allowInitialUserOverride === true) { defaultPrefs[key] = val; - } - else { + } else { $.pref(key, val); } - } - else if (['extensions', 'allowedOrigins'].indexOf(key) > -1) { + } else if (['extensions', 'allowedOrigins'].indexOf(key) > -1) { if (cfgCfg.overwrite === false && ( curConfig.preventAllURLConfig || @@ -349,9 +342,8 @@ window.svgEditor = (function ($) { return; } curConfig[key] = curConfig[key].concat(val); // We will handle any dupes later - } // Only allow other curConfig if defined in defaultConfig - else if (defaultConfig.hasOwnProperty(key)) { + } else if (defaultConfig.hasOwnProperty(key)) { if (cfgCfg.overwrite === false && ( curConfig.preventAllURLConfig || curConfig.hasOwnProperty(key) @@ -364,17 +356,14 @@ window.svgEditor = (function ($) { return; } extendOrAdd(curConfig, key, val); - } - else { + } else { if (cfgCfg.allowInitialUserOverride === true) { extendOrAdd(defaultConfig, key, val); - } - else { + } else { if (defaultConfig[key] && typeof defaultConfig[key] === 'object') { curConfig[key] = {}; $.extend(true, curConfig[key], val); // Merge properties recursively, e.g., on initFill, initStroke objects - } - else { + } else { curConfig[key] = val; } } @@ -403,7 +392,7 @@ window.svgEditor = (function ($) { * types) to determine the proper output. */ editor.setCustomHandlers = function (opts) { - editor.ready(function() { + editor.ready(function () { if (opts.open) { $('#tool_open > input[type="file"]').remove(); $('#tool_open').show(); @@ -436,12 +425,12 @@ window.svgEditor = (function ($) { if ('localStorage' in window) { // && onWeb removed so Webkit works locally editor.storage = localStorage; } - } catch(err) {} + } catch (err) {} // Todo: Avoid var-defined functions and group functions together, etc. where possible - var good_langs = []; - $('#lang_select option').each(function() { - good_langs.push(this.value); + var goodLangs = []; + $('#lang_select option').each(function () { + goodLangs.push(this.value); }); function setupCurPrefs () { @@ -465,7 +454,7 @@ window.svgEditor = (function ($) { // Export updated config editor.curConfig = curConfig; } - (function() { + (function () { // Load config/data from URL if given var src, qstr; urldata = $.deparam.querystring(true); @@ -480,7 +469,7 @@ window.svgEditor = (function ($) { if (urldata.extensions) { // For security reasons, disallow cross-domain or cross-folder extensions via URL - urldata.extensions = urldata.extensions.match(/[:\/\\]/) ? '' : urldata.extensions.split(','); + urldata.extensions = urldata.extensions.match(/[:/\\]/) ? '' : urldata.extensions.split(','); } // Disallowing extension paths via URL for @@ -528,43 +517,42 @@ window.svgEditor = (function ($) { editor.loadContentAndPrefs(); } setupCurPrefs(); - } - else { + } else { setupCurConfig(); editor.loadContentAndPrefs(); setupCurPrefs(); } }()); - var setIcon = editor.setIcon = function(elem, icon_id, forcedSize) { - var icon = (typeof icon_id === 'string') ? $.getSvgIcon(icon_id, true) : icon_id.clone(); + var setIcon = editor.setIcon = function (elem, iconId, forcedSize) { + var icon = (typeof iconId === 'string') ? $.getSvgIcon(iconId, true) : iconId.clone(); if (!icon) { - console.log('NOTE: Icon image missing: ' + icon_id); + console.log('NOTE: Icon image missing: ' + iconId); return; } $(elem).empty().append(icon); }; - var extFunc = function() { - $.each(curConfig.extensions, function() { + var extFunc = function () { + $.each(curConfig.extensions, function () { var extname = this; if (!extname.match(/^ext-.*\.js/)) { // Ensure URL cannot specify some other unintended file in the extPath return; } - $.getScript(curConfig.extPath + extname, function(d) { + $.getScript(curConfig.extPath + extname, function (d) { // Fails locally in Chrome 5 if (!d) { var s = document.createElement('script'); s.src = curConfig.extPath + extname; document.querySelector('head').appendChild(s); } - }).fail(function(jqxhr, settings, exception){ + }).fail(function (jqxhr, settings, exception) { console.log(exception); }); }); // var lang = ('lang' in curPrefs) ? curPrefs.lang : null; - editor.putLocale(null, good_langs); + editor.putLocale(null, goodLangs); }; // Load extensions @@ -575,7 +563,7 @@ window.svgEditor = (function ($) { extFunc(); } $.svgIcons(curConfig.imgPath + 'svg_edit_icons.svg', { - w:24, h:24, + w: 24, h: 24, id_match: false, no_img: !svgedit.browser.isWebkit(), // Opera & Firefox 4 gives odd behavior w/images fallback_path: curConfig.imgPath, @@ -725,35 +713,35 @@ window.svgEditor = (function ($) { '.layer_button .svg_icon, #layerlist td.layervis .svg_icon': 14, '.dropdown button .svg_icon': 7, '#main_button .dropdown .svg_icon': 9, - '.palette_item:first .svg_icon' : 15, + '.palette_item:first .svg_icon': 15, '#fill_bg .svg_icon, #stroke_bg .svg_icon': 16, '.toolbar_button button .svg_icon': 16, '.stroke_tool div div .svg_icon': 20, '#tools_bottom label .svg_icon': 18 }, - callback: function(icons) { - $('.toolbar_button button > svg, .toolbar_button button > img').each(function() { + callback: function (icons) { + $('.toolbar_button button > svg, .toolbar_button button > img').each(function () { $(this).parent().prepend(this); }); - var min_height, + var minHeight, tleft = $('#tools_left'); if (tleft.length !== 0) { - min_height = tleft.offset().top + tleft.outerHeight(); + minHeight = tleft.offset().top + tleft.outerHeight(); } var size = $.pref('iconsize'); - editor.setIconSize(size || ($(window).height() < min_height ? 's': 'm')); + editor.setIconSize(size || ($(window).height() < minHeight ? 's' : 'm')); // Look for any missing flyout icons from plugins - $('.tools_flyout').each(function() { + $('.tools_flyout').each(function () { var shower = $('#' + this.id + '_show'); var sel = shower.attr('data-curopt'); // Check if there's an icon here if (!shower.children('svg, img').length) { var clone = $(sel).children().clone(); if (clone.length) { - clone[0].removeAttribute('style'); //Needed for Opera + clone[0].removeAttribute('style'); // Needed for Opera shower.append(clone); } } @@ -761,8 +749,8 @@ window.svgEditor = (function ($) { editor.runCallbacks(); - setTimeout(function() { - $('.flyout_arrow_horiz:empty').each(function() { + setTimeout(function () { + $('.flyout_arrow_horiz:empty').each(function () { $(this).append($.getSvgIcon('arrow_right').width(5).height(5)); }); }, 1); @@ -770,7 +758,7 @@ window.svgEditor = (function ($) { }); editor.canvas = svgCanvas = new $.SvgCanvas(document.getElementById('svgcanvas'), curConfig); - var supportsNonSS, resize_timer, changeZoom, Actions, curScrollPos, + var supportsNonSS, resizeTimer, changeZoom, Actions, curScrollPos, palette = [ // Todo: Make into configuration item? '#000000', '#3f3f3f', '#7f7f7f', '#bfbfbf', '#ffffff', '#ff0000', '#ff7f00', '#ffff00', '#7fff00', @@ -788,17 +776,17 @@ window.svgEditor = (function ($) { undoMgr = svgCanvas.undoMgr, defaultImageURL = curConfig.imgPath + 'logo.png', workarea = $('#workarea'), - canv_menu = $('#cmenu_canvas'), - // layer_menu = $('#cmenu_layers'), // Unused + canvMenu = $('#cmenu_canvas'), + // layerMenu = $('#cmenu_layers'), // Unused exportWindow = null, zoomInIcon = 'crosshair', zoomOutIcon = 'crosshair', - ui_context = 'toolbars', + uiContext = 'toolbars', origSource = '', - paintBox = {fill: null, stroke:null}; + paintBox = {fill: null, stroke: null}; // For external openers - (function() { + (function () { // let the opener know SVG Edit is ready (now that config is set up) var svgEditorReadyEvent, w = window.opener || window.parent; @@ -807,8 +795,7 @@ window.svgEditor = (function ($) { svgEditorReadyEvent = w.document.createEvent('Event'); svgEditorReadyEvent.initEvent('svgEditorReady', true, true); w.document.documentElement.dispatchEvent(svgEditorReadyEvent); - } - catch(e) {} + } catch (e) {} } }()); @@ -820,28 +807,27 @@ window.svgEditor = (function ($) { (function () { $('#dialog_container').draggable({cancel: '#dialog_content, #dialog_buttons *', containment: 'window'}); var box = $('#dialog_box'), - btn_holder = $('#dialog_buttons'), - dialog_content = $('#dialog_content'), + btnHolder = $('#dialog_buttons'), + dialogContent = $('#dialog_content'), dbox = function (type, msg, callback, defaultVal, opts, changeCb, checkbox) { var ok, ctrl, chkbx; - dialog_content.html('

' + msg.replace(/\n/g, '

')+'

') - .toggleClass('prompt', (type == 'prompt')); - btn_holder.empty(); + dialogContent.html('

' + msg.replace(/\n/g, '

') + '

') + .toggleClass('prompt', (type === 'prompt')); + btnHolder.empty(); - ok = $('').appendTo(btn_holder); + ok = $('').appendTo(btnHolder); if (type !== 'alert') { $('') - .appendTo(btn_holder) - .click(function() { box.hide(); if (callback) {callback(false);}}); + .appendTo(btnHolder) + .click(function () { box.hide(); if (callback) { callback(false); } }); } if (type === 'prompt') { - ctrl = $('').prependTo(btn_holder); + ctrl = $('').prependTo(btnHolder); ctrl.val(defaultVal || ''); - ctrl.bind('keydown', 'return', function() {ok.click();}); - } - else if (type === 'select') { + ctrl.bind('keydown', 'return', function () { ok.click(); }); + } else if (type === 'select') { var div = $('
'); ctrl = $(''; - $.each(tool.options, function(val, text) { - var sel = (val == tool.defval) ? ' selected' : ''; - html += ''; + html = '' + + ''; // Creates the tool, hides & adds it, returns the select element var sel = $(html).appendTo(panel).find('select'); - $.each(tool.events, function(evt, func) { + $.each(tool.events, function (evt, func) { $(sel).bind(evt, func); }); break; case 'button-select': - html = ''; + html = ''; var list = $('
    ').appendTo('#option_lists'); @@ -2554,9 +2533,9 @@ window.svgEditor = (function ($) { } // Creates the tool, hides & adds it, returns the select element - var dropdown = $(html).appendTo(panel).children(); + /* var dropdown = */ $(html).appendTo(panel).children(); - btn_selects.push({ + btnSelects.push({ elem: ('#' + tool.id), list: ('#' + tool.id + '_opts'), title: tool.title, @@ -2566,11 +2545,11 @@ window.svgEditor = (function ($) { break; case 'input': - html = '' - + '' - + tool.label + ':' - + ''; + html = '' + + '' + + tool.label + ':' + + ''; // Creates the tool, hides & adds it, returns the select element @@ -2582,7 +2561,7 @@ window.svgEditor = (function ($) { } if (tool.events) { - $.each(tool.events, function(evt, func) { + $.each(tool.events, function (evt, func) { inp.bind(evt, func); }); } @@ -2595,38 +2574,38 @@ window.svgEditor = (function ($) { } if (ext.buttons) { - var fallback_obj = {}, - placement_obj = {}, + var fallbackObj = {}, + placementObj = {}, svgicons = ext.svgicons, holders = {}; // Add buttons given by extension - $.each(ext.buttons, function(i, btn) { - var icon, svgicon, tls_id; + $.each(ext.buttons, function (i, btn) { + var icon, svgicon, tlsId; var id = btn.id; var num = i; // Give button a unique ID - while($('#'+id).length) { + while ($('#' + id).length) { id = btn.id + '_' + (++num); } if (!svgicons) { icon = $(''); } else { - fallback_obj[id] = btn.icon; + fallbackObj[id] = btn.icon; svgicon = btn.svgicon || btn.id; - if (btn.type == 'app_menu') { - placement_obj['#' + id + ' > div'] = svgicon; + if (btn.type === 'app_menu') { + placementObj['#' + id + ' > div'] = svgicon; } else { - placement_obj['#' + id] = svgicon; + placementObj['#' + id] = svgicon; } } var cls, parent; // Set button up according to its type - switch ( btn.type ) { + switch (btn.type) { case 'mode_flyout': case 'mode': cls = 'tool_button'; @@ -2645,8 +2624,8 @@ window.svgEditor = (function ($) { parent = '#main_menu ul'; break; } - var flyout_holder, cur_h, show_btn, ref_data, ref_btn; - var button = $((btn.list || btn.type == 'app_menu') ? '
  • ' : '
    ') + var flyoutHolder, curH, showBtn, refData, refBtn; + var button = $((btn.list || btn.type === 'app_menu') ? '
  • ' : '
    ') .attr('id', id) .attr('title', btn.title) .addClass(cls); @@ -2654,125 +2633,121 @@ window.svgEditor = (function ($) { if ('position' in btn) { if ($(parent).children().eq(btn.position).length) { $(parent).children().eq(btn.position).before(button); - } - else { + } else { $(parent).children().last().before(button); } } else { button.appendTo(parent); } - if (btn.type =='mode_flyout') { + if (btn.type === 'mode_flyout') { // Add to flyout menu / make flyout menu -// var opts = btn.includeWith; -// // opts.button, default, position - ref_btn = $(button); + // var opts = btn.includeWith; + // // opts.button, default, position + refBtn = $(button); - flyout_holder = ref_btn.parent(); + flyoutHolder = refBtn.parent(); // Create a flyout menu if there isn't one already - if (!ref_btn.parent().hasClass('tools_flyout')) { + if (!refBtn.parent().hasClass('tools_flyout')) { // Create flyout placeholder - tls_id = ref_btn[0].id.replace('tool_', 'tools_'); - show_btn = ref_btn.clone() - .attr('id', tls_id + '_show') + tlsId = refBtn[0].id.replace('tool_', 'tools_'); + showBtn = refBtn.clone() + .attr('id', tlsId + '_show') .append($('
    ', {'class': 'flyout_arrow_horiz'})); - ref_btn.before(show_btn); + refBtn.before(showBtn); // Create a flyout div - flyout_holder = makeFlyoutHolder(tls_id, ref_btn); - flyout_holder.data('isLibrary', true); - show_btn.data('isLibrary', true); + flyoutHolder = makeFlyoutHolder(tlsId, refBtn); + flyoutHolder.data('isLibrary', true); + showBtn.data('isLibrary', true); } -// ref_data = Actions.getButtonData(opts.button); + // refData = Actions.getButtonData(opts.button); - placement_obj['#' + tls_id + '_show'] = btn.id; + placementObj['#' + tlsId + '_show'] = btn.id; // TODO: Find way to set the current icon using the iconloader if this is not default // Include data for extension button as well as ref button - cur_h = holders['#'+flyout_holder[0].id] = [{ - sel: '#'+id, + curH = holders['#' + flyoutHolder[0].id] = [{ + sel: '#' + id, fn: btn.events.click, icon: btn.id, -// key: btn.key, + // key: btn.key, isDefault: true - }, ref_data]; -// -// // {sel:'#tool_rect', fn: clickRect, evt: 'mouseup', key: 4, parent: '#tools_rect', icon: 'rect'} -// -// var pos = ('position' in opts)?opts.position:'last'; -// var len = flyout_holder.children().length; -// -// // Add at given position or end -// if (!isNaN(pos) && pos >= 0 && pos < len) { -// flyout_holder.children().eq(pos).before(button); -// } else { -// flyout_holder.append(button); -// cur_h.reverse(); -// } - } else if (btn.type == 'app_menu') { + }, refData]; + // + // // {sel:'#tool_rect', fn: clickRect, evt: 'mouseup', key: 4, parent: '#tools_rect', icon: 'rect'} + // + // var pos = ('position' in opts)?opts.position:'last'; + // var len = flyoutHolder.children().length; + // + // // Add at given position or end + // if (!isNaN(pos) && pos >= 0 && pos < len) { + // flyoutHolder.children().eq(pos).before(button); + // } else { + // flyoutHolder.append(button); + // curH.reverse(); + // } + } else if (btn.type === 'app_menu') { button.append('
    ').append(btn.title); } - - } - else if (btn.list) { + } else if (btn.list) { // Add button to list button.addClass('push_button'); $('#' + btn.list + '_opts').append(button); if (btn.isDefault) { $('#cur_' + btn.list).append(button.children().clone()); svgicon = btn.svgicon || btn.id; - placement_obj['#cur_' + btn.list] = svgicon; + placementObj['#cur_' + btn.list] = svgicon; } - } - else if (btn.includeWith) { + } else if (btn.includeWith) { // Add to flyout menu / make flyout menu var opts = btn.includeWith; // opts.button, default, position - ref_btn = $(opts.button); + refBtn = $(opts.button); - flyout_holder = ref_btn.parent(); + flyoutHolder = refBtn.parent(); // Create a flyout menu if there isn't one already - if (!ref_btn.parent().hasClass('tools_flyout')) { + if (!refBtn.parent().hasClass('tools_flyout')) { // Create flyout placeholder - tls_id = ref_btn[0].id.replace('tool_', 'tools_'); - show_btn = ref_btn.clone() - .attr('id',tls_id + '_show') + tlsId = refBtn[0].id.replace('tool_', 'tools_'); + showBtn = refBtn.clone() + .attr('id', tlsId + '_show') .append($('
    ', {'class': 'flyout_arrow_horiz'})); - ref_btn.before(show_btn); + refBtn.before(showBtn); // Create a flyout div - flyout_holder = makeFlyoutHolder(tls_id, ref_btn); + flyoutHolder = makeFlyoutHolder(tlsId, refBtn); } - ref_data = Actions.getButtonData(opts.button); + refData = Actions.getButtonData(opts.button); if (opts.isDefault) { - placement_obj['#' + tls_id + '_show'] = btn.id; + placementObj['#' + tlsId + '_show'] = btn.id; } // TODO: Find way to set the current icon using the iconloader if this is not default // Include data for extension button as well as ref button - cur_h = holders['#' + flyout_holder[0].id] = [{ + curH = holders['#' + flyoutHolder[0].id] = [{ sel: '#' + id, fn: btn.events.click, icon: btn.id, key: btn.key, isDefault: btn.includeWith ? btn.includeWith.isDefault : 0 - }, ref_data]; + }, refData]; // {sel:'#tool_rect', fn: clickRect, evt: 'mouseup', key: 4, parent: '#tools_rect', icon: 'rect'} var pos = ('position' in opts) ? opts.position : 'last'; - var len = flyout_holder.children().length; + var len = flyoutHolder.children().length; // Add at given position or end if (!isNaN(pos) && pos >= 0 && pos < len) { - flyout_holder.children().eq(pos).before(button); + flyoutHolder.children().eq(pos).before(button); } else { - flyout_holder.append(button); - cur_h.reverse(); + flyoutHolder.append(button); + curH.reverse(); } } @@ -2782,12 +2757,12 @@ window.svgEditor = (function ($) { if (!btn.list) { // Add given events to button - $.each(btn.events, function(name, func) { - if (name == 'click' && btn.type == 'mode') { + $.each(btn.events, function (name, func) { + if (name === 'click' && btn.type === 'mode') { if (btn.includeWith) { button.bind(name, func); } else { - button.bind(name, function() { + button.bind(name, function () { if (toolButtonClick(button)) { func(); } @@ -2796,7 +2771,7 @@ window.svgEditor = (function ($) { if (btn.key) { $(document).bind('keydown', btn.key, func); if (btn.title) { - button.attr('title', btn.title + ' ['+btn.key+']'); + button.attr('title', btn.title + ' [' + btn.key + ']'); } } } else { @@ -2808,27 +2783,27 @@ window.svgEditor = (function ($) { setupFlyouts(holders); }); - $.each(btn_selects, function() { + $.each(btnSelects, function () { addAltDropDown(this.elem, this.list, this.callback, {seticon: true}); }); if (svgicons) { - cb_ready = false; // Delay callback + cbReady = false; // Delay callback } $.svgIcons(svgicons, { w: 24, h: 24, id_match: false, no_img: (!svgedit.browser.isWebkit()), - fallback: fallback_obj, - placement: placement_obj, + fallback: fallbackObj, + placement: placementObj, callback: function (icons) { // Non-ideal hack to make the icon match the current size - //if (curPrefs.iconsize && curPrefs.iconsize !== 'm') { + // if (curPrefs.iconsize && curPrefs.iconsize !== 'm') { if ($.pref('iconsize') !== 'm') { prepResize(); } - cb_ready = true; // Ready for callback + cbReady = true; // Ready for callback runCallback(); } }); @@ -2837,7 +2812,7 @@ window.svgEditor = (function ($) { runCallback(); }; - var getPaint = function(color, opac, type) { + var getPaint = function (color, opac, type) { // update the editor's fill paint var opts = { alpha: opac }; if (color.indexOf('url(#') === 0) { @@ -2856,8 +2831,8 @@ window.svgEditor = (function ($) { return new $.jGraduate.Paint(opts); }; - $('#text').focus( function(){ textBeingEntered = true; } ); - $('#text').blur( function(){ textBeingEntered = false; } ); + // $('#text').focus(function () { textBeingEntered = true; }); + // $('#text').blur(function () { textBeingEntered = false; }); // bind the selected event to our function that handles updates to the UI svgCanvas.bind('selected', selectedChanged); @@ -2878,26 +2853,26 @@ window.svgEditor = (function ($) { svgCanvas.textActions.setInputElem($('#text')[0]); var str = '
    '; - $.each(palette, function(i, item) { + $.each(palette, function (i, item) { str += '
    '; }); $('#palette').append(str); // Set up editor background functionality // TODO add checkerboard as "pattern" - var color_blocks = ['#FFF', '#888', '#000']; // ,'url(data:image/gif;base64,R0lGODlhEAAQAIAAAP%2F%2F%2F9bW1iH5BAAAAAAALAAAAAAQABAAAAIfjG%2Bgq4jM3IFLJgpswNly%2FXkcBpIiVaInlLJr9FZWAQA7)']; + var colorBlocks = ['#FFF', '#888', '#000']; // ,'url(data:image/gif;base64,R0lGODlhEAAQAIAAAP%2F%2F%2F9bW1iH5BAAAAAAALAAAAAAQABAAAAIfjG%2Bgq4jM3IFLJgpswNly%2FXkcBpIiVaInlLJr9FZWAQA7)']; str = ''; - $.each(color_blocks, function() { + $.each(colorBlocks, function () { str += '
    '; }); $('#bg_blocks').append(str); var blocks = $('#bg_blocks div'); - var cur_bg = 'cur_background'; - blocks.each(function() { + var curBg = 'cur_background'; + blocks.each(function () { var blk = $(this); - blk.click(function() { - blocks.removeClass(cur_bg); - $(this).addClass(cur_bg); + blk.click(function () { + blocks.removeClass(curBg); + $(this).addClass(curBg); }); }); @@ -2905,38 +2880,38 @@ window.svgEditor = (function ($) { $('#image_save_opts input').val([$.pref('img_save')]); - var changeRectRadius = function(ctl) { + var changeRectRadius = function (ctl) { svgCanvas.setRectRadius(ctl.value); }; - var changeFontSize = function(ctl) { + var changeFontSize = function (ctl) { svgCanvas.setFontSize(ctl.value); }; - var changeStrokeWidth = function(ctl) { + var changeStrokeWidth = function (ctl) { var val = ctl.value; - if (val == 0 && selectedElement && ['line', 'polyline'].indexOf(selectedElement.nodeName) >= 0) { + if (val === 0 && selectedElement && ['line', 'polyline'].indexOf(selectedElement.nodeName) >= 0) { val = ctl.value = 1; } svgCanvas.setStrokeWidth(val); }; - var changeRotationAngle = function(ctl) { + var changeRotationAngle = function (ctl) { svgCanvas.setRotationAngle(ctl.value); $('#tool_reorient').toggleClass('disabled', parseInt(ctl.value, 10) === 0); }; - var changeOpacity = function(ctl, val) { - if (val == null) {val = ctl.value;} + var changeOpacity = function (ctl, val) { + if (val == null) { val = ctl.value; } $('#group_opacity').val(val); if (!ctl || !ctl.handle) { $('#opac_slider').slider('option', 'value', val); } - svgCanvas.setOpacity(val/100); + svgCanvas.setOpacity(val / 100); }; - var changeBlur = function(ctl, val, noUndo) { - if (val == null) {val = ctl.value;} + var changeBlur = function (ctl, val, noUndo) { + if (val == null) { val = ctl.value; } $('#blur').val(val); var complete = false; if (!ctl || !ctl.handle) { @@ -2950,26 +2925,26 @@ window.svgEditor = (function ($) { } }; - $('#stroke_style').change(function() { + $('#stroke_style').change(function () { svgCanvas.setStrokeAttr('stroke-dasharray', $(this).val()); operaRepaint(); }); - $('#stroke_linejoin').change(function() { + $('#stroke_linejoin').change(function () { svgCanvas.setStrokeAttr('stroke-linejoin', $(this).val()); operaRepaint(); }); // Lose focus for select elements when changed (Allows keyboard shortcuts to work better) - $('select').change(function(){$(this).blur();}); + $('select').change(function () { $(this).blur(); }); // fired when user wants to move elements to another layer var promptMoveLayerOnce = false; - $('#selLayerNames').change(function() { + $('#selLayerNames').change(function () { var destLayer = this.options[this.selectedIndex].value; var confirmStr = uiStrings.notification.QmoveElemsToLayer.replace('%s', destLayer); - var moveToLayer = function(ok) { - if (!ok) {return;} + var moveToLayer = function (ok) { + if (!ok) { return; } promptMoveLayerOnce = true; svgCanvas.moveSelectedToLayer(destLayer); svgCanvas.clearSelection(); @@ -2984,23 +2959,23 @@ window.svgEditor = (function ($) { } }); - $('#font_family').change(function() { + $('#font_family').change(function () { svgCanvas.setFontFamily(this.value); }); - $('#seg_type').change(function() { + $('#seg_type').change(function () { svgCanvas.setSegType($(this).val()); }); - $('#text').bind("keyup input", function() { + $('#text').bind('keyup input', function () { svgCanvas.setTextContent(this.value); }); - $('#image_url').change(function() { + $('#image_url').change(function () { setImageURL(this.value); }); - $('#link_url').change(function() { + $('#link_url').change(function () { if (this.value.length) { svgCanvas.setLinkURL(this.value); } else { @@ -3008,11 +2983,11 @@ window.svgEditor = (function ($) { } }); - $('#g_title').change(function() { + $('#g_title').change(function () { svgCanvas.setGroupTitle(this.value); }); - $('.attr_changer').change(function() { + $('.attr_changer').change(function () { var attr = this.getAttribute('data-attr'); var val = this.value; var valid = svgedit.units.isValidUnit(attr, val, selectedElement); @@ -3043,7 +3018,7 @@ window.svgEditor = (function ($) { var elem = selectedElement; svgCanvas.clearSelection(); elem.id = val; - svgCanvas.addToSelection([elem],true); + svgCanvas.addToSelection([elem], true); } else { svgCanvas.changeSelectedAttribute(attr, val); } @@ -3051,13 +3026,13 @@ window.svgEditor = (function ($) { }); // Prevent selection of elements when shift-clicking - $('#palette').mouseover(function() { + $('#palette').mouseover(function () { var inp = $(''); $(this).append(inp); inp.focus().remove(); }); - $('.palette_item').mousedown(function(evt) { + $('.palette_item').mousedown(function (evt) { // shift key or right click for stroke var picker = evt.shiftKey || evt.button === 2 ? 'stroke' : 'fill'; var color = $(this).data('rgb'); @@ -3078,57 +3053,57 @@ window.svgEditor = (function ($) { svgCanvas.setPaintOpacity(picker, 1.0); } updateToolButtonState(); - }).bind('contextmenu', function(e) {e.preventDefault();}); + }).bind('contextmenu', function (e) { e.preventDefault(); }); - $('#toggle_stroke_tools').on('click', function() { + $('#toggle_stroke_tools').on('click', function () { $('#tools_bottom').toggleClass('expanded'); }); - (function() { - var last_x = null, last_y = null, w_area = workarea[0], + (function () { + var lastX = null, lastY = null, wArea = workarea[0], panning = false, keypan = false; - $('#svgcanvas').bind('mousemove mouseup', function(evt) { - if (panning === false) {return;} + $('#svgcanvas').bind('mousemove mouseup', function (evt) { + if (panning === false) { return; } - w_area.scrollLeft -= (evt.clientX - last_x); - w_area.scrollTop -= (evt.clientY - last_y); + wArea.scrollLeft -= (evt.clientX - lastX); + wArea.scrollTop -= (evt.clientY - lastY); - last_x = evt.clientX; - last_y = evt.clientY; + lastX = evt.clientX; + lastY = evt.clientY; - if (evt.type === 'mouseup') {panning = false;} + if (evt.type === 'mouseup') { panning = false; } return false; - }).mousedown(function(evt) { + }).mousedown(function (evt) { if (evt.button === 1 || keypan === true) { panning = true; - last_x = evt.clientX; - last_y = evt.clientY; + lastX = evt.clientX; + lastY = evt.clientY; return false; } }); - $(window).mouseup(function() { + $(window).mouseup(function () { panning = false; }); - $(document).bind('keydown', 'space', function(evt) { + $(document).bind('keydown', 'space', function (evt) { svgCanvas.spaceKey = keypan = true; evt.preventDefault(); - }).bind('keyup', 'space', function(evt) { + }).bind('keyup', 'space', function (evt) { evt.preventDefault(); svgCanvas.spaceKey = keypan = false; - }).bind('keydown', 'shift', function(evt) { + }).bind('keydown', 'shift', function (evt) { if (svgCanvas.getMode() === 'zoom') { workarea.css('cursor', zoomOutIcon); } - }).bind('keyup', 'shift', function(evt) { + }).bind('keyup', 'shift', function (evt) { if (svgCanvas.getMode() === 'zoom') { workarea.css('cursor', zoomInIcon); } }); - editor.setPanning = function(active) { + editor.setPanning = function (active) { svgCanvas.spaceKey = keypan = active; }; }()); @@ -3137,40 +3112,42 @@ window.svgEditor = (function ($) { var button = $('#main_icon'); var overlay = $('#main_icon span'); var list = $('#main_menu'); - var on_button = false; + var onButton = false; var height = 0; - var js_hover = true; - var set_click = false; + var jsHover = true; + var setClick = false; /* // Currently unused - var hideMenu = function() { + var hideMenu = function () { list.fadeOut(200); }; */ - $(window).mouseup(function(evt) { - if (!on_button) { + $(window).mouseup(function (evt) { + if (!onButton) { button.removeClass('buttondown'); // do not hide if it was the file input as that input needs to be visible // for its change event to fire - if (evt.target.tagName != 'INPUT') { + if (evt.target.tagName !== 'INPUT') { list.fadeOut(200); - } else if (!set_click) { - set_click = true; - $(evt.target).click(function() { + } else if (!setClick) { + setClick = true; + $(evt.target).click(function () { list.css('margin-left', '-9999px').show(); }); } } - on_button = false; - }).mousedown(function(evt) { -// $('.contextMenu').hide(); + onButton = false; + }).mousedown(function (evt) { + // $('.contextMenu').hide(); var islib = $(evt.target).closest('div.tools_flyout, .contextMenu').length; - if (!islib) {$('.tools_flyout:visible,.contextMenu').fadeOut(250);} + if (!islib) { + $('.tools_flyout:visible,.contextMenu').fadeOut(250); + } }); - overlay.bind('mousedown',function() { + overlay.bind('mousedown', function () { if (!button.hasClass('buttondown')) { // Margin must be reset in case it was changed before; list.css('margin-left', 0).show(); @@ -3178,31 +3155,31 @@ window.svgEditor = (function ($) { height = list.height(); } // Using custom animation as slideDown has annoying 'bounce effect' - list.css('height',0).animate({ + list.css('height', 0).animate({ 'height': height }, 200); - on_button = true; + onButton = true; } else { list.fadeOut(200); } button.toggleClass('buttondown buttonup'); - }).hover(function() { - on_button = true; - }).mouseout(function() { - on_button = false; + }).hover(function () { + onButton = true; + }).mouseout(function () { + onButton = false; }); - var list_items = $('#main_menu li'); + var listItems = $('#main_menu li'); // Check if JS method of hovering needs to be used (Webkit bug) - list_items.mouseover(function() { - js_hover = ($(this).css('background-color') == 'rgba(0, 0, 0, 0)'); + listItems.mouseover(function () { + jsHover = ($(this).css('background-color') === 'rgba(0, 0, 0, 0)'); - list_items.unbind('mouseover'); - if (js_hover) { - list_items.mouseover(function() { + listItems.unbind('mouseover'); + if (jsHover) { + listItems.mouseover(function () { this.style.backgroundColor = '#FFC'; - }).mouseout(function() { + }).mouseout(function () { this.style.backgroundColor = 'transparent'; return true; }); @@ -3211,11 +3188,11 @@ window.svgEditor = (function ($) { }()); // Made public for UI customization. // TODO: Group UI functions into a public editor.ui interface. - editor.addDropDown = function(elem, callback, dropUp) { - if ($(elem).length == 0) {return;} // Quit if called on non-existant element + editor.addDropDown = function (elem, callback, dropUp) { + if ($(elem).length === 0) { return; } // Quit if called on non-existant element var button = $(elem).find('button'); var list = $(elem).find('ul').attr('id', $(elem)[0].id + '-list'); - var on_button = false; + var onButton = false; if (dropUp) { $(elem).addClass('dropup'); } else { @@ -3224,15 +3201,15 @@ window.svgEditor = (function ($) { } list.find('li').bind('mouseup', callback); - $(window).mouseup(function(evt) { - if (!on_button) { + $(window).mouseup(function (evt) { + if (!onButton) { button.removeClass('down'); list.hide(); } - on_button = false; + onButton = false; }); - button.bind('mousedown',function() { + button.bind('mousedown', function () { if (!button.hasClass('down')) { if (!dropUp) { var pos = $(elem).position(); @@ -3242,38 +3219,38 @@ window.svgEditor = (function ($) { }); } list.show(); - on_button = true; + onButton = true; } else { list.hide(); } button.toggleClass('down'); - }).hover(function() { - on_button = true; - }).mouseout(function() { - on_button = false; + }).hover(function () { + onButton = true; + }).mouseout(function () { + onButton = false; }); }; - editor.addDropDown('#font_family_dropdown', function() { + editor.addDropDown('#font_family_dropdown', function () { $('#font_family').val($(this).text()).change(); }); - editor.addDropDown('#opacity_dropdown', function() { - if ($(this).find('div').length) {return;} + editor.addDropDown('#opacity_dropdown', function () { + if ($(this).find('div').length) { return; } var perc = parseInt($(this).text().split('%')[0], 10); changeOpacity(false, perc); }, true); // For slider usage, see: http://jqueryui.com/demos/slider/ $('#opac_slider').slider({ - start: function() { + start: function () { $('#opacity_dropdown li:not(.special)').hide(); }, - stop: function() { + stop: function () { $('#opacity_dropdown li').show(); $(window).mouseup(); }, - slide: function(evt, ui) { + slide: function (evt, ui) { changeOpacity(ui); } }); @@ -3285,21 +3262,21 @@ window.svgEditor = (function ($) { $('#blur_slider').slider({ max: 10, step: 0.1, - stop: function(evt, ui) { + stop: function (evt, ui) { slideStart = false; changeBlur(ui); $('#blur_dropdown li').show(); $(window).mouseup(); }, - start: function() { + start: function () { slideStart = true; }, - slide: function(evt, ui) { + slide: function (evt, ui) { changeBlur(ui, null, slideStart); } }); - editor.addDropDown('#zoom_dropdown', function() { + editor.addDropDown('#zoom_dropdown', function () { var item = $(this); var val = item.data('val'); if (val) { @@ -3309,15 +3286,15 @@ window.svgEditor = (function ($) { } }, true); - addAltDropDown('#stroke_linecap', '#linecap_opts', function() { + addAltDropDown('#stroke_linecap', '#linecap_opts', function () { setStrokeOpt(this, true); }, {dropUp: true}); - addAltDropDown('#stroke_linejoin', '#linejoin_opts', function() { + addAltDropDown('#stroke_linejoin', '#linejoin_opts', function () { setStrokeOpt(this, true); }, {dropUp: true}); - addAltDropDown('#tool_position', '#position_opts', function() { + addAltDropDown('#tool_position', '#position_opts', function () { var letter = this.id.replace('tool_pos', '').charAt(0); svgCanvas.alignSelectedElements(letter, 'page'); }, {multiclick: true}); @@ -3339,88 +3316,88 @@ window.svgEditor = (function ($) { */ // Unfocus text input when workarea is mousedowned. - (function() { + (function () { var inp; - var unfocus = function() { + var unfocus = function () { $(inp).blur(); }; - $('#svg_editor').find('button, select, input:not(#text)').focus(function() { + $('#svg_editor').find('button, select, input:not(#text)').focus(function () { inp = this; - ui_context = 'toolbars'; + uiContext = 'toolbars'; workarea.mousedown(unfocus); - }).blur(function() { - ui_context = 'canvas'; + }).blur(function () { + uiContext = 'canvas'; workarea.unbind('mousedown', unfocus); // Go back to selecting text if in textedit mode - if (svgCanvas.getMode() == 'textedit') { + if (svgCanvas.getMode() === 'textedit') { $('#text').focus(); } }); }()); - var clickFHPath = function() { + var clickFHPath = function () { if (toolButtonClick('#tool_fhpath')) { svgCanvas.setMode('fhpath'); } }; - var clickLine = function() { + var clickLine = function () { if (toolButtonClick('#tool_line')) { svgCanvas.setMode('line'); } }; - var clickSquare = function() { + var clickSquare = function () { if (toolButtonClick('#tool_square')) { svgCanvas.setMode('square'); } }; - var clickRect = function() { + var clickRect = function () { if (toolButtonClick('#tool_rect')) { svgCanvas.setMode('rect'); } }; - var clickFHRect = function() { + var clickFHRect = function () { if (toolButtonClick('#tool_fhrect')) { svgCanvas.setMode('fhrect'); } }; - var clickCircle = function() { + var clickCircle = function () { if (toolButtonClick('#tool_circle')) { svgCanvas.setMode('circle'); } }; - var clickEllipse = function() { + var clickEllipse = function () { if (toolButtonClick('#tool_ellipse')) { svgCanvas.setMode('ellipse'); } }; - var clickFHEllipse = function() { + var clickFHEllipse = function () { if (toolButtonClick('#tool_fhellipse')) { svgCanvas.setMode('fhellipse'); } }; - var clickImage = function() { + var clickImage = function () { if (toolButtonClick('#tool_image')) { svgCanvas.setMode('image'); } }; - var clickZoom = function() { + var clickZoom = function () { if (toolButtonClick('#tool_zoom')) { svgCanvas.setMode('zoom'); workarea.css('cursor', zoomInIcon); } }; - var zoomImage = function(multiplier) { + var zoomImage = function (multiplier) { var res = svgCanvas.getResolution(); multiplier = multiplier ? res.zoom * multiplier : 1; // setResolution(res.w * multiplier, res.h * multiplier, true); @@ -3430,20 +3407,20 @@ window.svgEditor = (function ($) { updateCanvas(true); }; - var dblclickZoom = function() { + var dblclickZoom = function () { if (toolButtonClick('#tool_zoom')) { zoomImage(); setSelectMode(); } }; - var clickText = function() { + var clickText = function () { if (toolButtonClick('#tool_text')) { svgCanvas.setMode('text'); } }; - var clickPath = function() { + var clickPath = function () { if (toolButtonClick('#tool_path')) { svgCanvas.setMode('path'); } @@ -3451,70 +3428,70 @@ window.svgEditor = (function ($) { // Delete is a contextual tool that only appears in the ribbon if // an element has been selected - var deleteSelected = function() { + var deleteSelected = function () { if (selectedElement != null || multiselected) { svgCanvas.deleteSelectedElements(); } }; - var cutSelected = function() { + var cutSelected = function () { if (selectedElement != null || multiselected) { svgCanvas.cutSelectedElements(); } }; - var copySelected = function() { + var copySelected = function () { if (selectedElement != null || multiselected) { svgCanvas.copySelectedElements(); } }; - var pasteInCenter = function() { + var pasteInCenter = function () { var zoom = svgCanvas.getZoom(); - var x = (workarea[0].scrollLeft + workarea.width()/2)/zoom - svgCanvas.contentW; - var y = (workarea[0].scrollTop + workarea.height()/2)/zoom - svgCanvas.contentH; + var x = (workarea[0].scrollLeft + workarea.width() / 2) / zoom - svgCanvas.contentW; + var y = (workarea[0].scrollTop + workarea.height() / 2) / zoom - svgCanvas.contentH; svgCanvas.pasteElements('point', x, y); }; - var moveToTopSelected = function() { + var moveToTopSelected = function () { if (selectedElement != null) { svgCanvas.moveToTopSelectedElement(); } }; - var moveToBottomSelected = function() { + var moveToBottomSelected = function () { if (selectedElement != null) { svgCanvas.moveToBottomSelectedElement(); } }; - var moveUpDownSelected = function(dir) { + var moveUpDownSelected = function (dir) { if (selectedElement != null) { svgCanvas.moveUpDownSelected(dir); } }; - var convertToPath = function() { + var convertToPath = function () { if (selectedElement != null) { svgCanvas.convertToPath(); } }; - var reorientPath = function() { + var reorientPath = function () { if (selectedElement != null) { path.reorient(); } }; - var makeHyperlink = function() { + var makeHyperlink = function () { if (selectedElement != null || multiselected) { - $.prompt(uiStrings.notification.enterNewLinkURL, 'http://', function(url) { - if (url) {svgCanvas.makeHyperlink(url);} + $.prompt(uiStrings.notification.enterNewLinkURL, 'http://', function (url) { + if (url) { svgCanvas.makeHyperlink(url); } }); } }; - var moveSelected = function(dx,dy) { + var moveSelected = function (dx, dy) { if (selectedElement != null || multiselected) { if (curConfig.gridSnapping) { // Use grid snap value regardless of zoom level @@ -3522,59 +3499,59 @@ window.svgEditor = (function ($) { dx *= multi; dy *= multi; } - svgCanvas.moveSelectedElements(dx,dy); + svgCanvas.moveSelectedElements(dx, dy); } }; - var linkControlPoints = function() { + var linkControlPoints = function () { $('#tool_node_link').toggleClass('push_button_pressed tool_button'); var linked = $('#tool_node_link').hasClass('push_button_pressed'); path.linkControlPoints(linked); }; - var clonePathNode = function() { + var clonePathNode = function () { if (path.getNodePoint()) { path.clonePathNode(); } }; - var deletePathNode = function() { + var deletePathNode = function () { if (path.getNodePoint()) { path.deletePathNode(); } }; - var addSubPath = function() { + var addSubPath = function () { var button = $('#tool_add_subpath'); var sp = !button.hasClass('push_button_pressed'); button.toggleClass('push_button_pressed tool_button'); path.addSubPath(sp); }; - var opencloseSubPath = function() { + var opencloseSubPath = function () { path.opencloseSubPath(); }; - var selectNext = function() { + var selectNext = function () { svgCanvas.cycleElement(1); }; - var selectPrev = function() { + var selectPrev = function () { svgCanvas.cycleElement(0); }; - var rotateSelected = function(cw, step) { - if (selectedElement == null || multiselected) {return;} - if (!cw) {step *= -1;} + var rotateSelected = function (cw, step) { + if (selectedElement == null || multiselected) { return; } + if (!cw) { step *= -1; } var angle = parseFloat($('#angle').val()) + step; svgCanvas.setRotationAngle(angle); updateContextPanel(); }; - var clickClear = function() { + var clickClear = function () { var dims = curConfig.dimensions; - $.confirm(uiStrings.notification.QwantToClear, function(ok) { - if (!ok) {return;} + $.confirm(uiStrings.notification.QwantToClear, function (ok) { + if (!ok) { return; } setSelectMode(); svgCanvas.clear(); svgCanvas.setResolution(dims[0], dims[1]); @@ -3587,19 +3564,19 @@ window.svgEditor = (function ($) { }); }; - var clickBold = function() { - svgCanvas.setBold( !svgCanvas.getBold() ); + var clickBold = function () { + svgCanvas.setBold(!svgCanvas.getBold()); updateContextPanel(); return false; }; - var clickItalic = function() { - svgCanvas.setItalic( !svgCanvas.getItalic() ); + var clickItalic = function () { + svgCanvas.setItalic(!svgCanvas.getItalic()); updateContextPanel(); return false; }; - var clickSave = function() { + var clickSave = function () { // In the future, more options can be provided here var saveOpts = { 'images': $.pref('img_save'), @@ -3609,7 +3586,7 @@ window.svgEditor = (function ($) { }; var loadingURL; - var clickExport = function() { + var clickExport = function () { $.select('Select an image type for export: ', [ // See http://kangax.github.io/jstests/toDataUrl_mime_type_test/ for a useful list of MIME types and browser support // 'ICO', // Todo: Find a way to preserve transparency in SVG-Edit if not working presently and do full packaging for x-icon; then switch back to position after 'PNG' @@ -3633,7 +3610,7 @@ window.svgEditor = (function ($) { } else { popHTML = '' + str + '

    ' + str + '

    '; if (typeof URL && URL.createObjectURL) { - var blob = new Blob([popHTML], {type:'text/html'}); + var blob = new Blob([popHTML], {type: 'text/html'}); popURL = URL.createObjectURL(blob); } else { popURL = 'data:text/html;base64;charset=utf-8,' + svgedit.utilities.encode64(popHTML); @@ -3647,12 +3624,11 @@ window.svgEditor = (function ($) { openExportWindow(); } svgCanvas.exportPDF(exportWindowName); - } - else { + } else { if (!customExportImage) { openExportWindow(); } - var quality = parseInt($('#image-slider').val(), 10)/100; + var quality = parseInt($('#image-slider').val(), 10) / 100; svgCanvas.rasterExport(imgType, quality, exportWindowName); } }, function () { @@ -3661,8 +3637,7 @@ window.svgEditor = (function ($) { if (!$('#image-slider').length) { $('
    ').appendTo(sel.parent()); // Todo: i18n-ize label } - } - else { + } else { $('#image-slider').parent().remove(); } }); @@ -3671,57 +3646,56 @@ window.svgEditor = (function ($) { // by default, svgCanvas.open() is a no-op. // it is up to an extension mechanism (opera widget, etc) // to call setCustomHandlers() which will make it do something - var clickOpen = function() { + var clickOpen = function () { svgCanvas.open(); }; - var clickImport = function() { + var clickImport = function () { }; - var clickUndo = function() { + var clickUndo = function () { if (undoMgr.getUndoStackSize() > 0) { undoMgr.undo(); populateLayers(); } }; - var clickRedo = function() { + var clickRedo = function () { if (undoMgr.getRedoStackSize() > 0) { undoMgr.redo(); populateLayers(); } }; - var clickGroup = function() { + var clickGroup = function () { // group if (multiselected) { svgCanvas.groupSelectedElements(); - } // ungroup - else if (selectedElement) { + } else if (selectedElement) { svgCanvas.ungroupSelectedElement(); } }; - var clickClone = function() { + var clickClone = function () { svgCanvas.cloneSelectedElements(20, 20); }; - var clickAlign = function() { + var clickAlign = function () { var letter = this.id.replace('tool_align', '').charAt(0); svgCanvas.alignSelectedElements(letter, $('#align_relative_to').val()); }; - var clickWireframe = function() { + var clickWireframe = function () { $('#tool_wireframe').toggleClass('push_button_pressed tool_button'); workarea.toggleClass('wireframe'); - if (supportsNonSS) {return;} - var wf_rules = $('#wireframe_rules'); - if (!wf_rules.length) { - wf_rules = $('').appendTo('head'); + if (supportsNonSS) { return; } + var wfRules = $('#wireframe_rules'); + if (!wfRules.length) { + wfRules = $('').appendTo('head'); } else { - wf_rules.empty(); + wfRules.empty(); } updateWireFrame(); @@ -3729,8 +3703,8 @@ window.svgEditor = (function ($) { $('#svg_docprops_container, #svg_prefs_container').draggable({cancel: 'button,fieldset', containment: 'window'}); - var showDocProperties = function() { - if (docprops) {return;} + var showDocProperties = function () { + if (docprops) { return; } docprops = true; // This selects the correct radio button by using the array notation @@ -3750,23 +3724,23 @@ window.svgEditor = (function ($) { $('#svg_docprops').show(); }; - var showPreferences = function() { - if (preferences) {return;} + var showPreferences = function () { + if (preferences) { return; } preferences = true; $('#main_menu').hide(); // Update background color with current one var blocks = $('#bg_blocks div'); - var cur_bg = 'cur_background'; - var canvas_bg = curPrefs.bkgd_color; + var curBg = 'cur_background'; + var canvasBg = curPrefs.bkgd_color; var url = $.pref('bkgd_url'); - blocks.each(function() { + blocks.each(function () { var blk = $(this); - var is_bg = blk.css('background-color') == canvas_bg; - blk.toggleClass(cur_bg, is_bg); - if (is_bg) {$('#canvas_bg_url').removeClass(cur_bg);} + var isBg = blk.css('background-color') === canvasBg; + blk.toggleClass(curBg, isBg); + if (isBg) { $('#canvas_bg_url').removeClass(curBg); } }); - if (!canvas_bg) {blocks.eq(0).addClass(cur_bg);} + if (!canvasBg) { blocks.eq(0).addClass(curBg); } if (url) { $('#canvas_bg_url').val(url); } @@ -3777,16 +3751,16 @@ window.svgEditor = (function ($) { $('#svg_prefs').show(); }; - var hideSourceEditor = function() { + var hideSourceEditor = function () { $('#svg_source_editor').hide(); editingsource = false; $('#svg_source_textarea').blur(); }; - var saveSourceEditor = function() { - if (!editingsource) {return;} + var saveSourceEditor = function () { + if (!editingsource) { return; } - var saveChanges = function() { + var saveChanges = function () { svgCanvas.clearSelection(); hideSourceEditor(); zoomImage(); @@ -3796,8 +3770,8 @@ window.svgEditor = (function ($) { }; if (!svgCanvas.setSvgString($('#svg_source_textarea').val())) { - $.confirm(uiStrings.notification.QerrorsRevertToSource, function(ok) { - if (!ok) {return false;} + $.confirm(uiStrings.notification.QerrorsRevertToSource, function (ok) { + if (!ok) { return false; } saveChanges(); }); } else { @@ -3806,7 +3780,7 @@ window.svgEditor = (function ($) { setSelectMode(); }; - var hideDocProperties = function() { + var hideDocProperties = function () { $('#svg_docprops').hide(); $('#canvas_width,#canvas_height').removeAttr('disabled'); $('#resolution')[0].selectedIndex = 0; @@ -3814,12 +3788,12 @@ window.svgEditor = (function ($) { docprops = false; }; - var hidePreferences = function() { + var hidePreferences = function () { $('#svg_prefs').hide(); preferences = false; }; - var saveDocProperties = function() { + var saveDocProperties = function () { // set title var newTitle = $('#canvas_title').val(); updateTitle(newTitle); @@ -3829,7 +3803,7 @@ window.svgEditor = (function ($) { var width = $('#canvas_width'), w = width.val(); var height = $('#canvas_height'), h = height.val(); - if (w != 'fit' && !svgedit.units.isValidUnit('width', w)) { + if (w !== 'fit' && !svgedit.units.isValidUnit('width', w)) { $.alert(uiStrings.notification.invalidAttrValGiven); width.parent().addClass('error'); return false; @@ -3837,7 +3811,7 @@ window.svgEditor = (function ($) { width.parent().removeClass('error'); - if (h != 'fit' && !svgedit.units.isValidUnit('height', h)) { + if (h !== 'fit' && !svgedit.units.isValidUnit('height', h)) { $.alert(uiStrings.notification.invalidAttrValGiven); height.parent().addClass('error'); return false; @@ -3856,7 +3830,7 @@ window.svgEditor = (function ($) { hideDocProperties(); }; - var savePreferences = editor.savePreferences = function() { + var savePreferences = editor.savePreferences = function () { // Set background var color = $('#bg_blocks div.cur_background').css('background-color') || '#FFF'; setBackground(color, $('#canvas_bg_url').val()); @@ -3864,7 +3838,7 @@ window.svgEditor = (function ($) { // set language var lang = $('#lang_select').val(); if (lang !== $.pref('lang')) { - editor.putLocale(lang, good_langs); + editor.putLocale(lang, goodLangs); } // set icon size @@ -3877,7 +3851,7 @@ window.svgEditor = (function ($) { curConfig.showRulers = $('#show_rulers')[0].checked; $('#rulers').toggle(curConfig.showRulers); - if (curConfig.showRulers) {updateRulers();} + if (curConfig.showRulers) { updateRulers(); } curConfig.baseUnit = $('#base_unit').val(); svgCanvas.setConfig(curConfig); @@ -3888,10 +3862,10 @@ window.svgEditor = (function ($) { var resetScrollPos = $.noop; - var cancelOverlays = function() { + var cancelOverlays = function () { $('#dialog_box').hide(); if (!editingsource && !docprops && !preferences) { - if (cur_context) { + if (curContext) { svgCanvas.leaveContext(); } return; @@ -3899,8 +3873,8 @@ window.svgEditor = (function ($) { if (editingsource) { if (origSource !== $('#svg_source_textarea').val()) { - $.confirm(uiStrings.notification.QignoreSourceChanges, function(ok) { - if (ok) {hideSourceEditor();} + $.confirm(uiStrings.notification.QignoreSourceChanges, function (ok) { + if (ok) { hideSourceEditor(); } }); } else { hideSourceEditor(); @@ -3913,12 +3887,12 @@ window.svgEditor = (function ($) { resetScrollPos(); }; - var win_wh = {width:$(window).width(), height:$(window).height()}; + var winWh = {width: $(window).width(), height: $(window).height()}; // Fix for Issue 781: Drawing area jumps to top-left corner on window resize (IE9) if (svgedit.browser.isIE()) { - (function() { - resetScrollPos = function() { + (function () { + resetScrollPos = function () { if (workarea[0].scrollLeft === 0 && workarea[0].scrollTop === 0) { workarea[0].scrollLeft = curScrollPos.left; workarea[0].scrollTop = curScrollPos.top; @@ -3931,15 +3905,15 @@ window.svgEditor = (function ($) { }; $(window).resize(resetScrollPos); - editor.ready(function() { + editor.ready(function () { // TODO: Find better way to detect when to do this to minimize // flickering effect - setTimeout(function() { + setTimeout(function () { resetScrollPos(); }, 500); }); - workarea.scroll(function() { + workarea.scroll(function () { curScrollPos = { left: workarea[0].scrollLeft, top: workarea[0].scrollTop @@ -3948,29 +3922,28 @@ window.svgEditor = (function ($) { }()); } - $(window).resize(function(evt) { - $.each(win_wh, function(type, val) { + $(window).resize(function (evt) { + $.each(winWh, function (type, val) { var curval = $(window)[type](); - workarea[0]['scroll' + (type === 'width' ? 'Left' : 'Top')] -= (curval - val)/2; - win_wh[type] = curval; + workarea[0]['scroll' + (type === 'width' ? 'Left' : 'Top')] -= (curval - val) / 2; + winWh[type] = curval; }); setFlyoutPositions(); }); - (function() { - workarea.scroll(function() { + (function () { + workarea.scroll(function () { // TODO: jQuery's scrollLeft/Top() wouldn't require a null check - if ($('#ruler_x').length != 0) { + if ($('#ruler_x').length !== 0) { $('#ruler_x')[0].scrollLeft = workarea[0].scrollLeft; } - if ($('#ruler_y').length != 0) { + if ($('#ruler_y').length !== 0) { $('#ruler_y')[0].scrollTop = workarea[0].scrollTop; } }); - }()); - $('#url_notice').click(function() { + $('#url_notice').click(function () { $.alert(this.title); }); @@ -3978,26 +3951,26 @@ window.svgEditor = (function ($) { // added these event handlers for all the push buttons so they // behave more like buttons being pressed-in and not images - (function() { + (function () { var toolnames = ['clear', 'open', 'save', 'source', 'delete', 'delete_multi', 'paste', 'clone', 'clone_multi', 'move_top', 'move_bottom']; - var all_tools = ''; - var cur_class = 'tool_button_current'; + var allTools = ''; + var curClass = 'tool_button_current'; - $.each(toolnames, function(i, item) { - all_tools += (i ? ',' : '') + '#tool_' + item; + $.each(toolnames, function (i, item) { + allTools += (i ? ',' : '') + '#tool_' + item; }); - $(all_tools).mousedown(function() { - $(this).addClass(cur_class); - }).bind('mousedown mouseout', function() { - $(this).removeClass(cur_class); + $(allTools).mousedown(function () { + $(this).addClass(curClass); + }).bind('mousedown mouseout', function () { + $(this).removeClass(curClass); }); - $('#tool_undo, #tool_redo').mousedown(function() { - if (!$(this).hasClass('disabled')) {$(this).addClass(cur_class);} - }).bind('mousedown mouseout',function() { - $(this).removeClass(cur_class);} - ); + $('#tool_undo, #tool_redo').mousedown(function () { + if (!$(this).hasClass('disabled')) { $(this).addClass(curClass); } + }).bind('mousedown mouseout', function () { + $(this).removeClass(curClass); + }); }()); // switch modifier key in tooltips if mac @@ -4018,46 +3991,47 @@ window.svgEditor = (function ($) { // TODO: go back to the color boxes having white background-color and then setting // background-image to none.png (otherwise partially transparent gradients look weird) - var colorPicker = function(elem) { - var picker = elem.attr('id') == 'stroke_color' ? 'stroke' : 'fill'; -// var opacity = (picker == 'stroke' ? $('#stroke_opacity') : $('#fill_opacity')); + var colorPicker = function (elem) { + var picker = elem.attr('id') === 'stroke_color' ? 'stroke' : 'fill'; + // var opacity = (picker == 'stroke' ? $('#stroke_opacity') : $('#fill_opacity')); var paint = paintBox[picker].paint; - var title = (picker == 'stroke' ? 'Pick a Stroke Paint and Opacity' : 'Pick a Fill Paint and Opacity'); + var title = (picker === 'stroke' ? 'Pick a Stroke Paint and Opacity' : 'Pick a Fill Paint and Opacity'); // var was_none = false; // Currently unused var pos = elem.offset(); $('#color_picker') .draggable({cancel: '.jGraduate_tabs, .jGraduate_colPick, .jGraduate_gradPick, .jPicker', containment: 'window'}) .css(curConfig.colorPickerCSS || {'left': pos.left - 140, 'bottom': 40}) .jGraduate( - { - paint: paint, - window: { pickerTitle: title }, - images: { clientPath: curConfig.jGraduatePath }, - newstop: 'inverse' - }, - function(p) { - paint = new $.jGraduate.Paint(p); - paintBox[picker].setPaint(paint); - svgCanvas.setPaint(picker, paint); - $('#color_picker').hide(); - }, - function() { - $('#color_picker').hide(); - }); + { + paint: paint, + window: { pickerTitle: title }, + images: { clientPath: curConfig.jGraduatePath }, + newstop: 'inverse' + }, + function (p) { + paint = new $.jGraduate.Paint(p); + paintBox[picker].setPaint(paint); + svgCanvas.setPaint(picker, paint); + $('#color_picker').hide(); + }, + function () { + $('#color_picker').hide(); + } + ); }; - var PaintBox = function(container, type) { + var PaintBox = function (container, type) { var paintColor, paintOpacity, cur = curConfig[type === 'fill' ? 'initFill' : 'initStroke']; // set up gradients to be used for the buttons var svgdocbox = new DOMParser().parseFromString( - ''+ + '' + ' ', 'text/xml'); var docElem = svgdocbox.documentElement; docElem = $(container)[0].appendChild(document.importNode(docElem, true)); - docElem.setAttribute('width',16.5); + docElem.setAttribute('width', 16.5); this.rect = docElem.firstChild; this.defs = docElem.getElementsByTagName('defs')[0]; @@ -4065,24 +4039,24 @@ window.svgEditor = (function ($) { this.paint = new $.jGraduate.Paint({solidColor: cur.color}); this.type = type; - this.setPaint = function(paint, apply) { + this.setPaint = function (paint, apply) { this.paint = paint; var fillAttr = 'none'; var ptype = paint.type; var opac = paint.alpha / 100; - switch ( ptype ) { - case 'solidColor': - fillAttr = (paint[ptype] != 'none') ? '#' + paint[ptype] : paint[ptype]; - break; - case 'linearGradient': - case 'radialGradient': - this.defs.removeChild(this.grad); - this.grad = this.defs.appendChild(paint[ptype]); - var id = this.grad.id = 'gradbox_' + this.type; - fillAttr = 'url(#' + id + ')'; - break; + switch (ptype) { + case 'solidColor': + fillAttr = (paint[ptype] !== 'none') ? '#' + paint[ptype] : paint[ptype]; + break; + case 'linearGradient': + case 'radialGradient': + this.defs.removeChild(this.grad); + this.grad = this.defs.appendChild(paint[ptype]); + var id = this.grad.id = 'gradbox_' + this.type; + fillAttr = 'url(#' + id + ')'; + break; } this.rect.setAttribute('fill', fillAttr); @@ -4094,8 +4068,8 @@ window.svgEditor = (function ($) { } }; - this.update = function(apply) { - if (!selectedElement) {return;} + this.update = function (apply) { + if (!selectedElement) { return; } var i, len; var type = this.type; switch (selectedElement.tagName) { @@ -4151,15 +4125,15 @@ window.svgEditor = (function ($) { this.setPaint(paint); }; - this.prep = function() { + this.prep = function () { var ptype = this.paint.type; - switch ( ptype ) { - case 'linearGradient': - case 'radialGradient': - var paint = new $.jGraduate.Paint({copy: this.paint}); - svgCanvas.setPaint(type, paint); - break; + switch (ptype) { + case 'linearGradient': + case 'radialGradient': + var paint = new $.jGraduate.Paint({copy: this.paint}); + svgCanvas.setPaint(type, paint); + break; } }; }; @@ -4184,7 +4158,7 @@ window.svgEditor = (function ($) { $(blurTest).remove(); // Test for zoom icon support - (function() { + (function () { var pre = '-' + uaPrefix.toLowerCase() + '-zoom-'; var zoom = pre + 'in'; workarea.css('cursor', zoom); @@ -4196,8 +4170,8 @@ window.svgEditor = (function ($) { }()); // Test for embedImage support (use timeout to not interfere with page load) - setTimeout(function() { - svgCanvas.embedImage('images/logo.png', function(datauri) { + setTimeout(function () { + svgCanvas.embedImage('images/logo.png', function (datauri) { if (!datauri) { // Disable option $('#image_save_opts [value=embed]').attr('disabled', 'disabled'); @@ -4208,59 +4182,59 @@ window.svgEditor = (function ($) { }); }, 1000); - $('#fill_color, #tool_fill .icon_label').click(function() { + $('#fill_color, #tool_fill .icon_label').click(function () { colorPicker($('#fill_color')); updateToolButtonState(); }); - $('#stroke_color, #tool_stroke .icon_label').click(function() { + $('#stroke_color, #tool_stroke .icon_label').click(function () { colorPicker($('#stroke_color')); updateToolButtonState(); }); - $('#group_opacityLabel').click(function() { + $('#group_opacityLabel').click(function () { $('#opacity_dropdown button').mousedown(); $(window).mouseup(); }); - $('#zoomLabel').click(function() { + $('#zoomLabel').click(function () { $('#zoom_dropdown button').mousedown(); $(window).mouseup(); }); - $('#tool_move_top').mousedown(function(evt) { + $('#tool_move_top').mousedown(function (evt) { $('#tools_stacking').show(); evt.preventDefault(); }); - $('.layer_button').mousedown(function() { + $('.layer_button').mousedown(function () { $(this).addClass('layer_buttonpressed'); - }).mouseout(function() { + }).mouseout(function () { $(this).removeClass('layer_buttonpressed'); - }).mouseup(function() { + }).mouseup(function () { $(this).removeClass('layer_buttonpressed'); }); - $('.push_button').mousedown(function() { + $('.push_button').mousedown(function () { if (!$(this).hasClass('disabled')) { $(this).addClass('push_button_pressed').removeClass('push_button'); } - }).mouseout(function() { + }).mouseout(function () { $(this).removeClass('push_button_pressed').addClass('push_button'); - }).mouseup(function() { + }).mouseup(function () { $(this).removeClass('push_button_pressed').addClass('push_button'); }); // ask for a layer name - $('#layer_new').click(function() { + $('#layer_new').click(function () { var uniqName, i = svgCanvas.getCurrentDrawing().getNumLayers(); do { uniqName = uiStrings.layers.layer + ' ' + (++i); - } while(svgCanvas.getCurrentDrawing().hasLayer(uniqName)); + } while (svgCanvas.getCurrentDrawing().hasLayer(uniqName)); - $.prompt(uiStrings.notification.enterUniqueLayerName, uniqName, function(newName) { - if (!newName) {return;} + $.prompt(uiStrings.notification.enterUniqueLayerName, uniqName, function (newName) { + if (!newName) { return; } if (svgCanvas.getCurrentDrawing().hasLayer(newName)) { $.alert(uiStrings.notification.dupeLayerName); return; @@ -4271,7 +4245,7 @@ window.svgEditor = (function ($) { }); }); - function deleteLayer() { + function deleteLayer () { if (svgCanvas.deleteCurrentLayer()) { updateContextPanel(); populateLayers(); @@ -4283,11 +4257,11 @@ window.svgEditor = (function ($) { } } - function cloneLayer() { + function cloneLayer () { var name = svgCanvas.getCurrentDrawing().getCurrentLayerName() + ' copy'; - $.prompt(uiStrings.notification.enterUniqueLayerName, name, function(newName) { - if (!newName) {return;} + $.prompt(uiStrings.notification.enterUniqueLayerName, name, function (newName) { + if (!newName) { return; } if (svgCanvas.getCurrentDrawing().hasLayer(newName)) { $.alert(uiStrings.notification.dupeLayerName); return; @@ -4298,8 +4272,8 @@ window.svgEditor = (function ($) { }); } - function mergeLayer() { - if ($('#layerlist tr.layersel').index() == svgCanvas.getCurrentDrawing().getNumLayers()-1) { + function mergeLayer () { + if ($('#layerlist tr.layersel').index() === svgCanvas.getCurrentDrawing().getNumLayers() - 1) { return; } svgCanvas.mergeLayer(); @@ -4307,32 +4281,32 @@ window.svgEditor = (function ($) { populateLayers(); } - function moveLayer(pos) { + function moveLayer (pos) { var curIndex = $('#layerlist tr.layersel').index(); var total = svgCanvas.getCurrentDrawing().getNumLayers(); - if (curIndex > 0 || curIndex < total-1) { + if (curIndex > 0 || curIndex < total - 1) { curIndex += pos; - svgCanvas.setCurrentLayerPosition(total-curIndex-1); + svgCanvas.setCurrentLayerPosition(total - curIndex - 1); populateLayers(); } } $('#layer_delete').click(deleteLayer); - $('#layer_up').click(function() { + $('#layer_up').click(function () { moveLayer(-1); }); - $('#layer_down').click(function() { + $('#layer_down').click(function () { moveLayer(1); }); - $('#layer_rename').click(function() { + $('#layer_rename').click(function () { // var curIndex = $('#layerlist tr.layersel').prevAll().length; // Currently unused var oldName = $('#layerlist tr.layersel td.layername').text(); - $.prompt(uiStrings.notification.enterNewLayerName, '', function(newName) { - if (!newName) {return;} - if (oldName == newName || svgCanvas.getCurrentDrawing().hasLayer(newName)) { + $.prompt(uiStrings.notification.enterNewLayerName, '', function (newName) { + if (!newName) { return; } + if (oldName === newName || svgCanvas.getCurrentDrawing().hasLayer(newName)) { $.alert(uiStrings.notification.layerHasThatName); return; } @@ -4346,7 +4320,7 @@ window.svgEditor = (function ($) { var SIDEPANEL_OPENWIDTH = 150; var sidedrag = -1, sidedragging = false, allowmove = false; - var changeSidePanelWidth = function(delta) { + var changeSidePanelWidth = function (delta) { var rulerX = $('#ruler_x'); $('#sidepanels').width('+=' + delta); $('#layerpanel').width('+=' + delta); @@ -4355,9 +4329,9 @@ window.svgEditor = (function ($) { svgCanvas.runExtensions('workareaResized'); }; - var resizeSidePanel = function(evt) { - if (!allowmove) {return;} - if (sidedrag == -1) {return;} + var resizeSidePanel = function (evt) { + if (!allowmove) { return; } + if (sidedrag === -1) { return; } sidedragging = true; var deltaX = sidedrag - evt.pageX; var sideWidth = $('#sidepanels').width(); @@ -4368,36 +4342,36 @@ window.svgEditor = (function ($) { deltaX = 2 - sideWidth; sideWidth = 2; } - if (deltaX == 0) {return;} + if (deltaX === 0) { return; } sidedrag -= deltaX; changeSidePanelWidth(deltaX); }; // if width is non-zero, then fully close it, otherwise fully open it // the optional close argument forces the side panel closed - var toggleSidePanel = function(close) { + var toggleSidePanel = function (close) { var w = $('#sidepanels').width(); var deltaX = (w > 2 || close ? 2 : SIDEPANEL_OPENWIDTH) - w; changeSidePanelWidth(deltaX); }; $('#sidepanel_handle') - .mousedown(function(evt) { + .mousedown(function (evt) { sidedrag = evt.pageX; $(window).mousemove(resizeSidePanel); allowmove = false; // Silly hack for Chrome, which always runs mousemove right after mousedown - setTimeout(function() { + setTimeout(function () { allowmove = true; }, 20); }) - .mouseup(function(evt) { - if (!sidedragging) {toggleSidePanel();} + .mouseup(function (evt) { + if (!sidedragging) { toggleSidePanel(); } sidedrag = -1; sidedragging = false; }); - $(window).mouseup(function() { + $(window).mouseup(function () { sidedrag = -1; sidedragging = false; $('#svg_editor').unbind('mousemove', resizeSidePanel); @@ -4405,77 +4379,77 @@ window.svgEditor = (function ($) { populateLayers(); - // function changeResolution(x,y) { - // var zoom = svgCanvas.getResolution().zoom; - // setResolution(x * zoom, y * zoom); - // } + // function changeResolution (x,y) { + // var zoom = svgCanvas.getResolution().zoom; + // setResolution(x * zoom, y * zoom); + // } - var centerCanvas = function() { + var centerCanvas = function () { // this centers the canvas vertically in the workarea (horizontal handled in CSS) workarea.css('line-height', workarea.height() + 'px'); }; $(window).bind('load resize', centerCanvas); - function stepFontSize(elem, step) { - var orig_val = Number(elem.value); - var sug_val = orig_val + step; - var increasing = sug_val >= orig_val; - if (step === 0) {return orig_val;} + function stepFontSize (elem, step) { + var origVal = Number(elem.value); + var sugVal = origVal + step; + var increasing = sugVal >= origVal; + if (step === 0) { return origVal; } - if (orig_val >= 24) { + if (origVal >= 24) { if (increasing) { - return Math.round(orig_val * 1.1); + return Math.round(origVal * 1.1); } - return Math.round(orig_val / 1.1); + return Math.round(origVal / 1.1); } - if (orig_val <= 1) { + if (origVal <= 1) { if (increasing) { - return orig_val * 2; + return origVal * 2; } - return orig_val / 2; + return origVal / 2; } - return sug_val; + return sugVal; } - function stepZoom(elem, step) { - var orig_val = Number(elem.value); - if (orig_val === 0) {return 100;} - var sug_val = orig_val + step; - if (step === 0) {return orig_val;} + function stepZoom (elem, step) { + var origVal = Number(elem.value); + if (origVal === 0) { return 100; } + var sugVal = origVal + step; + if (step === 0) { return origVal; } - if (orig_val >= 100) { - return sug_val; + if (origVal >= 100) { + return sugVal; } - if (sug_val >= orig_val) { - return orig_val * 2; + if (sugVal >= origVal) { + return origVal * 2; } - return orig_val / 2; + return origVal / 2; } - // function setResolution(w, h, center) { - // updateCanvas(); - // // w-=0; h-=0; - // // $('#svgcanvas').css( { 'width': w, 'height': h } ); - // // $('#canvas_width').val(w); - // // $('#canvas_height').val(h); - // // - // // if (center) { - // // var w_area = workarea; - // // var scroll_y = h/2 - w_area.height()/2; - // // var scroll_x = w/2 - w_area.width()/2; - // // w_area[0].scrollTop = scroll_y; - // // w_area[0].scrollLeft = scroll_x; - // // } - // } + // function setResolution (w, h, center) { + // updateCanvas(); + // // w -= 0; h -= 0; + // // $('#svgcanvas').css({'width': w, 'height': h}); + // // $('#canvas_width').val(w); + // // $('#canvas_height').val(h); + // // + // // if (center) { + // // var wArea = workarea; + // // var scrollY = h/2 - wArea.height()/2; + // // var scrollX = w/2 - wArea.width()/2; + // // wArea[0].scrollTop = scrollY; + // // wArea[0].scrollLeft = scrollX; + // // } + // } - $('#resolution').change(function() { + $('#resolution').change(function () { var wh = $('#canvas_width,#canvas_height'); if (!this.selectedIndex) { - if ($('#canvas_width').val() == 'fit') { + if ($('#canvas_width').val() === 'fit') { wh.removeAttr('disabled').val(100); } - } else if (this.value == 'content') { + } else if (this.value === 'content') { wh.val('fit').attr('disabled', 'disabled'); } else { var dims = this.value.split('x'); @@ -4485,13 +4459,13 @@ window.svgEditor = (function ($) { } }); - //Prevent browser from erroneously repopulating fields + // Prevent browser from erroneously repopulating fields $('input,select').attr('autocomplete', 'off'); // Associate all button actions as well as non-button keyboard shortcuts - Actions = (function() { + Actions = (function () { // sel:'selector', fn:function, evt:'event', key:[key, preventDefault, NoDisableInInput] - var tool_buttons = [ + var toolButtons = [ {sel: '#tool_select', fn: clickSelect, evt: 'click', key: ['V', true]}, {sel: '#tool_fhpath', fn: clickFHPath, evt: 'click', key: ['Q', true]}, {sel: '#tool_line', fn: clickLine, evt: 'click', key: ['L', true]}, @@ -4506,11 +4480,10 @@ window.svgEditor = (function ($) { {sel: '#tool_image', fn: clickImage, evt: 'mouseup'}, {sel: '#tool_zoom', fn: clickZoom, evt: 'mouseup', key: ['Z', true]}, {sel: '#tool_clear', fn: clickClear, evt: 'mouseup', key: ['N', true]}, - {sel: '#tool_save', fn: function() { + {sel: '#tool_save', fn: function () { if (editingsource) { saveSourceEditor(); - } - else { + } else { clickSave(); } }, evt: 'mouseup', key: ['S', true]}, @@ -4524,7 +4497,7 @@ window.svgEditor = (function ($) { {sel: '#tool_docprops_save', fn: saveDocProperties, evt: 'click'}, {sel: '#tool_docprops', fn: showDocProperties, evt: 'mouseup'}, {sel: '#tool_prefs_save', fn: savePreferences, evt: 'click'}, - {sel: '#tool_prefs_option', fn: function() {showPreferences(); return false;}, evt: 'mouseup'}, + {sel: '#tool_prefs_option', fn: function () { showPreferences(); return false; }, evt: 'mouseup'}, {sel: '#tool_delete,#tool_delete_multi', fn: deleteSelected, evt: 'click', key: ['del/backspace', true]}, {sel: '#tool_reorient', fn: reorientPath, evt: 'click'}, {sel: '#tool_node_link', fn: linkControlPoints, evt: 'click'}, @@ -4544,8 +4517,8 @@ window.svgEditor = (function ($) { {sel: '#tool_unlink_use', fn: clickGroup, evt: 'click'}, {sel: '[id^=tool_align]', fn: clickAlign, evt: 'click'}, // these two lines are required to make Opera work properly with the flyout mechanism - // {sel: '#tools_rect_show', fn: clickRect, evt: 'click'}, - // {sel: '#tools_ellipse_show', fn: clickEllipse, evt: 'click'}, + // {sel: '#tools_rect_show', fn: clickRect, evt: 'click'}, + // {sel: '#tools_ellipse_show', fn: clickEllipse, evt: 'click'}, {sel: '#tool_bold', fn: clickBold, evt: 'mousedown'}, {sel: '#tool_italic', fn: clickItalic, evt: 'mousedown'}, {sel: '#sidepanel_handle', fn: toggleSidePanel, key: ['X']}, @@ -4553,60 +4526,60 @@ window.svgEditor = (function ($) { // Shortcuts not associated with buttons - {key: 'ctrl+left', fn: function(){rotateSelected(0,1);}}, - {key: 'ctrl+right', fn: function(){rotateSelected(1,1);}}, - {key: 'ctrl+shift+left', fn: function(){rotateSelected(0,5);}}, - {key: 'ctrl+shift+right', fn: function(){rotateSelected(1,5);}}, + {key: 'ctrl+left', fn: function () { rotateSelected(0, 1); }}, + {key: 'ctrl+right', fn: function () { rotateSelected(1, 1); }}, + {key: 'ctrl+shift+left', fn: function () { rotateSelected(0, 5); }}, + {key: 'ctrl+shift+right', fn: function () { rotateSelected(1, 5); }}, {key: 'shift+O', fn: selectPrev}, {key: 'shift+P', fn: selectNext}, - {key: [modKey+'up', true], fn: function(){zoomImage(2);}}, - {key: [modKey+'down', true], fn: function(){zoomImage(0.5);}}, - {key: [modKey+']', true], fn: function(){moveUpDownSelected('Up');}}, - {key: [modKey+'[', true], fn: function(){moveUpDownSelected('Down');}}, - {key: ['up', true], fn: function(){moveSelected(0,-1);}}, - {key: ['down', true], fn: function(){moveSelected(0,1);}}, - {key: ['left', true], fn: function(){moveSelected(-1,0);}}, - {key: ['right', true], fn: function(){moveSelected(1,0);}}, - {key: 'shift+up', fn: function(){moveSelected(0,-10);}}, - {key: 'shift+down', fn: function(){moveSelected(0,10);}}, - {key: 'shift+left', fn: function(){moveSelected(-10,0);}}, - {key: 'shift+right', fn: function(){moveSelected(10,0);}}, - {key: ['alt+up', true], fn: function(){svgCanvas.cloneSelectedElements(0,-1);}}, - {key: ['alt+down', true], fn: function(){svgCanvas.cloneSelectedElements(0,1);}}, - {key: ['alt+left', true], fn: function(){svgCanvas.cloneSelectedElements(-1,0);}}, - {key: ['alt+right', true], fn: function(){svgCanvas.cloneSelectedElements(1,0);}}, - {key: ['alt+shift+up', true], fn: function(){svgCanvas.cloneSelectedElements(0,-10);}}, - {key: ['alt+shift+down', true], fn: function(){svgCanvas.cloneSelectedElements(0,10);}}, - {key: ['alt+shift+left', true], fn: function(){svgCanvas.cloneSelectedElements(-10,0);}}, - {key: ['alt+shift+right', true], fn: function(){svgCanvas.cloneSelectedElements(10,0);}}, - {key: 'A', fn: function(){svgCanvas.selectAllInCurrentLayer();}}, + {key: [modKey + 'up', true], fn: function () { zoomImage(2); }}, + {key: [modKey + 'down', true], fn: function () { zoomImage(0.5); }}, + {key: [modKey + ']', true], fn: function () { moveUpDownSelected('Up'); }}, + {key: [modKey + '[', true], fn: function () { moveUpDownSelected('Down'); }}, + {key: ['up', true], fn: function () { moveSelected(0, -1); }}, + {key: ['down', true], fn: function () { moveSelected(0, 1); }}, + {key: ['left', true], fn: function () { moveSelected(-1, 0); }}, + {key: ['right', true], fn: function () { moveSelected(1, 0); }}, + {key: 'shift+up', fn: function () { moveSelected(0, -10); }}, + {key: 'shift+down', fn: function () { moveSelected(0, 10); }}, + {key: 'shift+left', fn: function () { moveSelected(-10, 0); }}, + {key: 'shift+right', fn: function () { moveSelected(10, 0); }}, + {key: ['alt+up', true], fn: function () { svgCanvas.cloneSelectedElements(0, -1); }}, + {key: ['alt+down', true], fn: function () { svgCanvas.cloneSelectedElements(0, 1); }}, + {key: ['alt+left', true], fn: function () { svgCanvas.cloneSelectedElements(-1, 0); }}, + {key: ['alt+right', true], fn: function () { svgCanvas.cloneSelectedElements(1, 0); }}, + {key: ['alt+shift+up', true], fn: function () { svgCanvas.cloneSelectedElements(0, -10); }}, + {key: ['alt+shift+down', true], fn: function () { svgCanvas.cloneSelectedElements(0, 10); }}, + {key: ['alt+shift+left', true], fn: function () { svgCanvas.cloneSelectedElements(-10, 0); }}, + {key: ['alt+shift+right', true], fn: function () { svgCanvas.cloneSelectedElements(10, 0); }}, + {key: 'A', fn: function () { svgCanvas.selectAllInCurrentLayer(); }}, // Standard shortcuts - {key: modKey+'z', fn: clickUndo}, + {key: modKey + 'z', fn: clickUndo}, {key: modKey + 'shift+z', fn: clickRedo}, {key: modKey + 'y', fn: clickRedo}, - {key: modKey+'x', fn: cutSelected}, - {key: modKey+'c', fn: copySelected}, - {key: modKey+'v', fn: pasteInCenter} + {key: modKey + 'x', fn: cutSelected}, + {key: modKey + 'c', fn: copySelected}, + {key: modKey + 'v', fn: pasteInCenter} ]; // Tooltips not directly associated with a single function - var key_assocs = { + var keyAssocs = { '4/Shift+4': '#tools_rect_show', '5/Shift+5': '#tools_ellipse_show' }; return { - setAll: function() { + setAll: function () { var flyouts = {}; - $.each(tool_buttons, function(i, opts) { + $.each(toolButtons, function (i, opts) { // Bind function to button var btn; if (opts.sel) { btn = $(opts.sel); - if (btn.length == 0) {return true;} // Skip if markup does not exist + if (btn.length === 0) { return true; } // Skip if markup does not exist if (opts.evt) { if (svgedit.browser.isTouch() && opts.evt === 'click') { opts.evt = 'mousedown'; @@ -4615,13 +4588,13 @@ window.svgEditor = (function ($) { } // Add to parent flyout menu, if able to be displayed - if (opts.parent && $(opts.parent + '_show').length != 0) { - var f_h = $(opts.parent); - if (!f_h.length) { - f_h = makeFlyoutHolder(opts.parent.substr(1)); + if (opts.parent && $(opts.parent + '_show').length !== 0) { + var fH = $(opts.parent); + if (!fH.length) { + fH = makeFlyoutHolder(opts.parent.substr(1)); } - f_h.append(btn); + fH.append(btn); if (!$.isArray(flyouts[opts.parent])) { flyouts[opts.parent] = []; @@ -4633,18 +4606,21 @@ window.svgEditor = (function ($) { // Bind function to shortcut key if (opts.key) { // Set shortcut based on options - var keyval, disInInp = true, fn = opts.fn, pd = false; + var keyval, + // disInInp = true, + fn = opts.fn, + pd = false; if ($.isArray(opts.key)) { keyval = opts.key[0]; - if (opts.key.length > 1) {pd = opts.key[1];} - if (opts.key.length > 2) {disInInp = opts.key[2];} + if (opts.key.length > 1) { pd = opts.key[1]; } + // if (opts.key.length > 2) { disInInp = opts.key[2]; } } else { keyval = opts.key; } keyval += ''; - $.each(keyval.split('/'), function(i, key) { - $(document).bind('keydown', key, function(e) { + $.each(keyval.split('/'), function (i, key) { + $(document).bind('keydown', key, function (e) { fn(); if (pd) { e.preventDefault(); @@ -4657,7 +4633,7 @@ window.svgEditor = (function ($) { // Put shortcut in title if (opts.sel && !opts.hidekey && btn.attr('title')) { var newTitle = btn.attr('title').split('[')[0] + ' (' + keyval + ')'; - key_assocs[keyval] = opts.sel; + keyAssocs[keyval] = opts.sel; // Disregard for menu items if (!btn.parents('#main_menu').length) { btn.attr('title', newTitle); @@ -4673,16 +4649,19 @@ window.svgEditor = (function ($) { // Make 'return' keypress trigger the change event $('.attr_changer, #image_url').bind('keydown', 'return', - function(evt) {$(this).change();evt.preventDefault();} + function (evt) { + $(this).change(); + evt.preventDefault(); + } ); - $(window).bind('keydown', 'tab', function(e) { - if (ui_context === 'canvas') { + $(window).bind('keydown', 'tab', function (e) { + if (uiContext === 'canvas') { e.preventDefault(); selectNext(); } - }).bind('keydown', 'shift+tab', function(e) { - if (ui_context === 'canvas') { + }).bind('keydown', 'shift+tab', function (e) { + if (uiContext === 'canvas') { e.preventDefault(); selectPrev(); } @@ -4690,39 +4669,39 @@ window.svgEditor = (function ($) { $('#tool_zoom').dblclick(dblclickZoom); }, - setTitles: function() { - $.each(key_assocs, function(keyval, sel) { + setTitles: function () { + $.each(keyAssocs, function (keyval, sel) { var menu = ($(sel).parents('#main_menu').length); - $(sel).each(function() { + $(sel).each(function () { var t; if (menu) { t = $(this).text().split(' [')[0]; } else { t = this.title.split(' [')[0]; } - var key_str = ''; + var keyStr = ''; // Shift+Up - $.each(keyval.split('/'), function(i, key) { - var mod_bits = key.split('+'), mod = ''; - if (mod_bits.length > 1) { - mod = mod_bits[0] + '+'; - key = mod_bits[1]; + $.each(keyval.split('/'), function (i, key) { + var modBits = key.split('+'), mod = ''; + if (modBits.length > 1) { + mod = modBits[0] + '+'; + key = modBits[1]; } - key_str += (i?'/':'') + mod + (uiStrings['key_'+key] || key); + keyStr += (i ? '/' : '') + mod + (uiStrings['key_' + key] || key); }); if (menu) { - this.lastChild.textContent = t +' ['+key_str+']'; + this.lastChild.textContent = t + ' [' + keyStr + ']'; } else { - this.title = t +' ['+key_str+']'; + this.title = t + ' [' + keyStr + ']'; } }); }); }, - getButtonData: function(sel) { + getButtonData: function (sel) { var b; - $.each(tool_buttons, function(i, btn) { - if (btn.sel === sel) {b = btn;} + $.each(toolButtons, function (i, btn) { + if (btn.sel === sel) { b = btn; } }); return b; } @@ -4732,16 +4711,16 @@ window.svgEditor = (function ($) { Actions.setAll(); // Select given tool - editor.ready(function() { + editor.ready(function () { var tool, itool = curConfig.initTool, container = $('#tools_left, #svg_editor .tools_flyout'), - pre_tool = container.find('#tool_' + itool), - reg_tool = container.find('#' + itool); - if (pre_tool.length) { - tool = pre_tool; - } else if (reg_tool.length) { - tool = reg_tool; + preTool = container.find('#tool_' + itool), + regTool = container.find('#' + itool); + if (preTool.length) { + tool = preTool; + } else if (regTool.length) { + tool = regTool; } else { tool = $('#tool_select'); } @@ -4779,116 +4758,121 @@ window.svgEditor = (function ($) { }); // init SpinButtons - $('#rect_rx').SpinButton({ min: 0, max: 1000, callback: changeRectRadius }); - $('#stroke_width').SpinButton({ min: 0, max: 99, smallStep: 0.1, callback: changeStrokeWidth }); - $('#angle').SpinButton({ min: -180, max: 180, step: 5, callback: changeRotationAngle }); - $('#font_size').SpinButton({ min: 0.001, stepfunc: stepFontSize, callback: changeFontSize }); - $('#group_opacity').SpinButton({ min: 0, max: 100, step: 5, callback: changeOpacity }); - $('#blur').SpinButton({ min: 0, max: 10, step: 0.1, callback: changeBlur }); - $('#zoom').SpinButton({ min: 0.001, max: 10000, step: 50, stepfunc: stepZoom, callback: changeZoom }) + $('#rect_rx').SpinButton({min: 0, max: 1000, callback: changeRectRadius}); + $('#stroke_width').SpinButton({min: 0, max: 99, smallStep: 0.1, callback: changeStrokeWidth}); + $('#angle').SpinButton({min: -180, max: 180, step: 5, callback: changeRotationAngle}); + $('#font_size').SpinButton({min: 0.001, stepfunc: stepFontSize, callback: changeFontSize}); + $('#group_opacity').SpinButton({min: 0, max: 100, step: 5, callback: changeOpacity}); + $('#blur').SpinButton({min: 0, max: 10, step: 0.1, callback: changeBlur}); + $('#zoom').SpinButton({min: 0.001, max: 10000, step: 50, stepfunc: stepZoom, callback: changeZoom}) // Set default zoom .val(svgCanvas.getZoom() * 100); - $('#workarea').contextMenu({ + $('#workarea').contextMenu( + { menu: 'cmenu_canvas', inSpeed: 0 }, - function(action, el, pos) { + function (action, el, pos) { switch (action) { - case 'delete': - deleteSelected(); - break; - case 'cut': - cutSelected(); - break; - case 'copy': - copySelected(); - break; - case 'paste': - svgCanvas.pasteElements(); - break; - case 'paste_in_place': - svgCanvas.pasteElements('in_place'); - break; - case 'group': - case 'group_elements': - svgCanvas.groupSelectedElements(); - break; - case 'ungroup': - svgCanvas.ungroupSelectedElement(); - break; - case 'move_front': - moveToTopSelected(); - break; - case 'move_up': - moveUpDownSelected('Up'); - break; - case 'move_down': - moveUpDownSelected('Down'); - break; - case 'move_back': - moveToBottomSelected(); - break; - default: - if (svgedit.contextmenu && svgedit.contextmenu.hasCustomHandler(action)) { - svgedit.contextmenu.getCustomHandler(action).call(); - } - break; + case 'delete': + deleteSelected(); + break; + case 'cut': + cutSelected(); + break; + case 'copy': + copySelected(); + break; + case 'paste': + svgCanvas.pasteElements(); + break; + case 'paste_in_place': + svgCanvas.pasteElements('in_place'); + break; + case 'group': + case 'group_elements': + svgCanvas.groupSelectedElements(); + break; + case 'ungroup': + svgCanvas.ungroupSelectedElement(); + break; + case 'move_front': + moveToTopSelected(); + break; + case 'move_up': + moveUpDownSelected('Up'); + break; + case 'move_down': + moveUpDownSelected('Down'); + break; + case 'move_back': + moveToBottomSelected(); + break; + default: + if (svgedit.contextmenu && svgedit.contextmenu.hasCustomHandler(action)) { + svgedit.contextmenu.getCustomHandler(action).call(); + } + break; } } ); - var lmenu_func = function(action, el, pos) { - switch ( action ) { - case 'dupe': - cloneLayer(); - break; - case 'delete': - deleteLayer(); - break; - case 'merge_down': - mergeLayer(); - break; - case 'merge_all': - svgCanvas.mergeAllLayers(); - updateContextPanel(); - populateLayers(); - break; + var lmenuFunc = function (action, el, pos) { + switch (action) { + case 'dupe': + cloneLayer(); + break; + case 'delete': + deleteLayer(); + break; + case 'merge_down': + mergeLayer(); + break; + case 'merge_all': + svgCanvas.mergeAllLayers(); + updateContextPanel(); + populateLayers(); + break; } }; - $('#layerlist').contextMenu({ + $('#layerlist').contextMenu( + { menu: 'cmenu_layers', inSpeed: 0 }, - lmenu_func + lmenuFunc ); - $('#layer_moreopts').contextMenu({ + $('#layer_moreopts').contextMenu( + { menu: 'cmenu_layers', inSpeed: 0, allowLeft: true }, - lmenu_func + lmenuFunc ); - $('.contextMenu li').mousedown(function(ev) { + $('.contextMenu li').mousedown(function (ev) { ev.preventDefault(); }); $('#cmenu_canvas li').disableContextMenu(); - canv_menu.enableContextMenuItems('#delete,#cut,#copy'); + canvMenu.enableContextMenuItems('#delete,#cut,#copy'); - canv_menu[(localStorage.getItem('svgedit_clipboard') ? 'en' : 'dis') + 'ableContextMenuItems'] - ('#paste,#paste_in_place'); - window.addEventListener('storage', function(e) { - if(e.key != 'svgedit_clipboard') return; + canvMenu[(localStorage.getItem('svgedit_clipboard') ? 'en' : 'dis') + 'ableContextMenuItems']( + '#paste,#paste_in_place' + ); + window.addEventListener('storage', function (e) { + if (e.key !== 'svgedit_clipboard') return; - canv_menu[(localStorage.getItem('svgedit_clipboard') ? 'en' : 'dis') + 'ableContextMenuItems'] - ('#paste,#paste_in_place'); + canvMenu[(localStorage.getItem('svgedit_clipboard') ? 'en' : 'dis') + 'ableContextMenuItems']( + '#paste,#paste_in_place' + ); }); - window.addEventListener('beforeunload', function(e) { + window.addEventListener('beforeunload', function (e) { // Suppress warning if page is empty if (undoMgr.getUndoStackSize() === 0) { editor.showSaveWarning = false; @@ -4902,7 +4886,7 @@ window.svgEditor = (function ($) { } }, false); - editor.openPrep = function(func) { + editor.openPrep = function (func) { $('#main_menu').hide(); if (undoMgr.getUndoStackSize() === 0) { func(true); @@ -4911,18 +4895,18 @@ window.svgEditor = (function ($) { } }; - function onDragEnter(e) { + function onDragEnter (e) { e.stopPropagation(); e.preventDefault(); // and indicator should be displayed here, such as "drop files here" } - function onDragOver(e) { + function onDragOver (e) { e.stopPropagation(); e.preventDefault(); } - function onDragLeave(e) { + function onDragLeave (e) { e.stopPropagation(); e.preventDefault(); // hypothetical indicator should be removed here @@ -4932,13 +4916,13 @@ window.svgEditor = (function ($) { // and provide a file input to click. When that change event fires, it will // get the text contents of the file and send it to the canvas if (window.FileReader) { - var importImage = function(e) { + var importImage = function (e) { $.process_cancel(uiStrings.notification.loadingImage); e.stopPropagation(); e.preventDefault(); $('#workarea').removeAttr('style'); $('#main_menu').hide(); - var file = (e.type == 'drop') ? e.dataTransfer.files[0] : this.files[0]; + var file = (e.type === 'drop') ? e.dataTransfer.files[0] : this.files[0]; if (!file) { $('#dialog_box').hide(); return; @@ -4947,13 +4931,13 @@ window.svgEditor = (function ($) { } else */ - if (file.type.indexOf('image') != -1) { + if (file.type.indexOf('image') > -1) { // Detected an image // svg handling var reader; - if (file.type.indexOf('svg') != -1) { + if (file.type.indexOf('svg') > -1) { reader = new FileReader(); - reader.onloadend = function(e) { + reader.onloadend = function (e) { var newElement = svgCanvas.importSvgString(e.target.result, true); svgCanvas.ungroupSelectedElement(); svgCanvas.ungroupSelectedElement(); @@ -4965,13 +4949,12 @@ window.svgEditor = (function ($) { $('#dialog_box').hide(); }; reader.readAsText(file); - } - else { - //bitmap handling + } else { + // bitmap handling reader = new FileReader(); - reader.onloadend = function(e) { + reader.onloadend = function (e) { // let's insert the new image until we know its dimensions - var insertNewImage = function(width, height) { + var insertNewImage = function (width, height) { var newImage = svgCanvas.addSvgElementFromJson({ element: 'image', attr: { @@ -4996,7 +4979,7 @@ window.svgEditor = (function ($) { var img = new Image(); img.src = e.target.result; img.style.opacity = 0; - img.onload = function() { + img.onload = function () { imgWidth = img.offsetWidth; imgHeight = img.offsetHeight; insertNewImage(imgWidth, imgHeight); @@ -5012,15 +4995,15 @@ window.svgEditor = (function ($) { workarea[0].addEventListener('dragleave', onDragLeave, false); workarea[0].addEventListener('drop', importImage, false); - var open = $('