lazybox 0.1.4 → 0.1.5

data/README.md

@@ -1,6 +1,10 @@
 LazyBox
 =======
 
+[Live Demo](http://lazybox.herokuapp.com/)
+
+[Demo Source](https://github.com/alex-galushka/lazybox_demo)
+
 Lazybox is a jQuery-based, lightbox that can display entire remote pages, images and confirmation dialogs.
 Replace standard rails confirmations with lazybox just added several rows to your project. Use lazybox with rails assets pipeline.
 
@@ -9,12 +13,12 @@ This is high perfomance modal dialogs. All unpacked files take only 5 kb.
 This is simplest solution for popup windows and custom confirmation dialogs.
 
 Installing
-------------
+----------
 
 Add it to your Gemfile:
 
 ```ruby
-    gem 'lazybox'
+gem 'lazybox'
 ```
 
 Then run `bundle install` to update your application's bundle.
@@ -22,17 +26,17 @@ Then run `bundle install` to update your application's bundle.
 Include in your `application.css`:
 
 ```css
-    /*
-     * ...
-     *= require lazybox
-     * ...
-     */
+/*
+ * ...
+ *= require lazybox
+ * ...
+ */
 ```
 
 And in `application.js`:
 
 ```javascript
-    //= require lazybox
+//= require lazybox
 ```
 
 Usage
@@ -41,34 +45,34 @@ Usage
 ###Remote pages
 Usual remote link:
 
-```ruby
-  link_to 'Lazybox', new_model_path, :remote => true
+```haml
+- link_to 'Lazybox', new_model_path, :remote => true
 ```
 
 In your controller:
 
 ```ruby
-  def new
-    @model = Model.new
-  end
-
-  def create
-    @model = Model.new(params[:model])
-    render :action => :new unless @model.save
-  end
+def new
+  @model = Model.new
+end
+
+def create
+  @model = Model.new(params[:model])
+  render :action => :new unless @model.save
+end
 ```
 
 `new.js.haml`
 
-```ruby
-  $.lazybox("#{escape_javascript(render :partial => 'form')}");
+```haml
+$.lazybox("#{escape_javascript(render :partial => 'form')}");
 ```
 
 `create.js.haml`
 
-```ruby
-  $.lazybox.close()
-  window.location.reload()
+```haml
+$.lazybox.close()
+window.location.reload()
 ```
 ![LazyBox](http://i.imgur.com/FEYpJ.png)
 
@@ -79,7 +83,7 @@ You can replace standard rails confirmations with lazybox
 And in `application.js`:
 
 ```javascript
-  $.rails.allowAction = $.lazybox.confirm;
+$.rails.allowAction = $.lazybox.confirm;
 ```
 
 ![LazyBox](http://i.imgur.com/1OQdU.png)
@@ -87,7 +91,7 @@ And in `application.js`:
 for options use global lazybox settings:
 
 ```javascript
-  $.lazybox.settings = {cancelClass: "button gray", submitClass: 'button gray', overlay: false}
+$.lazybox.settings = {cancelClass: "button gray", submitClass: 'button gray', overlay: false}
 ```
 
 ![LazyBox](http://i.imgur.com/2gW9R.png)
@@ -95,7 +99,7 @@ for options use global lazybox settings:
 ###Images
 
 ```haml
-  - link_to 'Image', image.url, :rel => :lazybox
+- link_to 'Image', image.url, :rel => :lazybox
 ```
 Include in your `app/assets/javascripts/application.js`:
 
@@ -112,10 +116,37 @@ $(document).ready(function() {
 If there are more than one link to image you can click on image in the lazybox to show the next one
 
 ```haml
-  = link_to image.url, :rel => :lazybox do
-    = image_tag image.url, :height => 100
-  = link_to image2.url, :rel => :lazybox do
-    = image_tag image2.url, :height => 100
+= link_to image.url, :rel => :lazybox do
+  = image_tag image.url, :height => 100
+= link_to image2.url, :rel => :lazybox do
+  = image_tag image2.url, :height => 100
+```
+
+Custom close image
+------------------
+
+Set 'closeImg' option to true.
+
+`application.js`:
+
+```javascript
+$(document).ready(function() {
+  $('.images a').lazybox({closeImg: true});
+});
+```
+
+Style your close:
+
+`application.css`
+
+```css
+#lazybox_close.img {
+  background: url('close.png') no-repeat;
+  width: 32px;
+  height: 32px;
+  top: -17px;
+  right: -17px;
+}
 ```
 
 Options
@@ -125,6 +156,7 @@ Options
     esc:        true|false //default true. Close lazybox on esc press
     close:      true|false //default true. Show close lazybox button
     niceClose:  true|false //default true. Show nice close button like in fancybox(IE always shows simple close button)
+    closeImg:   true|false //default false. Use image for close link
     modal:      true|false //default true. Close lazybox on overlay click
     opacity:    0.6 //default 0.3. Set opacity for lazybox overlay
     klass:      'class' // Set class for lazybox. <div id='lazybox' class='class'>...</div>
@@ -140,9 +172,6 @@ Events
     $.lazybox.show()
     $.lazybox.close()
     $.lazybox.center()
-    $(document).trigger('close.lazybox') //Will be deprecated in next version.  Use $.lazybox.close()
-    $(document).trigger('center.lazybox') //Will be deprecated in next version.  Use $.lazybox.center()
-
 
 Browser Compatibility
 ---------------------

data/lib/lazybox/version.rb

@@ -1,3 +1,3 @@
 module Lazybox
-  VERSION = "0.1.4"
+  VERSION = "0.1.5"
 end

data/vendor/assets/javascripts/lazybox.js

@@ -28,9 +28,8 @@
              }
   });
   $.fn.lazybox = function(options){
-    var imagesRegexp = new RegExp('\\.(png|jpg|jpeg|gif)(\\?.*)?$', 'i')
     this.live('click', function(e){
-      var a = $(this), href = a.attr('href')
+      var a = $(this), href = a.attr('href'), imagesRegexp = new RegExp('\\.(png|jpg|jpeg|gif)(\\?.*)?$', 'i')
       e.preventDefault()
       if (href.match(imagesRegexp)){
         var img = new Image()
@@ -50,17 +49,16 @@
       $('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)
     }
-    $('body:not(:has(#lazybox))').append("<div id='lazybox'><div id='lazybox_body'></div></div>")
-    if (options.klass) { $('#lazybox').removeClass().addClass(options.klass) } else { $('#lazybox').removeClass() }
+    $('body:not(:has(#lazybox))').append("<div id='lazybox'><div id='lazybox_body'></div></div>");
+    (options.klass) ? $('#lazybox').attr('class', options.klass) : $('#lazybox').removeClass()
     if (options.close) {
-      $('#lazybox:not(:has(#lazybox_close))').prepend($("<a id='lazybox_close' title='close'>×</a>"))
-      if (!$.browser.msie && options.niceClose) $('#lazybox_close').addClass('nice')
-    } else $('#lazybox_close').remove()
-    if (!options.modal && options.overlay) { $('#lazybox_overlay').bind('click', function(){ $.lazybox.close() }) } else { $('#lazybox_overlay').unbind() }
+      $('#lazybox:not(:has(#lazybox_close))').prepend($("<a id='lazybox_close' title='close'></a>"));
+      (options.closeImg) ? $('#lazybox_close').attr('class', 'img').text('') : $('#lazybox_close').removeClass().text('×')
+      if (!$.browser.msie && options.niceClose && !options.closeImg) $('#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() })
   }
 
-  $(document).bind('close.lazybox', function(){ $.lazybox.close(); console.warn('will be deprecated') })
-  $(document).bind('center.lazybox', function(){ $.lazybox.center(); console.warn('will be deprecated') })
 })(jQuery);

data/vendor/assets/stylesheets/lazybox.css

@@ -38,8 +38,6 @@ a#lazybox_close {
   width: 25px;
 }
 
-a#lazybox_close:hover { color: black; }
-
 a#lazybox_close.nice {
   background: black;
   border: 2px solid white;
@@ -52,9 +50,9 @@ a#lazybox_close.nice {
   -moz-box-shadow: 0 1px 5px #333;
   -webkit-box-shadow: 0 1px 5px #333;
 }
-a#lazybox_close.nice:hover { background: white; border-color: black; color: black; }
 
+a#lazybox_close:hover { color: black; }
+a#lazybox_close.nice:hover { background: white; border-color: black; 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: 19
+  hash: 17
   prerelease: 
   segments: 
   - 0
   - 1
-  - 4
-  version: 0.1.4
+  - 5
+  version: 0.1.5
 platform: ruby
 authors: 
 - Alex Galushka
@@ -15,7 +15,7 @@ autorequire:
 bindir: bin
 cert_chain: []
 
-date: 2012-03-29 00:00:00 Z
+date: 2012-03-31 00:00:00 Z
 dependencies: 
 - !ruby/object:Gem::Dependency 
   name: rails