keystone_image 0.0.1 → 0.0.2

data/README.md

@@ -19,13 +19,13 @@ Add this line to your application.html.erb to load up the relevant javascripts:
 
 That's it. If you want to, review the javascript files for available options. Override key assignments by specifying key codes. Example:
     
-    $.keystoneImage({toogle_overlay_keycode: 90});
+    $.keystoneImage({toogle_overlay_keycode: 49});
 
 
 ## Usage
-- in the webpage, press 'q' to toggle the dropbox - drag and drop any image into it
-- press 'a' to toggle keystone image on/off
-- to move the keystone image, press ijkl keys - hold shift to move faster
+- in the webpage, press 'alt/option + 2' to toggle the dropbox - drag and drop any image into it
+- press 'alt/option + 1' to toggle keystone image on/off
+- to move the keystone image, hold alt + one of 3/4/5/6 keys - hold shift to move faster
 
 
 ## Limitations
@@ -35,10 +35,11 @@ Do not access your webpage via the file:// protocol or you might not be able to
 
 ## Compatibility
 
-Because of the usage of HTML5 Local Storage, native drag/drop, and File API, only modern browsers are supported. Tested working with:
+Because of the usage of HTML5 Local Storage, native drag/drop, and File API, only modern browsers are supported. Known working with:
 - jQuery 1.6.2
 - Firefox 6.0
 - Chrome 13.0.782.112
+- Safari 6.0.2 (8536.26.17)
 - IE10
 
 

data/app/assets/javascripts/jquery.keystone-image.js

@@ -4,12 +4,12 @@
     /***** Configuration *****/
     // Example char codes:
     // http://www.cambiaresearch.com/articles/15/javascript-char-codes-key-codes
-    var settings = {'toggle_drop_box_keycode': 81,  // q
-                    'toogle_overlay_keycode': 65,   // a
-                    'up_keycode': 73,               // i
-                    'down_keycode': 75,             // k
-                    'left_keycode': 74,             // j
-                    'right_keycode': 76}            // l
+    var settings = {'toogle_overlay_keycode': 49,   // alt/option + 1
+                    'toggle_drop_box_keycode': 50,  // alt/option + 2
+                    'up_keycode': 51,               // alt/option + 3
+                    'down_keycode': 52,             // alt/option + 4
+                    'left_keycode': 53,             // alt/option + 5
+                    'right_keycode': 54}            // alt/option + 6
 
     $.extend(settings, setting_overrides);
     
@@ -17,7 +17,8 @@
     
     var defaults = {'keystone_image_data_url': '',
                     'keystone_image_pos_x': 0,
-                    'keystone_image_pos_y': 0}
+                    'keystone_image_pos_y': 0,
+                    'keystone_image_overlay_display_status': 'f'}
   
     $.each(defaults, function(key, value) {
       if(localStorage[key] == null) {localStorage[key] = value;}
@@ -37,7 +38,9 @@
     body.append('<img id="keystone_image_overlay" style="display: none; position: absolute; z-index: 9000; opacity: 0.5; pointer-events: none;" />');
     var image = $('#keystone_image_overlay');
     image.attr('src', localStorage['keystone_image_data_url']);
-
+    if(localStorage['keystone_image_overlay_display_status'] == 't')
+      image.show();
+    
 
 
 
@@ -56,12 +59,18 @@
       }
     }
     
+    function record_overlay_display_status() {
+      localStorage['keystone_image_overlay_display_status'] = (image.css('display') == 'none') ? 't' : 'f';
+    }
+    
     
     
     
     
     /***** Event Handlers *****/
     doc.keydown(function(e) {
+      if(!e.altKey) return;
+      
       var position_delta = e.shiftKey ? 30 : 1;
       
       switch(e.which) {
@@ -69,6 +78,7 @@
           dropbox.fadeToggle(150);
           break;
         case settings.toogle_overlay_keycode:
+          record_overlay_display_status();
           image.fadeToggle(100);
           break;
         case settings.up_keycode:

data/keystone_image.gemspec

@@ -16,4 +16,6 @@ Gem::Specification.new do |gem|
   gem.executables   = gem.files.grep(%r{^bin/}).map{ |f| File.basename(f) }
   gem.test_files    = gem.files.grep(%r{^(test|spec|features)/})
   gem.require_paths = ["lib"]
+  
+  gem.add_dependency "jquery-rails", ">= 1.0.13"
 end

data/lib/keystone_image/version.rb

@@ -1,3 +1,3 @@
 module KeystoneImage
-  VERSION = "0.0.1"
+  VERSION = "0.0.2"
 end

metadata

@@ -1,13 +1,13 @@
 --- !ruby/object:Gem::Specification 
 name: keystone_image
 version: !ruby/object:Gem::Version 
-  hash: 29
+  hash: 27
   prerelease: 
   segments: 
   - 0
   - 0
-  - 1
-  version: 0.0.1
+  - 2
+  version: 0.0.2
 platform: ruby
 authors: 
 - Vincent Woo
@@ -15,9 +15,24 @@ autorequire:
 bindir: bin
 cert_chain: []
 
-date: 2013-02-17 00:00:00 Z
-dependencies: []
-
+date: 2013-02-18 00:00:00 Z
+dependencies: 
+- !ruby/object:Gem::Dependency 
+  name: jquery-rails
+  prerelease: false
+  requirement: &id001 !ruby/object:Gem::Requirement 
+    none: false
+    requirements: 
+    - - ">="
+      - !ruby/object:Gem::Version 
+        hash: 13
+        segments: 
+        - 1
+        - 0
+        - 13
+        version: 1.0.13
+  type: :runtime
+  version_requirements: *id001
 description: KeystoneImage overlays a semi-transparent wireframe/design image over everything in the web browser viewport. Handy when converting a PSD from a graphic designer into a webpage to ensure pixel perfect layouts.
 email: 
 - contact@undefinedrange.com