diff --git a/.brackets.json b/.brackets.json index 85bb406..9fa1d53 100644 --- a/.brackets.json +++ b/.brackets.json @@ -1,5 +1,13 @@ { "spaceUnits": 2, "useTabChar": false, - "linting.enabled": true + "linting.enabled": true, + "linting.prefer": [ + "HTMLHint", + "CSSLint", + "JSHint", + "JSCS", + "JSONLint" + ], + "linting.usePreferredOnly": true } \ No newline at end of file diff --git a/.jscs.json b/.jscs.json index cdeb6f6..a03a975 100644 --- a/.jscs.json +++ b/.jscs.json @@ -46,7 +46,7 @@ }, "maximumLineLength": { - "value": 125, + "value": 145, "allowComments": true, "allowRegex": true } diff --git a/.jshintrc b/.jshintrc index 374b1d5..ca13a84 100644 --- a/.jshintrc +++ b/.jshintrc @@ -1,6 +1,5 @@ { "indent" : 2, - "maxlen" : 125, "browser" : true, "jquery" : true, "node" : true, diff --git a/Gruntfile.js b/Gruntfile.js index d8347be..1c284de 100644 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -1,4 +1,4 @@ -module.exports = function(grunt) { +module.exports = function (grunt) { "use strict"; grunt.initConfig({ pkg: grunt.file.readJSON("package.json"), @@ -51,7 +51,7 @@ module.exports = function(grunt) { require("matchdep").filterDev("grunt-*").forEach(grunt.loadNpmTasks); - grunt.registerTask("default", "List of commands", function() { + grunt.registerTask("default", "List of commands", function () { grunt.log.writeln(""); grunt.log.writeln("Run 'grunt lint' to lint the source files"); }); diff --git a/css/style.css b/css/style.css index 4b9bba0..64e7239 100644 --- a/css/style.css +++ b/css/style.css @@ -46,9 +46,7 @@ height: 240px; } -/* Slight shadow around image */ .html-skeleton-img-shadow { box-shadow: 0 0 3px #000; } -.html-skeleton-img-shadow-dark { box-shadow: 0 0 2px 1px #fff; } /* Shift the dialog content (excluding the image) up */ .html-skeleton-content { diff --git a/main.js b/main.js index f96e1f2..f9394da 100644 --- a/main.js +++ b/main.js @@ -1,9 +1,9 @@ /*jslint vars: true, plusplus: true, devel: true, nomen: true, indent: 2, maxerr: 50 */ -/*global define, brackets, Mustache */ +/*global $, define, brackets, Mustache */ /* * HTML Skeleton - * Created 2014 Triangle717 + * Created 2014-2015 Triangle717 * * * Licensed under The MIT License @@ -15,6 +15,7 @@ define(function (require, exports, module) { "use strict"; var AppInit = brackets.getModule("utils/AppInit"), CommandManager = brackets.getModule("command/CommandManager"), + DocumentManager = brackets.getModule("document/DocumentManager"), Dialogs = brackets.getModule("widgets/Dialogs"), EditorManager = brackets.getModule("editor/EditorManager"), ExtensionUtils = brackets.getModule("utils/ExtensionUtils"), @@ -25,6 +26,7 @@ define(function (require, exports, module) { Menus = brackets.getModule("command/Menus"), PreferencesManager = brackets.getModule("preferences/PreferencesManager"), ProjectManager = brackets.getModule("project/ProjectManager"), + ImageFiles = LanguageManager.getLanguage("image")._fileExtensions.concat("svg"), Strings = require("strings"), SvgSize = require("src/SvgSize"), @@ -37,6 +39,7 @@ define(function (require, exports, module) { localizedDialog = Mustache.render(skeletonDialogHTML, Strings), localizedButton = Mustache.render(toolbarButtonHTML, Strings); + // HTML snippets roster var skeletonBones = { image : "", inStyle : "", @@ -46,13 +49,13 @@ define(function (require, exports, module) { extScript: "", basiSkel : "\n\n\nindent-size\n" + - "indent-size\n" + - "indent-size\n\n\n\nindent-size\n\n\n", + "indent-size\n" + + "indent-size\n\n\n\nindent-size\n\n\n", fullSkel : "\n\n\nindent-size\n" + - "indent-size\n" + - "indent-size\nindent-size\n" + - "\n\n\nindent-size\n\n\n" + "indent-size\n" + + "indent-size\nindent-size\n" + + "\n\n\nindent-size\n\n\n" }; @@ -60,18 +63,17 @@ define(function (require, exports, module) { // If the user ever changes their preferences, // we need to make sure we stay up-to-date PreferencesManager.on("change", function () { - // Do NOT attempt to assign `indentUnits` directly to the function. // It will completely break otherwise var tempVar = IndentSize.getIndentation(); indentUnits = tempVar; }); - /** * @private - * Insert the selected elements into the document - * @param elements The elements to be inserted into the document + * Insert the selected elements into the document. + * @param elements The elements to be inserted into the document. + * @returns {Boolean} Always true. */ function _insertSelectedElements(elements) { // Get the document in the full editor @@ -86,18 +88,16 @@ define(function (require, exports, module) { // Do a regex search for the `indent-size` keyword // and replace it with the user's indent settings // Also replace all single quotes with double quotes - value = value.replace(/indent-size/g, indentUnits) - .replace(/'/g, "\""); + value = value.replace(/indent-size/g, indentUnits).replace(/'/g, "\""); // Insert the selected elements at the current cursor position editor.document.replaceRange(value, cursor); }); }); } - return; + return true; } - /** * @private * Get skeleton choices. @@ -139,56 +139,47 @@ define(function (require, exports, module) { _insertSelectedElements(selections); } - /** * @private * Create a usable, valid path to the user's selected image - * relative to document into which it being inserted - * @param {string} imageDir The full path to a user-selected image - * @return {string} A usable, valid path to the image + * relative to document into which it being inserted. + * @param {String} image The full path to a user-selected image. + * @param {Boolean} [uiDisplay=false] If true, perform additional changes suitable for UI display. + * @return {String} A usable, valid path to the image. */ - function _createImageURL(imageDir) { + function _createImageURL(image, uiDisplay) { + if (uiDisplay === undefined) { + uiDisplay = false; + } + // Get the directory to the file the image is being inserted into // and just the file name of the image - var curFileDir = EditorManager.getCurrentFullEditor().document.file.parentPath, - imgFileName = FileUtils.getBaseName(imageDir); + var curDir = EditorManager.getCurrentFullEditor().document.file.parentPath, + fileName = FileUtils.getBaseName(image); - // If this is a saved documentand image and document are in the same folder - if (!/^_brackets_/.test(curFileDir) && (curFileDir.toLowerCase() === imageDir.replace(imgFileName, "").toLowerCase())) { + // If this is a saved document and image and document are in the same folder + if (!DocumentManager.getCurrentDocument().isUntitled() && + curDir.toLowerCase() === image.replace(fileName, "").toLowerCase()) { // Use only the image file name - imageDir = imgFileName; + image = fileName; } - // Try to make the path as relative as possible - imageDir = ProjectManager.makeProjectRelativeIfPossible(imageDir); + // Try to make the path relative + image = ProjectManager.makeProjectRelativeIfPossible(image); - // If the path is longer than 50 characters, split it up for better displaying - if (imageDir.length > 50) { - imageDir = imageDir.substring(0, 51) + "
" + imageDir.substring(51, imageDir.length); + // If desired, if the path is longer than 50 characters split it up for better displaying + if (uiDisplay && image.length > 50) { + image = image.substring(0, 51) + "
" + image.substring(51, image.length); } - return imageDir; + return image; } - - /** - * @private - * Check if the dark theme is enabled and return - * the appropriate class name for a slight shadow - * on the image preview. - * @return {string} Appropriate shadow class name - */ - function _getImageShadow() { - return document.querySelector("body").classList.contains("dark") ? - "html-skeleton-img-shadow-dark" : "html-skeleton-img-shadow"; - } - - /** * @private * Update image width/height input fields. - * @param imageWidth {string} The image width. - * @param imageHeight {string} The image height. - * @return {boolean} true. + * @param imageWidth {String} The image width. + * @param imageHeight {String} The image height. + * @return {Boolean} true. */ function _updateSizeInput(imgWidth, imgHeight) { document.querySelector(".html-skeleton-form .img-width").value = imgWidth; @@ -200,7 +191,7 @@ define(function (require, exports, module) { /** * @private * Display the user selected image. - * @param imagePath {string} Absolute path to image file. + * @param imagePath {String} Absolute path to image file. */ function _displayImage(imagePath) { var shortImagePath = "", @@ -225,7 +216,7 @@ define(function (require, exports, module) { $imgPreview.removeClass("html-skeleton-img-container"); // Trim the file path for nice displaying - shortImagePath = _createImageURL(imagePath); + shortImagePath = _createImageURL(imagePath, true); // The image is an unsupported file type if (!isSupported && !isSvgImage) { @@ -234,7 +225,7 @@ define(function (require, exports, module) { $(".html-skeleton-img").css("position", "relative"); $imgPreview.addClass("html-skeleton-img-container"); $imgPathDisplay.css("color", "red"); - $imgPreview.removeClass(_getImageShadow()); + $imgPreview.removeClass("html-skeleton-img-shadow"); $imgPathDisplay.html(shortImagePath); imgErrorText.innerHTML = "
is not supported for previewing!"; @@ -252,7 +243,7 @@ define(function (require, exports, module) { // Position and add small shadow to container $(".html-skeleton-img").css("position", "relative"); - $imgPreview.addClass(_getImageShadow()); + $imgPreview.addClass("html-skeleton-img-shadow"); // Show the file path and display the image $imgPathDisplay.html(shortImagePath); @@ -277,25 +268,22 @@ define(function (require, exports, module) { return; } - /** * @private - * Open the file browse dialog for the user to select an image + * Open the file browse dialog for the user to select an image. + * @param {Object} e DOM event. */ function _showFileDialog(e) { - FileSystem.showOpenDialog( - false, false, Strings.FILE_DIALOG_TITLE, - null, ImageFiles, function (closedDialog, selectedFile) { - if (!closedDialog && selectedFile && selectedFile.length > 0) { - _displayImage(selectedFile[0]); - } + FileSystem.showOpenDialog(false, false, Strings.FILE_DIALOG_TITLE, + "", ImageFiles, function (cancel, selected) { + if (!cancel && selected && selected.length > 0) { + _displayImage(selected[0]); } - ); + }); e.preventDefault(); e.stopPropagation(); } - /** * Display HTML Skeleton dialog box */ diff --git a/nls/de/strings.js b/nls/de/strings.js index f9d0814..ff3c5d3 100644 --- a/nls/de/strings.js +++ b/nls/de/strings.js @@ -1,25 +1,12 @@ /* -* Copyright (c) 2012 Adobe Systems Incorporated. All rights reserved. -* -* Permission is hereby granted, free of charge, to any person obtaining a -* copy of this software and associated documentation files (the "Software"), -* to deal in the Software without restriction, including without limitation -* the rights to use, copy, modify, merge, publish, distribute, sublicense, -* and/or sell copies of the Software, and to permit persons to whom the -* Software is furnished to do so, subject to the following conditions: -* -* The above copyright notice and this permission notice shall be included in -* all copies or substantial portions of the Software. -* -* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING -* FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER -* DEALINGS IN THE SOFTWARE. -* -*/ + * HTML Skeleton + * Created 2014-2015 Triangle717 + * + * + * Licensed under The MIT License + * + */ + /*jslint vars: true, plusplus: true, devel: true, nomen: true, indent: 4, maxerr: 50 */ /*global define */ @@ -47,7 +34,7 @@ define({ "FULL_SKELETON" : "Komplettes HTML Grundgerüst", "FULL_SKELETON_DESCRIPTION" : "Enthält alle obigen Elemente, außer Inline-Stylesheet, Inline-Script und Grafik/Bild", "BTN_CANCEL" : "Abbrechen", - "BTN_DONE" : "Fertig", + "BTN_DONE" : "Fertig" }); /* Last translated for d04d101774e59251f89e36f83a261e988b4e39b8 */ diff --git a/nls/it/strings.js b/nls/it/strings.js index cbef031..4ea9bba 100644 --- a/nls/it/strings.js +++ b/nls/it/strings.js @@ -1,25 +1,12 @@ /* -* Copyright (c) 2012 Adobe Systems Incorporated. All rights reserved. -* -* Permission is hereby granted, free of charge, to any person obtaining a -* copy of this software and associated documentation files (the "Software"), -* to deal in the Software without restriction, including without limitation -* the rights to use, copy, modify, merge, publish, distribute, sublicense, -* and/or sell copies of the Software, and to permit persons to whom the -* Software is furnished to do so, subject to the following conditions: -* -* The above copyright notice and this permission notice shall be included in -* all copies or substantial portions of the Software. -* -* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING -* FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER -* DEALINGS IN THE SOFTWARE. -* -*/ + * HTML Skeleton + * Created 2014-2015 Triangle717 + * + * + * Licensed under The MIT License + * + */ + /*jslint vars: true, plusplus: true, devel: true, nomen: true, indent: 4, maxerr: 50 */ /*global define */ @@ -49,6 +36,6 @@ define({ "FULL_SKELETON_DESCRIPTION" : "Comprende tutti gli elementi sopra indicati, salvo foglio di stile interno, script interno, e immagine", "BTN_CANCEL" : "Cancella", "BTN_DONE" : "Fatto", - "BTN_BROWSE" : "Sfoglia\u2026", + "BTN_BROWSE" : "Sfoglia\u2026" }); /* Last translated for 53ba9106af6ec36af1400f95417498a05f6e277a */ diff --git a/nls/root/strings.js b/nls/root/strings.js index 5d47d9d..7b3ca14 100644 --- a/nls/root/strings.js +++ b/nls/root/strings.js @@ -1,25 +1,12 @@ /* -* Copyright (c) 2012 Adobe Systems Incorporated. All rights reserved. -* -* Permission is hereby granted, free of charge, to any person obtaining a -* copy of this software and associated documentation files (the "Software"), -* to deal in the Software without restriction, including without limitation -* the rights to use, copy, modify, merge, publish, distribute, sublicense, -* and/or sell copies of the Software, and to permit persons to whom the -* Software is furnished to do so, subject to the following conditions: -* -* The above copyright notice and this permission notice shall be included in -* all copies or substantial portions of the Software. -* -* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING -* FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER -* DEALINGS IN THE SOFTWARE. -* -*/ + * HTML Skeleton + * Created 2014-2015 Triangle717 + * + * + * Licensed under The MIT License + * + */ + /*jslint vars: true, plusplus: true, devel: true, nomen: true, indent: 4, maxerr: 50 */ /*global define */ @@ -50,5 +37,5 @@ define({ "FULL_SKELETON_DESCRIPTION" : "Includes all elements above except inline stylesheet, inline script, and image", "BTN_CANCEL" : "Cancel", "BTN_DONE" : "Done", - "BTN_BROWSE" : "Browse\u2026", + "BTN_BROWSE" : "Browse\u2026" }); diff --git a/nls/strings.js b/nls/strings.js index 6f18251..183cdcf 100644 --- a/nls/strings.js +++ b/nls/strings.js @@ -1,25 +1,12 @@ /* -* Copyright (c) 2012 Adobe Systems Incorporated. All rights reserved. -* -* Permission is hereby granted, free of charge, to any person obtaining a -* copy of this software and associated documentation files (the "Software"), -* to deal in the Software without restriction, including without limitation -* the rights to use, copy, modify, merge, publish, distribute, sublicense, -* and/or sell copies of the Software, and to permit persons to whom the -* Software is furnished to do so, subject to the following conditions: -* -* The above copyright notice and this permission notice shall be included in -* all copies or substantial portions of the Software. -* -* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING -* FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER -* DEALINGS IN THE SOFTWARE. -* -*/ + * HTML Skeleton + * Created 2014-2015 Triangle717 + * + * + * Licensed under The MIT License + * + */ + /*jslint vars: true, plusplus: true, devel: true, nomen: true, indent: 4, maxerr: 50 */ /*global define */ diff --git a/package.json b/package.json index 5108e74..01c6b4d 100644 --- a/package.json +++ b/package.json @@ -1,10 +1,9 @@ { "name": "le717.html-skeleton", - "version": "1.3.5", + "version": "1.4.0", "title": "HTML Skeleton", "description": "Insert a variety of HTML elements into your document with ease.", "homepage": "https://github.com/le717/brackets-html-skeleton", - "version": "1.3.5", "author": "Triangle717 (http://le717.github.io)", "license": "MIT", "engines": { "brackets": ">=0.44.0" }, diff --git a/src/IndentSize.js b/src/IndentSize.js index a818cf1..dff5e8c 100644 --- a/src/IndentSize.js +++ b/src/IndentSize.js @@ -3,7 +3,7 @@ /* * HTML Skeleton - * Created 2014 Triangle717 + * Created 2014-2015 Triangle717 * * * Licensed under The MIT License @@ -11,44 +11,41 @@ */ - define(function (require, exports, module) { +define(function (require, exports) { "use strict"; - var PreferencesManager = brackets.getModule("preferences/PreferencesManager"); - - // Store the indentation values, - // initializing them as 2 space indentation - var indentation = { - char: "\u0020", - size: 2, - isTab: false - }; + var PreferencesManager = brackets.getModule("preferences/PreferencesManager"); + // Store the indentation values, + // initializing them as 2 space indentation + var indentation = { + char: "\u0020", + size: 2, + isTab: false + }; /** * @private - * Polyfill from http://stackoverflow.com/a/4550005 - * @param str Text to be repeated. - * @param num Number of times text should be repeated. - * @return {string} repeated the number of times stated. + * Helper from http://stackoverflow.com/a/4550005 + * @param {String} str Text to be repeated. + * @param {Number} num Number of times text repeated should occur. + * @returns {String} */ function _repeatString(str, num) { - return (new Array(num + 1)).join(str); + return new Array(num + 1).join(str); } - /** * Create a complete indentation level by repeating * the user's desired character by their chosen size. - * @return {string} Complete indentation level. + * @return {String} Complete indentation level. */ function getIndentation() { return _repeatString(indentation.char, indentation.size); } - /** * Get the current indentation settings for use in inserted code - * @return {string} User's current indentation settings + * @return {String} User's current indentation settings */ function getIndentType() { // \u0009 is a tab, \u0020 is a space @@ -64,31 +61,27 @@ return indentation.char; } - - /** - * Get the user's indentation level size depending on if they use spaces or tabs. - * @return {string} Indentation level size. - */ - function getIndentSize() { - indentation.size = indentation.isTab ? PreferencesManager.get("tabSize") : PreferencesManager.get("spaceUnits"); - return indentation.size; - } - + /** + * Get the user's indentation level size depending on if they use spaces or tabs. + * @return {String} Indentation level size. + */ + function getIndentSize() { + indentation.size = indentation.isTab ? PreferencesManager.get("tabSize") : PreferencesManager.get("spaceUnits"); + return indentation.size; + } // A relevant preference was changed, update our settings PreferencesManager.on("change", function (e, data) { - data.ids.forEach(function (value) { - if (value === "useTabChar") { - getIndentType(); - } else if (value === "tabSize" || value === "spaceUnits") { - getIndentSize(); - } - }); - }); + if (data.ids.indexOf("useTabChar") > -1) { + getIndentType(); + } + if (data.ids.indexOf("tabSize") > -1 || data.ids.indexOf("spaceUnits") > -1) { + getIndentSize(); + } + }); - exports.indentation = indentation; - exports.getIndentType = getIndentType; - exports.getIndentSize = getIndentSize; - exports.getIndentation = getIndentation; - }); + exports.getIndentType = getIndentType; + exports.getIndentSize = getIndentSize; + exports.getIndentation = getIndentation; +}); diff --git a/src/SvgSize.js b/src/SvgSize.js index 9a6bbe5..9b00292 100644 --- a/src/SvgSize.js +++ b/src/SvgSize.js @@ -1,9 +1,9 @@ /*jslint vars: true, plusplus: true, devel: true, nomen: true, indent: 2, maxerr: 50 */ -/*global define, brackets, $ */ +/*global $, define, brackets */ /* * HTML Skeleton - * Created 2014 Triangle717 + * Created 2014-2015 Triangle717 * * * Licensed under The MIT License @@ -11,74 +11,86 @@ */ -define(function (require, exports, module) { +define(function (require, exports) { "use strict"; var FileSystem = brackets.getModule("filesystem/FileSystem"), FileUtils = brackets.getModule("file/FileUtils"); /** * @private - * Get SVG graphic file object - * @param svgfile {string} absolute path to SVG graphic - * @return {jQuery.Promise} promise that contains a File object + * Get SVG graphic file object. + * @param {String} svgFile Absolute path to SVG graphic. + * @return {$.Promise} Promise that contains a File object. */ - function _readSVG(svgfile) { + function _readSVGFile(svgfile) { return FileUtils.readAsText(FileSystem.getFileForPath(svgfile)); } /** * @private - * @param width the proposed width - * @param height the proposed height - * @return {boolean} true if width and height are valid + * @param {Number} width The proposed width. + * @param {Number} height The proposed height. + * @return {Boolean} True if width and height are valid. */ - function _checkIfValid(width, height) { - return !Number.isNaN(width) && !Number.isNaN(height) && (width && height) !== 0 && (width && height) !== ""; + function _isValid(width, height) { + return !Number.isNaN(width) && !Number.isNaN(height) && (width && height) !== null; } /** * Attempt to extract the size of an SVG graphic - * from the width/height, viewBox and enable-background attributes - * @param svgfile {string} absolute path to SVG graphic - * @return {jQuery.Promise} promise that resolves to a - * two-index array containing the respective width and height or NaN - * if the size could not be extracted + * from the width/height, viewBox and enable-background attributes. + * @param {String} svgFile Absolute path to SVG graphic. + * @return {$.Promise} Promise that resolves to a two-index array + * containing the respective width and height + * or NaN if the size could not be extracted. */ function getSVGSize(svgfile) { var result = new $.Deferred(); - _readSVG(svgfile).then(function (content) { - // Add the SVG to the DOM - var $svgContainer = $("
").css("display", "none").html(content), - $svgElement = $svgContainer.find("svg"); + _readSVGFile(svgfile).then(function (content) { + // Regexs to extract the details + var widthRegex = /[^-]width=['"](.+?)['"]/i, + heightRegex = /[^-]height=['"](.+?)['"]/i, + viewBoxRegex = /viewBox=['"](.+?)['"]/i, + enableBackgroundRegex = /enable-background=['"](.+?)['"]/i; - // Extract every instance a width/height might be present - var attrWidth = $svgElement.attr("width") !== undefined ? $svgElement.attr("width") : "", - attrHeight = $svgElement.attr("height") !== undefined ? $svgElement.attr("height") : "", - viewBoxWidth = $svgElement.prop("viewBox").baseVal.width, - viewBoxHeight = $svgElement.prop("viewBox").baseVal.height, - enableBackground = $svgElement.attr("enable-background") !== undefined ? - $svgElement.attr("enable-background") : ""; + // Check the SVG for the needed attributes + var results = { + width: widthRegex.test(content) ? content.match(widthRegex)[1] : null, + height: heightRegex.test(content) ? content.match(heightRegex)[1] : null, + viewBox: viewBoxRegex.test(content) ? content.match(viewBoxRegex)[1] : null, + enableBackground: enableBackgroundRegex.test(content) ? content.match(enableBackgroundRegex)[1] : null + }; - // Extract the width and height values from the background - var backgroundSizes = enableBackground.split(" "); - var backgroundWidth = parseInt(backgroundSizes[3], 10), - backgroundHeight = parseInt(backgroundSizes[4], 10); + // The viewBox values are present, extract them + if (results.viewBox) { + var individualVB = results.viewBox.split(" "); + results.viewBoxWidth = individualVB[2]; + results.viewBoxHeight = individualVB[3]; + delete results.viewBox; + } + + // The enable-background values are present, extract them + if (results.enableBackground) { + var individualEB = results.enableBackground.split(" "); + results.enableBackgroundWidth = individualEB[3]; + results.enableBackgroundHeight = individualEB[4]; + delete results.enableBackground; + } // Check the validity of the extracted values, - // preferring width/height attributes, then viewBox values + // preferring width/height, viewBox, and finally enable-background var svgSize = [NaN, NaN]; - if (_checkIfValid(attrWidth, attrHeight)) { - svgSize = [attrWidth, attrHeight]; - } else if (_checkIfValid(viewBoxWidth, viewBoxHeight)) { - svgSize = [viewBoxWidth, viewBoxHeight]; - } else if (_checkIfValid(backgroundWidth, backgroundHeight)) { - svgSize = [backgroundWidth, backgroundHeight]; + if (_isValid(results.width, results.height)) { + svgSize = [results.width, results.height]; + } else if (_isValid(results.viewBoxWidth, results.viewBoxHeight)) { + svgSize = [results.viewBoxWidth, results.viewBoxHeight]; + } else if (_isValid(results.enableBackgroundWidth, results.enableBackgroundHeight)) { + svgSize = [results.enableBackgroundWidth, results.enableBackgroundHeight]; } - // Remove container from DOM, resolve the promise - $svgContainer.remove(); + // Resolve the promise result.resolve(svgSize); }); return result.promise(); diff --git a/strings.js b/strings.js index 025b430..9299475 100644 --- a/strings.js +++ b/strings.js @@ -1,25 +1,12 @@ /* -* Copyright (c) 2012 Adobe Systems Incorporated. All rights reserved. -* -* Permission is hereby granted, free of charge, to any person obtaining a -* copy of this software and associated documentation files (the "Software"), -* to deal in the Software without restriction, including without limitation -* the rights to use, copy, modify, merge, publish, distribute, sublicense, -* and/or sell copies of the Software, and to permit persons to whom the -* Software is furnished to do so, subject to the following conditions: -* -* The above copyright notice and this permission notice shall be included in -* all copies or substantial portions of the Software. -* -* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING -* FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER -* DEALINGS IN THE SOFTWARE. -* -*/ + * HTML Skeleton + * Created 2014-2015 Triangle717 + * + * + * Licensed under The MIT License + * + */ + /*jslint vars: true, plusplus: true, devel: true, nomen: true, indent: 4, maxerr: 50 */ /*global define */