diff --git a/.gitignore b/.gitignore index 7e004f5..438d6ec 100644 --- a/.gitignore +++ b/.gitignore @@ -1,6 +1,2 @@ -/site/_output -/site/source.html -/site/jquery.transit.js -/site/jquery.transit.min.js -/site/.sass-cache -/site/test +node_modules +site diff --git a/HISTORY.md b/HISTORY.md index e06dc43..c1abd48 100644 --- a/HISTORY.md +++ b/HISTORY.md @@ -1,5 +1,27 @@ -v0.9.9 - Dec 14, 2012 ---------------------- +## v0.9.12 - July 17, 2014 + + * Fix browserify builds by using the correct jQuery. ([@dminkovsky], [#201]) + * Fix properties resetting after a transition. ([#204], [#205]) + +## v0.9.11 - June 23, 2014 + + * Add support for `scaleX` and `scaleY`. ([@YousefED], [#192]) + * Add support for npm. + * Add support for RequireJS and CommonJS. + * Fix transitionend support for IE10, Chrome, and many others. ([@wambotron], [#103]) + +Also: + + * Fix `.transition({...}, {queue: false})` not being honored. ([@YousefED], [#192]) + * Remove some redundant code. ([@Bongo], [#165]) + * Docs: Update to support the new docco. ([@francismakes], [#175]) + * Add `easeInCubic` easing. ([@emagnier], [@willblackmore], [#161], [#142]) + * Add test cases for jQuery 2.0+. ([@hankhero], [#155]) + +The version `0.9.10` was not officially released as it was published prematurely +to npm. + +## v0.9.9 - Dec 14, 2012 Many, many thanks to the many [contributors] who made this release happen! This is a pre-release of 1.0. @@ -7,31 +29,30 @@ is a pre-release of 1.0. ### Fixes and additions: * Fix support for jQuery 1.8, IE 10, Firefox 16, Android Jellybean. - (#48, #62, #63, #69, #70, #71, #72, #76, #77, #80, #81, #82, #85, #86, #90, #92, #93) - * Compatibility with Twitter Bootstrap has been fixed. (#67) + ([#48], [#62], [#63], [#69], [#70], [#71], [#72], [#76], [#77], [#80], [#81], [#82], [#85], [#86], [#90], [#92], [#93]) + * Compatibility with Twitter Bootstrap has been fixed. ([#67]) * Unprefixed CSS properties are now used if your browser supports them. - * Account for prefix-free transition end for Mozilla. (#97) - * Callbacks should now be called even if duration is `0`. (#37) - * Doing `.css('transition', 'transform 1s')` should now properly vendor-prefix 'transform'. (#84) - * Added Penner easing splines. (#44) + * Account for prefix-free transition end for Mozilla. ([#97]) + * Callbacks should now be called even if duration is `0`. ([#37]) + * Doing `.css('transition', 'transform 1s')` should now properly vendor-prefix 'transform'. ([#84]) + * Added Penner easing splines. ([#44]) ### Internal fixes: * New test suite. - * In building the website, use `fl-rocco` instead of `docco`. This removes the dependency. (#50) + * In building the website, use `fl-rocco` instead of `docco`. This removes the dependency. ([#50]) -v0.1.3 - Feb 14, 2012 ---------------------- +## v0.1.3 - Feb 14, 2012 ### Fixed: - * Fix JS error with undefined `next` function. (#21) - * Using `delay: 0` now works. Closes (#20) - * More robust checking of 3D transition support. (#19) + * Fix JS error with undefined `next` function. ([#21]) + * Using `delay: 0` now works. Closes ([#20]) + * More robust checking of 3D transition support. ([#19]) * Stop rotateX/rotateY/etc from stopping other transitions when it's not - supported. (#15) + supported. ([#15]) ### Added: - * Support Firefox 10 3D transitions. (#19) + * Support Firefox 10 3D transitions. ([#19]) ### Changed: * Allow disabling using the transitionEnd property. @@ -39,33 +60,94 @@ v0.1.3 - Feb 14, 2012 * Use the more reliable timers by default. (`useTransitionEnd` now defaults to `false`) -v0.1.2 - Jan 24, 2012 ---------------------- +## v0.1.2 - Jan 24, 2012 -Thanks to code contributors @ppcano, @jeduan, @steckel, @weotch, and everyone +Thanks to code contributors [@ppcano], [@jeduan], [@steckel], [@weotch], and everyone who reported issues. ### Fixed: - * IE8 error about .indexOf. (#12, #8) - * Fix z-layer scaling in Safari. (#9, #10) - * Fix scale elements being unclickable in WebKits. (#9, #10) - * Fix support for `queue: false`. (#13) - * Clean up transitions when done. (#14) - * Fix disappearing scaled elements in Chrome. (#11) + * IE8 error about .indexOf. ([#12], [#8]) + * Fix z-layer scaling in Safari. ([#9], [#10]) + * Fix scale elements being unclickable in WebKits. ([#9], [#10]) + * Fix support for `queue: false`. ([#13]) + * Clean up transitions when done. ([#14]) + * Fix disappearing scaled elements in Chrome. ([#11]) * Fix a bug where the default duration and easing can sometimes not be used. ### Changed: - * Make code compatible with jsHint. (#6) + * Make code compatible with jsHint. ([#6]) -v0.1.1 - Nov 18, 2011 ---------------------- +## v0.1.1 - Nov 18, 2011 ### Fixed: * Only animate what is needed (ie, don't use 'transition-property: all'). -v0.1.0 - Nov 14, 2011 ---------------------- +## v0.1.0 - Nov 14, 2011 Initial official release. [contributors]: https://github.com/rstacruz/jquery.transit/contributors + +[#201]: https://github.com/rstarcuz/jquery.transit/issues/201 +[@dminkovsky]: https://github.com/dminkovsky + +[#204]: https://github.com/rstacruz/jquery.transit/issues/204 +[#205]: https://github.com/rstacruz/jquery.transit/issues/205 +[#192]: https://github.com/rstacruz/jquery.transit/issues/192 +[#103]: https://github.com/rstacruz/jquery.transit/issues/103 +[#192]: https://github.com/rstacruz/jquery.transit/issues/192 +[#165]: https://github.com/rstacruz/jquery.transit/issues/165 +[#175]: https://github.com/rstacruz/jquery.transit/issues/175 +[#161]: https://github.com/rstacruz/jquery.transit/issues/161 +[#142]: https://github.com/rstacruz/jquery.transit/issues/142 +[#155]: https://github.com/rstacruz/jquery.transit/issues/155 +[#48]: https://github.com/rstacruz/jquery.transit/issues/48 +[#62]: https://github.com/rstacruz/jquery.transit/issues/62 +[#63]: https://github.com/rstacruz/jquery.transit/issues/63 +[#69]: https://github.com/rstacruz/jquery.transit/issues/69 +[#70]: https://github.com/rstacruz/jquery.transit/issues/70 +[#71]: https://github.com/rstacruz/jquery.transit/issues/71 +[#72]: https://github.com/rstacruz/jquery.transit/issues/72 +[#76]: https://github.com/rstacruz/jquery.transit/issues/76 +[#77]: https://github.com/rstacruz/jquery.transit/issues/77 +[#80]: https://github.com/rstacruz/jquery.transit/issues/80 +[#81]: https://github.com/rstacruz/jquery.transit/issues/81 +[#82]: https://github.com/rstacruz/jquery.transit/issues/82 +[#85]: https://github.com/rstacruz/jquery.transit/issues/85 +[#86]: https://github.com/rstacruz/jquery.transit/issues/86 +[#90]: https://github.com/rstacruz/jquery.transit/issues/90 +[#92]: https://github.com/rstacruz/jquery.transit/issues/92 +[#93]: https://github.com/rstacruz/jquery.transit/issues/93 +[#67]: https://github.com/rstacruz/jquery.transit/issues/67 +[#97]: https://github.com/rstacruz/jquery.transit/issues/97 +[#37]: https://github.com/rstacruz/jquery.transit/issues/37 +[#84]: https://github.com/rstacruz/jquery.transit/issues/84 +[#44]: https://github.com/rstacruz/jquery.transit/issues/44 +[#50]: https://github.com/rstacruz/jquery.transit/issues/50 +[#21]: https://github.com/rstacruz/jquery.transit/issues/21 +[#20]: https://github.com/rstacruz/jquery.transit/issues/20 +[#19]: https://github.com/rstacruz/jquery.transit/issues/19 +[#15]: https://github.com/rstacruz/jquery.transit/issues/15 +[#19]: https://github.com/rstacruz/jquery.transit/issues/19 +[#12]: https://github.com/rstacruz/jquery.transit/issues/12 +[#8]: https://github.com/rstacruz/jquery.transit/issues/8 +[#9]: https://github.com/rstacruz/jquery.transit/issues/9 +[#10]: https://github.com/rstacruz/jquery.transit/issues/10 +[#9]: https://github.com/rstacruz/jquery.transit/issues/9 +[#10]: https://github.com/rstacruz/jquery.transit/issues/10 +[#13]: https://github.com/rstacruz/jquery.transit/issues/13 +[#14]: https://github.com/rstacruz/jquery.transit/issues/14 +[#11]: https://github.com/rstacruz/jquery.transit/issues/11 +[#6]: https://github.com/rstacruz/jquery.transit/issues/6 +[@YousefED]: https://github.com/YousefED +[@wambotron]: https://github.com/wambotron +[@YousefED]: https://github.com/YousefED +[@Bongo]: https://github.com/Bongo +[@francismakes]: https://github.com/francismakes +[@emagnier]: https://github.com/emagnier +[@willblackmore]: https://github.com/willblackmore +[@hankhero]: https://github.com/hankhero +[@ppcano]: https://github.com/ppcano +[@jeduan]: https://github.com/jeduan +[@steckel]: https://github.com/steckel +[@weotch]: https://github.com/weotch diff --git a/NOTES.md b/NOTES.md new file mode 100644 index 0000000..afd8ab9 --- /dev/null +++ b/NOTES.md @@ -0,0 +1,36 @@ +Developer notes +=============== + +Testing: + + open test/index.html + +Making a new release: + + vim HISTORY.md # update changelog + bump *.json *.js # update version number + npm publish # release to npm + git release v1.0.0 # release to github/bower + cd site && make # update the site + +Managing the site +----------------- + +Make `site/`: + + git clone git@github.com:rstacruz/jquery.transit.git -b gh-pages ./site + +Update: + + cd site + make update # update from files + make # update the site + make dist # make dist/ files (uh, should be deprecated) + +v1.0.0 to do +------------ + + * .transitionStop() + * use transitionend by default (#184) + * Update bootstrap compatibility (#143, #67) + * Redesign the site diff --git a/README.md b/README.md index 5e08ff6..519d661 100644 --- a/README.md +++ b/README.md @@ -10,13 +10,22 @@ examples. Usage ----- -Just include this script after jQuery. Requires jQuery 1.4+. +Just include [jquery.transit.js] after jQuery. Requires jQuery 1.4+. ``` html ``` +It is also available via [bower] and [npm]. + + $ bower install --save jquery.transit + $ npm install --save jquery.transit + +[bower]: http://bower.io/search/?q=jquery.transit +[npm]: http://npmjs.org/package/jquery.transit +[jquery.transit.js]: https://github.com/rstacruz/jquery.transit/blob/master/jquery.transit.js + Transformations --------------- @@ -105,7 +114,11 @@ different browsers. Alternatives ------------ -__[Move.js](https://github.com/visionmedia/move.js)__ (recommended!) +__[Velocity.js](https://velocityjs.org)__ (recommended!) + + * Pros: optimized for situations with hundreds of simultaneous transitions. Lots of extra features. + +__[Move.js](https://github.com/visionmedia/move.js)__ * Pros: no jQuery dependency, great syntax. * Cons (at time of writing): no iOS support (doesn't use `translate3d`), some @@ -128,20 +141,29 @@ __[jQuery CSS3 rotate](http://plugins.jquery.com/project/Rotate)__ * Pros: simply provides rotation. * Cons: simply provides rotation. No transitions support. -Acknowledgements ----------------- +Support +------- + +__Bugs and requests__: submit them through the project's issues tracker.
+[![Issues](http://img.shields.io/github/issues/rstacruz/jquery.transit.svg)]( https://github.com/rstacruz/jquery.transit/issues ) + +__Questions__: ask them at StackOverflow with the tag *jquery-transit*.
+[![StackOverflow](http://img.shields.io/badge/stackoverflow-jquery--transit-brightgreen.svg)]( http://stackoverflow.com/questions/tagged/jquery-transit ) + +__Chat__: join us at gitter.im.
+[![Chat](http://img.shields.io/badge/gitter-rstacruz / jquery.transit-brightgreen.svg)]( https://gitter.im/rstacruz/jquery.transit ) + +Thanks +------ -© 2011, Rico Sta. Cruz. Released under the [MIT -License](http://www.opensource.org/licenses/mit-license.php). +**jQuery Transit** © 2011-2014+, Rico Sta. Cruz. Released under the [MIT License].
+Authored and maintained by Rico Sta. Cruz with help from [contributors]. -jQuery Transit is authored and maintained by [Rico Sta. Cruz][rsc] with help -from it's [contributors][c]. It is sponsored by my startup, [Sinefunc, Inc][sf]. +> [ricostacruz.com](http://ricostacruz.com)  ·  +> GitHub [@rstacruz](https://github.com/rstacruz)  ·  +> Twitter [@rstacruz](https://twitter.com/rstacruz) - * [My website](http://ricostacruz.com) (ricostacruz.com) - * [Sinefunc, Inc.](http://sinefunc.com) (sinefunc.com) - * [Github](http://github.com/rstacruz) (@rstacruz) - * [Twitter](http://twitter.com/rstacruz) (@rstacruz) +[MIT License]: http://mit-license.org/ +[contributors]: http://github.com/rstacruz/jquery.transit/contributors -[rsc]: http://ricostacruz.com -[c]: http://github.com/rstacruz/jquery.transit/contributors -[sf]: http://sinefunc.com +[![npm version](https://img.shields.io/npm/v/jquery.transit.png)](https://npmjs.org/package/jquery.transit "View this project on npm") diff --git a/Rakefile b/Rakefile deleted file mode 100644 index 3f124b8..0000000 --- a/Rakefile +++ /dev/null @@ -1,110 +0,0 @@ -def system(*a) - puts " $ #{a[0]}" - super -end - -module Compressor - def self.compress(jscode) - require 'net/http' - require 'uri' - - response = Net::HTTP.post_form(URI.parse('http://closure-compiler.appspot.com/compile'), { - 'js_code' => jscode, - 'compilation_level' => "SIMPLE_OPTIMIZATIONS", - 'output_format' => 'text', - 'output_info' => 'compiled_code' - }) - response.body - end - - def self.compress_with_comment(jscode) - comment = jscode.match(/(\/\*!.*?\*\/)/m) && $1 - compressed = compress(jscode) - compressed = comment + "\n" + compressed if comment - compressed - end -end - -module Helpers - def can_run?(what) - ! `which #{what}`.strip.empty? - end - - def version - contents = File.read('jquery.transit.js') - m = contents.match(/version: "(.*?)"/) - m[1] - end - - def die(str) - puts str - exit - end -end - -extend Helpers - -desc "Print version." -task :version do - puts version -end - -desc "Puts released versions on the site." -task :release => :compress do - require 'fileutils' - - fn = "site/jquery.transit-#{version}.js" - FileUtils.cp 'site/jquery.transit.js', fn - puts "==> #{fn}" - - fn = "site/jquery.transit-#{version}.min.js" - FileUtils.cp 'site/jquery.transit.min.js', fn - puts "==> #{fn}" -end - -task :check_deps do - die "Error: You need Rocco. Try `gem install fl-rocco`." unless can_run?('rocco') - begin - require 'proton' - rescue LoadError => e - die "Error: You need Proton. Try `gem install proton`." - end -end - -task :compress do - system "cp jquery.transit.js site/" - - puts "==> Compressing (site/jquery.transit.min.js)..." - str = File.read('jquery.transit.js') - str = Compressor.compress_with_comment(str) - File.open('site/jquery.transit.min.js', 'w') { |f| f.write str } -end - -# Prepare -task :prebuild => [:check_deps, :compress] do - puts "==> Generating annotated source..." - system "rocco jquery.transit.js > /dev/null" - system "mv ./jquery.transit.html site/source.html" - system "rm -rf docs" - - puts "==> Copying test files..." - system "rm -rf site/test" - system "cp -R test site/test" -end - -desc "Builds the website" -task :build => :prebuild do - puts "==> Building site..." - system "cd site && proton build" -end - -desc "Deploys the website" -task :deploy => :build do - system "git update-ghpages rstacruz/jquery.transit -i site/_output -b gh-pages" -end - -desc "Starts the preview site" -task :preview => [:check_deps] do - port = ENV['port'] || 4833 - exec "cd site && proton start -p #{port}" -end diff --git a/bower.json b/bower.json new file mode 100644 index 0000000..eee1c52 --- /dev/null +++ b/bower.json @@ -0,0 +1,17 @@ +{ + "name": "jquery.transit", + "repo": "rstacruz/jquery.transit", + "description": "Smooth CSS3 transitions and transformations for jQuery.", + "version": "0.9.12", + "keywords": [ + "css3", + "animation", + "transition" + ], + "dependencies": { + "jquery": "*" + }, + "development": {}, + "license": "MIT", + "main": "jquery.transit.js" +} diff --git a/component.json b/component.json index dff492e..d77d822 100644 --- a/component.json +++ b/component.json @@ -2,7 +2,7 @@ "name": "jquery.transit", "repo": "rstacruz/jquery.transit", "description": "Smooth CSS3 transitions and transformations for jQuery.", - "version": "0.9.9", + "version": "0.9.12", "keywords": [ "css3", "animation", diff --git a/jquery.transit.js b/jquery.transit.js index 561b49a..a2b47b8 100644 --- a/jquery.transit.js +++ b/jquery.transit.js @@ -1,15 +1,28 @@ /*! * jQuery Transit - CSS3 transitions and transformations - * (c) 2011-2012 Rico Sta. Cruz + * (c) 2011-2014 Rico Sta. Cruz * MIT Licensed. * * http://ricostacruz.com/jquery.transit * http://github.com/rstacruz/jquery.transit */ -(function($) { +/* jshint expr: true */ + +;(function (root, factory) { + + if (typeof define === 'function' && define.amd) { + define(['jquery'], factory); + } else if (typeof exports === 'object') { + module.exports = factory(require('jquery')); + } else { + factory(root.jQuery); + } + +}(this, function($) { + $.transit = { - version: "0.9.9", + version: "0.9.12", // Map of $.css() keys to values for 'transitionProperty'. // See https://developer.mozilla.org/en/CSS/CSS_transitions#Properties_that_can_be_animated @@ -43,8 +56,6 @@ var prefixes = ['Moz', 'Webkit', 'O', 'ms']; var prop_ = prop.charAt(0).toUpperCase() + prop.substr(1); - if (prop in div.style) { return prop; } - for (var i=0; i 0) { this.style[support.transition] = transitionValue; } - $(this).css(properties); + $(this).css(theseProperties); }); }; // Defer running. This allows the browser to paint any pending CSS it hasn't // painted yet before doing the transitions. var deferredRun = function(next) { - this.offsetWidth; // force a repaint + this.offsetWidth = this.offsetWidth; // force a repaint run(next); }; @@ -678,18 +724,22 @@ // ### toMS(duration) // Converts given `duration` to a millisecond string. // - // toMS('fast') //=> '400ms' - // toMS(10) //=> '10ms' + // toMS('fast') => $.fx.speeds[i] => "200ms" + // toMS('normal') //=> $.fx.speeds._default => "400ms" + // toMS(10) //=> '10ms' + // toMS('100ms') //=> '100ms' // function toMS(duration) { var i = duration; - // Allow for string durations like 'fast'. - if ($.fx.speeds[i]) { i = $.fx.speeds[i]; } + // Allow string durations like 'fast' and 'slow', without overriding numeric values. + if (typeof i === 'string' && (!i.match(/^[\-0-9\.]+/))) { i = $.fx.speeds[i] || $.fx.speeds._default; } return unit(i, 'ms'); } // Export some functions for testable-ness. $.transit.getTransitionValue = getTransition; -})(jQuery); + + return $; +})); diff --git a/package.json b/package.json new file mode 100644 index 0000000..78336e7 --- /dev/null +++ b/package.json @@ -0,0 +1,36 @@ +{ + "name": "jquery.transit", + "version": "0.9.12", + "description": "Smooth CSS3 transitions and transformations for jQuery.", + "main": "jquery.transit.js", + "directories": { + "test": "test" + }, + "scripts": { + "test": "mocha" + }, + "repository": { + "type": "git", + "url": "git://github.com/rstacruz/jquery.transit.git" + }, + "keywords": [ + "css3", + "animation", + "transition" + ], + "author": "Rico Sta. Cruz ", + "license": "MIT", + "peerDependencies": { + "jquery": "*" + }, + "devDependencies": { + "chai": "1.9.1", + "sinon": "1.10.2", + "jsdom": "0.11.0", + "coffee-script": "1.7.1" + }, + "bugs": { + "url": "https://github.com/rstacruz/jquery.transit/issues" + }, + "homepage": "http://ricostacruz.com/jquery.transit" +} diff --git a/test/index.html b/test/index.html index 7a847a8..ac4a924 100644 --- a/test/index.html +++ b/test/index.html @@ -33,6 +33,7 @@
Use: + jQ 2.0.3 jQ 1.9.0b1 jQ 1.8 jQ 1.7 @@ -157,6 +158,12 @@

jQuery transit tests

.transition({ opacity: 0 }); }); + test('Transition of transform (no jump first time)', function($box) { + $box + .transition({ transform: "translateX(80px)" }); + }); + + diff --git a/test/test.js b/test/test.js index ed88d03..a015441 100644 --- a/test/test.js +++ b/test/test.js @@ -1,25 +1,31 @@ (function($) { /* Simple test framework of sorts */ - $('.test').live('mouseenter play', function() { - var $test = $(this).closest('.test'); - $test.trigger('reset'); - var $box = $test.find('.box:not(.ghost)'); - var $ghost = $box.clone().addClass('ghost').appendTo($test.find('.area')); - $test.data('code').fn($box, $test); - }); - $('.test').live('mouseleave reset', function() { - var $test = $(this).closest('.test'); - var $ghost = $test.find('.ghost'); - if ($ghost.length) { - $test.find('.box:not(.ghost)').remove(); - $test.find('.ghost').removeClass('ghost'); - } - }); - - $('.play-all').live('click', function() { - $('.test').trigger('play'); + function addTestEvents ($test) { + $test.bind('mouseenter play', function() { + var $test = $(this).closest('.test'); + $test.trigger('reset'); + var $box = $test.find('.box:not(.ghost)'); + var $ghost = $box.clone().addClass('ghost').appendTo($test.find('.area')); + + $test.data('code').fn($box, $test); + }); + + $test.bind('mouseleave reset', function() { + var $test = $(this).closest('.test'); + var $ghost = $test.find('.ghost'); + if ($ghost.length) { + $test.find('.box:not(.ghost)').remove(); + $test.find('.ghost').removeClass('ghost'); + } + }); + } + + $(document).ready(function () { + $('.play-all').bind('click', function() { + $('.test').trigger('play'); + }); }); function test(name, fn) { @@ -36,6 +42,7 @@ $test.find('h3').html(name); $test.find('pre').text(code); $test.data('code', {fn: fn}); + addTestEvents($test); $('.tests').append($test); }