hq/sakrecoer-mother-web
hq/sakrecoer-mother-web
4
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity

Initial commit with current state + bundled

Browse source
This commit is contained in:
Set Hallstrom 2019-04-24 17:18:35 +02:00
parent 1b057a5554
commit de10aad814
187 changed files with 6831 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

570
about/about.css Normal file
View file

@ -0,0 +1,570 @@
---
---
{% include base.html %}
{% include normalize.css %}
/*! sakrecoer sheet */
@font-face {
font-family: futura;
src: url('{{ base }}/assets/fonts/free_avantgarde.woff');
}
@font-face {
font-family: futurabold;
src: url('{{ base }}/assets/fonts/free_avantgardeBOLD.woff');
}
html{
-webkit-transition:.5s background;
transition:.5s background;
font-family: futura,sans-serif;
}
body{
background: #fff no-repeat; background-size:cover; background-attachment: fixed;
margin:0;
font-family: futura,sans-serif;
color: #0ff;
}
h1,
h2,
h3,
h4 {
font-family: futurabold; text-transform: uppercase;
}
p {
font-family: futura;
}
b,
strong {
font-family: futurabold;
}
a:link,
a:visited,
a:hover,
a:active,
a:focus {
text-decoration: underline;
-webkit-transition:.6s background;
transition:.6s background
}
a,
a:link,
a:visited {
color: #fff;
-webkit-transition-property: hover;
-webkit-transition: color 0.15s ease-in-out;
-moz-transition: color 0.15s linear 0s; /* firefox 4 */
-o-transition-property: color; /* opera 10.5 */
-o-transition-duration: 0.15s;
}
a:hover {
color: #0ff;
}
a:active {
color: #f00;
}
#navigation {
position: fixed; bottom: 0; left: 0; z-index: 1000;
width: 250px; height: 85%; padding: 10px;
background-color: rgba(0,0,0,.4);
text-align: center;
border-radius: 0 100% 0 0;
opacity: .33;
-webkit-transition-property: hover;
-webkit-transition: opacity 0.7s ease-in-out;
-moz-transition: opacity 0.7s linear 0s; /* firefox 4 */
-o-transition-property: opacity; /* opera 10.5 */
-o-transition-duration: 0.7s;
}
#navigation:hover {
opacity: 1;
z-index: 10;
}
/* content */
#content{
position: absolute; top: 140px; left: 20px;
width: 66%; margin: 0 0 0 300px; padding: 10px;
box-shadow:2px 2px 10px #000;
background: rgba(0, 0, 0, 0.25);
border-radius: 4px;
}
td {
vertical-align: top;
}
hr {
border: 1px solid #000;
height: 1px;
}
/* Fullscreen Background image */
.image-fullscreen,
.image-fullscreen .mask {
background-size: cover;
background-repeat: no-repeat;
position:fixed;
left:0px;
top:0px;
right:0px;
bottom:0px;
z-index: -1;
}
body, div, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, img, form, fieldset, input, textarea, blockquote {
margin: 0; padding: 0; border: 0;
font: 18px/30px futura, "Helvetica Neue", Helvetica, Arial;
}
body {
font: 18px/30px futura, "Helvetica Neue", Helvetica, Arial;
color: #000;
text-shadow: 0px 0px 10px #0ff;
}
a {
color: #fff; text-decoration: none; font-weight: bold;
}
img {
border-radius: 7px;
}
section {
overflow-x: hidden; height: 993px;
}
#intro {
background: #000 url(images/pusset-bg.jpg) left no-repeat;
background-size: contain;
color: #fff;
}
#intro h1 {
width: 858px; height: 161px;
background: url(images/intro-title.png); text-indent: -9999px;
position: relative; top: 145px; left: 200px;
}
#intro p {
position: relative; top: 200px; left: 285px;
width: 650px; margin: 0 0 30px 0;
}
#intro p:nth-child(2) {
font-weight: bold;
}
#reset {
background: #000 url(images/resetbg.jpg) no-repeat center;
background-size: contain;
position: relative;
}
#reset h2 {
width: 432px; height: 310px;
background: url(images/reset-title.png); text-indent: -9999px;
position: relative; top: 87px; left: 90px;
}
#reset-photo {
position: absolute; top: 70px; left: 650px;
}
#reset p {
position: relative; top: 130px; left: 93px;
width: 530px; margin: 0 0 30px 0;
color: #fff;
text-shadow: 0px 0px 20px #f00;
}
#reset a {
color: #fff; text-decoration: none; font-weight: bold;
}
#reset .btn a {
display: block;
padding: 50px;
background-color: #0ff;
box-shadow: 0 0 20px #0ff;
border-radius: 7px;
-webkit-transition-property: hover;
-webkit-transition: background-color 0.25s ease-in-out;
-moz-transition: background-color 0.25s linear 0s; /* firefox 4 */
-o-transition-property: background-color; /* opera 10.5 */
-o-transition-duration: 0.25s;
font-size: 48px;
color: #f00;
text-align:center;
}
#reset .btn a:hover {
background-color: #f00;
color: #0ff;
}
#reset img {
border-radius: 7px;
box-shadow: 0 0 40px #f00;
}
#simio {
background: #000 url(images/simio_bg.jpg) no-repeat center;
background-size: contain;
position: relative;
}
#simio h2 {
width: 635px; height: 208px;
background: url(images/simio-title.png) top left; text-indent: -9999px;
position: relative; top: 87px; left: 90px;
}
#simio-photo {
position: absolute; left: 410px; top: 300px;
transform: rotate(0deg);
-moz-transform: rotate(0deg);
}
#simio p {
position: relative; top: 145px; left: 90px;
width: 300px; margin: 0 0 30px 0;
color: #fff;
font-weight: bold;
text-shadow: 0px 0px 20px #0269e3;
}
#simio a {
color: #fff; text-decoration: none; font-weight: bold;
}
#simio img {
border-radius: 7px;
box-shadow: 0 0 40px #0269e3;
}
#simio a.btn {
position: absolute; width: 500px; top: 610px; right: 10px;
display: block;
padding: 50px;
background-color: #f00;
box-shadow: 0 0 20px #0269e3;
border-radius: 7px;
-webkit-transition-property: hover;
-webkit-transition: background-color 0.25s ease-in-out;
-moz-transition: background-color 0.25s linear 0s; /* firefox 4 */
-o-transition-property: background-color; /* opera 10.5 */
-o-transition-duration: 0.25s;
font-size: 48px;
color: #fff;
text-align:center;
}
#simio a.btn:hover {
background-color: #0269e3;
color: #f00;
}
#pusset {
background: #000 url(images/intro-bg.jpg) no-repeat center;
background-size: contain;
}
#pusset h2 {
width: 513px; height: 324px;
background: url(images/pusset-title.png); text-indent: -9999px;
position: relative; top: 70px; left: 90px;
}
#pusset p {
position: relative; top: 100px; left: 100px;
width: 500px;
color: #f00;
background-color: #000;
text-shadow: 0px 0px 20px #0ff;
}
#pusset a {
color: #fff; text-decoration: none; font-weight: bold;
}
#pusset a.btn {
position: absolute; width: 500px; top: 700px; right: 10px;
display: block;
padding: 50px;
background-color: #f00;
box-shadow: 0 0 20px #f00;
border-radius: 7px;
-webkit-transition-property: hover;
-webkit-transition: background-color 0.25s ease-in-out;
-moz-transition: background-color 0.25s linear 0s; /* firefox 4 */
-o-transition-property: background-color; /* opera 10.5 */
-o-transition-duration: 0.25s;
font-size: 48px;
color: #fff;
text-align:center;
}
#pusset a.btn:hover {
background-color: #0ff;
color: #fff;
box-shadow: 0 0 20px #0ff;
}
#sakrecoer {
background: #0ff url(images/sakrecoerLIVE.png);
position: relative;
text-shadow: 0px 0px 10px #f00;
color: #fff;
}
#sakrecoer h2 {
width: 900px; height: 147px;
background: url(images/intro-title.png); text-indent: -9999px;
position: relative; top: 90px; left: 85px;
}
#sakrecoer p {
position: relative; top: 120px; left: 90px;
width: 720px;
}
#sakrecoer ul li {
float: left; box-shadow: 0 0 20px rgba(0,0,0,0.5); line-height: 0;
position: absolute; list-style: none;
}
#sakrecoer ul li:nth-child(1) {
top: 640px; left: 50px;
transform: rotate(10deg);
-moz-transform: rotate(10deg);
-webkit-transform: rotate(10deg);
z-index: 1;
}
#sakrecoer ul li:nth-child(2) {
top: 550px; left: 320px;
transform: rotate(-5deg);
-moz-transform: rotate(-5deg);
-webkit-transform: rotate(-5deg);
z-index: 3;
}
#sakrecoer ul li:nth-child(3) {
top: 680px; left: 520px;
transform: rotate(-2deg);
-moz-transform: rotate(-2deg);
-webkit-transform: rotate(-2deg);
z-index: 2;
}
#sakrecoer ul li:nth-child(4) {
top: 550px; left: 810px;
transform: rotate(7deg);
-moz-transform: rotate(7deg);
-webkit-transform: rotate(7deg);
z-index: 1;
}
#sakrecoer ul li:nth-child(5) {
top: 630px; left: 940px;
transform: rotate(-7deg);
-moz-transform: rotate(-7deg);
-webkit-transform: rotate(-7deg);
z-index: 2;
}
#sakrecoer ul li:nth-child(6) {
top: 678px; left: 1230px;
transform: rotate(-2deg);
-moz-transform: rotate(-2deg);
-webkit-transform: rotate(-2deg);
z-index: 1;
}
#sakrecoer img {
box-shadow: 0 0 10px #f00;
}
#final {
background: #0fc url(images/last-bg.jpg);
background-size: contain;
}
#final h2 {
width: 672px; height: 358px;
background: url(images/final-title.png); text-indent: -9999px;
position: relative; top: 87px; left: 90px;
}
#final p {
position: relative; top: 130px; left: 115px;
width: 672px;
color: #fff;
}
#final p.credits {
font-size: 12px;
position: absolute; top: 950px; left: 115px;
color: #000;
text-shadow: none;
width: 872px;
}
html{
height: 100%;
overflow-x: hidden;
}
.curtains{
width: 100%;
z-index:1;
position:relative;
}
.curtains>li{
background: black;
display:block;
top: 0;
left: 0;
width: 100%;
min-height: 100%;
overflow: hidden;
z-index:1;
}
.curtains>li.hidden{display:none;}
.curtains>li:first-child{z-index:2;}
#nav {
position: fixed;
bottom: -10px; left: 7px;
font-size: 12px;
padding: 0 0 0 0;
z-index: 10000;
text-transform: uppercase;
}
#nav li {
float: left;
position: relative;
list-style: none;
z-index: 10000;
}
/* main level link */
#nav a {
font-weight: bold;
color: #fff;
text-decoration: none;
display: block;
width:250px;
text-shadow: none;
}
#nav a:hover {
color: #0ff;
text-shadow: none;
}
/* main level link hover */
#nav .current a, #nav li:hover > a {
color: #fff;
text-shadow: none;
}
/* sub levels link hover */
#nav ul li:hover a, #nav li:hover li a {
background: rgba(255,0,0,1);
border: none;
color: #fff;
margin: 0;
padding: 0px 0px;
border-radius: 0px;
text-shadow: none;
}
#nav ul a:hover {
color: #0ff !important;
text-shadow: none;
}
/* dropdown */
#nav li:hover > ul {
display: block;
}
/* level 2 list */
#nav ul {
display: none;
margin: 0;
padding: 0;
position: absolute;
bottom: 25px;
left: 0;
border: none;
}
#nav ul li {
float: none;
margin: 0;
padding: 0;
}
#nav ul a {
font-weight: normal;
text-shadow: none;
}
/* level 3+ list */
#nav ul ul {
left: 250px;
bottom: 0;
}
/* clearfix */
#nav:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
#nav {
display: inline-block;
}
html[xmlns] #nav {
display: block;
}
* html #nav {
height: 18px;
}
#music_nav:hover{
background-color: rgba(255, 0, 24, 0.3);
}
#music_nav_sub:hover{
background-color: rgba(255, 0, 24, 0.3);
}
#about_nav:hover{
background-color: rgba(153, 255, 0, 0.3);
}
#log_nav:hover{
background-color: rgba(0, 255, 229, 0.3);
}
#log_nav_sub:hover{
background-color: rgba(0, 255, 229, 0.3);
}
#discog_nav:hover{
background-color: rgba(102, 0, 255, 0.3);
}
#links_nav:hover{
background-color: rgba(0, 0, 0, 0.3);
}

BIN
about/free_avantgarde.woff Normal file
View file

Binary file not shown.

BIN
about/free_avantgardeBOLD.woff Normal file
View file

Binary file not shown.

BIN
about/images/cs-vid-1.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 24 KiB

BIN
about/images/cs-vid-2.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 18 KiB

BIN
about/images/cs-vid-3.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 33 KiB

BIN
about/images/cs-vid-4.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 15 KiB

BIN
about/images/cs-vid-5.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 41 KiB

BIN
about/images/cs-vid-6.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 18 KiB

BIN
about/images/final-title.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 15 KiB

BIN
about/images/intro-bg.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 161 KiB

BIN
about/images/intro-title.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 13 KiB

BIN
about/images/last-bg.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 97 KiB

BIN
about/images/live_original.gif Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 1.3 MiB

BIN
about/images/micro_logo.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 245 B

BIN
about/images/micro_logo2.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 255 B

BIN
about/images/pusset-bg.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 144 KiB

BIN
about/images/pusset-title.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 37 KiB

BIN
about/images/reset-title.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 56 KiB

BIN
about/images/resetbg.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 271 KiB

BIN
about/images/sakrecoer-title.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 14 KiB

BIN
about/images/sakrecoerLIVE.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 741 KiB

BIN
about/images/simio-photo.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 32 KiB

BIN
about/images/simio-title.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 35 KiB

BIN
about/images/simio_bg.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 399 KiB

104
about/index.html Normal file
View file

@ -0,0 +1,104 @@
---
---
<!DOCTYPE html>
<html>
<head>
{% include base.html %}
<title>About The Sakrecoer Family</title>
<meta charset="utf-8" />
<meta name='robots' content='index'/>
<meta name="description" content="Sakrecoer Uncorporated Stands for fun loving activism, art and music. It is a spiritually and schizophrenically extended family, pushing music, visuals, thoughts and passion">
<meta name="keywords" content="About, Sakrecoer, reSet, Simio, Agga, Bizar, Fo0bar, Hallstr&ouml; pusSet, 7ainsi, Alej, Beast, DL, Dr.Strangelove, FoObar, France Claudois, Gopher, H&auml;ck, Ites, Jack The Cutter, Kapten F&auml;rg Af Ola, Oktavio Tubo, Papi Crapi, Rho, Rouge, Random Radio Jack, Robbin, Seven, Sept, Sofie, Tes, Tikov, Ville,">
<link rel="shortcut icon" href="{{ base }}/assets/img/favicon.ico" type="image/vnd.microsoft.icon" />
<link href="about.css" rel="stylesheet" />
<script src="js/jquery-1.8.2.min.js"></script>
<script src="js/curtain.js"></script>
<script src="js/jquery.scrollorama.js"></script>
<script src="js/scripts.js"></script>
</head>
<body>
<ul class="curtains">
<li>
<section id="intro">
<a href="{{ base }}/"><h1>About Sakrecoer Uncorporated</h1></a>
<p><b>Sakrecoer Uncorporated</b> Stands for independent fun-loving Activism, Art &amp; Music. I am a 1980 born robot. If <a href="https://en.wikipedia.org/wiki/Monica_Zetterlund" target="_blank">Monica Zetterlund</a> was a cyberpunk making electronic music, I would probably be Her. The red thread in my music is African. Vocals, manually operated groove-boxes, bass and lots of rhythmics are populating my colorful soundscapes that often get associated to the the pop-culture. I aim for questions rather than answers and at pushing <i>your</i> creativity. I move by feet in the streets and value my integrity.</p>
<p>My 2016 motto is to record live versions of sexy beats i do right away and post them everywhere. This way I'm hoping to help people keep focused on making love rather than fu*king eachother up. In the midst of 2077, I hope to have a number of songs worth flying to venus with. Then I'll make them sound even nicer, but most likeley just do better new ones or save the world.</p>
<p>I go by many aliases that you will find if you scroll down this page.</p>
<p style="font-size:9px">This website was deisgned and executed by <a href="http://set.hallstrom.ch" target="_blank">me</a> On these pages I push sounds, images, thoughts and passion for cool robots like you, thanks to the good Alsenet.com people and the Helevtico-Russian Linux Lovers Circle.</p>
</section>
</li>
<li>
<section id="reset">
<h2>reSet Sakrecoer</h2>
<img src="images/live_original.gif" alt="reSet Sakrecoer Live In Barcelona" id="reset-photo" />
<p>Electronic Pop, croonerism, and happy-joy</p>
<p class="btn"><a href="mailto:info@basspistol.com?subject=Booking for reSet">Book reSet</a></p>
</section>
</li>
<li>
<section id="simio">
<h2>Simio Sakrecoer</h2>
<img src="images/simio-photo.jpg" alt="Visit Line25" id="simio-photo" />
<p>Black Magic, Rave, Cyberpunk</p>
<a class="btn" href="mailto:info@basspistol.com?subject=Booking for Simio">Book Simio</a>
</section>
</li>
<li>
<section id="pusset">
<h2>pusSet Sakrecoer</h2>
<p style="padding:0 5px 5px 5px;">House, Groove, Sex-appeal</p>
<a class="btn" href="mailto:info@basspistol.com?subject=Booking for pusSet">Book pusset</a>
</section>
</li>
<li>
<section id="sakrecoer">
<h2>Sakrecoer</h2>
<p style="background-color:rgba(0,0,0,.9);padding:7px;">The past gig list is to longtimes and for forgotten times! Recieved with enthusiasm by several venues, big and small such as: <br /><br />
Apolo Nitsa - Barcelona<br />
Dachkantine - Z&uuml;rich<br />
Center Of Contemporary Art - Geneva<br />
Alcazar - Stockholm<br />
Microdisco Festival - Berlin<br />
Button Factory - Dublin<br />
<br />
And many many other really really nice ones :) delivering good mood, beat, base and bass! </p>
<ul>
<li><img src="images/cs-vid-1.jpg" alt="" /></li>
<li><img src="images/cs-vid-2.jpg" alt="" /></li>
<li><img src="images/cs-vid-3.jpg" alt="" /></li>
<li><img src="images/cs-vid-4.jpg" alt="" /></li>
<li><img src="images/cs-vid-5.jpg" alt="" /></li>
<li><img src="images/cs-vid-6.jpg" alt="" /></li>
</ul>
</section>
</li>
</ul>
<ul id="nav">
<li><a href="{{ base }}/"><img src="{{ base }}/assets/img/sakrecoerLOGO.png" width="125px" height="125px" title="HOME" /></a></li>
</ul>
</body>
</html>

540
about/js/curtain.js Normal file
View file

@ -0,0 +1,540 @@
/*
* Curtain.js - Create an unique page transitioning system
* ---
* Version: 1.4.1
* Copyright 2011, Victor Coulon (http://victorcoulon.fr)
* Released under the MIT Licence
*/
(function ( $, window, document, undefined ) {
var pluginName = 'curtain',
defaults = {
scrollSpeed: 400,
bodyHeight: 0,
linksArray: [],
mobile: false,
scrollButtons: {},
controls: null,
curtainLinks: '.curtain-links',
enableKeys: true,
easing: 'swing',
nextSlide: null,
prevSlide: null
};
// The actual plugin constructor
function Plugin( element, options ) {
var self = this;
// Public attributes
this.element = element;
this.options = $.extend( {}, defaults, options) ;
this._defaults = defaults;
this._name = pluginName;
this._ignoreHashChange = false;
this.init();
// Public Functions
this.insert = function(content){
if(Object.prototype.toString.call(content) !== '[object Object]') {
throw new TypeError('Content must be an object');
}
content.goTo = (content.goTo === true) ? true : false;
// append the content to list
var newEl = $(document.createElement('li')).attr('id', (content.htmlId) ? content.htmlId : null)
.attr('class', (content.htmlClass) ? content.htmlClass : null)
.html( (content.html) ? content.html : null );
$(self.element).append(newEl);
// Append Content after an element OR at the end
if(content.insertAfter && $(content.insertAfter).length) {
$(self.element).find(content.insertAfter).after(newEl);
} else {
$(self.element).append(newEl);
}
// When the element is ready
self.readyElement($(newEl), function(){
// re(init) cache elements
self.$element = $(self.element);
self.$li = $(self.element).find('>li');
// Mobile Fix
if(self.options.mobile){
self.$li.css({position:'relative'});
self.$element.find('.fixed').css({position:'absolute'});
}
self.setLinks();
// Set dimensions after loading images (or not)
if($(newEl).find('img').length){
$(newEl).find('img').load(function(){
self.setDimensions();
});
} else {
self.setDimensions();
}
// Scroll to the new element
if(content.goTo === true){
var position = $(newEl).attr('data-position') || null;
self.scrollEl.animate({
scrollTop:position
}, self.options.scrollSpeed, self.options.easing);
}
});
};
}
Plugin.prototype = {
init: function () {
var self = this;
// Cache element
this.$element = $(this.element);
this.$li = $(this.element).find('>li');
$.Android = (navigator.userAgent.match(/Android/i));
$.iPhone = ((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i)));
$.iPad = ((navigator.userAgent.match(/iPad/i)));
$.iOs4 = (/OS [1-4]_[0-9_]+ like Mac OS X/i.test(navigator.userAgent));
if($.iPhone || $.iPad || $.Android){
this.options.mobile = true;
this.$li.css({position:'relative'});
this.$element.find('.fixed').css({position:'absolute'});
}
if(this.options.mobile){
this.scrollEl = this.$element;
} else if($.browser.mozilla || $.browser.msie) {
this.scrollEl = $('html');
} else {
this.scrollEl = $('body');
}
if(self.options.controls){
self.options.scrollButtons['up'] = $(self.options.controls).find('[href="#up"]');
self.options.scrollButtons['down'] = $(self.options.controls).find('[href="#down"]');
if(!$.iOs4 && ($.iPhone || $.iPad)){
self.$element.css({
position:'fixed',
top:0,
left:0,
right:0,
bottom:0,
'-webkit-overflow-scrolling':'touch',
overflow:'auto'
});
$(self.options.controls).css({position:'absolute'});
}
}
// We'll check if our images are loaded
var images = [],
imagesLoaded = 0,
loadAllImages = function loadAllImages(callback){
if(images.length === 0){
callback();
return false;
}
var img = new Image();
$(img).attr('src',images[imagesLoaded]).load(function(){
imagesLoaded++;
if(imagesLoaded == images.length)
callback();
else
loadAllImages(callback);
});
};
self.$element.find('img').each(function(i,el){
images.push(el.src);
});
// When all image is loaded
loadAllImages(function(){
self.setDimensions();
self.$li.eq(0).addClass('current');
// Cache
self.$current = self.$element.find('.current');
self.$fixed = self.$current.find('.fixed');
self.$step = self.$current.find('.step');
self.currentP = parseInt(self.$current.attr('data-position'), 10);
self.currentHeight = parseInt(self.$current.attr('data-height'), 10);
if(!self.options.mobile){
if(self.$li.eq(1).length)
self.$li.eq(1).nextAll().css({display:'none'});
}
self.setEvents();
self.setLinks();
self.isHashIsOnList(location.hash.substring(1));
});
},
// Events
scrollToPosition: function (direction){
var position = null,
self = this;
if($('html, body').is(':animated')){
return false;
}
if(direction === 'up' || direction == 'down'){
// Keyboard event
var $current = this.$element.find('.current'),
$next = (direction === 'up') ? $current.prev() : $current.next();
position = $next.attr('data-position') || null;
// Step in the current panel ?
if($current.find('.step').length){
if(!$current.find('.current-step').length)
$current.find('.step').eq(0).addClass('current-step');
var $nextStep = (direction === 'up') ? $current.find('.current-step').prev('.step') : $current.find('.current-step').next('.step');
if($nextStep.length) {
position = (this.options.mobile) ? $nextStep.position().top + parseInt($current.attr('data-position'), 10) : $nextStep.offset().top;
}
}
if(position){
self.scrollEl.animate({
scrollTop:position
}, this.options.scrollSpeed, this.options.easing);
}
} else if(direction === 'top'){
self.scrollEl.animate({
scrollTop:0
}, self.options.scrollSpeed, self.options.easing);
} else if(direction === 'bottom'){
self.scrollEl.animate({
scrollTop:self.options.bodyHeight
}, self.options.scrollSpeed, self.options.easing);
} else {
position = $("#"+direction).attr('data-position') || null;
if(position){
self.scrollEl.animate({
scrollTop:position
}, this.options.scrollSpeed, this.options.easing);
}
}
},
scrollEvent: function() {
var self = this,
docTop = $(document).scrollTop(),
windowHeight = $(window).height();
if(docTop < self.currentP && self.$current.index() > 0){
if (self.options.prevSlide) {
self.options.prevSlide();
}
// Scroll top
self._ignoreHashChange = true;
if(self.$current.prev().attr('id'))
self.setHash(self.$current.prev().attr('id'));
self.$current.removeClass('current').css({marginTop: 0})
.nextAll().css({display:'none'}).end()
.prev().addClass('current').css({display:'block'});
// Cache
self.$current = self.$element.find('.current');
self.$fixed = self.$current.find('.fixed');
self.$step = self.$current.find('.step');
self.currentP = parseInt(self.$current.attr('data-position'), 10);
self.currentHeight = parseInt(self.$current.attr('data-height'), 10);
} else if(docTop < (self.currentP + self.$current.height())){
// Animate the current pannel during the scroll
var position = -(docTop-self.currentP);
self.$current.css({marginTop:position});
// If there is a fixed element in the current panel
if(self.$fixed.length){
var dataTop = parseInt(self.$fixed.attr('data-top'), 10);
if((docTop-self.currentP+windowHeight) >= self.currentHeight && self.$fixed.css('position') === 'fixed'){
self.$fixed.css({
position: 'absolute',
top: Math.abs(docTop-self.currentP + dataTop)
});
} else if((docTop-self.currentP+windowHeight) <= self.currentHeight && self.$fixed.css('position') === 'absolute'){
self.$fixed.css({
position: 'fixed',
top: dataTop
});
}
}
// If there is a step element in the current panel
if(self.$step.length){
$.each(self.$step, function(i,el){
if($(el).offset().top <= docTop+5 && ($(el).offset().top + $(el).outerHeight()) >= docTop+5){
if(!$(el).hasClass('current-step')){
self.$step.removeClass('current-step');
$(el).addClass('current-step');
}
}
});
}
} else {
if (self.options.nextSlide) {
self.options.nextSlide();
}
// Scroll bottom
self._ignoreHashChange = true;
if(self.$current.next().attr('id'))
self.setHash(self.$current.next().attr('id'));
self.$current.removeClass('current')
.css({display:'none'})
.next().addClass('current').nextAll().css({display:'block'});
// Cache
self.$current = self.$element.find('.current');
self.$fixed = self.$current.find('.fixed');
self.$step = self.$current.find('.step');
self.currentP = parseInt(self.$current.attr('data-position'), 10);
self.currentHeight = parseInt(self.$current.attr('data-height'), 10);
}
},
scrollMobileEvent: function() {
var self = this;
var docTop = self.$element.scrollTop(),
$current = self.$element.find('.current'),
$step = $current.find('.step'),
currentP = parseInt($current.attr('data-position'), 10),
currentHeight = parseInt($current.attr('data-height'), 10),
windowHeight = $(window).height();
if(docTop+10 < currentP && $current.index() > 0){
$current.removeClass('current').prev().addClass('current');
} else if(docTop+10 < (currentP + $current.height())){
// If there is a step element in the current panel
if($step.length){
$.each($step, function(i,el){
if(($(el).position().top+currentP) <= docTop && (($(el).position().top+currentP) + $(el).outerHeight()) >= docTop){
if(!$(el).hasClass('current-step')){
$step.removeClass('current-step');
$(el).addClass('current-step');
}
}
});
}
} else {
$current.removeClass('current').next().addClass('current');
}
},
// Setters
setDimensions: function(){
var windowHeight = $(window).height(),
levelHeight = 0,
cover = false,
height = null;
this.$li.each(function(index) {
var $self = $(this);
cover = $self.hasClass('cover');
if(cover){
$self.css({height: windowHeight, zIndex: 999-index})
.attr('data-height',windowHeight)
.attr('data-position',levelHeight);
levelHeight += windowHeight;
} else{
height = ($self.outerHeight() <= windowHeight) ? windowHeight : $self.outerHeight();
$self.css({minHeight: height, zIndex: 999-index})
.attr('data-height',height)
.attr('data-position',levelHeight);
levelHeight += height;
}
if($self.find('.fixed').length){
var top = $self.find('.fixed').css('top');
$self.find('.fixed').attr('data-top', top);
}
});
if(!this.options.mobile)
this.setBodyHeight();
},
setEvents: function() {
var self = this;
$(window).on('resize', function(){
self.setDimensions();
});
if(self.options.mobile) {
self.$element.on('scroll', function(){
self.scrollMobileEvent();
});
} else {
$(window).on('scroll', function(){
self.scrollEvent();
});
}
if(self.options.enableKeys) {
$(document).on('keydown', function(e){
if(e.keyCode === 38 || e.keyCode === 37) {
self.scrollToPosition('up');
e.preventDefault();
return false;
}
if(e.keyCode === 40 || e.keyCode === 39){
self.scrollToPosition('down');
e.preventDefault();
return false;
}
// Home button
if(e.keyCode === 36){
self.scrollToPosition('top');
e.preventDefault();
return false;
}
// End button
if(e.keyCode === 35){
self.scrollToPosition('bottom');
e.preventDefault();
return false;
}
});
}
if(self.options.scrollButtons){
if(self.options.scrollButtons.up){
self.options.scrollButtons.up.on('click', function(e){
e.preventDefault();
self.scrollToPosition('up');
});
}
if(self.options.scrollButtons.down){
self.options.scrollButtons.down.on('click', function(e){
e.preventDefault();
self.scrollToPosition('down');
});
}
}
if(self.options.curtainLinks){
$(self.options.curtainLinks).on('click', function(e){
e.preventDefault();
var href = $(this).attr('href');
if(!self.isHashIsOnList(href.substring(1)) && position)
return false;
var position = $(href).attr('data-position') || null;
if(position){
self.scrollEl.animate({
scrollTop:position
}, self.options.scrollSpeed, self.options.easing);
}
return false;
});
}
if ("onhashchange" in window) {
window.addEventListener("hashchange", function(){
if(self._ignoreHashChange === false){
self.isHashIsOnList(location.hash.substring(1));
}
self._ignoreHashChange = false;
}, false);
}
},
setBodyHeight: function(){
var h = 0;
this.$li.each(function() {
h += $(this).height();
});
this.options.bodyHeight = h;
$('body').height(h);
},
setLinks: function(){
var self = this;
this.$li.each(function() {
var id = $(this).attr('id') || 0;
self.options.linksArray.push(id);
});
},
setHash: function(hash){
if(history.pushState) {
history.pushState(null, null, '#'+hash);
}
else {
location.hash = hash;
}
},
// Utils
isHashIsOnList: function(hash){
var self = this;
$.each(self.options.linksArray, function(i,val){
if(val === hash){
self.scrollToPosition(hash);
return false;
}
});
},
readyElement: function(el,callback){
var interval = setInterval(function(){
if(el.length){
callback(el.length);
clearInterval(interval);
}
},60);
}
};
$.fn[pluginName] = function ( options ) {
return this.each(function () {
if (!$.data(this, 'plugin_' + pluginName)) {
$.data(this, 'plugin_' + pluginName, new Plugin( this, options ));
}
});
};
})( jQuery, window, document );

2
about/js/jquery-1.8.2.min.js vendored Normal file
View file

File diff suppressed because one or more lines are too long

519
about/js/jquery.scrollorama.js Normal file
View file

@ -0,0 +1,519 @@
/*
scrollorama - The jQuery plugin for doing cool scrolly stuff
by John Polacek (@johnpolacek)
Dual licensed under MIT and GPL.
*/
(function($) {
$.scrollorama = function(options) {
var scrollorama = this,
blocks = [],
browserPrefix = '',
onBlockChange = function() {},
latestKnownScrollY = 0,
ticking = false,
requestAnimFrame = window.requestAnimationFrame ||
window.webkitRequestAnimationFrame ||
window.mozRequestAnimationFrame ||
window.oRequestAnimationFrame ||
window.msRequestAnimationFrame ||
function( callback ){
window.setTimeout(callback, 1000 / 60);
},
defaults = {offset:0, enablePin: true};
scrollorama.settings = $.extend({}, defaults, options);
scrollorama.blockIndex = 0;
if (options.blocks === undefined) { alert('ERROR: Must assign blocks class selector to scrollorama plugin'); }
// PRIVATE FUNCTIONS
function init() {
var i, block, didScroll, marginTop = false;
if (typeof scrollorama.settings.blocks === 'string') { scrollorama.settings.blocks = $(scrollorama.settings.blocks); }
// set browser prefix
if ($.browser.mozilla) { browserPrefix = '-moz-'; }
if ($.browser.webkit) { browserPrefix = '-webkit-'; }
if ($.browser.opera) { browserPrefix = '-o-'; }
if ($.browser.msie) { browserPrefix = '-ms-'; }
// create blocks array to contain animation props
$('body').css('position','relative');
for (i=0; i<scrollorama.settings.blocks.length; i++) {
block = scrollorama.settings.blocks.eq(i);
marginTop = block.css('margin-top');
blocks.push({
block: block,
top: block.offset().top - (!Boolean(marginTop) ? parseInt(marginTop, 10) : 0),
pin: 0,
animations:[]
});
}
// convert block elements to absolute position
if (scrollorama.settings.enablePin.toString() === 'true') {
for (i=0; i<blocks.length; i++) {
blocks[i].block
.css('position', 'absolute')
.css('top', blocks[i].top);
}
}
$('body').prepend('<div id="scroll-wrap"></div>');
latestKnownScrollY = 0;
ticking = false;
$(window).on( 'scroll.scrollorama', onScroll );
}
function onScroll() {
latestKnownScrollY = window.scrollY;
requestTick();
}
function requestTick() {
if(!ticking) {
requestAnimFrame(function(){
onScrollorama();
update();
});
}
ticking = true;
}
function update() {
// reset the tick so we can
// capture the next onScroll
ticking = false;
}
function onScrollorama() {
var scrollTop = $(window).scrollTop(),
currBlockIndex = getCurrBlockIndex(scrollTop),
i, j, anim, startAnimPos, endAnimPos, animPercent, animVal;
// update all animations
for (i=0; i<blocks.length; i++) {
// go through the animations for each block
if (blocks[i].animations.length) {
for (j=0; j<blocks[i].animations.length; j++) {
anim = blocks[i].animations[j];
// if above current block, settings should be at start value
if (i > currBlockIndex) {
if (currBlockIndex !== i-1 && anim.baseline !== 'bottom') {
setProperty(anim.element, anim.property, anim.startVal);
}
if (blocks[i].pin) {
blocks[i].block
.css('position', 'absolute')
.css('top', blocks[i].top);
}
}
// if below current block, settings should be at end value
// unless on an element that gets animated when it hits the bottom of the viewport
else if (i < currBlockIndex) {
setProperty(anim.element, anim.property, anim.endVal);
if (blocks[i].pin) {
blocks[i].block
.css('position', 'absolute')
.css('top', (blocks[i].top + blocks[i].pin));
}
}
// otherwise, set values per scroll position
if (i === currBlockIndex || (currBlockIndex === i-1 && anim.baseline === 'bottom')) {
// if block gets pinned, set position fixed
if (blocks[i].pin && currBlockIndex === i) {
blocks[i].block
.css('position', 'fixed')
.css('top', 0);
}
// set start and end animation positions
startAnimPos = blocks[i].top + anim.delay;
if (anim.baseline === 'bottom') { startAnimPos -= $(window).height(); }
endAnimPos = startAnimPos + anim.duration;
// if scroll is before start of animation, set to start value
if (scrollTop < startAnimPos) {
setProperty(anim.element, anim.property, anim.startVal);
}
// if scroll is after end of animation, set to end value
else if (scrollTop > endAnimPos) {
setProperty(anim.element, anim.property, anim.endVal);
if (blocks[i].pin) {
blocks[i].block
.css('position', 'absolute')
.css('top', (blocks[i].top + blocks[i].pin));
}
}
// otherwise, set value based on scroll
else {
// calculate percent to animate
animPercent = (scrollTop - startAnimPos) / anim.duration;
// account for easing if there is any
if ( anim.easing && $.isFunction( $.easing[anim.easing] ) ) {
animPercent = $.easing[anim.easing]( animPercent, animPercent*1000, 0, 1, 1000 );
}
// then multiply the percent by the value range and calculate the new value
animVal = anim.startVal + (animPercent * (anim.endVal - anim.startVal));
setProperty(anim.element, anim.property, animVal);
}
}
}
}
}
// update blockIndex and trigger event if changed
if (scrollorama.blockIndex !== currBlockIndex) {
scrollorama.blockIndex = currBlockIndex;
onBlockChange();
}
}
function getCurrBlockIndex(scrollTop) {
var currBlockIndex = 0, i;
for (i=0; i<blocks.length; i++) {
// check if block is in view
if (blocks[i].top <= scrollTop - scrollorama.settings.offset) { currBlockIndex = i; }
}
return currBlockIndex;
}
function setProperty(target, prop, val) {
var scaleCSS, currentPosition;
if (prop === 'rotate' || prop === 'zoom' || prop === 'scale') {
if (prop === 'rotate') {
target.css(browserPrefix+'transform', 'rotate('+val+'deg)');
} else if (prop === 'zoom' || prop === 'scale') {
scaleCSS = 'scale('+val+')';
if (browserPrefix !== '-ms-') {
target.css(browserPrefix+'transform', scaleCSS);
} else {
target.css('zoom', scaleCSS);
}
}
}
else if(prop === 'background-position-x' || prop === 'background-position-y' ) {
currentPosition = target.css('background-position').split(' ');
if(prop === 'background-position-x') {
target.css('background-position',val+'px '+currentPosition[1]);
}
if(prop === 'background-position-y') {
target.css('background-position', currentPosition[0]+' '+val+'px');
}
}
else if(prop === 'text-shadow' ) {
target.css(prop,'0px 0px '+val+'px #ffffff');
} else {
target.css(prop, val);
}
}
// PUBLIC FUNCTIONS
scrollorama.animate = function(target) {
var targetIndex,
targetBlock,
anim,
offset,
i, j;
/*
target = animation target
arguments = array of animation parameters
anim = object that contains all animation params (created from arguments)
offset = positioning helper for pinning
animation parameters:
delay = amount of scrolling (in pixels) before animation starts
duration = amount of scrolling (in pixels) over which the animation occurs
property = css property being animated
start = start value of the property
end = end value of the property
pin = pin block during animation duration (applies to all animations within block)
baseline = top (default, when block reaches top of viewport) or bottom (when block first comies into view)
easing = just like jquery's easing functions
*/
// if string, convert to DOM object
if (typeof target === 'string') { target = $(target); }
// find block of target
for (i=0; i<blocks.length; i++) {
if (blocks[i].block.has(target).length) {
targetBlock = blocks[i];
targetIndex = i;
}
}
// add each animation to the blocks animations array from function arguments
for (i=1; i<arguments.length; i++) {
anim = arguments[i];
// for top/left/right/bottom, set relative positioning if static
if (anim.property === 'top' || anim.property === 'left' || anim.property === 'bottom' || anim.property === 'right' ) {
if (target.css('position') === 'static') { target.css('position','relative'); }
// set anim.start, anim.end defaults
cssValue = parseInt(target.css(anim.property),10);
if (anim.start === undefined) {
anim.start = isNaN(cssValue) ? 0 : cssValue;
} else if (anim.end === undefined) {
anim.end = isNaN(cssValue) ? 0 : cssValue;
}
}
// set anim.start/anim.end defaults for rotate, zoom/scale, letter-spacing
if (anim.property === 'rotate') {
if (anim.start === undefined) { anim.start = 0; }
if (anim.end === undefined) { anim.end = 0; }
} else if (anim.property === 'zoom' || anim.property === 'scale' ) {
if (anim.start === undefined) { anim.start = 1; }
if (anim.end === undefined) { anim.end = 1; }
} else if (anim.property === 'letter-spacing' && target.css(anim.property)) {
if (anim.start === undefined) { anim.start = 1; }
if (anim.end === undefined) { anim.end = 1; }
}
if (anim.baseline === undefined) {
if (anim.pin || targetBlock.pin || targetIndex === 0) {
anim.baseline = 'top';
} else {
anim.baseline = 'bottom';
}
}
if (anim.delay === undefined) { anim.delay = 0; }
targetBlock.animations.push({
element: target,
delay: anim.delay,
duration: anim.duration,
property: anim.property,
startVal: anim.start !== undefined ? anim.start : parseInt(target.css(anim.property),10), // if undefined, use current css value
endVal: anim.end !== undefined ? anim.end : parseInt(target.css(anim.property),10), // if undefined, use current css value
baseline: anim.baseline !== undefined ? anim.baseline : 'bottom',
easing: anim.easing
});
if (anim.pin) {
if (targetBlock.pin < anim.duration + anim.delay) {
offset = anim.duration + anim.delay - targetBlock.pin;
targetBlock.pin += offset;
// adjust positions of blocks below target block
for (j=targetIndex+1; j<blocks.length; j++) {
blocks[j].top += offset;
blocks[j].block.css('top', blocks[j].top);
}
}
}
}
onScrollorama();
};
// function for passing blockChange event callback
scrollorama.onBlockChange = function(f) {
onBlockChange = f;
};
// function for getting an array of scrollpoints
// (top of each animation block and animation element scroll start point)
scrollorama.getScrollpoints = function() {
var scrollpoints = [],i,j,anim;
for (i=0; i<blocks.length; i++) {
scrollpoints.push(blocks[i].top);
// go through the animations for each block
if (blocks[i].animations.length && blocks[i].pin > 0) {
for (j=0; j<blocks[i].animations.length; j++) {
anim = blocks[i].animations[j];
scrollpoints.push(blocks[i].top + anim.delay + anim.duration);
}
}
}
// make sure scrollpoints are in numeric order
scrollpoints.sort(function(a,b) {return a - b;});
return scrollpoints;
};
// Remove scrollorama
scrollorama.destroy = function () {
// Remove animations
for (i=0; i<blocks.length; i++) {
// Remove CSS rules
blocks[i].block.css({
top: '',
position: ''
});
// Remove scrolloroma-specific attributes
delete blocks[i].animations;
delete blocks[i].top;
delete blocks[i].pin;
}
// Unbind the window scroll event
$(window).off('scroll.scrollorama');
$('#scroll-wrap').remove();
// Remove the scrolloroma object
delete scrollorama;
};
// INIT
init();
return scrollorama;
};
//
// Easing functions from jQuery UI
//
$.extend($.easing, {
def: 'easeOutQuad',
swing: function (x, t, b, c, d) {
//alert($.easing.default);
return $.easing[$.easing.def](x, t, b, c, d);
},
easeInQuad: function (x, t, b, c, d) {
return c*(t/=d)*t + b;
},
easeOutQuad: function (x, t, b, c, d) {
return -c *(t/=d)*(t-2) + b;
},
easeInOutQuad: function (x, t, b, c, d) {
if ((t/=d/2) < 1) { return c/2*t*t + b; }
return -c/2 * ((--t)*(t-2) - 1) + b;
},
easeInCubic: function (x, t, b, c, d) {
return c*(t/=d)*t*t + b;
},
easeOutCubic: function (x, t, b, c, d) {
return c*((t=t/d-1)*t*t + 1) + b;
},
easeInOutCubic: function (x, t, b, c, d) {
if ((t/=d/2) < 1) { return c/2*t*t*t + b; }
return c/2*((t-=2)*t*t + 2) + b;
},
easeInQuart: function (x, t, b, c, d) {
return c*(t/=d)*t*t*t + b;
},
easeOutQuart: function (x, t, b, c, d) {
return -c * ((t=t/d-1)*t*t*t - 1) + b;
},
easeInOutQuart: function (x, t, b, c, d) {
if ((t/=d/2) < 1) { return c/2*t*t*t*t + b; }
return -c/2 * ((t-=2)*t*t*t - 2) + b;
},
easeInQuint: function (x, t, b, c, d) {
return c*(t/=d)*t*t*t*t + b;
},
easeOutQuint: function (x, t, b, c, d) {
return c*((t=t/d-1)*t*t*t*t + 1) + b;
},
easeInOutQuint: function (x, t, b, c, d) {
if ((t/=d/2) < 1) { return c/2*t*t*t*t*t + b; }
return c/2*((t-=2)*t*t*t*t + 2) + b;
},
easeInSine: function (x, t, b, c, d) {
return -c * Math.cos(t/d * (Math.PI/2)) + c + b;
},
easeOutSine: function (x, t, b, c, d) {
return c * Math.sin(t/d * (Math.PI/2)) + b;
},
easeInOutSine: function (x, t, b, c, d) {
return -c/2 * (Math.cos(Math.PI*t/d) - 1) + b;
},
easeInExpo: function (x, t, b, c, d) {
return (t===0) ? b : c * Math.pow(2, 10 * (t/d - 1)) + b;
},
easeOutExpo: function (x, t, b, c, d) {
return (t===d) ? b+c : c * (-Math.pow(2, -10 * t/d) + 1) + b;
},
easeInOutExpo: function (x, t, b, c, d) {
if (t===0) { return b; }
if (t===d) { return b+c; }
if ((t/=d/2) < 1) { return c/2 * Math.pow(2, 10 * (t - 1)) + b; }
return c/2 * (-Math.pow(2, -10 * --t) + 2) + b;
},
easeInCirc: function (x, t, b, c, d) {
return -c * (Math.sqrt(1 - (t/=d)*t) - 1) + b;
},
easeOutCirc: function (x, t, b, c, d) {
return c * Math.sqrt(1 - (t=t/d-1)*t) + b;
},
easeInOutCirc: function (x, t, b, c, d) {
if ((t/=d/2) < 1) { return -c/2 * (Math.sqrt(1 - t*t) - 1) + b; }
return c/2 * (Math.sqrt(1 - (t-=2)*t) + 1) + b;
},
easeInElastic: function (x, t, b, c, d) {
var s=1.70158,p=0,a=c;
if (t===0) { return b; }
if ((t/=d)===1) { return b+c; }
if (!p) { p=d*0.3; }
if (a < Math.abs(c)) { a=c; s=p/4; }
else{ s = p/(2*Math.PI) * Math.asin (c/a); }
return -(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b;
},
easeOutElastic: function (x, t, b, c, d) {
var s=1.70158,p=0,a=c;
if (t===0) { return b; }
if ((t/=d)===1) { return b+c; }
if (!p) { p=d*0.3; }
if (a < Math.abs(c)) { a=c; s=p/4; }
else { s = p/(2*Math.PI) * Math.asin (c/a); }
return a*Math.pow(2,-10*t) * Math.sin( (t*d-s)*(2*Math.PI)/p ) + c + b;
},
easeInOutElastic: function (x, t, b, c, d) {
var s=1.70158,p=0,a=c;
if (t===0) { return b; }
if ((t/=d/2)===2) { return b+c; }
if (!p) { p=d*(0.3*1.5); }
if (a < Math.abs(c)) { a=c; s=p/4; }
else { s = p/(2*Math.PI) * Math.asin (c/a); }
if (t < 1) { return -0.5*(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b; }
return a*Math.pow(2,-10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )*0.5 + c + b;
},
easeInBack: function (x, t, b, c, d, s) {
if (s === undefined) { s = 1.70158; }
return c*(t/=d)*t*((s+1)*t - s) + b;
},
easeOutBack: function (x, t, b, c, d, s) {
if (s === undefined) { s = 1.70158; }
return c*((t=t/d-1)*t*((s+1)*t + s) + 1) + b;
},
easeInOutBack: function (x, t, b, c, d, s) {
if (s === undefined) { s = 1.70158; }
if ((t/=d/2) < 1) { return c/2*(t*t*(((s*=(1.525))+1)*t - s)) + b; }
return c/2*((t-=2)*t*(((s*=(1.525))+1)*t + s) + 2) + b;
},
easeInBounce: function (x, t, b, c, d) {
return c - $.easing.easeOutBounce (x, d-t, 0, c, d) + b;
},
easeOutBounce: function (x, t, b, c, d) {
if ((t/=d) < (1/2.75)) {
return c*(7.5625*t*t) + b;
} else if (t < (2/2.75)) {
return c*(7.5625*(t-=(1.5/2.75))*t + 0.75) + b;
} else if (t < (2.5/2.75)) {
return c*(7.5625*(t-=(2.25/2.75))*t + 0.9375) + b;
} else {
return c*(7.5625*(t-=(2.625/2.75))*t + 0.984375) + b;
}
},
easeInOutBounce: function (x, t, b, c, d) {
if (t < d/2) { return $.easing.easeInBounce (x, t*2, 0, c, d) * 0.5 + b; }
return $.easing.easeOutBounce (x, t*2-d, 0, c, d) * 0.5 + c*0.5 + b;
}
});
})(jQuery);

50
about/js/scripts.js Normal file
View file

@ -0,0 +1,50 @@
$(document).ready(function(){
$('.curtains>li').css('position', 'fixed');
$('.curtains').curtain();
var scrollorama = $.scrollorama({
blocks:'.curtains'
});
scrollorama.animate('#intro h1',{
duration:200, property:'left', end:-860
});
scrollorama.animate('#reset-photo',{
delay:900, duration:993, property:'top', start:300, end:-300
});
scrollorama.animate('#simio-photo',{
delay:993, duration:1986, property:'rotate', start:-10, end:10
});
scrollorama.animate('#pusset .btn',{
delay:2700, duration:993, property:'left', start:-800, easing:'easeOutBounce'
});
scrollorama.animate('#sakrecoer ul li:nth-child(1)',{
delay:2979, duration:993, property:'top', start:840, end: 690
});
scrollorama.animate('#sakrecoer ul li:nth-child(2)',{
delay:2979, duration:993, property:'top', start:800, end: 690
});
scrollorama.animate('#sakrecoer ul li:nth-child(3)',{
delay:2979, duration:993, property:'top', start:920, end: 630
});
scrollorama.animate('#sakrecoer ul li:nth-child(4)',{
delay:2979, duration:993, property:'top', start:880, end: 670
});
scrollorama.animate('#sakrecoer ul li:nth-child(5)',{
delay:2979, duration:993, property:'top', start:830, end: 710
});
scrollorama.animate('#sakrecoer ul li:nth-child(6)',{
delay:2979, duration:993, property:'top', start:960, end: 650
});
scrollorama.animate('#final h2',{
delay:4500, duration:900, property:'top', start:0, easing:'easeOutBounce'
});
});

290
about/style.css Normal file
View file

@ -0,0 +1,290 @@
---
---
body, div, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, img, form, fieldset, input, textarea, blockquote {
margin: 0; padding: 0; border: 0;
}
body {
font: 18px/30px "Helvetica Neue", Helvetica, Arial, Sans-serif;
color: #000;
text-shadow: 0px 0px 10px #0ff;
}
a {
color: #fff; text-decoration: none; font-weight: bold;
}
img {
border-radius: 7px;
}
section {
overflow-x: hidden; height: 993px;
}
#intro {
background: #000 url(images/pusset-bg.jpg) left no-repeat;
background-size: contain;
color: #fff;
}
#intro h1 {
width: 858px; height: 161px;
background: url(images/intro-title.png); text-indent: -9999px;
position: relative; top: 145px; left: 200px;
}
#intro p {
position: relative; top: 200px; left: 285px;
width: 650px; margin: 0 0 30px 0;
}
#intro p:nth-child(2) {
font-weight: bold;
}
#reset {
background: #0cf url(images/resetbg.jpg) no-repeat;
background-size: cover;
position: relative;
}
#reset h2 {
width: 432px; height: 310px;
background: url(images/reset-title.png); text-indent: -9999px;
position: relative; top: 87px; left: 90px;
}
#reset-photo {
position: absolute; top: 70px; left: 650px;
}
#reset p {
position: relative; top: 130px; left: 93px;
width: 530px; margin: 0 0 30px 0;
color: #fff;
text-shadow: 0px 0px 20px #f00;
}
#reset a {
color: #fff; text-decoration: none; font-weight: bold;
}
#reset .btn a {
display: block;
padding: 50px;
background-color: #0ff;
box-shadow: 0 0 20px #0ff;
border-radius: 7px;
-webkit-transition-property: hover;
-webkit-transition: background-color 0.25s ease-in-out;
-moz-transition: background-color 0.25s linear 0s; /* firefox 4 */
-o-transition-property: background-color; /* opera 10.5 */
-o-transition-duration: 0.25s;
font-size: 48px;
color: #f00;
text-align:center;
}
#reset .btn a:hover {
background-color: #f00;
color: #0ff;
}
#reset img {
border-radius: 7px;
box-shadow: 0 0 40px #f00;
}
#simio {
background: #000 url(images/simio_bg.jpg) no-repeat top right;
background-size: cover;
position: relative;
}
#simio h2 {
width: 635px; height: 208px;
background: url(images/simio-title.png) top left; text-indent: -9999px;
position: relative; top: 87px; left: 90px;
}
#simio-photo {
position: absolute; left: 410px; top: 300px;
transform: rotate(0deg);
-moz-transform: rotate(0deg);
}
#simio p {
position: relative; top: 145px; left: 90px;
width: 300px; margin: 0 0 30px 0;
color: #fff;
font-weight: bold;
text-shadow: 0px 0px 20px #0269e3;
}
#simio a {
color: #fff; text-decoration: none; font-weight: bold;
}
#simio img {
border-radius: 7px;
box-shadow: 0 0 40px #0269e3;
}
#simio a.btn {
position: absolute; width: 500px; top: 610px; right: 10px;
display: block;
padding: 50px;
background-color: #f00;
box-shadow: 0 0 20px #0269e3;
border-radius: 7px;
-webkit-transition-property: hover;
-webkit-transition: background-color 0.25s ease-in-out;
-moz-transition: background-color 0.25s linear 0s; /* firefox 4 */
-o-transition-property: background-color; /* opera 10.5 */
-o-transition-duration: 0.25s;
font-size: 48px;
color: #fff;
text-align:center;
}
#simio a.btn:hover {
background-color: #0269e3;
color: #f00;
}
#pusset {
background: #f00 url(images/intro-bg.jpg);
background-size: cover;
}
#pusset h2 {
width: 513px; height: 324px;
background: url(images/pusset-title.png); text-indent: -9999px;
position: relative; top: 70px; left: 90px;
}
#pusset p {
position: relative; top: 100px; left: 100px;
width: 500px;
color: #0ff;
text-shadow: 0px 0px 20px #0ff;
}
#pusset a {
color: #fff; text-decoration: none; font-weight: bold;
}
#pusset a.btn {
position: absolute; width: 500px; top: 700px; right: 10px;
display: block;
padding: 50px;
background-color: #f00;
box-shadow: 0 0 20px #f00;
border-radius: 7px;
-webkit-transition-property: hover;
-webkit-transition: background-color 0.25s ease-in-out;
-moz-transition: background-color 0.25s linear 0s; /* firefox 4 */
-o-transition-property: background-color; /* opera 10.5 */
-o-transition-duration: 0.25s;
font-size: 48px;
color: #fff;
text-align:center;
}
#pusset a.btn:hover {
background-color: #0ff;
color: #fff;
box-shadow: 0 0 20px #0ff;
}
#sakrecoer {
background: #0ff url(images/sakrecoerLIVE.png);
position: relative;
text-shadow: 0px 0px 10px #f00;
color: #fff;
}
#sakrecoer h2 {
width: 900px; height: 147px;
background: url(images/intro-title.png); text-indent: -9999px;
position: relative; top: 90px; left: 85px;
}
#sakrecoer p {
position: relative; top: 120px; left: 90px;
width: 720px;
}
#sakrecoer ul li {
float: left; box-shadow: 0 0 20px rgba(0,0,0,0.5); line-height: 0;
position: absolute; list-style: none;
}
#sakrecoer ul li:nth-child(1) {
top: 640px; left: 50px;
transform: rotate(10deg);
-moz-transform: rotate(10deg);
-webkit-transform: rotate(10deg);
z-index: 1;
}
#sakrecoer ul li:nth-child(2) {
top: 550px; left: 320px;
transform: rotate(-5deg);
-moz-transform: rotate(-5deg);
-webkit-transform: rotate(-5deg);
z-index: 3;
}
#sakrecoer ul li:nth-child(3) {
top: 680px; left: 520px;
transform: rotate(-2deg);
-moz-transform: rotate(-2deg);
-webkit-transform: rotate(-2deg);
z-index: 2;
}
#sakrecoer ul li:nth-child(4) {
top: 550px; left: 810px;
transform: rotate(7deg);
-moz-transform: rotate(7deg);
-webkit-transform: rotate(7deg);
z-index: 1;
}
#sakrecoer ul li:nth-child(5) {
top: 630px; left: 940px;
transform: rotate(-7deg);
-moz-transform: rotate(-7deg);
-webkit-transform: rotate(-7deg);
z-index: 2;
}
#sakrecoer ul li:nth-child(6) {
top: 678px; left: 1230px;
transform: rotate(-2deg);
-moz-transform: rotate(-2deg);
-webkit-transform: rotate(-2deg);
z-index: 1;
}
#sakrecoer img {
box-shadow: 0 0 10px #f00;
}
#final {
background: #0fc url(images/last-bg.jpg);
background-size: cover;
}
#final h2 {
width: 672px; height: 358px;
background: url(images/final-title.png); text-indent: -9999px;
position: relative; top: 87px; left: 90px;
}
#final p {
position: relative; top: 130px; left: 115px;
width: 672px;
color: #fff;
}
#final p.credits {
font-size: 12px;
position: absolute; top: 950px; left: 115px;
color: #000;
text-shadow: none;
width: 872px;
}
{% include curtain.css %}
{% include style.css %}
{% include navmenu.css %}