Skip to content

Latest commit

 

History

History
75 lines (75 loc) · 10.4 KB

changelog.md

File metadata and controls

75 lines (75 loc) · 10.4 KB

Changelog for Previous & Archived Releases

By Anthony Martinez

Previous Releases

Version 1.2.0 (June 12, 2013)

  1. Support for SVG output as base64 is now dropped in favor of partially encoded ASCII, which is more efficient than base64 and is at least somewhat legible, too. Credit for inspiration goes to this clever article he read on Smashing Magazine, showing him for the first time that data URIs don't always have to be in base64.
  2. Preview display is now available when using background-size in input. There is and will likely not be any support for editing/updating the output, however. Instead, to make changes, edit your original input and convert again.
  3. The output boxes and preview get cleared or reset upon toggling Batch Mode.
  4. Firefox 3.6-, Opera 10-, and perhaps a few other older browsers now have support for performing multiple conversions. Fixes issue #2 on the bottom. It was an old regex parsing quirk, fixed by just adding one line: token.lastIndex=0. Don't you love easy fixes?
  5. Bug fix: Using background-size in Batch Mode input led to awful errors in output.
  6. Bug fix: The script did not previously allow for decimal angle measurements lacking at least one leading digit. For example: 0.5deg would work, but not .5deg.
  7. Bug fix: When doing multiple conversions of varying dimensions (including any that exceed available page width and therefore get scaled down to fit the page), the preview may display at an incorrect aspect ratio.
  8. Bug fix / improvement in error-handling: The SVG output text box and Update button should not activate after a failed conversion.
  9. Bug fix / improvement in error-handling: The error message for use of the non-standard center keyword in input was not always being thrown properly.
  10. The script now complies with ECMAScript 5's Strict Mode.
  11. Further tweaks to the page to improve usability, including adding label elements, making input element text now clickable (not just the radio buttons or checkboxes themselves).
  12. The CSS component is now slimmed down by a further 20%, thanks to the removal of unneeded code and optimization of the remaining code. Now, if getting the size of the JS component under control were only as simple... Actually, despite all the changes in this release, the JS is about 5% smaller compared to 1.1.0, but that could be attributed mostly to the migration of the mammoth test case out of the script and into a separate file (test case file) for better discoverability. Ignoring that removal, the JS actually saw a 5% gain in file size.

Version 1.1.0 (June 9, 2013)

  1. Improved error-handling, such as to catch empty input and non-pixel/non-percentage dimensions when editing the output to generate a new SVG preview.
  2. Bug fix: SVG dimensions exceeding available page width would cause previews to get cropped. Now the script detects when the SVG dimensions exceed available page width, and scales the preview down accordingly (without touching your output code).
  3. Bug fix: After conversion, the SVG element in the preview now has a white background, for more accurate rendering of semi-transparent or transparent gradient colors. Previously, the page's background gradient would alter the rendering of semi-transparent or transparent gradient colors.
  4. Bug fix: The appearance of all monospaced text (in <code>, <kbd>, <input>, and <textarea> elements) is now standardized, correcting Opera's maverick rendering behavior. Although, to Opera's credit, the new default font of Consolas is the result of Opera's behavior.
  5. Bug fix: <facepalm> Restored proper functionality to the percent and pixel radio buttons after breaking them in 1.0.0. D'oh! </facepalm>
  6. Performed further tweaks to HTML and CSS to improve page usability, including adding a placeholder for the SVG preview, and removing of some unnecessary CSS.

Version 1.0.0 (June 7, 2013)

  1. The script now detects background-size in input and adjusts behavior accordingly, outputting individual SVG files instead of one layered file, when multiple gradients are used. This allows for gradients to display correctly even when background-size is used.
  2. Bug fix: When input consists of multiple gradients, and more than one of those gradients have destination or origin keywords, e.g., top right or to bottom, the script would calculate the SVG coordinates incorrectly (reusing the coords from a previous gradient). This should happen no more.
  3. Bug fix: Colors defined as three-digit hex notation at a color-stop explicitly labeled 100% would get incorrectly detected as a six-digit color, e.g., #RGB100 instead of #RGB. The script's regex is now updated to avoid this error.
  4. Tweaked HTML and CSS to improve page usability.

Version 0.9.6 (May 28, 2013)

  1. Improved support for IE9-. They can now generate CSS base64 output and execute Batch Mode, thanks to the tiny shim he found for the window.btoa function.
  2. Improved error-handling in Batch Mode. If any individual gradients return an error, processing continues to the end, and those gradients that returned an error are noted in the output.
  3. Improved support for IE8-, FireFox 2-, Safari 3.0-, and Opera 9.6-. They will now skip over the CSS color validation loop, thereby avoiding any errors caused by having rgba and/or hsl/a colors in the input gradient(s). Fixes issue #3 on the bottom of the README.
  4. Bug fix for IE8-: most input color names smaller than 8 letters would output a dud string in the SVG. Now the input color names get output as is, as expected.

Version 0.9.5 (May 27, 2013)

  1. Added a Batch Mode to generate base64 CSS output for multiple selectors at once. Yes! An exclusive feature, as far as he knows. Born out of frustration with the limitations of existing LESS mixins and online gradient generators, this blows everything out of the water :) Requires IE10 any IE or any recent release of Chrome, FF, Safari, or Opera; it won't work in IE9-.
  2. Optimized IE9 base64 output to retain original rgba/hsla/transparent colors, saving a few extra bytes per stop.
  3. Migrated all JS event handlers into the <script> block to separate content and behavior.

Version 0.9.0 (May 26, 2013)

  1. Added full support for new unprefixed W3C syntax gradients (using to <destination> syntax).
  2. Added logic to calculate degrees differently, to match the new W3C syntax. For example, try -moz-linear-gradient(72deg,#fff,#000) and linear-gradient(72deg,#fff,#000) in FireFox CSS — they render differently. Then input them into this script, and they should each render in SVG the same way they do in CSS.
  3. If all color stop percentages are missing, then the script will now interpolate them, as happens in CSS. If only the start and ending stops are missing, the script will add them.
  4. If no direction keywords or angle measurements are specified, the script will now assume defaults, as happens in CSS.
  5. "Angle units"? Yeah, there's now support for all valid units, (deg, rad, grad, & turn). Plus negative values and decimals work.
  6. Improved support for old WebKit syntax — from() and to() will work as expected, even with decimals, and even if to() comes before other color-stops (as is acceptable).
  7. Added support for rgb/a percents, hsl/a, floating points in rgb/a and hsl/a, color names, and the transparent keyword.
  8. Added logic to convert alpha values and transparent to proper SVG stop-opacity values.
  9. Overhauled the SVG vector generation logic, greatly improving accuracy.
  10. Added optional IE9 base64 output for CSS.
  11. Added multiple background support. Yes! No other SVG or gradient generator he's aware of, even the awesome visualcsstools.com that he drew inspiration from, has this.
  12. Extended SVG preview display/update capabilites to more browsers (Chrome 7+, IE9+, FF4+, Safari 5.1+, Opera 11.6+).

Archived Versions by KMH Creative

Version 0.1

Preview does not work in Internet Explorer, however the source code output does so you can still make SVG images with it.

CSS3 Gradient parameters that are NOT supported:

  • color stops expressed as decimals (ex. “0.7″) instead of percentages (ex. “70%”)
  • The old webkit “from” and “to” syntax is not supported. So this will not work:
    -webkit-gradient(linear, 0% 0%, 0% 100%, from(#666666), to(#666666), color-stop(.6,#333))
    However, the old syntax in this format IS supported:
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#666666), color-stop(100%,#666666), color-stop(60%,#333333));
  • No support for “hsl” or “hsla” color stops. Only “hex,” “rgb” and “rgba” are supported. However “rgba” (alpha channel) support varies across browsers so you will probably want to change them to “rgb” instead for better compatibility.
  • The converter currently does not support “radial” gradients at all!