parallax-rails 1.0.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +15 -0
- data/Gemfile +4 -0
- data/LICENSE.txt +22 -0
- data/README.md +1 -0
- data/Rakefile +2 -0
- data/app/assets/javascripts/jquery.parallax.js +498 -0
- data/app/assets/javascripts/jquery.parallax.min.js +1 -0
- data/app/assets/javascripts/parallax.js +495 -0
- data/app/assets/javascripts/parallax.min.js +1 -0
- data/app/assets/javascripts/requestAnimationFrame.js +34 -0
- data/app/assets/stylesheets/parallax-custom.css +134 -0
- data/lib/parallax-rails.rb +8 -0
- data/lib/parallax-rails/version.rb +5 -0
- data/parallax-rails.gemspec +23 -0
- metadata +85 -0
@@ -0,0 +1 @@
|
|
1
|
+
!function(t,i,e){"use strict";function s(t,i){this.element=t,this.layers=t.getElementsByClassName("layer");var e={calibrateX:this.data(this.element,"calibrate-x"),calibrateY:this.data(this.element,"calibrate-y"),invertX:this.data(this.element,"invert-x"),invertY:this.data(this.element,"invert-y"),limitX:this.data(this.element,"limit-x"),limitY:this.data(this.element,"limit-y"),scalarX:this.data(this.element,"scalar-x"),scalarY:this.data(this.element,"scalar-y"),frictionX:this.data(this.element,"friction-x"),frictionY:this.data(this.element,"friction-y"),originX:this.data(this.element,"origin-x"),originY:this.data(this.element,"origin-y")};for(var s in e)null===e[s]&&delete e[s];this.extend(this,r,i,e),this.calibrationTimer=null,this.calibrationFlag=!0,this.enabled=!1,this.depths=[],this.raf=null,this.bounds=null,this.ex=0,this.ey=0,this.ew=0,this.eh=0,this.ecx=0,this.ecy=0,this.erx=0,this.ery=0,this.cx=0,this.cy=0,this.ix=0,this.iy=0,this.mx=0,this.my=0,this.vx=0,this.vy=0,this.onMouseMove=this.onMouseMove.bind(this),this.onDeviceOrientation=this.onDeviceOrientation.bind(this),this.onOrientationTimer=this.onOrientationTimer.bind(this),this.onCalibrationTimer=this.onCalibrationTimer.bind(this),this.onAnimationFrame=this.onAnimationFrame.bind(this),this.onWindowResize=this.onWindowResize.bind(this),this.initialise()}var n="Parallax",o=30,r={relativeInput:!1,clipRelativeInput:!1,calibrationThreshold:100,calibrationDelay:500,supportDelay:500,calibrateX:!1,calibrateY:!0,invertX:!0,invertY:!0,limitX:!1,limitY:!1,scalarX:10,scalarY:10,frictionX:.1,frictionY:.1,originX:.5,originY:.5};s.prototype.extend=function(){if(arguments.length>1)for(var t=arguments[0],i=1,e=arguments.length;e>i;i++){var s=arguments[i];for(var n in s)t[n]=s[n]}},s.prototype.data=function(t,i){return this.deserialize(t.getAttribute("data-"+i))},s.prototype.deserialize=function(t){return"true"===t?!0:"false"===t?!1:"null"===t?null:!isNaN(parseFloat(t))&&isFinite(t)?parseFloat(t):t},s.prototype.camelCase=function(t){return t.replace(/-+(.)?/g,function(t,i){return i?i.toUpperCase():""})},s.prototype.transformSupport=function(s){for(var n=i.createElement("div"),o=!1,r=null,a=!1,h=null,l=null,p=0,c=this.vendors.length;c>p;p++)if(null!==this.vendors[p]?(h=this.vendors[p][0]+"transform",l=this.vendors[p][1]+"Transform"):(h="transform",l="transform"),n.style[l]!==e){o=!0;break}switch(s){case"2D":a=o;break;case"3D":if(o){var m=i.body||i.createElement("body"),u=i.documentElement,y=u.style.overflow;i.body||(u.style.overflow="hidden",u.appendChild(m),m.style.overflow="hidden",m.style.background=""),m.appendChild(n),n.style[l]="translate3d(1px,1px,1px)",r=t.getComputedStyle(n).getPropertyValue(h),a=r!==e&&r.length>0&&"none"!==r,u.style.overflow=y,m.removeChild(n)}}return a},s.prototype.ww=null,s.prototype.wh=null,s.prototype.wcx=null,s.prototype.wcy=null,s.prototype.wrx=null,s.prototype.wry=null,s.prototype.portrait=null,s.prototype.desktop=!navigator.userAgent.match(/(iPhone|iPod|iPad|Android|BlackBerry|BB10|mobi|tablet|opera mini|nexus 7)/i),s.prototype.vendors=[null,["-webkit-","webkit"],["-moz-","Moz"],["-o-","O"],["-ms-","ms"]],s.prototype.motionSupport=!!t.DeviceMotionEvent,s.prototype.orientationSupport=!!t.DeviceOrientationEvent,s.prototype.orientationStatus=0,s.prototype.transform2DSupport=s.prototype.transformSupport("2D"),s.prototype.transform3DSupport=s.prototype.transformSupport("3D"),s.prototype.propertyCache={},s.prototype.initialise=function(){this.transform3DSupport&&this.accelerate(this.element);var i=t.getComputedStyle(this.element);"static"===i.getPropertyValue("position")&&(this.element.style.position="relative"),this.updateLayers(),this.updateDimensions(),this.enable(),this.queueCalibration(this.calibrationDelay)},s.prototype.updateLayers=function(){this.layers=this.element.getElementsByClassName("layer"),this.depths=[];for(var t=0,i=this.layers.length;i>t;t++){var e=this.layers[t];this.transform3DSupport&&this.accelerate(e),e.style.position=t?"absolute":"relative",e.style.display="block",e.style.left=0,e.style.top=0,this.depths.push(this.data(e,"depth")||0)}},s.prototype.updateDimensions=function(){this.ww=t.innerWidth,this.wh=t.innerHeight,this.wcx=this.ww*this.originX,this.wcy=this.wh*this.originY,this.wrx=Math.max(this.wcx,this.ww-this.wcx),this.wry=Math.max(this.wcy,this.wh-this.wcy)},s.prototype.updateBounds=function(){this.bounds=this.element.getBoundingClientRect(),this.ex=this.bounds.left,this.ey=this.bounds.top,this.ew=this.bounds.width,this.eh=this.bounds.height,this.ecx=this.ew*this.originX,this.ecy=this.eh*this.originY,this.erx=Math.max(this.ecx,this.ew-this.ecx),this.ery=Math.max(this.ecy,this.eh-this.ecy)},s.prototype.queueCalibration=function(t){clearTimeout(this.calibrationTimer),this.calibrationTimer=setTimeout(this.onCalibrationTimer,t)},s.prototype.enable=function(){this.enabled||(this.enabled=!0,this.orientationSupport?(this.portrait=null,t.addEventListener("deviceorientation",this.onDeviceOrientation),setTimeout(this.onOrientationTimer,this.supportDelay)):(this.cx=0,this.cy=0,this.portrait=!1,t.addEventListener("mousemove",this.onMouseMove)),t.addEventListener("resize",this.onWindowResize),this.raf=requestAnimationFrame(this.onAnimationFrame))},s.prototype.disable=function(){this.enabled&&(this.enabled=!1,this.orientationSupport?t.removeEventListener("deviceorientation",this.onDeviceOrientation):t.removeEventListener("mousemove",this.onMouseMove),t.removeEventListener("resize",this.onWindowResize),cancelAnimationFrame(this.raf))},s.prototype.calibrate=function(t,i){this.calibrateX=t===e?this.calibrateX:t,this.calibrateY=i===e?this.calibrateY:i},s.prototype.invert=function(t,i){this.invertX=t===e?this.invertX:t,this.invertY=i===e?this.invertY:i},s.prototype.friction=function(t,i){this.frictionX=t===e?this.frictionX:t,this.frictionY=i===e?this.frictionY:i},s.prototype.scalar=function(t,i){this.scalarX=t===e?this.scalarX:t,this.scalarY=i===e?this.scalarY:i},s.prototype.limit=function(t,i){this.limitX=t===e?this.limitX:t,this.limitY=i===e?this.limitY:i},s.prototype.origin=function(t,i){this.originX=t===e?this.originX:t,this.originY=i===e?this.originY:i},s.prototype.clamp=function(t,i,e){return t=Math.max(t,i),t=Math.min(t,e)},s.prototype.css=function(t,i,s){var n=this.propertyCache[i];if(!n)for(var o=0,r=this.vendors.length;r>o;o++)if(n=null!==this.vendors[o]?this.camelCase(this.vendors[o][1]+"-"+i):i,t.style[n]!==e){this.propertyCache[i]=n;break}t.style[n]=s},s.prototype.accelerate=function(t){this.css(t,"transform","translate3d(0,0,0)"),this.css(t,"transform-style","preserve-3d"),this.css(t,"backface-visibility","hidden")},s.prototype.setPosition=function(t,i,e){i+="px",e+="px",this.transform3DSupport?this.css(t,"transform","translate3d("+i+","+e+",0)"):this.transform2DSupport?this.css(t,"transform","translate("+i+","+e+")"):(t.style.left=i,t.style.top=e)},s.prototype.onOrientationTimer=function(){this.orientationSupport&&0===this.orientationStatus&&(this.disable(),this.orientationSupport=!1,this.enable())},s.prototype.onCalibrationTimer=function(){this.calibrationFlag=!0},s.prototype.onWindowResize=function(){this.updateDimensions()},s.prototype.onAnimationFrame=function(){this.updateBounds();var t=this.ix-this.cx,i=this.iy-this.cy;(Math.abs(t)>this.calibrationThreshold||Math.abs(i)>this.calibrationThreshold)&&this.queueCalibration(0),this.portrait?(this.mx=this.calibrateX?i:this.iy,this.my=this.calibrateY?t:this.ix):(this.mx=this.calibrateX?t:this.ix,this.my=this.calibrateY?i:this.iy),this.mx*=this.ew*(this.scalarX/100),this.my*=this.eh*(this.scalarY/100),isNaN(parseFloat(this.limitX))||(this.mx=this.clamp(this.mx,-this.limitX,this.limitX)),isNaN(parseFloat(this.limitY))||(this.my=this.clamp(this.my,-this.limitY,this.limitY)),this.vx+=(this.mx-this.vx)*this.frictionX,this.vy+=(this.my-this.vy)*this.frictionY;for(var e=0,s=this.layers.length;s>e;e++){var n=this.layers[e],o=this.depths[e],r=this.vx*o*(this.invertX?-1:1),a=this.vy*o*(this.invertY?-1:1);this.setPosition(n,r,a)}this.raf=requestAnimationFrame(this.onAnimationFrame)},s.prototype.onDeviceOrientation=function(t){if(!this.desktop&&null!==t.beta&&null!==t.gamma){this.orientationStatus=1;var i=(t.beta||0)/o,e=(t.gamma||0)/o,s=this.wh>this.ww;this.portrait!==s&&(this.portrait=s,this.calibrationFlag=!0),this.calibrationFlag&&(this.calibrationFlag=!1,this.cx=i,this.cy=e),this.ix=i,this.iy=e}},s.prototype.onMouseMove=function(t){var i=t.clientX,e=t.clientY;!this.orientationSupport&&this.relativeInput?(this.clipRelativeInput&&(i=Math.max(i,this.ex),i=Math.min(i,this.ex+this.ew),e=Math.max(e,this.ey),e=Math.min(e,this.ey+this.eh)),this.ix=(i-this.ex-this.ecx)/this.erx,this.iy=(e-this.ey-this.ecy)/this.ery):(this.ix=(i-this.wcx)/this.wrx,this.iy=(e-this.wcy)/this.wry)},t[n]=s}(window,document),function(){for(var t=0,i=["ms","moz","webkit","o"],e=0;e<i.length&&!window.requestAnimationFrame;++e)window.requestAnimationFrame=window[i[e]+"RequestAnimationFrame"],window.cancelAnimationFrame=window[i[e]+"CancelAnimationFrame"]||window[i[e]+"CancelRequestAnimationFrame"];window.requestAnimationFrame||(window.requestAnimationFrame=function(i){var e=(new Date).getTime(),s=Math.max(0,16-(e-t)),n=window.setTimeout(function(){i(e+s)},s);return t=e+s,n}),window.cancelAnimationFrame||(window.cancelAnimationFrame=function(t){clearTimeout(t)})}();
|
@@ -0,0 +1,34 @@
|
|
1
|
+
/**
|
2
|
+
* Request Animation Frame Polyfill.
|
3
|
+
* @author Tino Zijdel
|
4
|
+
* @author Paul Irish
|
5
|
+
* @see https://gist.github.com/paulirish/1579671
|
6
|
+
*/
|
7
|
+
;(function() {
|
8
|
+
|
9
|
+
var lastTime = 0;
|
10
|
+
var vendors = ['ms', 'moz', 'webkit', 'o'];
|
11
|
+
|
12
|
+
for(var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) {
|
13
|
+
window.requestAnimationFrame = window[vendors[x]+'RequestAnimationFrame'];
|
14
|
+
window.cancelAnimationFrame = window[vendors[x]+'CancelAnimationFrame'] || window[vendors[x]+'CancelRequestAnimationFrame'];
|
15
|
+
}
|
16
|
+
|
17
|
+
if (!window.requestAnimationFrame) {
|
18
|
+
window.requestAnimationFrame = function(callback, element) {
|
19
|
+
var currTime = new Date().getTime();
|
20
|
+
var timeToCall = Math.max(0, 16 - (currTime - lastTime));
|
21
|
+
var id = window.setTimeout(function() { callback(currTime + timeToCall); },
|
22
|
+
timeToCall);
|
23
|
+
lastTime = currTime + timeToCall;
|
24
|
+
return id;
|
25
|
+
};
|
26
|
+
}
|
27
|
+
|
28
|
+
if (!window.cancelAnimationFrame) {
|
29
|
+
window.cancelAnimationFrame = function(id) {
|
30
|
+
clearTimeout(id);
|
31
|
+
};
|
32
|
+
}
|
33
|
+
|
34
|
+
}());
|
@@ -0,0 +1,134 @@
|
|
1
|
+
body {
|
2
|
+
font-family: monospace;
|
3
|
+
font-size: 18px;
|
4
|
+
background: #111;
|
5
|
+
color: #666;
|
6
|
+
margin: 0;
|
7
|
+
}
|
8
|
+
|
9
|
+
img {
|
10
|
+
display: block;
|
11
|
+
width: 100%;
|
12
|
+
}
|
13
|
+
|
14
|
+
input[type=checkbox] {
|
15
|
+
display: none;
|
16
|
+
}
|
17
|
+
|
18
|
+
label {
|
19
|
+
display: inline-block;
|
20
|
+
margin-right: 1em;
|
21
|
+
padding: 0.4em 0;
|
22
|
+
cursor: pointer;
|
23
|
+
}
|
24
|
+
|
25
|
+
button {
|
26
|
+
border: 10px solid #00FFAA;
|
27
|
+
font-family: monospace;
|
28
|
+
position: absolute;
|
29
|
+
line-height: 60px;
|
30
|
+
text-align: right;
|
31
|
+
padding: 0 1.2em;
|
32
|
+
background: #444;
|
33
|
+
font-size: 24px;
|
34
|
+
cursor: pointer;
|
35
|
+
display: block;
|
36
|
+
outline: none;
|
37
|
+
height: 80px;
|
38
|
+
width: 80%;
|
39
|
+
top: 260px;
|
40
|
+
margin: 0;
|
41
|
+
left: 10%;
|
42
|
+
}
|
43
|
+
|
44
|
+
button:hover {
|
45
|
+
background: #00FFAA;
|
46
|
+
}
|
47
|
+
|
48
|
+
input[type=checkbox] + label:before {
|
49
|
+
display: inline-block;
|
50
|
+
position: relative;
|
51
|
+
background: #444;
|
52
|
+
margin-right: 8px;
|
53
|
+
content: "";
|
54
|
+
height: 16px;
|
55
|
+
width: 16px;
|
56
|
+
top: 1px;
|
57
|
+
}
|
58
|
+
|
59
|
+
input[type=checkbox]:checked + label:before {
|
60
|
+
background: #00FFAA;
|
61
|
+
}
|
62
|
+
|
63
|
+
.container {
|
64
|
+
position: relative;
|
65
|
+
max-width: 600px;
|
66
|
+
margin: 0 auto;
|
67
|
+
padding: 5%;
|
68
|
+
}
|
69
|
+
|
70
|
+
.scene {
|
71
|
+
padding: 0;
|
72
|
+
margin: 0;
|
73
|
+
}
|
74
|
+
|
75
|
+
.fill {
|
76
|
+
position: absolute;
|
77
|
+
bottom: 5%;
|
78
|
+
right: 5%;
|
79
|
+
left: 5%;
|
80
|
+
top: 5%;
|
81
|
+
}
|
82
|
+
|
83
|
+
.expand-width {
|
84
|
+
width: 100%;
|
85
|
+
}
|
86
|
+
|
87
|
+
.border {
|
88
|
+
border: 2px dashed #00FFAA;
|
89
|
+
}
|
90
|
+
|
91
|
+
.aspect {
|
92
|
+
opacity: 0.2;
|
93
|
+
}
|
94
|
+
|
95
|
+
.layer:nth-child(1) {
|
96
|
+
opacity: 0.15;
|
97
|
+
}
|
98
|
+
.layer:nth-child(1) button {
|
99
|
+
-webkit-transform: rotate(150deg);
|
100
|
+
}
|
101
|
+
|
102
|
+
.layer:nth-child(2) {
|
103
|
+
opacity: 0.30;
|
104
|
+
}
|
105
|
+
.layer:nth-child(2) button {
|
106
|
+
-webkit-transform: rotate(120deg);
|
107
|
+
}
|
108
|
+
|
109
|
+
.layer:nth-child(3) {
|
110
|
+
opacity: 0.45;
|
111
|
+
}
|
112
|
+
.layer:nth-child(3) button {
|
113
|
+
-webkit-transform: rotate(90deg);
|
114
|
+
}
|
115
|
+
|
116
|
+
.layer:nth-child(4) {
|
117
|
+
opacity: 0.60;
|
118
|
+
}
|
119
|
+
.layer:nth-child(4) button {
|
120
|
+
-webkit-transform: rotate(60deg);
|
121
|
+
}
|
122
|
+
|
123
|
+
.layer:nth-child(5) {
|
124
|
+
opacity: 0.75;
|
125
|
+
}
|
126
|
+
.layer:nth-child(5) button {
|
127
|
+
-webkit-transform: rotate(30deg);
|
128
|
+
}
|
129
|
+
|
130
|
+
.layer:nth-child(6) {
|
131
|
+
opacity: 0.90;
|
132
|
+
}
|
133
|
+
.layer:nth-child(6) button {
|
134
|
+
}
|
@@ -0,0 +1,23 @@
|
|
1
|
+
# coding: utf-8
|
2
|
+
lib = File.expand_path('../lib', __FILE__)
|
3
|
+
$LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib)
|
4
|
+
require 'parallax-rails/version'
|
5
|
+
|
6
|
+
Gem::Specification.new do |spec|
|
7
|
+
spec.name = "parallax-rails"
|
8
|
+
spec.version = Parallax::Rails::VERSION
|
9
|
+
spec.authors = ["TwoWeb"]
|
10
|
+
spec.email = ["dev@twoweb.com.br"]
|
11
|
+
spec.summary = "gem for parallax.js"
|
12
|
+
spec.description = "parallax.js for rails"
|
13
|
+
spec.homepage = "https://github.com/twoweb/parallax-rails"
|
14
|
+
spec.license = "MIT"
|
15
|
+
|
16
|
+
spec.files = `git ls-files -z`.split("\x0")
|
17
|
+
spec.executables = spec.files.grep(%r{^bin/}) { |f| File.basename(f) }
|
18
|
+
spec.test_files = spec.files.grep(%r{^(test|spec|features)/})
|
19
|
+
spec.require_paths = ["lib"]
|
20
|
+
|
21
|
+
spec.add_development_dependency "bundler", "~> 1.7"
|
22
|
+
spec.add_development_dependency "rake", "~> 10.0"
|
23
|
+
end
|
metadata
ADDED
@@ -0,0 +1,85 @@
|
|
1
|
+
--- !ruby/object:Gem::Specification
|
2
|
+
name: parallax-rails
|
3
|
+
version: !ruby/object:Gem::Version
|
4
|
+
version: 1.0.0
|
5
|
+
platform: ruby
|
6
|
+
authors:
|
7
|
+
- TwoWeb
|
8
|
+
autorequire:
|
9
|
+
bindir: bin
|
10
|
+
cert_chain: []
|
11
|
+
date: 2015-04-15 00:00:00.000000000 Z
|
12
|
+
dependencies:
|
13
|
+
- !ruby/object:Gem::Dependency
|
14
|
+
name: bundler
|
15
|
+
requirement: !ruby/object:Gem::Requirement
|
16
|
+
requirements:
|
17
|
+
- - ~>
|
18
|
+
- !ruby/object:Gem::Version
|
19
|
+
version: '1.7'
|
20
|
+
type: :development
|
21
|
+
prerelease: false
|
22
|
+
version_requirements: !ruby/object:Gem::Requirement
|
23
|
+
requirements:
|
24
|
+
- - ~>
|
25
|
+
- !ruby/object:Gem::Version
|
26
|
+
version: '1.7'
|
27
|
+
- !ruby/object:Gem::Dependency
|
28
|
+
name: rake
|
29
|
+
requirement: !ruby/object:Gem::Requirement
|
30
|
+
requirements:
|
31
|
+
- - ~>
|
32
|
+
- !ruby/object:Gem::Version
|
33
|
+
version: '10.0'
|
34
|
+
type: :development
|
35
|
+
prerelease: false
|
36
|
+
version_requirements: !ruby/object:Gem::Requirement
|
37
|
+
requirements:
|
38
|
+
- - ~>
|
39
|
+
- !ruby/object:Gem::Version
|
40
|
+
version: '10.0'
|
41
|
+
description: parallax.js for rails
|
42
|
+
email:
|
43
|
+
- dev@twoweb.com.br
|
44
|
+
executables: []
|
45
|
+
extensions: []
|
46
|
+
extra_rdoc_files: []
|
47
|
+
files:
|
48
|
+
- Gemfile
|
49
|
+
- LICENSE.txt
|
50
|
+
- README.md
|
51
|
+
- Rakefile
|
52
|
+
- app/assets/javascripts/jquery.parallax.js
|
53
|
+
- app/assets/javascripts/jquery.parallax.min.js
|
54
|
+
- app/assets/javascripts/parallax.js
|
55
|
+
- app/assets/javascripts/parallax.min.js
|
56
|
+
- app/assets/javascripts/requestAnimationFrame.js
|
57
|
+
- app/assets/stylesheets/parallax-custom.css
|
58
|
+
- lib/parallax-rails.rb
|
59
|
+
- lib/parallax-rails/version.rb
|
60
|
+
- parallax-rails.gemspec
|
61
|
+
homepage: https://github.com/twoweb/parallax-rails
|
62
|
+
licenses:
|
63
|
+
- MIT
|
64
|
+
metadata: {}
|
65
|
+
post_install_message:
|
66
|
+
rdoc_options: []
|
67
|
+
require_paths:
|
68
|
+
- lib
|
69
|
+
required_ruby_version: !ruby/object:Gem::Requirement
|
70
|
+
requirements:
|
71
|
+
- - ! '>='
|
72
|
+
- !ruby/object:Gem::Version
|
73
|
+
version: '0'
|
74
|
+
required_rubygems_version: !ruby/object:Gem::Requirement
|
75
|
+
requirements:
|
76
|
+
- - ! '>='
|
77
|
+
- !ruby/object:Gem::Version
|
78
|
+
version: '0'
|
79
|
+
requirements: []
|
80
|
+
rubyforge_project:
|
81
|
+
rubygems_version: 2.0.0.rc.2
|
82
|
+
signing_key:
|
83
|
+
specification_version: 4
|
84
|
+
summary: gem for parallax.js
|
85
|
+
test_files: []
|