lazybox 0.1.8 → 0.2.0

data/README.md

@@ -65,7 +65,7 @@ end
 `new.js.haml`
 
 ```haml
-$.lazybox("#{escape_javascript(render :partial => 'form')}");
+$.lazybox("#{j(render :partial => 'form')}");
 ```
 
 `create.js.haml`
@@ -93,9 +93,14 @@ for options use global lazybox settings:
 ```javascript
 $.lazybox.settings = {cancelClass: "button gray", submitClass: 'button gray', overlay: false}
 ```
-
 ![LazyBox](http://i.imgur.com/2gW9R.png)
 
+or instance settings
+
+```javascript
+$.lazybox("<div>It works!</div>",{onTop: true, opacity: 0.7, modal: false})
+```
+
 ###Images
 
 ```haml
@@ -160,6 +165,7 @@ Options
     closeImg:   true|false //default false. Use image for close link
     onTop:      true|false //default false.  Show lazybox on top instead of on center. It will use slide animation instead of fade.
     opacity:    0.6 //default 0.3. Set opacity for lazybox overlay
+    speed:      400 //default 300. Set animation speed
     klass:      'class' // Set class for lazybox. <div id='lazybox' class='class'>...</div>
     //confirmation options
     cancelText:   //default 'Cancel'. Cancel button text

data/lib/lazybox/version.rb

@@ -1,3 +1,3 @@
 module Lazybox
-  VERSION = "0.1.8"
+  VERSION = "0.2.0"
 end

data/vendor/assets/javascripts/lazybox.js

@@ -1,19 +1,21 @@
 (function($){
-  var defaults = {overlay: true, esc: true, close: true, niceClose: true, modal: true, opacity: 0.3, onTop: false, cancelText: 'Cancel', cancelClass: 'button', submitText: 'Ok', submitClass: 'button'}, effect, y
+  var defaults = {overlay: true, esc: true, close: true, niceClose: true, modal: true, opacity: 0.3, onTop: false, cancelText: 'Cancel', cancelClass: 'button', submitText: 'Ok', submitClass: 'button', speed: 300}, effect, y
   $.lazybox = function(html, options){ $.lazybox.show(html, options) }
   $.extend($.lazybox, {
     settings: $.extend({}, defaults),
     show: function(content, options){
-            var onTop = init(options).onTop
+            var options = init(options)
             $('#lazybox_body').html(content)
-            $.lazybox.center(onTop);
-            (onTop) ? effect = 'slideDown' : effect = 'fadeIn'
-            $('#lazybox')[effect](300)
+            $.lazybox.center(options.onTop);
+            (options.onTop) ? effect = 'slideDown' : effect = 'fadeIn'
+            $('#lazybox')[effect](options.speed)
+            return options
           },
-    close: function(){
+    close: function(speed){
+             speed = speed || defaults.speed;
              ($('#lazybox').position().top == 0) ? effect = 'slideUp' : effect = 'fadeOut'
-             $('#lazybox')[effect](300)
-             $('#lazybox_overlay').fadeOut(500)
+             $('#lazybox')[effect](speed)
+             $('#lazybox_overlay').fadeOut(speed+200)
            },
     center: function(onTop){
               (onTop) ? y = 0 : y = (($(window).height()-$('#lazybox').outerHeight())/2)+$(window).scrollTop()
@@ -36,12 +38,12 @@
       if (href.match(imagesRegexp)){
         var img = new Image(), nextLink
         img.onload = function(element){
-          $.lazybox.show(img, options);
+          options = $.lazybox.show(img, options);
           (a.is(':last-child')) ? nextLink = a.siblings('a[rel*=lazybox]:first') : nextLink = a.next('a[rel*=lazybox]:first')
-          if (!nextLink.length == 0) $('#lazybox img').bind('click', function(){ $('#lazybox').fadeOut(function(){ nextLink.click() }) })
+          if (!nextLink.length == 0) $('#lazybox img').bind('click', function(){ $('#lazybox').fadeOut(options.speed, function(){ nextLink.click() }) })
         }
         $(img).attr({'class': 'lazy_img', src: href})
-      } else $.ajax({url: href, success: function(data){ $.lazybox.show(data, options) }, error: function(){ $.lazybox.close() }})
+      } else $.ajax({url: href, success: function(data){ $.lazybox.show(data, options) }, error: function(){ $.lazybox.close(300) }})
     });
   }
 
@@ -49,7 +51,7 @@
     var options = $.extend($.extend({}, defaults), $.lazybox.settings, options)
     if (options.overlay) {
       $('body:not(:has(#lazybox_overlay))').append("<div id='lazybox_overlay'></div>")
-      $('#lazybox_overlay').css({filter: 'alpha(opacity='+options.opacity*100+')', opacity: options.opacity}).fadeIn(500)
+      $('#lazybox_overlay').css({filter: 'alpha(opacity='+options.opacity*100+')', opacity: options.opacity}).fadeIn(options.speed+200)
     }
     $('body:not(:has(#lazybox))').append("<div id='lazybox'><div id='lazybox_body'></div></div>");
     (options.klass) ? $('#lazybox').attr('class', options.klass) : $('#lazybox').removeClass()
@@ -58,9 +60,9 @@
       (options.closeImg) ? $('#lazybox_close').attr('class', 'img').text('') : $('#lazybox_close').removeClass().text('×')
       if (!$.browser.msie && options.niceClose && !options.closeImg && !options.onTop) $('#lazybox_close').attr('class', 'nice')
     } else $('#lazybox_close').remove();
-    (!options.modal && options.overlay) ? $('#lazybox_overlay').bind('click', function(){ $.lazybox.close() }) : $('#lazybox_overlay').unbind()
-    $(document).keyup(function(e) { if (e.keyCode == 27 && options.esc) $.lazybox.close() })
-    $('#lazybox_close, #lazybox_body .lazy_buttons a').live('click', function(e){ $.lazybox.close(); e.preventDefault() })
+    (!options.modal && options.overlay) ? $('#lazybox_overlay').bind('click', function(){ $.lazybox.close(options.speed) }) : $('#lazybox_overlay').unbind()
+    $(document).keyup(function(e) { if (e.keyCode == 27 && options.esc) $.lazybox.close(options.speed) })
+    $('#lazybox_close, #lazybox_body .lazy_buttons a').live('click', function(e){ $.lazybox.close(options.speed); e.preventDefault() })
     return options
   }
 

data/vendor/assets/stylesheets/lazybox.css

@@ -6,7 +6,7 @@
   position: fixed;
   right: 0px;
   top: 0px;
-  z-index: 100;
+  z-index: 1000;
 }
 
 #lazybox {
@@ -19,7 +19,7 @@
   padding: 20px;
   position: absolute;
   top: 49%;
-  z-index: 101;
+  z-index: 1001;
   -moz-box-shadow: 0 1px 5px #333;
   -webkit-box-shadow: 0 1px 5px #333;
 }
@@ -52,7 +52,7 @@ a#lazybox_close.nice {
 }
 
 a#lazybox_close:hover { color: black; }
-a#lazybox_close.nice:hover { background: white; border-color: black; color: black; }
+a#lazybox_close.nice:hover { background: white; border-color: black; }
 img.lazy_img { cursor: pointer; }
 #lazybox .lazy_buttons { margin-top: 15px; text-align: right; }
 #lazybox.confirm { max-width: 300px; }

metadata

@@ -1,13 +1,13 @@
 --- !ruby/object:Gem::Specification 
 name: lazybox
 version: !ruby/object:Gem::Version 
-  hash: 11
+  hash: 23
   prerelease: 
   segments: 
   - 0
-  - 1
-  - 8
-  version: 0.1.8
+  - 2
+  - 0
+  version: 0.2.0
 platform: ruby
 authors: 
 - Alex Galushka
@@ -15,7 +15,7 @@ autorequire:
 bindir: bin
 cert_chain: []
 
-date: 2012-04-04 00:00:00 Z
+date: 2012-04-12 00:00:00 Z
 dependencies: 
 - !ruby/object:Gem::Dependency 
   name: rails