overlay_me 0.12.0

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.
Files changed (36) hide show
  1. data/.gitignore +4 -0
  2. data/CHANGELOG.md +37 -0
  3. data/Gemfile +7 -0
  4. data/Gemfile.lock +70 -0
  5. data/LICENSE +21 -0
  6. data/README.md +136 -0
  7. data/Rakefile +115 -0
  8. data/addons/layout_resizer.js +51 -0
  9. data/demo_page.html +33 -0
  10. data/javascripts/addons/layout_resizer.js.coffee +42 -0
  11. data/javascripts/basics.js.coffee +25 -0
  12. data/javascripts/draggable.js.coffee +51 -0
  13. data/javascripts/init.js.coffee +24 -0
  14. data/javascripts/lib/backbone.js +1154 -0
  15. data/javascripts/lib/html5slider.js +268 -0
  16. data/javascripts/lib/jquery.js +9404 -0
  17. data/javascripts/lib/underscore.js +807 -0
  18. data/javascripts/menu.js.coffee +29 -0
  19. data/javascripts/menu_item.js.coffee +42 -0
  20. data/javascripts/overlay_me.js.coffee +3 -0
  21. data/javascripts/overlays/content_div_mngmt.js.coffee +91 -0
  22. data/javascripts/overlays/draggable_image.js.coffee +34 -0
  23. data/javascripts/overlays/dynamic_images_mngmt.js.coffee +48 -0
  24. data/javascripts/overlays/image.js.coffee +100 -0
  25. data/javascripts/overlays/images_mngt_div.js.coffee +103 -0
  26. data/javascripts/overlays/init.js.coffee +13 -0
  27. data/javascripts/overlays.js.coffee +49 -0
  28. data/lib/overlay_me/version.rb +7 -0
  29. data/lib/overlay_me.rb +22 -0
  30. data/overlay_me.css +232 -0
  31. data/overlay_me.gemspec +23 -0
  32. data/overlay_me.js +12565 -0
  33. data/stylesheets/overlay_me.css.scss +213 -0
  34. data/vendor/assets/javascripts/overlay_me/addons/layout_resizer.js +51 -0
  35. data/vendor/assets/javascripts/overlay_me/overlay_me.min.js +733 -0
  36. metadata +200 -0
data/overlay_me.css ADDED
@@ -0,0 +1,232 @@
1
+ /* line 6, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
2
+ button {
3
+ font-size: 10px;
4
+ margin: 0 5px;
5
+ padding: 0px 5px;
6
+ }
7
+
8
+ /* line 12, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
9
+ #overlay_me_page_container {
10
+ position: relative;
11
+ }
12
+
13
+ /* line 16, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
14
+ #overlay_me_dev_tools_menu {
15
+ position: absolute;
16
+ z-index: 990;
17
+ }
18
+ /* line 20, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
19
+ #overlay_me_dev_tools_menu * {
20
+ line-height: 14px;
21
+ }
22
+ /* line 24, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
23
+ #overlay_me_dev_tools_menu .drag-me {
24
+ line-height: 100%;
25
+ display: block;
26
+ color: black;
27
+ font-size: 0.7em;
28
+ text-align: center;
29
+ background-image: -webkit-gradient(linear, 0deg, 0deg, color-stop(0%, #999999), color-stop(30%, #dddddd), color-stop(70%, #dddddd), color-stop(100%, #999999));
30
+ background-image: -webkit-linear-gradient(0deg, #999999, #dddddd 30%, #dddddd 70%, #999999 100%);
31
+ background-image: -moz-linear-gradient(0deg, #999999, #dddddd 30%, #dddddd 70%, #999999 100%);
32
+ background-image: -o-linear-gradient(0deg, #999999, #dddddd 30%, #dddddd 70%, #999999 100%);
33
+ background-image: -ms-linear-gradient(0deg, #999999, #dddddd 30%, #dddddd 70%, #999999 100%);
34
+ background-image: linear-gradient(0deg, #999999, #dddddd 30%, #dddddd 70%, #999999 100%);
35
+ padding: 1px;
36
+ }
37
+ /* line 30, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
38
+ #overlay_me_dev_tools_menu .drag-me:hover {
39
+ cursor: move;
40
+ }
41
+ /* line 37, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
42
+ #overlay_me_dev_tools_menu ul {
43
+ list-style: none;
44
+ margin: 0;
45
+ padding: 0;
46
+ border: 0;
47
+ font-size: 100%;
48
+ font: inherit;
49
+ vertical-align: baseline;
50
+ }
51
+
52
+ /* line 48, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
53
+ .menu-item {
54
+ text-align: left;
55
+ background-color: #CCC;
56
+ border: 1px solid rgba(255, 255, 255, 0.2);
57
+ width: 250px;
58
+ }
59
+ /* line 53, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
60
+ .menu-item a.collaps-button {
61
+ cursor: pointer;
62
+ position: absolute;
63
+ padding-top: 9px;
64
+ padding-left: 5px;
65
+ width: 13px;
66
+ height: 9px;
67
+ border: none;
68
+ background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAAJCAYAAADpeqZqAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAIlJREFUeNpivHDhQujz589TmZiYvjMQAP/+/eOQkZGZyfD//38ZIL77nzhwG4ilQJpA2BiIPxHQ8BGIDUHqYZpAOIWApiSYWmRNIDfPxaYaKD4bWR2KJiDmA+KzaHrOQMVxagJhfSD+ALXhA5TPQEgTCCcD8V+gpmRs8rg0MQI1eANpJmzyAAEGAKD/bax/HrzbAAAAAElFTkSuQmCC) no-repeat center center;
69
+ }
70
+ /* line 62, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
71
+ .menu-item a.collaps-button span {
72
+ display: none;
73
+ color: yellow;
74
+ }
75
+ /* line 65, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
76
+ .menu-item a.collaps-button span:hover {
77
+ color: yellow;
78
+ }
79
+ /* line 70, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
80
+ .menu-item label.title {
81
+ padding-left: 20px;
82
+ color: white;
83
+ cursor: pointer;
84
+ width: 237px;
85
+ line-height: 1.1em;
86
+ font-size: 14px;
87
+ background: none;
88
+ }
89
+ /* line 80, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
90
+ .menu-item.collapsed .item-content {
91
+ display: none;
92
+ }
93
+ /* line 81, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
94
+ .menu-item.collapsed a.collaps-button {
95
+ background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAANCAYAAAB7AEQGAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAKtJREFUeNpiuHz5ctD///+lgJgBF2Z68uRJOgMDw0EgNmTAAZiA4AeQVgHiA0CchFUREpsPiOcCjZ8NZWNVBAaMjIwpQGofEOvjVAQFxkATDwJxMkgNCy7HAk3kB1KzgApf4DIJBD4CcRpQ8TZcJp2D+vQiVjcBjZ8HpBxhCtAVfQbiVKDxIMd+QtbI8u/fP04gfQ+Iw4D4LDa7WSQlJUGBdxyIn+DyAUCAAQDxsEXD9kreLQAAAABJRU5ErkJggg==) no-repeat center center;
96
+ }
97
+
98
+ /* line 89, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
99
+ #overlay_panel .content-mgnt-block {
100
+ position: relative;
101
+ line-height: 10px;
102
+ }
103
+ /* line 92, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
104
+ #overlay_panel .content-mgnt-block .unicorns {
105
+ background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAYAAAA71pVKAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAklJREFUeNqEks1u00AQx3d27V3HdezY+SBpkKBFoBZxQEKIOwfegBs3rtwoPABvw3sgceKAuFWtUBBSaT6ctvHXer2zOElTVaoKI/2lWWl/O//ZGZi8jgSPxFv3JX93+CJvfJ4/09++vzH6S/SVH59+IohH5JagxBilC4zNHHigSLvtTCPRnLYxtB4b29ojGglBc1PG1PAyLfUxzszIX7B86MwLP/iVkS566DWeEgo+gfrWdV1VJoZgpUdqon84p1a+wxI1CA+l3Z+yqu89N5a9v65EVgK8TOpgH/edZS6JAZ97/AkfKjF3pTpRkUrlfQFnoGlaHNc2F0sAzPIFWIl9WMEGTYUZJfyB12ED2l9UE6bkDAcoy+0QznXJ8nIEBosNuIb3xLoBNIlRhNlc7Ho9dDA6l1OC8gKGUGEnhAyBFmpSu8zqf9jAzqZ/RIUxFDR0G2LQ6ueIwUzGFIuE95livS4p2RaUVQYas/p+xQ4eiavPqO2nKPUcCrvlCR50uqlirXGeiUWeua4uva6vebNDwHIJErq2fW0Mdfcxpjqmqe37Nnd73US64Ummt8a5bCpZhh5UrZanfS9gBw/5tcorGSz1TJ/rCTljoomOGDTLsh+NUz8Ypdz/ndBwlpFeIdn7Hevm9miD9QNxdVGNSQzGSR3ao6Duekm23fqT3Al/Ju3waAEnr1xyayxnymhgNcU9Z7sx5LtWA+6bquxXaeLr5J+wMZebRQwDiwW2x0O7I1y7ZxOrS+X/4Y0DXJ0pANhgM4sKRv4KMACD6UDbVgTzkgAAAABJRU5ErkJggg==) no-repeat center center;
106
+ width: 15px;
107
+ height: 15px;
108
+ position: absolute;
109
+ right: 0;
110
+ top: 6px;
111
+ }
112
+ /* line 103, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
113
+ #overlay_panel label {
114
+ margin: 0 5px 0 0;
115
+ font-size: 14px;
116
+ }
117
+ /* line 108, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
118
+ #overlay_panel .content-mgnt-block, #overlay_panel #images_mgnt {
119
+ text-align: left;
120
+ padding: 3px 4px;
121
+ margin: 2px;
122
+ border: 1px #777 solid;
123
+ -webkit-border-radius: 5px;
124
+ -moz-border-radius: 5px;
125
+ -ms-border-radius: 5px;
126
+ -o-border-radius: 5px;
127
+ border-radius: 5px;
128
+ }
129
+ /* line 115, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
130
+ #overlay_panel .content-mgnt-block legend, #overlay_panel #images_mgnt legend {
131
+ font-size: 10px;
132
+ padding: 0 3px;
133
+ margin-left: 10px;
134
+ }
135
+ /* line 122, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
136
+ #overlay_panel .slider-block {
137
+ display: block;
138
+ }
139
+ /* line 124, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
140
+ #overlay_panel .slider-block label {
141
+ font-size: 70%;
142
+ vertical-align: top;
143
+ }
144
+ /* line 128, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
145
+ #overlay_panel .slider-block input[type=range] {
146
+ margin: 0;
147
+ }
148
+ /* line 133, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
149
+ #overlay_panel #images_mgnt {
150
+ width: 236px;
151
+ }
152
+ /* line 137, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
153
+ #overlay_panel #images_mgnt .controls {
154
+ padding-bottom: 5px;
155
+ }
156
+ /* line 141, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
157
+ #overlay_panel #images_mgnt .overlay-image-block {
158
+ text-align: left;
159
+ position: relative;
160
+ width: 236px;
161
+ border: 1px solid rgba(255, 255, 255, 0.2);
162
+ border-right: none;
163
+ border-left: none;
164
+ }
165
+ /* line 148, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
166
+ #overlay_panel #images_mgnt .overlay-image-block.hovered {
167
+ background-color: rgba(255, 255, 0, 0.5);
168
+ }
169
+ /* line 151, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
170
+ #overlay_panel #images_mgnt .overlay-image-block .del-button {
171
+ position: absolute;
172
+ right: 0;
173
+ top: 0;
174
+ margin: 3px 7px;
175
+ cursor: pointer;
176
+ border: 1px #AAA solid;
177
+ font-size: 80%;
178
+ background-color: #444;
179
+ color: white;
180
+ font-weight: bold;
181
+ padding: 0 4px 2px 4px;
182
+ }
183
+ /* line 167, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
184
+ #overlay_panel #images_mgnt .dynamic-adds label {
185
+ font-size: 75%;
186
+ }
187
+ /* line 170, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
188
+ #overlay_panel #images_mgnt .dynamic-adds input {
189
+ width: 105px;
190
+ font-size: 10px;
191
+ }
192
+ /* line 177, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
193
+ #overlay_panel input[type=checkbox], #overlay_panel label, #overlay_panel #contentSlider, #overlay_panel .zindex-switch {
194
+ display: inline;
195
+ }
196
+ /* line 181, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
197
+ #overlay_panel input[type=checkbox] {
198
+ vertical-align: middle;
199
+ margin: -3px 5px 0 0;
200
+ }
201
+
202
+ /* line 188, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
203
+ #overlay_me_images_container {
204
+ position: absolute;
205
+ z-index: 4;
206
+ top: 0;
207
+ left: 0;
208
+ }
209
+ /* line 193, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
210
+ #overlay_me_images_container div {
211
+ position: absolute;
212
+ visibility: hidden;
213
+ }
214
+ /* line 196, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
215
+ #overlay_me_images_container div.highlight {
216
+ background: rgba(255, 255, 0, 0.5);
217
+ opacity: 1;
218
+ }
219
+ /* line 199, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
220
+ #overlay_me_images_container div.highlight img {
221
+ opacity: .7;
222
+ }
223
+ /* line 203, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
224
+ #overlay_me_images_container div:hover {
225
+ cursor: move;
226
+ }
227
+ /* line 207, /Users/ffmini/Programming/overlay_me/stylesheets/overlay_me.css.scss */
228
+ #overlay_me_images_container img {
229
+ position: absolute;
230
+ top: 0;
231
+ left: 0;
232
+ }
data/overlay_me.gemspec ADDED
@@ -0,0 +1,23 @@
1
+ # -*- encoding: utf-8 -*-
2
+
3
+ require File.expand_path('../lib/overlay_me/version', __FILE__)
4
+
5
+ Gem::Specification.new do |s|
6
+ s.name = "overlay_me"
7
+ s.version = OverlayMe::VERSION
8
+ s.platform = Gem::Platform::RUBY
9
+ s.authors = ["Rufus Post", "Joseph Boiteau"]
10
+ s.email = ["joseph.b@frontfoot.com.au"]
11
+ s.homepage = "http://github.com/frontfoot/overlay_me"
12
+ s.summary = "A handy toolbox for your web development"
13
+ s.description = "loaded dynamically over any web page, this will help you to overlay designer's work on your DOM rendering"
14
+
15
+ ['rake', 'rack', 'json', 'haml', 'coffee-script', 'sprockets-sass', 'compass'].each do |dep|
16
+ s.add_dependency(dep)
17
+ end
18
+
19
+ s.files = `git ls-files | grep -v 'jpg$'`.split("\n")
20
+ s.require_paths = ["lib"]
21
+ end
22
+
23
+