add-to-homescreen-rails 2.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.
- data/.gitignore +17 -0
- data/Gemfile +4 -0
- data/LICENSE.txt +22 -0
- data/README.md +36 -0
- data/Rakefile +1 -0
- data/add-to-homescreen-rails.gemspec +19 -0
- data/lib/add-to-homescreen-rails.rb +11 -0
- data/lib/add-to-homescreen-rails/version.rb +9 -0
- data/vendor/assets/javascripts/add2home.js +337 -0
- data/vendor/assets/stylesheets/add2home.css +158 -0
- metadata +55 -0
data/.gitignore
ADDED
data/Gemfile
ADDED
data/LICENSE.txt
ADDED
@@ -0,0 +1,22 @@
|
|
1
|
+
Copyright (c) 2012 RogerE
|
2
|
+
|
3
|
+
MIT License
|
4
|
+
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining
|
6
|
+
a copy of this software and associated documentation files (the
|
7
|
+
"Software"), to deal in the Software without restriction, including
|
8
|
+
without limitation the rights to use, copy, modify, merge, publish,
|
9
|
+
distribute, sublicense, and/or sell copies of the Software, and to
|
10
|
+
permit persons to whom the Software is furnished to do so, subject to
|
11
|
+
the following conditions:
|
12
|
+
|
13
|
+
The above copyright notice and this permission notice shall be
|
14
|
+
included in all copies or substantial portions of the Software.
|
15
|
+
|
16
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
17
|
+
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
18
|
+
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
|
19
|
+
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
|
20
|
+
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
|
21
|
+
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
|
22
|
+
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
data/README.md
ADDED
@@ -0,0 +1,36 @@
|
|
1
|
+
# 'Add to Home screen' for Rails
|
2
|
+
|
3
|
+
This gem vendors the 'Add to Home screen' assets for Rails 3.1 and greater.
|
4
|
+
The files will be added to the asset pipeline and available for you to use.
|
5
|
+
|
6
|
+
For info on how to use the plugin see the original documentation:
|
7
|
+
|
8
|
+
[Add to Home screen](http://cubiq.org/add-to-home-screen)
|
9
|
+
|
10
|
+
Praise for creating this tool should of course be directed at [Matteo Spinelli](http://cubiq.org/)!
|
11
|
+
|
12
|
+
For the orignal javascript and css file go to his [Github repository](https://github.com/cubiq/add-to-homescreen).
|
13
|
+
|
14
|
+
## Usage
|
15
|
+
|
16
|
+
In your Gemfile, add:
|
17
|
+
|
18
|
+
```ruby
|
19
|
+
group :assets do
|
20
|
+
gem 'add-to-home-screen-rails'
|
21
|
+
end
|
22
|
+
```
|
23
|
+
|
24
|
+
You can include it by adding the following to your javascript file:
|
25
|
+
|
26
|
+
```javascript
|
27
|
+
//= require add2home
|
28
|
+
```
|
29
|
+
|
30
|
+
And to the css file:
|
31
|
+
|
32
|
+
```css
|
33
|
+
/*
|
34
|
+
*= require add2home
|
35
|
+
*/
|
36
|
+
```
|
data/Rakefile
ADDED
@@ -0,0 +1 @@
|
|
1
|
+
require "bundler/gem_tasks"
|
@@ -0,0 +1,19 @@
|
|
1
|
+
# -*- encoding: utf-8 -*-
|
2
|
+
lib = File.expand_path('../lib', __FILE__)
|
3
|
+
$LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib)
|
4
|
+
require 'add-to-homescreen-rails/version'
|
5
|
+
|
6
|
+
Gem::Specification.new do |gem|
|
7
|
+
gem.name = "add-to-homescreen-rails"
|
8
|
+
gem.version = Add::To::Homescreen::Rails::VERSION
|
9
|
+
gem.authors = ["RogerE"]
|
10
|
+
gem.email = ["roger@webfokus.no"]
|
11
|
+
gem.description = "Provides the 'Add to Home screen' assets for your Rails application."
|
12
|
+
gem.summary = "Use 'Add to Home screen' with Rails Asset Pipeline"
|
13
|
+
gem.homepage = "https://github.com/RogerE/add-to-homescreen-rails"
|
14
|
+
|
15
|
+
gem.files = `git ls-files`.split($/)
|
16
|
+
gem.executables = gem.files.grep(%r{^bin/}).map{ |f| File.basename(f) }
|
17
|
+
gem.test_files = gem.files.grep(%r{^(test|spec|features)/})
|
18
|
+
gem.require_paths = ["lib"]
|
19
|
+
end
|
@@ -0,0 +1,337 @@
|
|
1
|
+
/*!
|
2
|
+
* Add to Homescreen v2.0 ~ Copyright (c) 2012 Matteo Spinelli, http://cubiq.org
|
3
|
+
* Released under MIT license, http://cubiq.org/license
|
4
|
+
*/
|
5
|
+
var addToHome = (function (w) {
|
6
|
+
var nav = w.navigator,
|
7
|
+
isIDevice = 'platform' in nav && (/iphone|ipod|ipad/gi).test(nav.platform),
|
8
|
+
isIPad,
|
9
|
+
isRetina,
|
10
|
+
isSafari,
|
11
|
+
isStandalone,
|
12
|
+
OSVersion,
|
13
|
+
startX = 0,
|
14
|
+
startY = 0,
|
15
|
+
isExpired,
|
16
|
+
isSessionActive,
|
17
|
+
isReturningVisitor,
|
18
|
+
balloon,
|
19
|
+
overrideChecks,
|
20
|
+
|
21
|
+
positionInterval,
|
22
|
+
closeTimeout,
|
23
|
+
|
24
|
+
options = {
|
25
|
+
autostart: true, // Automatically open the balloon
|
26
|
+
returningVisitor: false, // Show the balloon to returning visitors only (setting this to true is HIGHLY RECCOMENDED)
|
27
|
+
animationIn: 'drop', // drop || bubble || fade
|
28
|
+
animationOut: 'fade', // drop || bubble || fade
|
29
|
+
startDelay: 2000, // 2 seconds from page load before the balloon appears
|
30
|
+
lifespan: 15000, // 15 seconds before it is automatically destroyed
|
31
|
+
bottomOffset: 14, // Distance of the balloon from bottom
|
32
|
+
expire: 0, // Minutes to wait before showing the popup again (0 = always displayed)
|
33
|
+
message: '', // Customize your message or force a language ('' = automatic)
|
34
|
+
touchIcon: false, // Display the touch icon
|
35
|
+
arrow: true, // Display the balloon arrow
|
36
|
+
hookOnLoad: true, // Should we hook to onload event? (really advanced usage)
|
37
|
+
iterations: 100 // Internal/debug use
|
38
|
+
},
|
39
|
+
|
40
|
+
intl = {
|
41
|
+
ca_es: 'Per instal·lar aquesta aplicació al vostre %device premeu %icon i llavors <strong>Afegir a pantalla d\'inici</strong>.',
|
42
|
+
da_dk: 'Tilføj denne side til din %device: tryk på %icon og derefter <strong>Tilføj til hjemmeskærm</strong>.',
|
43
|
+
de_de: 'Installieren Sie diese App auf Ihrem %device: %icon antippen und dann <strong>Zum Home-Bildschirm</strong>.',
|
44
|
+
el_gr: 'Εγκαταστήσετε αυτήν την Εφαρμογή στήν συσκευή σας %device: %icon μετά πατάτε <strong>Προσθήκη σε Αφετηρία</strong>.',
|
45
|
+
en_us: 'Install this web app on your %device: tap %icon and then <strong>Add to Home Screen</strong>.',
|
46
|
+
es_es: 'Para instalar esta app en su %device, pulse %icon y seleccione <strong>Añadir a pantalla de inicio</strong>.',
|
47
|
+
fi_fi: 'Asenna tämä web-sovellus laitteeseesi %device: paina %icon ja sen jälkeen valitse <strong>Lisää Koti-valikkoon</strong>.',
|
48
|
+
fr_fr: 'Ajoutez cette application sur votre %device en cliquant sur %icon, puis <strong>Ajouter à l\'écran d\'accueil</strong>.',
|
49
|
+
he_il: '<span dir="rtl">התקן אפליקציה זו על ה-%device שלך: הקש %icon ואז <strong>הוסף למסך הבית</strong>.</span>',
|
50
|
+
hu_hu: 'Telepítse ezt a web-alkalmazást az Ön %device-jára: nyomjon a %icon-ra majd a <strong>Főképernyőhöz adás</strong> gombra.',
|
51
|
+
it_it: 'Installa questa applicazione sul tuo %device: premi su %icon e poi <strong>Aggiungi a Home</strong>.',
|
52
|
+
ja_jp: 'このウェブアプリをあなたの%deviceにインストールするには%iconをタップして<strong>ホーム画面に追加</strong>を選んでください。',
|
53
|
+
ko_kr: '%device에 웹앱을 설치하려면 %icon을 터치 후 "홈화면에 추가"를 선택하세요',
|
54
|
+
nb_no: 'Installer denne appen på din %device: trykk på %icon og deretter <strong>Legg til på Hjem-skjerm</strong>',
|
55
|
+
nl_nl: 'Installeer deze webapp op uw %device: tik %icon en dan <strong>Zet in beginscherm</strong>.',
|
56
|
+
pl_pl: 'Aby zainstalować tę aplikacje na %device: naciśnij %icon a następnie <strong>Dodaj jako ikonę</strong>.',
|
57
|
+
pt_br: 'Instale este web app em seu %device: aperte %icon e selecione <strong>Adicionar à Tela Inicio</strong>.',
|
58
|
+
pt_pt: 'Para instalar esta aplicação no seu %device, prima o %icon e depois o <strong>Adicionar ao ecrã principal</strong>.',
|
59
|
+
ru_ru: 'Установите это веб-приложение на ваш %device: нажмите %icon, затем <strong>Добавить в «Домой»</strong>.',
|
60
|
+
sv_se: 'Lägg till denna webbapplikation på din %device: tryck på %icon och därefter <strong>Lägg till på hemskärmen</strong>.',
|
61
|
+
th_th: 'ติดตั้งเว็บแอพฯ นี้บน %device ของคุณ: แตะ %icon และ <strong>เพิ่มที่หน้าจอโฮม</strong>',
|
62
|
+
tr_tr: '%device için bu uygulamayı kurduktan sonra %icon simgesine dokunarak <strong>Ev Ekranına Ekle</strong>yin.',
|
63
|
+
zh_cn: '您可以将此应用程式安装到您的 %device 上。请按 %icon 然后点选<strong>添加至主屏幕</strong>。',
|
64
|
+
zh_tw: '您可以將此應用程式安裝到您的 %device 上。請按 %icon 然後點選<strong>加入主畫面螢幕</strong>。'
|
65
|
+
};
|
66
|
+
|
67
|
+
function init () {
|
68
|
+
// Preliminary check, prevents all further checks to be performed on iDevices only
|
69
|
+
if ( !isIDevice ) return;
|
70
|
+
|
71
|
+
var now = Date.now();
|
72
|
+
|
73
|
+
// Merge local with global options
|
74
|
+
if (w.addToHomeConfig) {
|
75
|
+
for ( var i in w.addToHomeConfig ) {
|
76
|
+
options[i] = w.addToHomeConfig[i];
|
77
|
+
}
|
78
|
+
}
|
79
|
+
if ( !options.autostart ) options.hookOnLoad = false;
|
80
|
+
|
81
|
+
isIPad = (/ipad/gi).test(nav.platform);
|
82
|
+
isRetina = w.devicePixelRatio && w.devicePixelRatio > 1;
|
83
|
+
isSafari = nav.appVersion.match(/Safari/gi);
|
84
|
+
isStandalone = nav.standalone;
|
85
|
+
|
86
|
+
OSVersion = nav.appVersion.match(/OS (\d+_\d+)/i);
|
87
|
+
OSVersion = OSVersion[1] ? +OSVersion[1].replace('_', '.') : 0;
|
88
|
+
|
89
|
+
isExpired = +w.localStorage.getItem('addToHome') || now;
|
90
|
+
isSessionActive = w.sessionStorage.getItem('addToHomeSession');
|
91
|
+
isReturningVisitor = !options.returningVisitor || ( isExpired && isExpired + 28*24*60*60*1000 > now ); // You are considered a "returning visitor" if you access the site more than once/month
|
92
|
+
|
93
|
+
// If it is expired we need to reissue a new balloon
|
94
|
+
isExpired = ( !options.expire || isExpired <= now );
|
95
|
+
|
96
|
+
if ( options.hookOnLoad ) w.addEventListener('load', loaded, false);
|
97
|
+
else if ( !options.hookOnLoad && options.autostart ) loaded();
|
98
|
+
}
|
99
|
+
|
100
|
+
function loaded () {
|
101
|
+
w.removeEventListener('load', loaded, false);
|
102
|
+
|
103
|
+
if ( !overrideChecks && (!isSafari || !isExpired || isSessionActive || isStandalone || !isReturningVisitor) ) return;
|
104
|
+
|
105
|
+
if ( options.expire || options.returningVisitor ) {
|
106
|
+
w.localStorage.setItem('addToHome', Date.now() + options.expire * 60000);
|
107
|
+
}
|
108
|
+
|
109
|
+
var icons = options.touchIcon ? document.querySelectorAll('head link[rel=apple-touch-icon],head link[rel=apple-touch-icon-precomposed]') : [],
|
110
|
+
sizes,
|
111
|
+
touchIcon = '',
|
112
|
+
closeButton,
|
113
|
+
platform = nav.platform.split(' ')[0],
|
114
|
+
language = nav.language.replace('-', '_'),
|
115
|
+
i, l;
|
116
|
+
|
117
|
+
balloon = document.createElement('div');
|
118
|
+
balloon.id = 'addToHomeScreen';
|
119
|
+
balloon.style.cssText += 'left:-9999px;-webkit-transition-property:-webkit-transform,opacity;-webkit-transition-duration:0;-webkit-transform:translate3d(0,0,0);position:' + (OSVersion < 5 ? 'absolute' : 'fixed');
|
120
|
+
|
121
|
+
// Localize message
|
122
|
+
if ( options.message in intl ) { // You may force a language despite the user's locale
|
123
|
+
language = options.message;
|
124
|
+
options.message = '';
|
125
|
+
}
|
126
|
+
if ( options.message === '' ) { // We look for a suitable language (defaulted to en_us)
|
127
|
+
options.message = language in intl ? intl[language] : intl['en_us'];
|
128
|
+
}
|
129
|
+
|
130
|
+
// Search for the apple-touch-icon
|
131
|
+
if ( icons.length ) {
|
132
|
+
for ( i = 0, l = icons.length; i < l; i++ ) {
|
133
|
+
sizes = icons[i].getAttribute('sizes');
|
134
|
+
|
135
|
+
if ( sizes ) {
|
136
|
+
if ( isRetina && sizes == '114x114' ) {
|
137
|
+
touchIcon = icons[i].href;
|
138
|
+
break;
|
139
|
+
}
|
140
|
+
} else {
|
141
|
+
touchIcon = icons[i].href;
|
142
|
+
}
|
143
|
+
}
|
144
|
+
|
145
|
+
touchIcon = '<span style="background-image:url(' + touchIcon + ')" class="addToHomeTouchIcon"></span>';
|
146
|
+
}
|
147
|
+
|
148
|
+
balloon.className = (isIPad ? 'addToHomeIpad' : 'addToHomeIphone') + (touchIcon ? ' addToHomeWide' : '');
|
149
|
+
balloon.innerHTML = touchIcon +
|
150
|
+
options.message.replace('%device', platform).replace('%icon', OSVersion >= 4.2 ? '<span class="addToHomeShare"></span>' : '<span class="addToHomePlus">+</span>') +
|
151
|
+
(options.arrow ? '<span class="addToHomeArrow"></span>' : '') +
|
152
|
+
'<span class="addToHomeClose">\u00D7</span>';
|
153
|
+
|
154
|
+
document.body.appendChild(balloon);
|
155
|
+
|
156
|
+
// Add the close action
|
157
|
+
closeButton = balloon.querySelector('.addToHomeClose');
|
158
|
+
if ( closeButton ) closeButton.addEventListener('click', clicked, false);
|
159
|
+
|
160
|
+
setTimeout(show, options.startDelay);
|
161
|
+
}
|
162
|
+
|
163
|
+
function show () {
|
164
|
+
var duration,
|
165
|
+
iPadXShift = 160;
|
166
|
+
|
167
|
+
// Set the initial position
|
168
|
+
if ( isIPad ) {
|
169
|
+
if ( OSVersion < 5 ) {
|
170
|
+
startY = w.scrollY;
|
171
|
+
startX = w.scrollX;
|
172
|
+
iPadXShift = 208;
|
173
|
+
}
|
174
|
+
|
175
|
+
balloon.style.top = startY + options.bottomOffset + 'px';
|
176
|
+
balloon.style.left = startX + iPadXShift - Math.round(balloon.offsetWidth / 2) + 'px';
|
177
|
+
|
178
|
+
switch ( options.animationIn ) {
|
179
|
+
case 'drop':
|
180
|
+
duration = '0.6s';
|
181
|
+
balloon.style.webkitTransform = 'translate3d(0,' + -(w.scrollY + options.bottomOffset + balloon.offsetHeight) + 'px,0)';
|
182
|
+
break;
|
183
|
+
case 'bubble':
|
184
|
+
duration = '0.6s';
|
185
|
+
balloon.style.opacity = '0';
|
186
|
+
balloon.style.webkitTransform = 'translate3d(0,' + (startY + 50) + 'px,0)';
|
187
|
+
break;
|
188
|
+
default:
|
189
|
+
duration = '1s';
|
190
|
+
balloon.style.opacity = '0';
|
191
|
+
}
|
192
|
+
} else {
|
193
|
+
startY = w.innerHeight + w.scrollY;
|
194
|
+
|
195
|
+
if ( OSVersion < 5 ) {
|
196
|
+
startX = Math.round((w.innerWidth - balloon.offsetWidth) / 2) + w.scrollX;
|
197
|
+
balloon.style.left = startX + 'px';
|
198
|
+
balloon.style.top = startY - balloon.offsetHeight - options.bottomOffset + 'px';
|
199
|
+
} else {
|
200
|
+
balloon.style.left = '50%';
|
201
|
+
balloon.style.marginLeft = -Math.round(balloon.offsetWidth / 2) + 'px';
|
202
|
+
balloon.style.bottom = options.bottomOffset + 'px';
|
203
|
+
}
|
204
|
+
|
205
|
+
switch (options.animationIn) {
|
206
|
+
case 'drop':
|
207
|
+
duration = '1s';
|
208
|
+
balloon.style.webkitTransform = 'translate3d(0,' + -(startY + options.bottomOffset) + 'px,0)';
|
209
|
+
break;
|
210
|
+
case 'bubble':
|
211
|
+
duration = '0.6s';
|
212
|
+
balloon.style.webkitTransform = 'translate3d(0,' + (balloon.offsetHeight + options.bottomOffset + 50) + 'px,0)';
|
213
|
+
break;
|
214
|
+
default:
|
215
|
+
duration = '1s';
|
216
|
+
balloon.style.opacity = '0';
|
217
|
+
}
|
218
|
+
}
|
219
|
+
|
220
|
+
balloon.offsetHeight; // repaint trick
|
221
|
+
balloon.style.webkitTransitionDuration = duration;
|
222
|
+
balloon.style.opacity = '1';
|
223
|
+
balloon.style.webkitTransform = 'translate3d(0,0,0)';
|
224
|
+
balloon.addEventListener('webkitTransitionEnd', transitionEnd, false);
|
225
|
+
|
226
|
+
closeTimeout = setTimeout(close, options.lifespan);
|
227
|
+
}
|
228
|
+
|
229
|
+
function manualShow (override) {
|
230
|
+
if ( !isIDevice || balloon ) return;
|
231
|
+
|
232
|
+
overrideChecks = override;
|
233
|
+
loaded();
|
234
|
+
}
|
235
|
+
|
236
|
+
function close () {
|
237
|
+
clearInterval( positionInterval );
|
238
|
+
clearTimeout( closeTimeout );
|
239
|
+
closeTimeout = null;
|
240
|
+
|
241
|
+
var posY = 0,
|
242
|
+
posX = 0,
|
243
|
+
opacity = '1',
|
244
|
+
duration = '0',
|
245
|
+
closeButton = balloon.querySelector('.addToHomeClose');
|
246
|
+
|
247
|
+
if ( closeButton ) closeButton.removeEventListener('click', close, false);
|
248
|
+
|
249
|
+
if ( OSVersion < 5 ) {
|
250
|
+
posY = isIPad ? w.scrollY - startY : w.scrollY + w.innerHeight - startY;
|
251
|
+
posX = isIPad ? w.scrollX - startX : w.scrollX + Math.round((w.innerWidth - balloon.offsetWidth)/2) - startX;
|
252
|
+
}
|
253
|
+
|
254
|
+
balloon.style.webkitTransitionProperty = '-webkit-transform,opacity';
|
255
|
+
|
256
|
+
switch ( options.animationOut ) {
|
257
|
+
case 'drop':
|
258
|
+
if ( isIPad ) {
|
259
|
+
duration = '0.4s';
|
260
|
+
opacity = '0';
|
261
|
+
posY = posY + 50;
|
262
|
+
} else {
|
263
|
+
duration = '0.6s';
|
264
|
+
posY = posY + balloon.offsetHeight + options.bottomOffset + 50;
|
265
|
+
}
|
266
|
+
break;
|
267
|
+
case 'bubble':
|
268
|
+
if ( isIPad ) {
|
269
|
+
duration = '0.8s';
|
270
|
+
posY = posY - balloon.offsetHeight - options.bottomOffset - 50;
|
271
|
+
} else {
|
272
|
+
duration = '0.4s';
|
273
|
+
opacity = '0';
|
274
|
+
posY = posY - 50;
|
275
|
+
}
|
276
|
+
break;
|
277
|
+
default:
|
278
|
+
duration = '0.8s';
|
279
|
+
opacity = '0';
|
280
|
+
}
|
281
|
+
|
282
|
+
balloon.addEventListener('webkitTransitionEnd', transitionEnd, false);
|
283
|
+
balloon.style.opacity = opacity;
|
284
|
+
balloon.style.webkitTransitionDuration = duration;
|
285
|
+
balloon.style.webkitTransform = 'translate3d(' + posX + 'px,' + posY + 'px,0)';
|
286
|
+
}
|
287
|
+
|
288
|
+
|
289
|
+
function clicked () {
|
290
|
+
w.sessionStorage.setItem('addToHomeSession', '1');
|
291
|
+
isSessionActive = true;
|
292
|
+
close();
|
293
|
+
}
|
294
|
+
|
295
|
+
function transitionEnd () {
|
296
|
+
balloon.removeEventListener('webkitTransitionEnd', transitionEnd, false);
|
297
|
+
|
298
|
+
balloon.style.webkitTransitionProperty = '-webkit-transform';
|
299
|
+
balloon.style.webkitTransitionDuration = '0.2s';
|
300
|
+
|
301
|
+
// We reached the end!
|
302
|
+
if ( !closeTimeout ) {
|
303
|
+
balloon.parentNode.removeChild(balloon);
|
304
|
+
balloon = null;
|
305
|
+
return;
|
306
|
+
}
|
307
|
+
|
308
|
+
// On iOS 4 we start checking the element position
|
309
|
+
if ( OSVersion < 5 && closeTimeout ) positionInterval = setInterval(setPosition, options.iterations);
|
310
|
+
}
|
311
|
+
|
312
|
+
function setPosition () {
|
313
|
+
var matrix = new WebKitCSSMatrix(w.getComputedStyle(balloon, null).webkitTransform),
|
314
|
+
posY = isIPad ? w.scrollY - startY : w.scrollY + w.innerHeight - startY,
|
315
|
+
posX = isIPad ? w.scrollX - startX : w.scrollX + Math.round((w.innerWidth - balloon.offsetWidth) / 2) - startX;
|
316
|
+
|
317
|
+
// Screen didn't move
|
318
|
+
if ( posY == matrix.m42 && posX == matrix.m41 ) return;
|
319
|
+
|
320
|
+
balloon.style.webkitTransform = 'translate3d(' + posX + 'px,' + posY + 'px,0)';
|
321
|
+
}
|
322
|
+
|
323
|
+
// Clear local and session storages (this is useful primarily in development)
|
324
|
+
function reset () {
|
325
|
+
w.localStorage.removeItem('addToHome');
|
326
|
+
w.sessionStorage.removeItem('addToHomeSession');
|
327
|
+
}
|
328
|
+
|
329
|
+
// Bootstrap!
|
330
|
+
init();
|
331
|
+
|
332
|
+
return {
|
333
|
+
show: manualShow,
|
334
|
+
close: close,
|
335
|
+
reset: reset
|
336
|
+
};
|
337
|
+
})(this);
|
@@ -0,0 +1,158 @@
|
|
1
|
+
/**
|
2
|
+
*
|
3
|
+
* Main container
|
4
|
+
*
|
5
|
+
*/
|
6
|
+
#addToHomeScreen {
|
7
|
+
z-index:9999;
|
8
|
+
-webkit-user-select:none;
|
9
|
+
-webkit-box-sizing:border-box;
|
10
|
+
width:240px;
|
11
|
+
font-size:15px;
|
12
|
+
padding:12px 14px;
|
13
|
+
text-align:left;
|
14
|
+
font-family:helvetica;
|
15
|
+
background-image:-webkit-gradient(linear,0 0,0 100%,color-stop(0,#fff),color-stop(0.02,#eee),color-stop(0.98,#ccc),color-stop(1,#a3a3a3));
|
16
|
+
border:1px solid #505050;
|
17
|
+
-webkit-border-radius:8px;
|
18
|
+
-webkit-background-clip:padding-box;
|
19
|
+
color:#333;
|
20
|
+
text-shadow:0 1px 0 rgba(255,255,255,0.75);
|
21
|
+
line-height:130%;
|
22
|
+
-webkit-box-shadow:0 0 4px rgba(0,0,0,0.5);
|
23
|
+
}
|
24
|
+
|
25
|
+
#addToHomeScreen.addToHomeIpad {
|
26
|
+
width:268px;
|
27
|
+
font-size:18px;
|
28
|
+
padding:14px;
|
29
|
+
}
|
30
|
+
|
31
|
+
/**
|
32
|
+
*
|
33
|
+
* The 'wide' class is added when the popup contains the touch icon
|
34
|
+
*
|
35
|
+
*/
|
36
|
+
#addToHomeScreen.addToHomeWide {
|
37
|
+
width:296px;
|
38
|
+
}
|
39
|
+
|
40
|
+
#addToHomeScreen.addToHomeIpad.addToHomeWide {
|
41
|
+
width:320px;
|
42
|
+
font-size:18px;
|
43
|
+
padding:14px;
|
44
|
+
}
|
45
|
+
|
46
|
+
/**
|
47
|
+
*
|
48
|
+
* The balloon arrow
|
49
|
+
*
|
50
|
+
*/
|
51
|
+
#addToHomeScreen .addToHomeArrow {
|
52
|
+
position:absolute;
|
53
|
+
background-image:-webkit-gradient(linear,0 0,100% 100%,color-stop(0,rgba(204,204,204,0)),color-stop(0.4,rgba(204,204,204,0)),color-stop(0.4,#ccc));
|
54
|
+
border-width:0 1px 1px 0;
|
55
|
+
border-style:solid;
|
56
|
+
border-color:#505050;
|
57
|
+
width:16px; height:16px;
|
58
|
+
-webkit-transform:rotateZ(45deg);
|
59
|
+
bottom:-9px; left:50%;
|
60
|
+
margin-left:-8px;
|
61
|
+
-webkit-box-shadow:inset -1px -1px 0 #a9a9a9;
|
62
|
+
-webkit-border-bottom-right-radius:2px;
|
63
|
+
}
|
64
|
+
|
65
|
+
|
66
|
+
/**
|
67
|
+
*
|
68
|
+
* The balloon arrow for iPad
|
69
|
+
*
|
70
|
+
*/
|
71
|
+
#addToHomeScreen.addToHomeIpad .addToHomeArrow {
|
72
|
+
-webkit-transform:rotateZ(-135deg);
|
73
|
+
background-image:-webkit-gradient(linear,0 0,100% 100%,color-stop(0,rgba(238,238,238,0)),color-stop(0.4,rgba(238,238,238,0)),color-stop(0.4,#eee));
|
74
|
+
-webkit-box-shadow:inset -1px -1px 0 #fff;
|
75
|
+
top:-9px; bottom:auto; left:50%;
|
76
|
+
}
|
77
|
+
|
78
|
+
|
79
|
+
/**
|
80
|
+
*
|
81
|
+
* Close button
|
82
|
+
*
|
83
|
+
*/
|
84
|
+
#addToHomeScreen .addToHomeClose {
|
85
|
+
-webkit-box-sizing:border-box;
|
86
|
+
position:absolute;
|
87
|
+
right:4px;
|
88
|
+
top:4px;
|
89
|
+
width:18px;
|
90
|
+
height:18px; line-height:14px;
|
91
|
+
text-align:center;
|
92
|
+
text-indent:1px;
|
93
|
+
-webkit-border-radius:9px;
|
94
|
+
background:rgba(0,0,0,0.12);
|
95
|
+
color:#707070;
|
96
|
+
-webkit-box-shadow:0 1px 0 #fff;
|
97
|
+
font-size:16px;
|
98
|
+
}
|
99
|
+
|
100
|
+
|
101
|
+
/**
|
102
|
+
*
|
103
|
+
* The '+' icon, displayed only on iOS < 4.2
|
104
|
+
*
|
105
|
+
*/
|
106
|
+
#addToHomeScreen .addToHomePlus {
|
107
|
+
font-weight:bold;
|
108
|
+
font-size:1.3em;
|
109
|
+
}
|
110
|
+
|
111
|
+
|
112
|
+
/**
|
113
|
+
*
|
114
|
+
* The 'share' icon, displayed only on iOS >= 4.2
|
115
|
+
*
|
116
|
+
*/
|
117
|
+
#addToHomeScreen .addToHomeShare {
|
118
|
+
display:inline-block;
|
119
|
+
width:18px;
|
120
|
+
height:15px;
|
121
|
+
background-repeat:no-repeat;
|
122
|
+
background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAPCAQAAABDj1eZAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAUdJREFUKFNtkLtLw1AYxS/qJLhXVKr2ZRulUNtiqgSb3CziICI6ucTFVYcOnaQOFRwUnNTRwUWXgpP/QdHNUEQUHGxofYBTlRs83iZNjKTncOGe7/vx3QchXUWn6FL3jhfKUdCCr5zuifV5oDiHQM+c+CIhiiCSWNu08iq9oHXKLAiqrgR4UXqlOEYZt++ExEL0wW7+OW0G10muLv9gmqfe5FAWKmTMYQYiFL7PYwyLOD8lSjNh2gdnPzMII4QUBxc4OothbAF7GCBKQ0YbSWyPQsIhqvetS+y0ygGMo/KFZfviDvR4AhwgZU9dGYnA0J/6ndc15i3ouYIMcVVUcEXIoOxCeRCfwP8sXBSdjtpUv/1QW+K16kCCIUC4id9Fa0JtkluwVkSfqPL6RwfSDA0aNlx7k/bWgViB7bMS2/1vk5sdsZLN/ALSuL3tylO4RAAAAABJRU5ErkJggg==);
|
123
|
+
background-size:18px 15px;
|
124
|
+
text-indent:-9999em;
|
125
|
+
overflow:hidden;
|
126
|
+
}
|
127
|
+
|
128
|
+
|
129
|
+
/**
|
130
|
+
*
|
131
|
+
* The touch icon (if available)
|
132
|
+
*
|
133
|
+
*/
|
134
|
+
#addToHomeScreen .addToHomeTouchIcon {
|
135
|
+
display:block;
|
136
|
+
float:left;
|
137
|
+
-webkit-border-radius:6px;
|
138
|
+
-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.5),
|
139
|
+
inset 0 0 2px rgba(255,255,255,0.9);
|
140
|
+
background-repeat:no-repeat;
|
141
|
+
width:57px; height:57px;
|
142
|
+
-webkit-background-size:57px 57px;
|
143
|
+
margin:0 12px 0 0;
|
144
|
+
border:1px solid #333;
|
145
|
+
-webkit-background-clip:padding-box;
|
146
|
+
}
|
147
|
+
|
148
|
+
|
149
|
+
/**
|
150
|
+
*
|
151
|
+
* The 'share' icon for retina display
|
152
|
+
*
|
153
|
+
*/
|
154
|
+
@media all and (-webkit-min-device-pixel-ratio: 2) {
|
155
|
+
#addToHomeScreen .addToHomeShare {
|
156
|
+
background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAeCAQAAADu6HTYAAADPElEQVR4Xq3TX2gcRRzA8e/M7mVv2+TSNpc/TZtrY6jUGqgaSAmEChKLrYK0YH0RFC2CSCkEfCghiKU04J8qNigq6os+iQV98MHWFwVBrQQRWs21lBw5cw3NNb1/udu72RGG5Y77IzXW77D7sAwf5scyYoL6BGXSDKFZwaGpLvIUaeoCkvX1MmsM0Ny6oRSQYOLuIS+YZOpfQdqslpUxcZrzTVAz4qPwW2O3CeIwC/RSzeY6Ow1QhUrkr+YOWfEKDkEP8Rij7CHKJmrFSDHBdwGEE5wiGChPN+PnT8VdRtEIl1d4gRj/1EVe5ZSBKGh8iqQpo/Fo5+3C/gz0MYg4zgwbqday1/Q4B8BGQ45d/Hi54lakCrU5obOcidJpu1+Lg9whjabyaOYLnrIBFFaRD+xe2ybMDWY66GmP/WA9cGfGp0CWhy0wkMN8inepFiH2rV1j0NQSNQbFLRQnS8/8YSDBBpadfv4CYDub2fmeHDNAsL1MBWUel0iA+Xik6eHcyvD3vAMSU1TGuA/YRS+dD7ovCQN43GKRFCU20Kd3V/avDVVyAZ5niTEuLA5/zBGWg9EEEhfJKN200Tat8CmRAQb9+wv7soPlHt2tQorsz1uPbr0HTY4sJwrH47zJZwABBAKLMBoQXepwgTwdHCo+fXMkQ4lrxEmQ5AaXipPqDY9V2vn09tgvTPI71EEGYxM+/uMJLJ4svpgaWGKOi/xKgmqLSUGSUd5f2vIVJ/CgBaTIUsZ7ZBsn0+NzfMOXLFCXQyTcybN6ep5ZZgUOHn7jpfUpsZshdugPGf+E5zjbyHTSRyQ8xfRPPM/s63RHeuknSoT22mjmmnAOIMkUZ6D1xSfPPAfd1WFKM3sO2CMaHx8M1NjnXKHaAGGkOW0C02WeYHUz4qMtx+w5gUDS8NckYe5lHsMYwCZEPyEEmjLDZFmAS7CDviMdxyTkMNVBKEmYLvbiQQBIBBbCQG04bGQvFWz6CfsCQLWCigILFwcfkGYBiOpbYuOizTAyYyDdCtrGaRG1LCkIgMYEFhI0WqQZoSlbGRyHKe4qOx7iv2bVQW9dp4dlM/x6kmwnWQcd/Q3FCqwTEiT5s+6D5v/pb0SSHyg7uhMWAAAAAElFTkSuQmCC);
|
157
|
+
}
|
158
|
+
}
|
metadata
ADDED
@@ -0,0 +1,55 @@
|
|
1
|
+
--- !ruby/object:Gem::Specification
|
2
|
+
name: add-to-homescreen-rails
|
3
|
+
version: !ruby/object:Gem::Version
|
4
|
+
version: '2.0'
|
5
|
+
prerelease:
|
6
|
+
platform: ruby
|
7
|
+
authors:
|
8
|
+
- RogerE
|
9
|
+
autorequire:
|
10
|
+
bindir: bin
|
11
|
+
cert_chain: []
|
12
|
+
date: 2012-10-20 00:00:00.000000000 Z
|
13
|
+
dependencies: []
|
14
|
+
description: Provides the 'Add to Home screen' assets for your Rails application.
|
15
|
+
email:
|
16
|
+
- roger@webfokus.no
|
17
|
+
executables: []
|
18
|
+
extensions: []
|
19
|
+
extra_rdoc_files: []
|
20
|
+
files:
|
21
|
+
- .gitignore
|
22
|
+
- Gemfile
|
23
|
+
- LICENSE.txt
|
24
|
+
- README.md
|
25
|
+
- Rakefile
|
26
|
+
- add-to-homescreen-rails.gemspec
|
27
|
+
- lib/add-to-homescreen-rails.rb
|
28
|
+
- lib/add-to-homescreen-rails/version.rb
|
29
|
+
- vendor/assets/javascripts/add2home.js
|
30
|
+
- vendor/assets/stylesheets/add2home.css
|
31
|
+
homepage: https://github.com/RogerE/add-to-homescreen-rails
|
32
|
+
licenses: []
|
33
|
+
post_install_message:
|
34
|
+
rdoc_options: []
|
35
|
+
require_paths:
|
36
|
+
- lib
|
37
|
+
required_ruby_version: !ruby/object:Gem::Requirement
|
38
|
+
none: false
|
39
|
+
requirements:
|
40
|
+
- - ! '>='
|
41
|
+
- !ruby/object:Gem::Version
|
42
|
+
version: '0'
|
43
|
+
required_rubygems_version: !ruby/object:Gem::Requirement
|
44
|
+
none: false
|
45
|
+
requirements:
|
46
|
+
- - ! '>='
|
47
|
+
- !ruby/object:Gem::Version
|
48
|
+
version: '0'
|
49
|
+
requirements: []
|
50
|
+
rubyforge_project:
|
51
|
+
rubygems_version: 1.8.24
|
52
|
+
signing_key:
|
53
|
+
specification_version: 3
|
54
|
+
summary: Use 'Add to Home screen' with Rails Asset Pipeline
|
55
|
+
test_files: []
|