keystone_image 0.0.1 → 0.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
data/README.md CHANGED
@@ -19,13 +19,13 @@ Add this line to your application.html.erb to load up the relevant javascripts:
19
19
 
20
20
  That's it. If you want to, review the javascript files for available options. Override key assignments by specifying key codes. Example:
21
21
 
22
- $.keystoneImage({toogle_overlay_keycode: 90});
22
+ $.keystoneImage({toogle_overlay_keycode: 49});
23
23
 
24
24
 
25
25
  ## Usage
26
- - in the webpage, press 'q' to toggle the dropbox - drag and drop any image into it
27
- - press 'a' to toggle keystone image on/off
28
- - to move the keystone image, press ijkl keys - hold shift to move faster
26
+ - in the webpage, press 'alt/option + 2' to toggle the dropbox - drag and drop any image into it
27
+ - press 'alt/option + 1' to toggle keystone image on/off
28
+ - to move the keystone image, hold alt + one of 3/4/5/6 keys - hold shift to move faster
29
29
 
30
30
 
31
31
  ## Limitations
@@ -35,10 +35,11 @@ Do not access your webpage via the file:// protocol or you might not be able to
35
35
 
36
36
  ## Compatibility
37
37
 
38
- Because of the usage of HTML5 Local Storage, native drag/drop, and File API, only modern browsers are supported. Tested working with:
38
+ Because of the usage of HTML5 Local Storage, native drag/drop, and File API, only modern browsers are supported. Known working with:
39
39
  - jQuery 1.6.2
40
40
  - Firefox 6.0
41
41
  - Chrome 13.0.782.112
42
+ - Safari 6.0.2 (8536.26.17)
42
43
  - IE10
43
44
 
44
45
 
@@ -4,12 +4,12 @@
4
4
  /***** Configuration *****/
5
5
  // Example char codes:
6
6
  // http://www.cambiaresearch.com/articles/15/javascript-char-codes-key-codes
7
- var settings = {'toggle_drop_box_keycode': 81, // q
8
- 'toogle_overlay_keycode': 65, // a
9
- 'up_keycode': 73, // i
10
- 'down_keycode': 75, // k
11
- 'left_keycode': 74, // j
12
- 'right_keycode': 76} // l
7
+ var settings = {'toogle_overlay_keycode': 49, // alt/option + 1
8
+ 'toggle_drop_box_keycode': 50, // alt/option + 2
9
+ 'up_keycode': 51, // alt/option + 3
10
+ 'down_keycode': 52, // alt/option + 4
11
+ 'left_keycode': 53, // alt/option + 5
12
+ 'right_keycode': 54} // alt/option + 6
13
13
 
14
14
  $.extend(settings, setting_overrides);
15
15
 
@@ -17,7 +17,8 @@
17
17
 
18
18
  var defaults = {'keystone_image_data_url': '',
19
19
  'keystone_image_pos_x': 0,
20
- 'keystone_image_pos_y': 0}
20
+ 'keystone_image_pos_y': 0,
21
+ 'keystone_image_overlay_display_status': 'f'}
21
22
 
22
23
  $.each(defaults, function(key, value) {
23
24
  if(localStorage[key] == null) {localStorage[key] = value;}
@@ -37,7 +38,9 @@
37
38
  body.append('<img id="keystone_image_overlay" style="display: none; position: absolute; z-index: 9000; opacity: 0.5; pointer-events: none;" />');
38
39
  var image = $('#keystone_image_overlay');
39
40
  image.attr('src', localStorage['keystone_image_data_url']);
40
-
41
+ if(localStorage['keystone_image_overlay_display_status'] == 't')
42
+ image.show();
43
+
41
44
 
42
45
 
43
46
 
@@ -56,12 +59,18 @@
56
59
  }
57
60
  }
58
61
 
62
+ function record_overlay_display_status() {
63
+ localStorage['keystone_image_overlay_display_status'] = (image.css('display') == 'none') ? 't' : 'f';
64
+ }
65
+
59
66
 
60
67
 
61
68
 
62
69
 
63
70
  /***** Event Handlers *****/
64
71
  doc.keydown(function(e) {
72
+ if(!e.altKey) return;
73
+
65
74
  var position_delta = e.shiftKey ? 30 : 1;
66
75
 
67
76
  switch(e.which) {
@@ -69,6 +78,7 @@
69
78
  dropbox.fadeToggle(150);
70
79
  break;
71
80
  case settings.toogle_overlay_keycode:
81
+ record_overlay_display_status();
72
82
  image.fadeToggle(100);
73
83
  break;
74
84
  case settings.up_keycode:
@@ -16,4 +16,6 @@ Gem::Specification.new do |gem|
16
16
  gem.executables = gem.files.grep(%r{^bin/}).map{ |f| File.basename(f) }
17
17
  gem.test_files = gem.files.grep(%r{^(test|spec|features)/})
18
18
  gem.require_paths = ["lib"]
19
+
20
+ gem.add_dependency "jquery-rails", ">= 1.0.13"
19
21
  end
@@ -1,3 +1,3 @@
1
1
  module KeystoneImage
2
- VERSION = "0.0.1"
2
+ VERSION = "0.0.2"
3
3
  end
metadata CHANGED
@@ -1,13 +1,13 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: keystone_image
3
3
  version: !ruby/object:Gem::Version
4
- hash: 29
4
+ hash: 27
5
5
  prerelease:
6
6
  segments:
7
7
  - 0
8
8
  - 0
9
- - 1
10
- version: 0.0.1
9
+ - 2
10
+ version: 0.0.2
11
11
  platform: ruby
12
12
  authors:
13
13
  - Vincent Woo
@@ -15,9 +15,24 @@ autorequire:
15
15
  bindir: bin
16
16
  cert_chain: []
17
17
 
18
- date: 2013-02-17 00:00:00 Z
19
- dependencies: []
20
-
18
+ date: 2013-02-18 00:00:00 Z
19
+ dependencies:
20
+ - !ruby/object:Gem::Dependency
21
+ name: jquery-rails
22
+ prerelease: false
23
+ requirement: &id001 !ruby/object:Gem::Requirement
24
+ none: false
25
+ requirements:
26
+ - - ">="
27
+ - !ruby/object:Gem::Version
28
+ hash: 13
29
+ segments:
30
+ - 1
31
+ - 0
32
+ - 13
33
+ version: 1.0.13
34
+ type: :runtime
35
+ version_requirements: *id001
21
36
  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.
22
37
  email:
23
38
  - contact@undefinedrange.com