diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..3c3629e --- /dev/null +++ b/.gitignore @@ -0,0 +1 @@ +node_modules diff --git a/1E13652F.gpg b/1E13652F.gpg deleted file mode 100644 index 92acbb7..0000000 Binary files a/1E13652F.gpg and /dev/null differ diff --git a/Checklist.md b/Checklist.md new file mode 100644 index 0000000..c315488 --- /dev/null +++ b/Checklist.md @@ -0,0 +1,4 @@ +#Design-Checklist + +- Responsive Design – Mobile: 320, 360, 400px +- Create Favicons (ICO!) with multiple sizes (16, 32, 48, 64px) diff --git a/README.md b/README.md index 62f1b1f..a314b53 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,4 @@ -Jastrow.me -========== +Template +======== -My Webpage +My template for a new website diff --git a/crossdomain.xml b/crossdomain.xml index 04aa721..a05eb8b 100755 --- a/crossdomain.xml +++ b/crossdomain.xml @@ -2,14 +2,11 @@ - - - - - - - - - - -
Jastrow.me
- -
-
-
- -
-

From the ether…

-

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ab voluptate hic et, aspernatur consectetur, sunt iste beatae iure cumque maiores numquam nobis possimus commodi.

-

Ipsam eius atque laudantium, delectus accusantium. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Asperiores, eos atque odio expedita. Laborum cum laboriosam officiis, voluptate neque id quos ut explicabo modi a, obcaecati nesciunt nihil illo accusantium.

-

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Odio quod veritatis suscipit quas id maxime, aliquid facere aut aliquam quasi tempore voluptatum minima, consectetur accusamus unde perspiciatis dicta dolorem et.

-
- -
-
-
- -
-

Writing

-

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ab voluptate hic et, aspernatur consectetur, sunt iste beatae iure cumque maiores numquam nobis possimus commodi ipsam eius atque laudantium, delectus accusantium. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Asperiores, eos atque odio expedita. Laborum cum laboriosam officiis, voluptate neque id quos ut explicabo modi a, obcaecati nesciunt nihil illo accusantium.

-

My projects on GitHub.com

-
- -
-
-
- -
-

Social

-

Writing code, working on webpages and coding small scripts is fun, but there is more in life then work.

-

I also spend a lot of time on those "social media platforms" these guys with the silly glasses (social-media-consultans) are talking about.

-

I use Facebook and Instagram – but I love Twitter. While designing and writing this site I wrote my 13.275th tweet and I won't stop there!

-
- - - - - - - - diff --git a/js/main.js b/js/main.js new file mode 100644 index 0000000..2f9e51c --- /dev/null +++ b/js/main.js @@ -0,0 +1,725 @@ +/* Some scripts and stuff +--------------------------*/ + + +/* Target-Blank for CSS-Class "external" +--------------------------*/ +function externalLinks() { + if (!document.getElementsByTagName) {return;} + var anchors = document.getElementsByTagName("a"); + for (var i=0; iarticle,aside,dialog,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}mark{background:#FF0;color:#000}template{display:none}"; +c=d.insertBefore(c.lastChild,d.firstChild);b.hasCSS=!!c}g||t(a,b);return a}var k=l.html5||{},s=/^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i,r=/^(?:a|b|code|div|fieldset|h1|h2|h3|h4|h5|h6|i|label|li|ol|p|q|span|strong|style|table|tbody|td|th|tr|ul)$/i,j,o="_html5shiv",h=0,n={},g;(function(){try{var a=f.createElement("a");a.innerHTML="";j="hidden"in a;var b;if(!(b=1==a.childNodes.length)){f.createElement("a");var c=f.createDocumentFragment();b="undefined"==typeof c.cloneNode|| +"undefined"==typeof c.createDocumentFragment||"undefined"==typeof c.createElement}g=b}catch(d){g=j=!0}})();var e={elements:k.elements||"abbr article aside audio bdi canvas data datalist details dialog figcaption figure footer header hgroup main mark meter nav output progress section summary template time video",version:"3.7.0",shivCSS:!1!==k.shivCSS,supportsUnknownElements:g,shivMethods:!1!==k.shivMethods,type:"default",shivDocument:q,createElement:p,createDocumentFragment:function(a,b){a||(a=f); +if(g)return a.createDocumentFragment();for(var b=b||i(a),c=b.frag.cloneNode(),d=0,e=m(),h=e.length;d + break + } + if (elem.hasAttribute('data-instant')) { + return false + } + if (elem.hasAttribute('data-no-instant')) { + return true + } + } + while (elem = elem.parentNode); + return false + } + + function isWhitelisted(elem) { + do { + if (!elem.hasAttribute) { // Parent of + break + } + if (elem.hasAttribute('data-no-instant')) { + return false + } + if (elem.hasAttribute('data-instant')) { + return true + } + } + while (elem = elem.parentNode); + return false + } + + function triggerPageEvent(eventType, arg1) { + for (var i = 0; i < $eventsCallbacks[eventType].length; i++) { + $eventsCallbacks[eventType][i](arg1) + } + + /* The `change` event takes one boolean argument: "isInitialLoad" */ + } + + function changePage(title, body, newUrl, scrollY) { + document.title = title + + document.documentElement.replaceChild(body, document.body) + /* We cannot just use `document.body = doc.body`, it causes Safari (tested + 5.1, 6.0 and Mobile 7.0) to execute script tags directly. + */ + + if (newUrl) { + history.pushState(null, null, newUrl) + + var hashIndex = newUrl.indexOf('#'), + hashElem = hashIndex > -1 + && document.getElementById(newUrl.substr(hashIndex + 1)), + offset = 0 + + if (hashElem) { + while (hashElem.offsetParent) { + offset += hashElem.offsetTop + + hashElem = hashElem.offsetParent + } + } + scrollTo(0, offset) + + $currentLocationWithoutHash = removeHash(newUrl) + } + else { + scrollTo(0, scrollY) + } + instantanize() + bar.done() + triggerPageEvent('change', false) + } + + function setPreloadingAsHalted() { + $isPreloading = false + $isWaitingForCompletion = false + } + + + ////////// EVENT HANDLERS ////////// + + + function mousedown(e) { + preload(getLinkTarget(e.target).href) + } + + function mouseover(e) { + var a = getLinkTarget(e.target) + a.addEventListener('mouseout', mouseout) + + if (!$delayBeforePreload) { + preload(a.href) + } + else { + $urlToPreload = a.href + $preloadTimer = setTimeout(preload, $delayBeforePreload) + } + } + + function touchstart(e) { + var a = getLinkTarget(e.target) + if ($preloadOnMousedown) { + a.removeEventListener('mousedown', mousedown) + } + else { + a.removeEventListener('mouseover', mouseover) + } + preload(a.href) + } + + function click(e) { + if (e.which > 1 || e.metaKey || e.ctrlKey) { // Opening in new tab + return + } + e.preventDefault() + display(getLinkTarget(e.target).href) + } + + function mouseout() { + if ($preloadTimer) { + clearTimeout($preloadTimer) + $preloadTimer = false + return + } + + if (!$isPreloading || $isWaitingForCompletion) { + return + } + $xhr.abort() + setPreloadingAsHalted() + } + + function readystatechange() { + if ($xhr.readyState < 4) { + return + } + if ($xhr.status == 0) { + /* Request aborted */ + return + } + + $timing.ready = +new Date - $timing.start + triggerPageEvent('receive') + + if ($xhr.getResponseHeader('Content-Type').match(/\/(x|ht|xht)ml/)) { + var doc = document.implementation.createHTMLDocument('') + doc.documentElement.innerHTML = $xhr.responseText + $title = doc.title + $body = doc.body + var urlWithoutHash = removeHash($url) + $history[urlWithoutHash] = { + body: $body, + title: $title, + scrollY: urlWithoutHash in $history ? $history[urlWithoutHash].scrollY : 0 + } + + var elems = doc.head.children, + found = 0, + elem, + data + + for (var i = elems.length - 1; i >= 0; i--) { + elem = elems[i] + if (elem.hasAttribute('data-instant-track')) { + data = elem.getAttribute('href') || elem.getAttribute('src') || elem.innerHTML + for (var j = $trackedAssets.length - 1; j >= 0; j--) { + if ($trackedAssets[j] == data) { + found++ + } + } + } + } + if (found != $trackedAssets.length) { + $mustRedirect = true // Assets have changed + } + } + else { + $mustRedirect = true // Not an HTML document + } + + if ($isWaitingForCompletion) { + $isWaitingForCompletion = false + display($url) + } + } + + + ////////// MAIN FUNCTIONS ////////// + + + function instantanize(isInitializing) { + var as = document.getElementsByTagName('a'), + a, + domain = location.protocol + '//' + location.host + + for (var i = as.length - 1; i >= 0; i--) { + a = as[i] + if (a.target // target="_blank" etc. + || a.hasAttribute('download') + || a.href.indexOf(domain + '/') != 0 // Another domain, or no href attribute + || (a.href.indexOf('#') > -1 + && removeHash(a.href) == $currentLocationWithoutHash) // Anchor + || ($useWhitelist + ? !isWhitelisted(a) + : isBlacklisted(a)) + ) { + continue + } + a.addEventListener('touchstart', touchstart) + if ($preloadOnMousedown) { + a.addEventListener('mousedown', mousedown) + } + else { + a.addEventListener('mouseover', mouseover) + } + a.addEventListener('click', click) + } + if (!isInitializing) { + var scripts = document.body.getElementsByTagName('script'), + script, + copy, + parentNode, + nextSibling + + for (i = 0, j = scripts.length; i < j; i++) { + script = scripts[i] + if (script.hasAttribute('data-no-instant')) { + continue + } + copy = document.createElement('script') + if (script.src) { + copy.src = script.src + } + if (script.innerHTML) { + copy.innerHTML = script.innerHTML + } + parentNode = script.parentNode + nextSibling = script.nextSibling + parentNode.removeChild(script) + parentNode.insertBefore(copy, nextSibling) + } + } + } + + function preload(url) { + if (!$preloadOnMousedown + && 'display' in $timing + && +new Date - ($timing.start + $timing.display) < 100) { + /* After a page is displayed, if the user's cursor happens to be above + a link a mouseover event will be in most browsers triggered + automatically, and in other browsers it will be triggered when the + user moves his mouse by 1px. + + Here are the behavior I noticed, all on Windows: + - Safari 5.1: auto-triggers after 0 ms + - IE 11: auto-triggers after 30-80 ms (depends on page's size?) + - Firefox: auto-triggers after 10 ms + - Opera 18: auto-triggers after 10 ms + + - Chrome: triggers when cursor moved + - Opera 12.16: triggers when cursor moved + + To remedy to this, we do not start preloading if last display + occurred less than 100 ms ago. If they happen to click on the link, + they will be redirected. + */ + + return + } + if ($preloadTimer) { + clearTimeout($preloadTimer) + $preloadTimer = false + } + + if (!url) { + url = $urlToPreload + } + + if ($isPreloading && (url == $url || $isWaitingForCompletion)) { + return + } + $isPreloading = true + $isWaitingForCompletion = false + + $url = url + $body = false + $mustRedirect = false + $timing = { + start: +new Date + } + triggerPageEvent('fetch') + $xhr.open('GET', url) + $xhr.send() + } + + function display(url) { + if (!('display' in $timing)) { + $timing.display = +new Date - $timing.start + } + if ($preloadTimer) { + /* Happens when there’s a delay before preloading and that delay + hasn't expired (preloading didn't kick in). + */ + + if ($url && $url != url) { + /* Happens when the user clicks on a link before preloading + kicks in while another link is already preloading. + */ + + location.href = url + return + } + preload(url) + bar.start(0, true) + triggerPageEvent('wait') + $isWaitingForCompletion = true + return + } + if (!$isPreloading || $isWaitingForCompletion) { + /* If the page isn't preloaded, it likely means the user has focused + on a link (with his Tab key) and then pressed Return, which + triggered a click. + Because very few people do this, it isn't worth handling this case + and preloading on focus (also, focusing on a link doesn't mean it's + likely that you'll "click" on it), so we just redirect them when + they "click". + It could also mean the user hovered over a link less than 100 ms + after a page display, thus we didn't start the preload (see + comments in `preload()` for the rationale behind this.) + + If the page is waiting for completion, the user clicked twice while + the page was preloading. Either on the same link or on another + link. If it's the same link something might have gone wrong (or he + could have double clicked), so we send him to the page the old way. + If it's another link, it hasn't been preloaded, so we redirect the + user the old way. + */ + + location.href = url + return + } + if ($mustRedirect) { + location.href = $url + return + } + if (!$body) { + bar.start(0, true) + triggerPageEvent('wait') + $isWaitingForCompletion = true + return + } + $history[$currentLocationWithoutHash].scrollY = pageYOffset + setPreloadingAsHalted() + changePage($title, $body, $url) + } + + + ////////// PROGRESS BAR FUNCTIONS ////////// + + + var bar = function() { + var $barContainer, + $barElement, + $barTransformProperty, + $barProgress, + $barTimer + + function init() { + $barContainer = document.createElement('div') + $barContainer.id = 'instantclick' + $barElement = document.createElement('div') + $barElement.id = 'instantclick-bar' + $barElement.className = 'instantclick-bar' + $barContainer.appendChild($barElement) + + var vendors = ['Webkit', 'Moz', 'O'] + + $barTransformProperty = 'transform' + if (!($barTransformProperty in $barElement.style)) { + for (var i = 0; i < 3; i++) { + if (vendors[i] + 'Transform' in $barElement.style) { + $barTransformProperty = vendors[i] + 'Transform' + } + } + } + + var transitionProperty = 'transition' + if (!(transitionProperty in $barElement.style)) { + for (var i = 0; i < 3; i++) { + if (vendors[i] + 'Transition' in $barElement.style) { + transitionProperty = '-' + vendors[i].toLowerCase() + '-' + transitionProperty + } + } + } + + var style = document.createElement('style') + style.innerHTML = '#instantclick{position:' + ($hasTouch ? 'absolute' : 'fixed') + ';top:0;left:0;width:100%;pointer-events:none;z-index:2147483647;' + transitionProperty + ':opacity .25s .1s}' + + '.instantclick-bar{background:#29d;width:100%;margin-left:-100%;height:2px;' + transitionProperty + ':all .25s}' + /* We set the bar's background in `.instantclick-bar` so that it can be + overriden in CSS with `#instantclick-bar`, as IDs have higher priority. + */ + document.head.appendChild(style) + + if ($hasTouch) { + updatePositionAndScale() + addEventListener('resize', updatePositionAndScale) + addEventListener('scroll', updatePositionAndScale) + } + + } + + function start(at, jump) { + $barProgress = at + if (document.getElementById($barContainer.id)) { + document.body.removeChild($barContainer) + } + $barContainer.style.opacity = '1' + if (document.getElementById($barContainer.id)) { + document.body.removeChild($barContainer) + /* So there's no CSS animation if already done once and it goes from 1 to 0 */ + } + update() + if (jump) { + setTimeout(jumpStart, 0) + /* Must be done in a timer, otherwise the CSS animation doesn't happen. */ + } + clearTimeout($barTimer) + $barTimer = setTimeout(inc, 500) + } + + function jumpStart() { + $barProgress = 10 + update() + } + + function inc() { + $barProgress += 1 + (Math.random() * 2) + if ($barProgress >= 98) { + $barProgress = 98 + } + else { + $barTimer = setTimeout(inc, 500) + } + update() + } + + function update() { + $barElement.style[$barTransformProperty] = 'translate(' + $barProgress + '%)' + if (!document.getElementById($barContainer.id)) { + document.body.appendChild($barContainer) + } + } + + function done() { + if (document.getElementById($barContainer.id)) { + clearTimeout($barTimer) + $barProgress = 100 + update() + $barContainer.style.opacity = '0' + /* If you're debugging, setting this to 0.5 is handy. */ + return + } + + /* The bar container hasn't been appended: It's a new page. */ + start($barProgress == 100 ? 0 : $barProgress) + /* $barProgress is 100 on popstate, usually. */ + setTimeout(done, 0) + /* Must be done in a timer, otherwise the CSS animation doesn't happen. */ + } + + function updatePositionAndScale() { + /* Adapted from code by Sam Stephenson and Mislav Marohnić + http://signalvnoise.com/posts/2407 + */ + + $barContainer.style.left = pageXOffset + 'px' + $barContainer.style.width = innerWidth + 'px' + $barContainer.style.top = pageYOffset + 'px' + + var landscape = 'orientation' in window && Math.abs(orientation) == 90, + scaleY = innerWidth / screen[landscape ? 'height' : 'width'] * 2 + /* We multiply the size by 2 because the progress bar is harder + to notice on a mobile device. + */ + $barContainer.style[$barTransformProperty] = 'scaleY(' + scaleY + ')' + } + + return { + init: init, + start: start, + done: done + } + }() + + + ////////// PUBLIC VARIABLE AND FUNCTIONS ////////// + + var supported = 'pushState' in history + && (!$ua.match('Android') || $ua.match('Chrome/')) + && location.protocol != "file:" + + /* The state of Android's AOSP browsers: + + 2.3.7: pushState appears to work correctly, but + `doc.documentElement.innerHTML = body` is buggy. + See details here: http://stackoverflow.com/q/21918564 + Note an issue anymore, but it may fail where 3.0 do, this needs + testing again. + + 3.0: pushState appears to work correctly (though the URL bar is only + updated on focus), but + `document.documentElement.replaceChild(doc.body, document.body)` + throws DOMException: WRONG_DOCUMENT_ERR. + + 4.0.2: Doesn't support pushState. + + 4.0.4, + 4.1.1, + 4.2, + 4.3: pushState is here, but it doesn't update the URL bar. + (Great logic there.) + + 4.4: Works correctly. Claims to be 'Chrome/30.0.0.0'. + + All androids tested with Android SDK's Emulator. + Version numbers are from the browser's user agent. + + Because of this mess, the only whitelisted browser on Android is Chrome. + */ + + function init() { + if ($currentLocationWithoutHash) { + /* Already initialized */ + return + } + if (!supported) { + triggerPageEvent('change', true) + return + } + for (var i = arguments.length - 1; i >= 0; i--) { + var arg = arguments[i] + if (arg === true) { + $useWhitelist = true + } + else if (arg == 'mousedown') { + $preloadOnMousedown = true + } + else if (typeof arg == 'number') { + $delayBeforePreload = arg + } + } + $currentLocationWithoutHash = removeHash(location.href) + $history[$currentLocationWithoutHash] = { + body: document.body, + title: document.title, + scrollY: pageYOffset + } + + var elems = document.head.children, + elem, + data + for (var i = elems.length - 1; i >= 0; i--) { + elem = elems[i] + if (elem.hasAttribute('data-instant-track')) { + data = elem.getAttribute('href') || elem.getAttribute('src') || elem.innerHTML + /* We can't use just `elem.href` and `elem.src` because we can't + retrieve `href`s and `src`s from the Ajax response. + */ + $trackedAssets.push(data) + } + } + + $xhr = new XMLHttpRequest() + $xhr.addEventListener('readystatechange', readystatechange) + + instantanize(true) + + bar.init() + + triggerPageEvent('change', true) + + addEventListener('popstate', function() { + var loc = removeHash(location.href) + if (loc == $currentLocationWithoutHash) { + return + } + + if (!(loc in $history)) { + location.href = location.href + /* Reloads the page while using cache for scripts, styles and images, + unlike `location.reload()` */ + return + } + + $history[$currentLocationWithoutHash].scrollY = pageYOffset + $currentLocationWithoutHash = loc + changePage($history[loc].title, $history[loc].body, false, $history[loc].scrollY) + }) + } + + function on(eventType, callback) { + $eventsCallbacks[eventType].push(callback) + } + + + /* The debug function isn't included by default to reduce file size. + To enable it, add a slash at the beginning of the comment englobing + the debug function, and uncomment "debug: debug," in the return + statement below the function. */ + + /* + function debug() { + return { + currentLocationWithoutHash: $currentLocationWithoutHash, + history: $history, + xhr: $xhr, + url: $url, + title: $title, + mustRedirect: $mustRedirect, + body: $body, + timing: $timing, + isPreloading: $isPreloading, + isWaitingForCompletion: $isWaitingForCompletion + } + } + //*/ + + + //////////////////// + + + return { + // debug: debug, + supported: supported, + init: init, + on: on + } + +}(document, location); diff --git a/js/main.min.js b/js/main.min.js new file mode 100644 index 0000000..bfaf6f2 --- /dev/null +++ b/js/main.min.js @@ -0,0 +1 @@ +function externalLinks(){if(document.getElementsByTagName)for(var e=document.getElementsByTagName("a"),t=0;tarticle,aside,dialog,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}mark{background:#FF0;color:#000}template{display:none}",a=o.insertBefore(a.lastChild,o.firstChild),n.hasCSS=!!a}return c||i(e,n),e}var s,c,l=e.html5||{},d=/^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i,f=/^(?:a|b|code|div|fieldset|h1|h2|h3|h4|h5|h6|i|label|li|ol|p|q|span|strong|style|table|tbody|td|th|tr|ul)$/i,u="_html5shiv",h=0,m={};!function(){try{var e=t.createElement("a");e.innerHTML="",s="hidden"in e;var n;if(!(n=1==e.childNodes.length)){t.createElement("a");var r=t.createDocumentFragment();n="undefined"==typeof r.cloneNode||"undefined"==typeof r.createDocumentFragment||"undefined"==typeof r.createElement}c=n}catch(a){c=s=!0}}();var v={elements:l.elements||"abbr article aside audio bdi canvas data datalist details dialog figcaption figure footer header hgroup main mark meter nav output progress section summary template time video",version:"3.7.0",shivCSS:!1!==l.shivCSS,supportsUnknownElements:c,shivMethods:!1!==l.shivMethods,type:"default",shivDocument:o,createElement:a,createDocumentFragment:function(e,a){if(e||(e=t),c)return e.createDocumentFragment();for(var a=a||r(e),i=a.frag.cloneNode(),o=0,s=n(),l=s.length;l>o;o++)i.createElement(s[o]);return i}};e.html5=v,o(t)}(this,document);var InstantClick=function(e,t){function n(e){var t=e.indexOf("#");return 0>t?e:e.substr(0,t)}function r(e){for(;"A"!=e.nodeName;)e=e.parentNode;return e}function a(e){do{if(!e.hasAttribute)break;if(e.hasAttribute("data-instant"))return!1;if(e.hasAttribute("data-no-instant"))return!0}while(e=e.parentNode);return!1}function i(e){do{if(!e.hasAttribute)break;if(e.hasAttribute("data-no-instant"))return!1;if(e.hasAttribute("data-instant"))return!0}while(e=e.parentNode);return!1}function o(e,t){for(var n=0;n-1&&e.getElementById(a.substr(s+1)),l=0;if(c)for(;c.offsetParent;)l+=c.offsetTop,c=c.offsetParent;scrollTo(0,l),E=n(a)}else scrollTo(0,i);v(),W.done(),o("change",!1)}function c(){Y=!1,O=!1}function l(e){g(r(e.target).href)}function d(e){var t=r(e.target);t.addEventListener("mouseout",h),C?(T=t.href,w=setTimeout(g,C)):g(t.href)}function f(e){var t=r(e.target);x?t.removeEventListener("mousedown",l):t.removeEventListener("mouseover",d),g(t.href)}function u(e){e.which>1||e.metaKey||e.ctrlKey||(e.preventDefault(),p(r(e.target).href))}function h(){return w?(clearTimeout(w),void(w=!1)):void(Y&&!O&&(L.abort(),c()))}function m(){if(!(L.readyState<4)&&0!=L.status){if(F.ready=+new Date-F.start,o("receive"),L.getResponseHeader("Content-Type").match(/\/(x|ht|xht)ml/)){var t=e.implementation.createHTMLDocument("");t.documentElement.innerHTML=L.responseText,D=t.title,B=t.body;var r=n(S);N[r]={body:B,title:D,scrollY:r in N?N[r].scrollY:0};for(var a,i,s=t.head.children,c=0,l=s.length-1;l>=0;l--)if(a=s[l],a.hasAttribute("data-instant-track")){i=a.getAttribute("href")||a.getAttribute("src")||a.innerHTML;for(var d=I.length-1;d>=0;d--)I[d]==i&&c++}c!=I.length&&(H=!0)}else H=!0;O&&(O=!1,p(S))}}function v(r){for(var o,s=e.getElementsByTagName("a"),c=t.protocol+"//"+t.host,h=s.length-1;h>=0;h--)o=s[h],o.target||o.hasAttribute("download")||0!=o.href.indexOf(c+"/")||o.href.indexOf("#")>-1&&n(o.href)==E||(k?!i(o):a(o))||(o.addEventListener("touchstart",f),x?o.addEventListener("mousedown",l):o.addEventListener("mouseover",d),o.addEventListener("click",u));if(!r){var m,v,g,p,y=e.body.getElementsByTagName("script");for(h=0,j=y.length;j>h;h++)m=y[h],m.hasAttribute("data-no-instant")||(v=e.createElement("script"),m.src&&(v.src=m.src),m.innerHTML&&(v.innerHTML=m.innerHTML),g=m.parentNode,p=m.nextSibling,g.removeChild(m),g.insertBefore(v,p))}}function g(e){!x&&"display"in F&&+new Date-(F.start+F.display)<100||(w&&(clearTimeout(w),w=!1),e||(e=T),(!Y||e!=S&&!O)&&(Y=!0,O=!1,S=e,B=!1,H=!1,F={start:+new Date},o("fetch"),L.open("GET",e),L.send()))}function p(e){return"display"in F||(F.display=+new Date-F.start),w?S&&S!=e?void(t.href=e):(g(e),W.start(0,!0),o("wait"),void(O=!0)):!Y||O?void(t.href=e):H?void(t.href=S):B?(N[E].scrollY=pageYOffset,c(),void s(D,B,S)):(W.start(0,!0),o("wait"),void(O=!0))}function y(){if(!E){if(!q)return void o("change",!0);for(var r=arguments.length-1;r>=0;r--){var a=arguments[r];a===!0?k=!0:"mousedown"==a?x=!0:"number"==typeof a&&(C=a)}E=n(t.href),N[E]={body:e.body,title:e.title,scrollY:pageYOffset};for(var i,c,l=e.head.children,r=l.length-1;r>=0;r--)i=l[r],i.hasAttribute("data-instant-track")&&(c=i.getAttribute("href")||i.getAttribute("src")||i.innerHTML,I.push(c));L=new XMLHttpRequest,L.addEventListener("readystatechange",m),v(!0),W.init(),o("change",!0),addEventListener("popstate",function(){var e=n(t.href);if(e!=E){if(!(e in N))return void(t.href=t.href);N[E].scrollY=pageYOffset,E=e,s(N[e].title,N[e].body,!1,N[e].scrollY)}})}}function b(e,t){z[e].push(t)}var E,T,w,L,k,x,C,A=navigator.userAgent,M="createTouch"in e,N={},S=!1,D=!1,H=!1,B=!1,F={},Y=!1,O=!1,I=[],z={fetch:[],receive:[],wait:[],change:[]},W=function(){function t(){c=e.createElement("div"),c.id="instantclick",l=e.createElement("div"),l.id="instantclick-bar",l.className="instantclick-bar",c.appendChild(l);var t=["Webkit","Moz","O"];if(d="transform",!(d in l.style))for(var n=0;3>n;n++)t[n]+"Transform"in l.style&&(d=t[n]+"Transform");var r="transition";if(!(r in l.style))for(var n=0;3>n;n++)t[n]+"Transition"in l.style&&(r="-"+t[n].toLowerCase()+"-"+r);var a=e.createElement("style");a.innerHTML="#instantclick{position:"+(M?"absolute":"fixed")+";top:0;left:0;width:100%;pointer-events:none;z-index:2147483647;"+r+":opacity .25s .1s}.instantclick-bar{background:#29d;width:100%;margin-left:-100%;height:2px;"+r+":all .25s}",e.head.appendChild(a),M&&(s(),addEventListener("resize",s),addEventListener("scroll",s))}function n(t,n){f=t,e.getElementById(c.id)&&e.body.removeChild(c),c.style.opacity="1",e.getElementById(c.id)&&e.body.removeChild(c),i(),n&&setTimeout(r,0),clearTimeout(u),u=setTimeout(a,500)}function r(){f=10,i()}function a(){f+=1+2*Math.random(),f>=98?f=98:u=setTimeout(a,500),i()}function i(){l.style[d]="translate("+f+"%)",e.getElementById(c.id)||e.body.appendChild(c)}function o(){return e.getElementById(c.id)?(clearTimeout(u),f=100,i(),void(c.style.opacity="0")):(n(100==f?0:f),void setTimeout(o,0))}function s(){c.style.left=pageXOffset+"px",c.style.width=innerWidth+"px",c.style.top=pageYOffset+"px";var e="orientation"in window&&90==Math.abs(orientation),t=innerWidth/screen[e?"height":"width"]*2;c.style[d]="scaleY("+t+")"}var c,l,d,f,u;return{init:t,start:n,done:o}}(),q="pushState"in history&&(!A.match("Android")||A.match("Chrome/"))&&"file:"!=t.protocol;return{supported:q,init:y,on:b}}(document,location); \ No newline at end of file diff --git a/js/scripts-min.js b/js/scripts-min.js deleted file mode 100644 index 3cf9448..0000000 --- a/js/scripts-min.js +++ /dev/null @@ -1 +0,0 @@ -function externalLinks(){if(document.getElementsByTagName)for(var e=document.getElementsByTagName("a"),t=0;t li { - position: relative; -} -.fa-li { - position: absolute; - left: -2.14285714em; - width: 2.14285714em; - top: 0.14285714em; - text-align: center; -} -.fa-li.fa-lg { - left: -1.85714286em; -} -.fa-border { - padding: .2em .25em .15em; - border: solid 0.08em #eeeeee; - border-radius: .1em; -} -.pull-right { - float: right; -} -.pull-left { - float: left; -} -.fa.pull-left { - margin-right: .3em; -} -.fa.pull-right { - margin-left: .3em; -} -.fa-spin { - -webkit-animation: spin 2s infinite linear; - -moz-animation: spin 2s infinite linear; - -o-animation: spin 2s infinite linear; - animation: spin 2s infinite linear; -} -@-moz-keyframes spin { - 0% { - -moz-transform: rotate(0deg); - } - 100% { - -moz-transform: rotate(359deg); - } -} -@-webkit-keyframes spin { - 0% { - -webkit-transform: rotate(0deg); - } - 100% { - -webkit-transform: rotate(359deg); - } -} -@-o-keyframes spin { - 0% { - -o-transform: rotate(0deg); - } - 100% { - -o-transform: rotate(359deg); - } -} -@keyframes spin { - 0% { - -webkit-transform: rotate(0deg); - transform: rotate(0deg); - } - 100% { - -webkit-transform: rotate(359deg); - transform: rotate(359deg); - } -} -.fa-rotate-90 { - filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1); - -webkit-transform: rotate(90deg); - -moz-transform: rotate(90deg); - -ms-transform: rotate(90deg); - -o-transform: rotate(90deg); - transform: rotate(90deg); -} -.fa-rotate-180 { - filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2); - -webkit-transform: rotate(180deg); - -moz-transform: rotate(180deg); - -ms-transform: rotate(180deg); - -o-transform: rotate(180deg); - transform: rotate(180deg); -} -.fa-rotate-270 { - filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); - -webkit-transform: rotate(270deg); - -moz-transform: rotate(270deg); - -ms-transform: rotate(270deg); - -o-transform: rotate(270deg); - transform: rotate(270deg); -} -.fa-flip-horizontal { - filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1); - -webkit-transform: scale(-1, 1); - -moz-transform: scale(-1, 1); - -ms-transform: scale(-1, 1); - -o-transform: scale(-1, 1); - transform: scale(-1, 1); -} -.fa-flip-vertical { - filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1); - -webkit-transform: scale(1, -1); - -moz-transform: scale(1, -1); - -ms-transform: scale(1, -1); - -o-transform: scale(1, -1); - transform: scale(1, -1); -} -.fa-stack { - position: relative; - display: inline-block; - width: 2em; - height: 2em; - line-height: 2em; - vertical-align: middle; -} -.fa-stack-1x, -.fa-stack-2x { - position: absolute; - left: 0; - width: 100%; - text-align: center; -} -.fa-stack-1x { - line-height: inherit; -} -.fa-stack-2x { - font-size: 2em; -} -.fa-inverse { - color: #ffffff; -} -/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen - readers do not read off random characters that represent icons */ -.fa-glass:before { - content: "\f000"; -} -.fa-music:before { - content: "\f001"; -} -.fa-search:before { - content: "\f002"; -} -.fa-envelope-o:before { - content: "\f003"; -} -.fa-heart:before { - content: "\f004"; -} -.fa-star:before { - content: "\f005"; -} -.fa-star-o:before { - content: "\f006"; -} -.fa-user:before { - content: "\f007"; -} -.fa-film:before { - content: "\f008"; -} -.fa-th-large:before { - content: "\f009"; -} -.fa-th:before { - content: "\f00a"; -} -.fa-th-list:before { - content: "\f00b"; -} -.fa-check:before { - content: "\f00c"; -} -.fa-times:before { - content: "\f00d"; -} -.fa-search-plus:before { - content: "\f00e"; -} -.fa-search-minus:before { - content: "\f010"; -} -.fa-power-off:before { - content: "\f011"; -} -.fa-signal:before { - content: "\f012"; -} -.fa-gear:before, -.fa-cog:before { - content: "\f013"; -} -.fa-trash-o:before { - content: "\f014"; -} -.fa-home:before { - content: "\f015"; -} -.fa-file-o:before { - content: "\f016"; -} -.fa-clock-o:before { - content: "\f017"; -} -.fa-road:before { - content: "\f018"; -} -.fa-download:before { - content: "\f019"; -} -.fa-arrow-circle-o-down:before { - content: "\f01a"; -} -.fa-arrow-circle-o-up:before { - content: "\f01b"; -} -.fa-inbox:before { - content: "\f01c"; -} -.fa-play-circle-o:before { - content: "\f01d"; -} -.fa-rotate-right:before, -.fa-repeat:before { - content: "\f01e"; -} -.fa-refresh:before { - content: "\f021"; -} -.fa-list-alt:before { - content: "\f022"; -} -.fa-lock:before { - content: "\f023"; -} -.fa-flag:before { - content: "\f024"; -} -.fa-headphones:before { - content: "\f025"; -} -.fa-volume-off:before { - content: "\f026"; -} -.fa-volume-down:before { - content: "\f027"; -} -.fa-volume-up:before { - content: "\f028"; -} -.fa-qrcode:before { - content: "\f029"; -} -.fa-barcode:before { - content: "\f02a"; -} -.fa-tag:before { - content: "\f02b"; -} -.fa-tags:before { - content: "\f02c"; -} -.fa-book:before { - content: "\f02d"; -} -.fa-bookmark:before { - content: "\f02e"; -} -.fa-print:before { - content: "\f02f"; -} -.fa-camera:before { - content: "\f030"; -} -.fa-font:before { - content: "\f031"; -} -.fa-bold:before { - content: "\f032"; -} -.fa-italic:before { - content: "\f033"; -} -.fa-text-height:before { - content: "\f034"; -} -.fa-text-width:before { - content: "\f035"; -} -.fa-align-left:before { - content: "\f036"; -} -.fa-align-center:before { - content: "\f037"; -} -.fa-align-right:before { - content: "\f038"; -} -.fa-align-justify:before { - content: "\f039"; -} -.fa-list:before { - content: "\f03a"; -} -.fa-dedent:before, -.fa-outdent:before { - content: "\f03b"; -} -.fa-indent:before { - content: "\f03c"; -} -.fa-video-camera:before { - content: "\f03d"; -} -.fa-photo:before, -.fa-image:before, -.fa-picture-o:before { - content: "\f03e"; -} -.fa-pencil:before { - content: "\f040"; -} -.fa-map-marker:before { - content: "\f041"; -} -.fa-adjust:before { - content: "\f042"; -} -.fa-tint:before { - content: "\f043"; -} -.fa-edit:before, -.fa-pencil-square-o:before { - content: "\f044"; -} -.fa-share-square-o:before { - content: "\f045"; -} -.fa-check-square-o:before { - content: "\f046"; -} -.fa-arrows:before { - content: "\f047"; -} -.fa-step-backward:before { - content: "\f048"; -} -.fa-fast-backward:before { - content: "\f049"; -} -.fa-backward:before { - content: "\f04a"; -} -.fa-play:before { - content: "\f04b"; -} -.fa-pause:before { - content: "\f04c"; -} -.fa-stop:before { - content: "\f04d"; -} -.fa-forward:before { - content: "\f04e"; -} -.fa-fast-forward:before { - content: "\f050"; -} -.fa-step-forward:before { - content: "\f051"; -} -.fa-eject:before { - content: "\f052"; -} -.fa-chevron-left:before { - content: "\f053"; -} -.fa-chevron-right:before { - content: "\f054"; -} -.fa-plus-circle:before { - content: "\f055"; -} -.fa-minus-circle:before { - content: "\f056"; -} -.fa-times-circle:before { - content: "\f057"; -} -.fa-check-circle:before { - content: "\f058"; -} -.fa-question-circle:before { - content: "\f059"; -} -.fa-info-circle:before { - content: "\f05a"; -} -.fa-crosshairs:before { - content: "\f05b"; -} -.fa-times-circle-o:before { - content: "\f05c"; -} -.fa-check-circle-o:before { - content: "\f05d"; -} -.fa-ban:before { - content: "\f05e"; -} -.fa-arrow-left:before { - content: "\f060"; -} -.fa-arrow-right:before { - content: "\f061"; -} -.fa-arrow-up:before { - content: "\f062"; -} -.fa-arrow-down:before { - content: "\f063"; -} -.fa-mail-forward:before, -.fa-share:before { - content: "\f064"; -} -.fa-expand:before { - content: "\f065"; -} -.fa-compress:before { - content: "\f066"; -} -.fa-plus:before { - content: "\f067"; -} -.fa-minus:before { - content: "\f068"; -} -.fa-asterisk:before { - content: "\f069"; -} -.fa-exclamation-circle:before { - content: "\f06a"; -} -.fa-gift:before { - content: "\f06b"; -} -.fa-leaf:before { - content: "\f06c"; -} -.fa-fire:before { - content: "\f06d"; -} -.fa-eye:before { - content: "\f06e"; -} -.fa-eye-slash:before { - content: "\f070"; -} -.fa-warning:before, -.fa-exclamation-triangle:before { - content: "\f071"; -} -.fa-plane:before { - content: "\f072"; -} -.fa-calendar:before { - content: "\f073"; -} -.fa-random:before { - content: "\f074"; -} -.fa-comment:before { - content: "\f075"; -} -.fa-magnet:before { - content: "\f076"; -} -.fa-chevron-up:before { - content: "\f077"; -} -.fa-chevron-down:before { - content: "\f078"; -} -.fa-retweet:before { - content: "\f079"; -} -.fa-shopping-cart:before { - content: "\f07a"; -} -.fa-folder:before { - content: "\f07b"; -} -.fa-folder-open:before { - content: "\f07c"; -} -.fa-arrows-v:before { - content: "\f07d"; -} -.fa-arrows-h:before { - content: "\f07e"; -} -.fa-bar-chart-o:before { - content: "\f080"; -} -.fa-twitter-square:before { - content: "\f081"; -} -.fa-facebook-square:before { - content: "\f082"; -} -.fa-camera-retro:before { - content: "\f083"; -} -.fa-key:before { - content: "\f084"; -} -.fa-gears:before, -.fa-cogs:before { - content: "\f085"; -} -.fa-comments:before { - content: "\f086"; -} -.fa-thumbs-o-up:before { - content: "\f087"; -} -.fa-thumbs-o-down:before { - content: "\f088"; -} -.fa-star-half:before { - content: "\f089"; -} -.fa-heart-o:before { - content: "\f08a"; -} -.fa-sign-out:before { - content: "\f08b"; -} -.fa-linkedin-square:before { - content: "\f08c"; -} -.fa-thumb-tack:before { - content: "\f08d"; -} -.fa-external-link:before { - content: "\f08e"; -} -.fa-sign-in:before { - content: "\f090"; -} -.fa-trophy:before { - content: "\f091"; -} -.fa-github-square:before { - content: "\f092"; -} -.fa-upload:before { - content: "\f093"; -} -.fa-lemon-o:before { - content: "\f094"; -} -.fa-phone:before { - content: "\f095"; -} -.fa-square-o:before { - content: "\f096"; -} -.fa-bookmark-o:before { - content: "\f097"; -} -.fa-phone-square:before { - content: "\f098"; -} -.fa-twitter:before { - content: "\f099"; -} -.fa-facebook:before { - content: "\f09a"; -} -.fa-github:before { - content: "\f09b"; -} -.fa-unlock:before { - content: "\f09c"; -} -.fa-credit-card:before { - content: "\f09d"; -} -.fa-rss:before { - content: "\f09e"; -} -.fa-hdd-o:before { - content: "\f0a0"; -} -.fa-bullhorn:before { - content: "\f0a1"; -} -.fa-bell:before { - content: "\f0f3"; -} -.fa-certificate:before { - content: "\f0a3"; -} -.fa-hand-o-right:before { - content: "\f0a4"; -} -.fa-hand-o-left:before { - content: "\f0a5"; -} -.fa-hand-o-up:before { - content: "\f0a6"; -} -.fa-hand-o-down:before { - content: "\f0a7"; -} -.fa-arrow-circle-left:before { - content: "\f0a8"; -} -.fa-arrow-circle-right:before { - content: "\f0a9"; -} -.fa-arrow-circle-up:before { - content: "\f0aa"; -} -.fa-arrow-circle-down:before { - content: "\f0ab"; -} -.fa-globe:before { - content: "\f0ac"; -} -.fa-wrench:before { - content: "\f0ad"; -} -.fa-tasks:before { - content: "\f0ae"; -} -.fa-filter:before { - content: "\f0b0"; -} -.fa-briefcase:before { - content: "\f0b1"; -} -.fa-arrows-alt:before { - content: "\f0b2"; -} -.fa-group:before, -.fa-users:before { - content: "\f0c0"; -} -.fa-chain:before, -.fa-link:before { - content: "\f0c1"; -} -.fa-cloud:before { - content: "\f0c2"; -} -.fa-flask:before { - content: "\f0c3"; -} -.fa-cut:before, -.fa-scissors:before { - content: "\f0c4"; -} -.fa-copy:before, -.fa-files-o:before { - content: "\f0c5"; -} -.fa-paperclip:before { - content: "\f0c6"; -} -.fa-save:before, -.fa-floppy-o:before { - content: "\f0c7"; -} -.fa-square:before { - content: "\f0c8"; -} -.fa-navicon:before, -.fa-reorder:before, -.fa-bars:before { - content: "\f0c9"; -} -.fa-list-ul:before { - content: "\f0ca"; -} -.fa-list-ol:before { - content: "\f0cb"; -} -.fa-strikethrough:before { - content: "\f0cc"; -} -.fa-underline:before { - content: "\f0cd"; -} -.fa-table:before { - content: "\f0ce"; -} -.fa-magic:before { - content: "\f0d0"; -} -.fa-truck:before { - content: "\f0d1"; -} -.fa-pinterest:before { - content: "\f0d2"; -} -.fa-pinterest-square:before { - content: "\f0d3"; -} -.fa-google-plus-square:before { - content: "\f0d4"; -} -.fa-google-plus:before { - content: "\f0d5"; -} -.fa-money:before { - content: "\f0d6"; -} -.fa-caret-down:before { - content: "\f0d7"; -} -.fa-caret-up:before { - content: "\f0d8"; -} -.fa-caret-left:before { - content: "\f0d9"; -} -.fa-caret-right:before { - content: "\f0da"; -} -.fa-columns:before { - content: "\f0db"; -} -.fa-unsorted:before, -.fa-sort:before { - content: "\f0dc"; -} -.fa-sort-down:before, -.fa-sort-desc:before { - content: "\f0dd"; -} -.fa-sort-up:before, -.fa-sort-asc:before { - content: "\f0de"; -} -.fa-envelope:before { - content: "\f0e0"; -} -.fa-linkedin:before { - content: "\f0e1"; -} -.fa-rotate-left:before, -.fa-undo:before { - content: "\f0e2"; -} -.fa-legal:before, -.fa-gavel:before { - content: "\f0e3"; -} -.fa-dashboard:before, -.fa-tachometer:before { - content: "\f0e4"; -} -.fa-comment-o:before { - content: "\f0e5"; -} -.fa-comments-o:before { - content: "\f0e6"; -} -.fa-flash:before, -.fa-bolt:before { - content: "\f0e7"; -} -.fa-sitemap:before { - content: "\f0e8"; -} -.fa-umbrella:before { - content: "\f0e9"; -} -.fa-paste:before, -.fa-clipboard:before { - content: "\f0ea"; -} -.fa-lightbulb-o:before { - content: "\f0eb"; -} -.fa-exchange:before { - content: "\f0ec"; -} -.fa-cloud-download:before { - content: "\f0ed"; -} -.fa-cloud-upload:before { - content: "\f0ee"; -} -.fa-user-md:before { - content: "\f0f0"; -} -.fa-stethoscope:before { - content: "\f0f1"; -} -.fa-suitcase:before { - content: "\f0f2"; -} -.fa-bell-o:before { - content: "\f0a2"; -} -.fa-coffee:before { - content: "\f0f4"; -} -.fa-cutlery:before { - content: "\f0f5"; -} -.fa-file-text-o:before { - content: "\f0f6"; -} -.fa-building-o:before { - content: "\f0f7"; -} -.fa-hospital-o:before { - content: "\f0f8"; -} -.fa-ambulance:before { - content: "\f0f9"; -} -.fa-medkit:before { - content: "\f0fa"; -} -.fa-fighter-jet:before { - content: "\f0fb"; -} -.fa-beer:before { - content: "\f0fc"; -} -.fa-h-square:before { - content: "\f0fd"; -} -.fa-plus-square:before { - content: "\f0fe"; -} -.fa-angle-double-left:before { - content: "\f100"; -} -.fa-angle-double-right:before { - content: "\f101"; -} -.fa-angle-double-up:before { - content: "\f102"; -} -.fa-angle-double-down:before { - content: "\f103"; -} -.fa-angle-left:before { - content: "\f104"; -} -.fa-angle-right:before { - content: "\f105"; -} -.fa-angle-up:before { - content: "\f106"; -} -.fa-angle-down:before { - content: "\f107"; -} -.fa-desktop:before { - content: "\f108"; -} -.fa-laptop:before { - content: "\f109"; -} -.fa-tablet:before { - content: "\f10a"; -} -.fa-mobile-phone:before, -.fa-mobile:before { - content: "\f10b"; -} -.fa-circle-o:before { - content: "\f10c"; -} -.fa-quote-left:before { - content: "\f10d"; -} -.fa-quote-right:before { - content: "\f10e"; -} -.fa-spinner:before { - content: "\f110"; -} -.fa-circle:before { - content: "\f111"; -} -.fa-mail-reply:before, -.fa-reply:before { - content: "\f112"; -} -.fa-github-alt:before { - content: "\f113"; -} -.fa-folder-o:before { - content: "\f114"; -} -.fa-folder-open-o:before { - content: "\f115"; -} -.fa-smile-o:before { - content: "\f118"; -} -.fa-frown-o:before { - content: "\f119"; -} -.fa-meh-o:before { - content: "\f11a"; -} -.fa-gamepad:before { - content: "\f11b"; -} -.fa-keyboard-o:before { - content: "\f11c"; -} -.fa-flag-o:before { - content: "\f11d"; -} -.fa-flag-checkered:before { - content: "\f11e"; -} -.fa-terminal:before { - content: "\f120"; -} -.fa-code:before { - content: "\f121"; -} -.fa-mail-reply-all:before, -.fa-reply-all:before { - content: "\f122"; -} -.fa-star-half-empty:before, -.fa-star-half-full:before, -.fa-star-half-o:before { - content: "\f123"; -} -.fa-location-arrow:before { - content: "\f124"; -} -.fa-crop:before { - content: "\f125"; -} -.fa-code-fork:before { - content: "\f126"; -} -.fa-unlink:before, -.fa-chain-broken:before { - content: "\f127"; -} -.fa-question:before { - content: "\f128"; -} -.fa-info:before { - content: "\f129"; -} -.fa-exclamation:before { - content: "\f12a"; -} -.fa-superscript:before { - content: "\f12b"; -} -.fa-subscript:before { - content: "\f12c"; -} -.fa-eraser:before { - content: "\f12d"; -} -.fa-puzzle-piece:before { - content: "\f12e"; -} -.fa-microphone:before { - content: "\f130"; -} -.fa-microphone-slash:before { - content: "\f131"; -} -.fa-shield:before { - content: "\f132"; -} -.fa-calendar-o:before { - content: "\f133"; -} -.fa-fire-extinguisher:before { - content: "\f134"; -} -.fa-rocket:before { - content: "\f135"; -} -.fa-maxcdn:before { - content: "\f136"; -} -.fa-chevron-circle-left:before { - content: "\f137"; -} -.fa-chevron-circle-right:before { - content: "\f138"; -} -.fa-chevron-circle-up:before { - content: "\f139"; -} -.fa-chevron-circle-down:before { - content: "\f13a"; -} -.fa-html5:before { - content: "\f13b"; -} -.fa-css3:before { - content: "\f13c"; -} -.fa-anchor:before { - content: "\f13d"; -} -.fa-unlock-alt:before { - content: "\f13e"; -} -.fa-bullseye:before { - content: "\f140"; -} -.fa-ellipsis-h:before { - content: "\f141"; -} -.fa-ellipsis-v:before { - content: "\f142"; -} -.fa-rss-square:before { - content: "\f143"; -} -.fa-play-circle:before { - content: "\f144"; -} -.fa-ticket:before { - content: "\f145"; -} -.fa-minus-square:before { - content: "\f146"; -} -.fa-minus-square-o:before { - content: "\f147"; -} -.fa-level-up:before { - content: "\f148"; -} -.fa-level-down:before { - content: "\f149"; -} -.fa-check-square:before { - content: "\f14a"; -} -.fa-pencil-square:before { - content: "\f14b"; -} -.fa-external-link-square:before { - content: "\f14c"; -} -.fa-share-square:before { - content: "\f14d"; -} -.fa-compass:before { - content: "\f14e"; -} -.fa-toggle-down:before, -.fa-caret-square-o-down:before { - content: "\f150"; -} -.fa-toggle-up:before, -.fa-caret-square-o-up:before { - content: "\f151"; -} -.fa-toggle-right:before, -.fa-caret-square-o-right:before { - content: "\f152"; -} -.fa-euro:before, -.fa-eur:before { - content: "\f153"; -} -.fa-gbp:before { - content: "\f154"; -} -.fa-dollar:before, -.fa-usd:before { - content: "\f155"; -} -.fa-rupee:before, -.fa-inr:before { - content: "\f156"; -} -.fa-cny:before, -.fa-rmb:before, -.fa-yen:before, -.fa-jpy:before { - content: "\f157"; -} -.fa-ruble:before, -.fa-rouble:before, -.fa-rub:before { - content: "\f158"; -} -.fa-won:before, -.fa-krw:before { - content: "\f159"; -} -.fa-bitcoin:before, -.fa-btc:before { - content: "\f15a"; -} -.fa-file:before { - content: "\f15b"; -} -.fa-file-text:before { - content: "\f15c"; -} -.fa-sort-alpha-asc:before { - content: "\f15d"; -} -.fa-sort-alpha-desc:before { - content: "\f15e"; -} -.fa-sort-amount-asc:before { - content: "\f160"; -} -.fa-sort-amount-desc:before { - content: "\f161"; -} -.fa-sort-numeric-asc:before { - content: "\f162"; -} -.fa-sort-numeric-desc:before { - content: "\f163"; -} -.fa-thumbs-up:before { - content: "\f164"; -} -.fa-thumbs-down:before { - content: "\f165"; -} -.fa-youtube-square:before { - content: "\f166"; -} -.fa-youtube:before { - content: "\f167"; -} -.fa-xing:before { - content: "\f168"; -} -.fa-xing-square:before { - content: "\f169"; -} -.fa-youtube-play:before { - content: "\f16a"; -} -.fa-dropbox:before { - content: "\f16b"; -} -.fa-stack-overflow:before { - content: "\f16c"; -} -.fa-instagram:before { - content: "\f16d"; -} -.fa-flickr:before { - content: "\f16e"; -} -.fa-adn:before { - content: "\f170"; -} -.fa-bitbucket:before { - content: "\f171"; -} -.fa-bitbucket-square:before { - content: "\f172"; -} -.fa-tumblr:before { - content: "\f173"; -} -.fa-tumblr-square:before { - content: "\f174"; -} -.fa-long-arrow-down:before { - content: "\f175"; -} -.fa-long-arrow-up:before { - content: "\f176"; -} -.fa-long-arrow-left:before { - content: "\f177"; -} -.fa-long-arrow-right:before { - content: "\f178"; -} -.fa-apple:before { - content: "\f179"; -} -.fa-windows:before { - content: "\f17a"; -} -.fa-android:before { - content: "\f17b"; -} -.fa-linux:before { - content: "\f17c"; -} -.fa-dribbble:before { - content: "\f17d"; -} -.fa-skype:before { - content: "\f17e"; -} -.fa-foursquare:before { - content: "\f180"; -} -.fa-trello:before { - content: "\f181"; -} -.fa-female:before { - content: "\f182"; -} -.fa-male:before { - content: "\f183"; -} -.fa-gittip:before { - content: "\f184"; -} -.fa-sun-o:before { - content: "\f185"; -} -.fa-moon-o:before { - content: "\f186"; -} -.fa-archive:before { - content: "\f187"; -} -.fa-bug:before { - content: "\f188"; -} -.fa-vk:before { - content: "\f189"; -} -.fa-weibo:before { - content: "\f18a"; -} -.fa-renren:before { - content: "\f18b"; -} -.fa-pagelines:before { - content: "\f18c"; -} -.fa-stack-exchange:before { - content: "\f18d"; -} -.fa-arrow-circle-o-right:before { - content: "\f18e"; -} -.fa-arrow-circle-o-left:before { - content: "\f190"; -} -.fa-toggle-left:before, -.fa-caret-square-o-left:before { - content: "\f191"; -} -.fa-dot-circle-o:before { - content: "\f192"; -} -.fa-wheelchair:before { - content: "\f193"; -} -.fa-vimeo-square:before { - content: "\f194"; -} -.fa-turkish-lira:before, -.fa-try:before { - content: "\f195"; -} -.fa-plus-square-o:before { - content: "\f196"; -} -.fa-space-shuttle:before { - content: "\f197"; -} -.fa-slack:before { - content: "\f198"; -} -.fa-envelope-square:before { - content: "\f199"; -} -.fa-wordpress:before { - content: "\f19a"; -} -.fa-openid:before { - content: "\f19b"; -} -.fa-institution:before, -.fa-bank:before, -.fa-university:before { - content: "\f19c"; -} -.fa-mortar-board:before, -.fa-graduation-cap:before { - content: "\f19d"; -} -.fa-yahoo:before { - content: "\f19e"; -} -.fa-google:before { - content: "\f1a0"; -} -.fa-reddit:before { - content: "\f1a1"; -} -.fa-reddit-square:before { - content: "\f1a2"; -} -.fa-stumbleupon-circle:before { - content: "\f1a3"; -} -.fa-stumbleupon:before { - content: "\f1a4"; -} -.fa-delicious:before { - content: "\f1a5"; -} -.fa-digg:before { - content: "\f1a6"; -} -.fa-pied-piper-square:before, -.fa-pied-piper:before { - content: "\f1a7"; -} -.fa-pied-piper-alt:before { - content: "\f1a8"; -} -.fa-drupal:before { - content: "\f1a9"; -} -.fa-joomla:before { - content: "\f1aa"; -} -.fa-language:before { - content: "\f1ab"; -} -.fa-fax:before { - content: "\f1ac"; -} -.fa-building:before { - content: "\f1ad"; -} -.fa-child:before { - content: "\f1ae"; -} -.fa-paw:before { - content: "\f1b0"; -} -.fa-spoon:before { - content: "\f1b1"; -} -.fa-cube:before { - content: "\f1b2"; -} -.fa-cubes:before { - content: "\f1b3"; -} -.fa-behance:before { - content: "\f1b4"; -} -.fa-behance-square:before { - content: "\f1b5"; -} -.fa-steam:before { - content: "\f1b6"; -} -.fa-steam-square:before { - content: "\f1b7"; -} -.fa-recycle:before { - content: "\f1b8"; -} -.fa-automobile:before, -.fa-car:before { - content: "\f1b9"; -} -.fa-cab:before, -.fa-taxi:before { - content: "\f1ba"; -} -.fa-tree:before { - content: "\f1bb"; -} -.fa-spotify:before { - content: "\f1bc"; -} -.fa-deviantart:before { - content: "\f1bd"; -} -.fa-soundcloud:before { - content: "\f1be"; -} -.fa-database:before { - content: "\f1c0"; -} -.fa-file-pdf-o:before { - content: "\f1c1"; -} -.fa-file-word-o:before { - content: "\f1c2"; -} -.fa-file-excel-o:before { - content: "\f1c3"; -} -.fa-file-powerpoint-o:before { - content: "\f1c4"; -} -.fa-file-photo-o:before, -.fa-file-picture-o:before, -.fa-file-image-o:before { - content: "\f1c5"; -} -.fa-file-zip-o:before, -.fa-file-archive-o:before { - content: "\f1c6"; -} -.fa-file-sound-o:before, -.fa-file-audio-o:before { - content: "\f1c7"; -} -.fa-file-movie-o:before, -.fa-file-video-o:before { - content: "\f1c8"; -} -.fa-file-code-o:before { - content: "\f1c9"; -} -.fa-vine:before { - content: "\f1ca"; -} -.fa-codepen:before { - content: "\f1cb"; -} -.fa-jsfiddle:before { - content: "\f1cc"; -} -.fa-life-bouy:before, -.fa-life-saver:before, -.fa-support:before, -.fa-life-ring:before { - content: "\f1cd"; -} -.fa-circle-o-notch:before { - content: "\f1ce"; -} -.fa-ra:before, -.fa-rebel:before { - content: "\f1d0"; -} -.fa-ge:before, -.fa-empire:before { - content: "\f1d1"; -} -.fa-git-square:before { - content: "\f1d2"; -} -.fa-git:before { - content: "\f1d3"; -} -.fa-hacker-news:before { - content: "\f1d4"; -} -.fa-tencent-weibo:before { - content: "\f1d5"; -} -.fa-qq:before { - content: "\f1d6"; -} -.fa-wechat:before, -.fa-weixin:before { - content: "\f1d7"; -} -.fa-send:before, -.fa-paper-plane:before { - content: "\f1d8"; -} -.fa-send-o:before, -.fa-paper-plane-o:before { - content: "\f1d9"; -} -.fa-history:before { - content: "\f1da"; -} -.fa-circle-thin:before { - content: "\f1db"; -} -.fa-header:before { - content: "\f1dc"; -} -.fa-paragraph:before { - content: "\f1dd"; -} -.fa-sliders:before { - content: "\f1de"; -} -.fa-share-alt:before { - content: "\f1e0"; -} -.fa-share-alt-square:before { - content: "\f1e1"; -} -.fa-bomb:before { - content: "\f1e2"; -} diff --git a/scss/main.scss b/scss/main.scss deleted file mode 100644 index b5da15f..0000000 --- a/scss/main.scss +++ /dev/null @@ -1,264 +0,0 @@ -/*----------------------------------------*\ - Schwerkraftlabor.de | @Gehirnfussel -\*----------------------------------------*/ - -/* Imports ---------------------------*/ - -/* @import 'normalize'; */ -/* @import 'font-awesome'; */ -@import 'mixins'; -@import 'defaults'; - -/* Content ---------------------------*/ - -$greybackground: #404040; -$whitebackground: #eeeeee; -$linkcolor: #8d3812; - -body { - color: #1e1e1e; - background: $whitebackground; - font-family: $font-sans-serif; - font-size: 12pt; - @include font-smoothing(off); -} -h1, h2, h3 { - font-family: $font-sans-serif; - font-weight: 700; - line-height: 1.2em; - margin: 0.4em 0.0em; -} -h1 { - font-size: 2.0em; - word-break: break-all; - @media only screen and (max-width: 640px) { - font-size: 1.7em; - } -} -h2 { - font-size: 1.5em; - @media only screen and (max-width: 640px) { - font-size: 1.4em; - } -} -h3 { - font-size: 1.25em; - @media only screen and (max-width: 640px) { - font-size: 1.2em; - } -} -p { - line-height: 1.6em; - padding: 0.5em 0; -} -ul { - li { - margin: 0.3em 0em 0.3em 0.5em; - list-style-position: inside; - list-style-type: square; - font-size: 1em; - - p { - padding-left: 1em; - } - } -} -a { - color: $linkcolor; - @include transition(color 0.2s ease); - &:hover, &:active, &:focus{ - color: lighten($linkcolor, 15%); - } - &:active { - position: relative; - top: 1px; - } -} -a.notdown { - &:active { - position: inherit; - } -} -/* -@media screen { - a.external:after { - content: "\00A0" "[" "\2197" "]"; - } -} -*/ - -/* Header ---------------------------*/ - -.menu { - background: lighten($greybackground, 10%); - border-bottom: darken($greybackground, 30%) 1px solid; - font-size: 1.2em; - width: 100%; - padding: .6em; - color: #ddd; - z-index: 100; - - @media only screen and (max-width: 640px) { - font-size: 1em; - } -} - - -/* Content ---------------------------*/ - -.seperator { - position: relative; - .bg { - background-size: cover !important; - margin: 0 auto; - padding: 0; - position: absolute; - width: 100%; - - @media only screen and (min-width: 980px) { - background-attachment: fixed !important; - } - } -} - -.seperator1 { - height: 517px; - @media only screen and (max-width: 640px) { - height: 276px; - } - .bg { - height: 517px; - background: url(../img/trees.jpg) repeat center; - @media only screen and (max-width: 640px) { - height: 276px; - background-image: url(../img/trees_640.jpg); - } - } -} - -.seperator2 { - height: 440px; - @media only screen and (max-width: 640px) { - height: 235px; - } - .bg { - height: 440px; - background: url(../img/code.jpg) repeat center; - @media only screen and (max-width: 640px) { - height: 235px; - background-image: url(../img/code_640.jpg); - } - } -} - -.seperator3 { - height: 435px; - @media only screen and (max-width: 640px) { - height: 232px; - } - .bg { - height: 435px; - background: url(../img/breakfast.jpg) repeat center; - @media only screen and (max-width: 640px) { - height: 232px; - background-image: url(../img/breakfast_640.jpg); - } - } -} - - -.text { - margin: 1em; - - h1 { - font-family: 'Merriweather', serif; - } -} - - -/* Footer ---------------------------*/ - - - - -/* Responsive Stuff ---------------------------*/ - -@media screen and (max-width: 768px) { - .column.full, - .column.three-fourth, - .column.two-thirds, - .column.half { - float: none; - margin: 0; - width: 100%; - } - .column.one-third, - .column.one-fourth { - float: left; - margin: 0; - width: 50%; - padding: 0.4em; - } -} - -@media screen and (max-width: 568px) { - .column.one-third, - .column.two-third { - float: none; - margin: 0; - width: 100%; - } -.wr_topbar { - font-size: 10.5pt; -} -.wr_infobar ul { - li { - width: 33%; - padding: 0.2em; - - a { - padding: 0.7em 0.5em; - } - } - } -.wr_infobar img { - height: 70px; - width: 222px; -} - -} - -@media screen and (max-width: 480px) { -.column.one-third, -.column.one-fourth, -.column.full, -.column.three-fourth, -.column.two-thirds, -.column.half, -.column.full { - float: left; - margin: 0; - width: 100%; -} -.wr_infobar ul { - li { - width: 50%; - padding: 0.1em; - text-transform: none; - } - } -.wr_footer ul { - li { - width: 48%; - padding: 0.3em; - margin: 1%; - } - } - -} diff --git a/src/img/breakfast.jpg b/src/img/breakfast.jpg deleted file mode 100644 index 644b07c..0000000 Binary files a/src/img/breakfast.jpg and /dev/null differ diff --git a/src/img/bunny.jpg b/src/img/bunny.jpg new file mode 100644 index 0000000..3cf3720 Binary files /dev/null and b/src/img/bunny.jpg differ diff --git a/src/img/code.jpg b/src/img/code.jpg deleted file mode 100644 index 8ef8eb5..0000000 Binary files a/src/img/code.jpg and /dev/null differ diff --git a/src/img/me.jpg b/src/img/me.jpg new file mode 100644 index 0000000..dc89a62 Binary files /dev/null and b/src/img/me.jpg differ diff --git a/src/img/trees.jpg b/src/img/trees.jpg deleted file mode 100644 index 361676d..0000000 Binary files a/src/img/trees.jpg and /dev/null differ diff --git a/js/html5shiv.js b/src/js/html5shiv/html5shiv.js similarity index 100% rename from js/html5shiv.js rename to src/js/html5shiv/html5shiv.js diff --git a/src/js/instantclick/instantclick.js b/src/js/instantclick/instantclick.js new file mode 100644 index 0000000..678e38c --- /dev/null +++ b/src/js/instantclick/instantclick.js @@ -0,0 +1,693 @@ +/* InstantClick 3.0.1 | (C) 2014 Alexandre Dieulot | http://instantclick.io/license.html */ + +var InstantClick = function(document, location) { + // Internal variables + var $ua = navigator.userAgent, + $hasTouch = 'createTouch' in document, + $currentLocationWithoutHash, + $urlToPreload, + $preloadTimer, + + // Preloading-related variables + $history = {}, + $xhr, + $url = false, + $title = false, + $mustRedirect = false, + $body = false, + $timing = {}, + $isPreloading = false, + $isWaitingForCompletion = false, + $trackedAssets = [], + + // Variables defined by public functions + $useWhitelist, + $preloadOnMousedown, + $delayBeforePreload, + $eventsCallbacks = { + fetch: [], + receive: [], + wait: [], + change: [] + } + + + ////////// HELPERS ////////// + + + function removeHash(url) { + var index = url.indexOf('#') + if (index < 0) { + return url + } + return url.substr(0, index) + } + + function getLinkTarget(target) { + while (target.nodeName != 'A') { + target = target.parentNode + } + return target + } + + function isBlacklisted(elem) { + do { + if (!elem.hasAttribute) { // Parent of + break + } + if (elem.hasAttribute('data-instant')) { + return false + } + if (elem.hasAttribute('data-no-instant')) { + return true + } + } + while (elem = elem.parentNode); + return false + } + + function isWhitelisted(elem) { + do { + if (!elem.hasAttribute) { // Parent of + break + } + if (elem.hasAttribute('data-no-instant')) { + return false + } + if (elem.hasAttribute('data-instant')) { + return true + } + } + while (elem = elem.parentNode); + return false + } + + function triggerPageEvent(eventType, arg1) { + for (var i = 0; i < $eventsCallbacks[eventType].length; i++) { + $eventsCallbacks[eventType][i](arg1) + } + + /* The `change` event takes one boolean argument: "isInitialLoad" */ + } + + function changePage(title, body, newUrl, scrollY) { + document.title = title + + document.documentElement.replaceChild(body, document.body) + /* We cannot just use `document.body = doc.body`, it causes Safari (tested + 5.1, 6.0 and Mobile 7.0) to execute script tags directly. + */ + + if (newUrl) { + history.pushState(null, null, newUrl) + + var hashIndex = newUrl.indexOf('#'), + hashElem = hashIndex > -1 + && document.getElementById(newUrl.substr(hashIndex + 1)), + offset = 0 + + if (hashElem) { + while (hashElem.offsetParent) { + offset += hashElem.offsetTop + + hashElem = hashElem.offsetParent + } + } + scrollTo(0, offset) + + $currentLocationWithoutHash = removeHash(newUrl) + } + else { + scrollTo(0, scrollY) + } + instantanize() + bar.done() + triggerPageEvent('change', false) + } + + function setPreloadingAsHalted() { + $isPreloading = false + $isWaitingForCompletion = false + } + + + ////////// EVENT HANDLERS ////////// + + + function mousedown(e) { + preload(getLinkTarget(e.target).href) + } + + function mouseover(e) { + var a = getLinkTarget(e.target) + a.addEventListener('mouseout', mouseout) + + if (!$delayBeforePreload) { + preload(a.href) + } + else { + $urlToPreload = a.href + $preloadTimer = setTimeout(preload, $delayBeforePreload) + } + } + + function touchstart(e) { + var a = getLinkTarget(e.target) + if ($preloadOnMousedown) { + a.removeEventListener('mousedown', mousedown) + } + else { + a.removeEventListener('mouseover', mouseover) + } + preload(a.href) + } + + function click(e) { + if (e.which > 1 || e.metaKey || e.ctrlKey) { // Opening in new tab + return + } + e.preventDefault() + display(getLinkTarget(e.target).href) + } + + function mouseout() { + if ($preloadTimer) { + clearTimeout($preloadTimer) + $preloadTimer = false + return + } + + if (!$isPreloading || $isWaitingForCompletion) { + return + } + $xhr.abort() + setPreloadingAsHalted() + } + + function readystatechange() { + if ($xhr.readyState < 4) { + return + } + if ($xhr.status == 0) { + /* Request aborted */ + return + } + + $timing.ready = +new Date - $timing.start + triggerPageEvent('receive') + + if ($xhr.getResponseHeader('Content-Type').match(/\/(x|ht|xht)ml/)) { + var doc = document.implementation.createHTMLDocument('') + doc.documentElement.innerHTML = $xhr.responseText + $title = doc.title + $body = doc.body + var urlWithoutHash = removeHash($url) + $history[urlWithoutHash] = { + body: $body, + title: $title, + scrollY: urlWithoutHash in $history ? $history[urlWithoutHash].scrollY : 0 + } + + var elems = doc.head.children, + found = 0, + elem, + data + + for (var i = elems.length - 1; i >= 0; i--) { + elem = elems[i] + if (elem.hasAttribute('data-instant-track')) { + data = elem.getAttribute('href') || elem.getAttribute('src') || elem.innerHTML + for (var j = $trackedAssets.length - 1; j >= 0; j--) { + if ($trackedAssets[j] == data) { + found++ + } + } + } + } + if (found != $trackedAssets.length) { + $mustRedirect = true // Assets have changed + } + } + else { + $mustRedirect = true // Not an HTML document + } + + if ($isWaitingForCompletion) { + $isWaitingForCompletion = false + display($url) + } + } + + + ////////// MAIN FUNCTIONS ////////// + + + function instantanize(isInitializing) { + var as = document.getElementsByTagName('a'), + a, + domain = location.protocol + '//' + location.host + + for (var i = as.length - 1; i >= 0; i--) { + a = as[i] + if (a.target // target="_blank" etc. + || a.hasAttribute('download') + || a.href.indexOf(domain + '/') != 0 // Another domain, or no href attribute + || (a.href.indexOf('#') > -1 + && removeHash(a.href) == $currentLocationWithoutHash) // Anchor + || ($useWhitelist + ? !isWhitelisted(a) + : isBlacklisted(a)) + ) { + continue + } + a.addEventListener('touchstart', touchstart) + if ($preloadOnMousedown) { + a.addEventListener('mousedown', mousedown) + } + else { + a.addEventListener('mouseover', mouseover) + } + a.addEventListener('click', click) + } + if (!isInitializing) { + var scripts = document.body.getElementsByTagName('script'), + script, + copy, + parentNode, + nextSibling + + for (i = 0, j = scripts.length; i < j; i++) { + script = scripts[i] + if (script.hasAttribute('data-no-instant')) { + continue + } + copy = document.createElement('script') + if (script.src) { + copy.src = script.src + } + if (script.innerHTML) { + copy.innerHTML = script.innerHTML + } + parentNode = script.parentNode + nextSibling = script.nextSibling + parentNode.removeChild(script) + parentNode.insertBefore(copy, nextSibling) + } + } + } + + function preload(url) { + if (!$preloadOnMousedown + && 'display' in $timing + && +new Date - ($timing.start + $timing.display) < 100) { + /* After a page is displayed, if the user's cursor happens to be above + a link a mouseover event will be in most browsers triggered + automatically, and in other browsers it will be triggered when the + user moves his mouse by 1px. + + Here are the behavior I noticed, all on Windows: + - Safari 5.1: auto-triggers after 0 ms + - IE 11: auto-triggers after 30-80 ms (depends on page's size?) + - Firefox: auto-triggers after 10 ms + - Opera 18: auto-triggers after 10 ms + + - Chrome: triggers when cursor moved + - Opera 12.16: triggers when cursor moved + + To remedy to this, we do not start preloading if last display + occurred less than 100 ms ago. If they happen to click on the link, + they will be redirected. + */ + + return + } + if ($preloadTimer) { + clearTimeout($preloadTimer) + $preloadTimer = false + } + + if (!url) { + url = $urlToPreload + } + + if ($isPreloading && (url == $url || $isWaitingForCompletion)) { + return + } + $isPreloading = true + $isWaitingForCompletion = false + + $url = url + $body = false + $mustRedirect = false + $timing = { + start: +new Date + } + triggerPageEvent('fetch') + $xhr.open('GET', url) + $xhr.send() + } + + function display(url) { + if (!('display' in $timing)) { + $timing.display = +new Date - $timing.start + } + if ($preloadTimer) { + /* Happens when there’s a delay before preloading and that delay + hasn't expired (preloading didn't kick in). + */ + + if ($url && $url != url) { + /* Happens when the user clicks on a link before preloading + kicks in while another link is already preloading. + */ + + location.href = url + return + } + preload(url) + bar.start(0, true) + triggerPageEvent('wait') + $isWaitingForCompletion = true + return + } + if (!$isPreloading || $isWaitingForCompletion) { + /* If the page isn't preloaded, it likely means the user has focused + on a link (with his Tab key) and then pressed Return, which + triggered a click. + Because very few people do this, it isn't worth handling this case + and preloading on focus (also, focusing on a link doesn't mean it's + likely that you'll "click" on it), so we just redirect them when + they "click". + It could also mean the user hovered over a link less than 100 ms + after a page display, thus we didn't start the preload (see + comments in `preload()` for the rationale behind this.) + + If the page is waiting for completion, the user clicked twice while + the page was preloading. Either on the same link or on another + link. If it's the same link something might have gone wrong (or he + could have double clicked), so we send him to the page the old way. + If it's another link, it hasn't been preloaded, so we redirect the + user the old way. + */ + + location.href = url + return + } + if ($mustRedirect) { + location.href = $url + return + } + if (!$body) { + bar.start(0, true) + triggerPageEvent('wait') + $isWaitingForCompletion = true + return + } + $history[$currentLocationWithoutHash].scrollY = pageYOffset + setPreloadingAsHalted() + changePage($title, $body, $url) + } + + + ////////// PROGRESS BAR FUNCTIONS ////////// + + + var bar = function() { + var $barContainer, + $barElement, + $barTransformProperty, + $barProgress, + $barTimer + + function init() { + $barContainer = document.createElement('div') + $barContainer.id = 'instantclick' + $barElement = document.createElement('div') + $barElement.id = 'instantclick-bar' + $barElement.className = 'instantclick-bar' + $barContainer.appendChild($barElement) + + var vendors = ['Webkit', 'Moz', 'O'] + + $barTransformProperty = 'transform' + if (!($barTransformProperty in $barElement.style)) { + for (var i = 0; i < 3; i++) { + if (vendors[i] + 'Transform' in $barElement.style) { + $barTransformProperty = vendors[i] + 'Transform' + } + } + } + + var transitionProperty = 'transition' + if (!(transitionProperty in $barElement.style)) { + for (var i = 0; i < 3; i++) { + if (vendors[i] + 'Transition' in $barElement.style) { + transitionProperty = '-' + vendors[i].toLowerCase() + '-' + transitionProperty + } + } + } + + var style = document.createElement('style') + style.innerHTML = '#instantclick{position:' + ($hasTouch ? 'absolute' : 'fixed') + ';top:0;left:0;width:100%;pointer-events:none;z-index:2147483647;' + transitionProperty + ':opacity .25s .1s}' + + '.instantclick-bar{background:#29d;width:100%;margin-left:-100%;height:2px;' + transitionProperty + ':all .25s}' + /* We set the bar's background in `.instantclick-bar` so that it can be + overriden in CSS with `#instantclick-bar`, as IDs have higher priority. + */ + document.head.appendChild(style) + + if ($hasTouch) { + updatePositionAndScale() + addEventListener('resize', updatePositionAndScale) + addEventListener('scroll', updatePositionAndScale) + } + + } + + function start(at, jump) { + $barProgress = at + if (document.getElementById($barContainer.id)) { + document.body.removeChild($barContainer) + } + $barContainer.style.opacity = '1' + if (document.getElementById($barContainer.id)) { + document.body.removeChild($barContainer) + /* So there's no CSS animation if already done once and it goes from 1 to 0 */ + } + update() + if (jump) { + setTimeout(jumpStart, 0) + /* Must be done in a timer, otherwise the CSS animation doesn't happen. */ + } + clearTimeout($barTimer) + $barTimer = setTimeout(inc, 500) + } + + function jumpStart() { + $barProgress = 10 + update() + } + + function inc() { + $barProgress += 1 + (Math.random() * 2) + if ($barProgress >= 98) { + $barProgress = 98 + } + else { + $barTimer = setTimeout(inc, 500) + } + update() + } + + function update() { + $barElement.style[$barTransformProperty] = 'translate(' + $barProgress + '%)' + if (!document.getElementById($barContainer.id)) { + document.body.appendChild($barContainer) + } + } + + function done() { + if (document.getElementById($barContainer.id)) { + clearTimeout($barTimer) + $barProgress = 100 + update() + $barContainer.style.opacity = '0' + /* If you're debugging, setting this to 0.5 is handy. */ + return + } + + /* The bar container hasn't been appended: It's a new page. */ + start($barProgress == 100 ? 0 : $barProgress) + /* $barProgress is 100 on popstate, usually. */ + setTimeout(done, 0) + /* Must be done in a timer, otherwise the CSS animation doesn't happen. */ + } + + function updatePositionAndScale() { + /* Adapted from code by Sam Stephenson and Mislav Marohnić + http://signalvnoise.com/posts/2407 + */ + + $barContainer.style.left = pageXOffset + 'px' + $barContainer.style.width = innerWidth + 'px' + $barContainer.style.top = pageYOffset + 'px' + + var landscape = 'orientation' in window && Math.abs(orientation) == 90, + scaleY = innerWidth / screen[landscape ? 'height' : 'width'] * 2 + /* We multiply the size by 2 because the progress bar is harder + to notice on a mobile device. + */ + $barContainer.style[$barTransformProperty] = 'scaleY(' + scaleY + ')' + } + + return { + init: init, + start: start, + done: done + } + }() + + + ////////// PUBLIC VARIABLE AND FUNCTIONS ////////// + + var supported = 'pushState' in history + && (!$ua.match('Android') || $ua.match('Chrome/')) + && location.protocol != "file:" + + /* The state of Android's AOSP browsers: + + 2.3.7: pushState appears to work correctly, but + `doc.documentElement.innerHTML = body` is buggy. + See details here: http://stackoverflow.com/q/21918564 + Note an issue anymore, but it may fail where 3.0 do, this needs + testing again. + + 3.0: pushState appears to work correctly (though the URL bar is only + updated on focus), but + `document.documentElement.replaceChild(doc.body, document.body)` + throws DOMException: WRONG_DOCUMENT_ERR. + + 4.0.2: Doesn't support pushState. + + 4.0.4, + 4.1.1, + 4.2, + 4.3: pushState is here, but it doesn't update the URL bar. + (Great logic there.) + + 4.4: Works correctly. Claims to be 'Chrome/30.0.0.0'. + + All androids tested with Android SDK's Emulator. + Version numbers are from the browser's user agent. + + Because of this mess, the only whitelisted browser on Android is Chrome. + */ + + function init() { + if ($currentLocationWithoutHash) { + /* Already initialized */ + return + } + if (!supported) { + triggerPageEvent('change', true) + return + } + for (var i = arguments.length - 1; i >= 0; i--) { + var arg = arguments[i] + if (arg === true) { + $useWhitelist = true + } + else if (arg == 'mousedown') { + $preloadOnMousedown = true + } + else if (typeof arg == 'number') { + $delayBeforePreload = arg + } + } + $currentLocationWithoutHash = removeHash(location.href) + $history[$currentLocationWithoutHash] = { + body: document.body, + title: document.title, + scrollY: pageYOffset + } + + var elems = document.head.children, + elem, + data + for (var i = elems.length - 1; i >= 0; i--) { + elem = elems[i] + if (elem.hasAttribute('data-instant-track')) { + data = elem.getAttribute('href') || elem.getAttribute('src') || elem.innerHTML + /* We can't use just `elem.href` and `elem.src` because we can't + retrieve `href`s and `src`s from the Ajax response. + */ + $trackedAssets.push(data) + } + } + + $xhr = new XMLHttpRequest() + $xhr.addEventListener('readystatechange', readystatechange) + + instantanize(true) + + bar.init() + + triggerPageEvent('change', true) + + addEventListener('popstate', function() { + var loc = removeHash(location.href) + if (loc == $currentLocationWithoutHash) { + return + } + + if (!(loc in $history)) { + location.href = location.href + /* Reloads the page while using cache for scripts, styles and images, + unlike `location.reload()` */ + return + } + + $history[$currentLocationWithoutHash].scrollY = pageYOffset + $currentLocationWithoutHash = loc + changePage($history[loc].title, $history[loc].body, false, $history[loc].scrollY) + }) + } + + function on(eventType, callback) { + $eventsCallbacks[eventType].push(callback) + } + + + /* The debug function isn't included by default to reduce file size. + To enable it, add a slash at the beginning of the comment englobing + the debug function, and uncomment "debug: debug," in the return + statement below the function. */ + + /* + function debug() { + return { + currentLocationWithoutHash: $currentLocationWithoutHash, + history: $history, + xhr: $xhr, + url: $url, + title: $title, + mustRedirect: $mustRedirect, + body: $body, + timing: $timing, + isPreloading: $isPreloading, + isWaitingForCompletion: $isWaitingForCompletion + } + } + //*/ + + + //////////////////// + + + return { + // debug: debug, + supported: supported, + init: init, + on: on + } + +}(document, location); diff --git a/js/scripts.js b/src/js/scripts.js similarity index 100% rename from js/scripts.js rename to src/js/scripts.js diff --git a/src/scss/_defaults.scss b/src/scss/_defaults.scss new file mode 100644 index 0000000..d6b04c1 --- /dev/null +++ b/src/scss/_defaults.scss @@ -0,0 +1,114 @@ +/* Vars +--------------------------*/ + +$font-sans-serif: Open Sans, Helvetica, Arial, sans-serif; +$font-serif: Georgia, serif; +$font-mono: Courier, monospace; + +/* Reset +--------------------------*/ + +*, *:before, *:after { + box-sizing: inherit; +} + +html { + height: 100%; + box-sizing: border-box; + text-size-adjust: 100%; +} + +/* Ideal Viewport-Fix for IE */ +@-ms-viewport { + width: device-width; +} + +/* Cleafix +--------------------------*/ +.clearfix::before, +.clearfix::after { + content: " "; + display: table; +} + +.clearfix::after { + clear: both; +} + +.clearfix { + *zoom: 1; +} + +/* FLUIDITY v0.1.0 + @mrmrs - http://mrmrs.cc – MIT +--------------------------*/ + +img, canvas, iframe, video, svg { max-width: 100%; } + + +/* Video-Container +--------------------------*/ + +.video { + position: relative; + height: 0; + padding-bottom: 56.25%; + + & > * { + position: absolute; + top: 0; + left: 0; + height: 100%; + width: 100%; + } +} + +/* Grid and stuff +--------------------------*/ +.container { + margin: 0 auto; + /*max-width: 960px; + width: 90%;*/ +} + +.row { + overflow: hidden; + max-width: 960px; + margin: 0 auto; +} +.fullrow { + max-width: 100%; +} + +.column { + float: left; + margin-left: 5%; +} + +.column:first-child { + margin-left: 0; +} + +.column.full { + width: 100%; +} + +.column.three-fourth { + width: 63.75%; +} + +.column.two-thirds { + width: 65%; +} + +.column.half { + width: 47.5%; +} + +.column.one-third { + width: 30%; +} + +.column.one-fourth { + width: 21.25%; +} diff --git a/src/scss/_icomoon.scss b/src/scss/_icomoon.scss new file mode 100755 index 0000000..92315df --- /dev/null +++ b/src/scss/_icomoon.scss @@ -0,0 +1,85 @@ +@font-face { + font-family: 'icomoon'; + src:url('../fonts/icomoon.eot?-y74kwe'); + src:url('../fonts/icomoon.eot?#iefix-y74kwe') format('embedded-opentype'), + url('../fonts/icomoon.woff?-y74kwe') format('woff'), + url('../fonts/icomoon.ttf?-y74kwe') format('truetype'), + url('../fonts/icomoon.svg?-y74kwe#icomoon') format('svg'); + font-weight: normal; + font-style: normal; +} + +[class^="icon-"], [class*=" icon-"] { + font-family: 'icomoon'; + speak: none; + font-style: normal; + font-weight: normal; + font-variant: normal; + text-transform: none; + line-height: 1; + + /* Better Font Rendering =========== */ + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +.icon-quill:before { + content: "\e603"; +} +.icon-play:before { + content: "\e600"; +} +.icon-lab:before { + content: "\e608"; +} +.icon-newtab:before { + content: "\e602"; +} +.icon-mail:before { + content: "\e610"; +} +.icon-facebook:before { + content: "\e605"; +} +.icon-instagram:before { + content: "\e606"; +} +.icon-twitter:before { + content: "\e607"; +} +.icon-vimeo2:before { + content: "\e60a"; +} +.icon-flickr:before { + content: "\e612"; +} +.icon-github:before { + content: "\e60c"; +} +.icon-tumblr:before { + content: "\e60f"; +} +.icon-flattr:before { + content: "\e60b"; +} +.icon-file-pdf:before { + content: "\e60d"; +} +.icon-file-zip:before { + content: "\e60e"; +} +.icon-mobile:before { + content: "\e611"; +} +.icon-mail3:before { + content: "\e601"; +} +.icon-paperplane:before { + content: "\e604"; +} +.icon-vcard:before { + content: "\e613"; +} +.icon-cc:before { + content: "\e609"; +} diff --git a/scss/_mixins.scss b/src/scss/_mixins.scss similarity index 99% rename from scss/_mixins.scss rename to src/scss/_mixins.scss index 8fa8d38..b2a8a57 100755 --- a/scss/_mixins.scss +++ b/src/scss/_mixins.scss @@ -1,6 +1,4 @@ - // Usage: Light-on-dark = on - @mixin font-smoothing($value: on) { @if $value == on { -webkit-font-smoothing: antialiased; diff --git a/scss/_normalize.scss b/src/scss/_normalize.scss similarity index 99% rename from scss/_normalize.scss rename to src/scss/_normalize.scss index 196d223..03a428a 100644 --- a/scss/_normalize.scss +++ b/src/scss/_normalize.scss @@ -1,4 +1,4 @@ -/*! normalize.css v3.0.0 | MIT License | git.io/normalize */ +/* normalize.css v3.0.0 | MIT License | git.io/normalize */ /** * 1. Set default font family to sans-serif. diff --git a/src/scss/main.scss b/src/scss/main.scss new file mode 100644 index 0000000..698613c --- /dev/null +++ b/src/scss/main.scss @@ -0,0 +1,253 @@ +/*----------------------------------------*\ + Schwerkraftlabor.de | @Gehirnfussel +\*----------------------------------------*/ + +/* Imports +--------------------------*/ + +@import 'defaults'; +@import 'normalize'; +@import 'mixins'; +@import 'icomoon'; + +/* Content +--------------------------*/ + +$linkcolor: #5c1075; +$bodycolor: #1e1e1e; +$font_body: Hind, sans-serif; +$font_h: Merriweather Sans, sans-serif; + +body { + color: $bodycolor; + font-size: 13pt; + @include font-smoothing(on); + margin: 0 auto; + font-family: $font_body; +} +h1, h2, h3 { + font-family: $font_h; + text-rendering: optimizeLegibility; + font-weight: 700; + line-height: 1.2; +} +h1 { + font-size: 2em; + word-break: break-all; +} +h2 { + font-size: 1.5em; +} +p { + line-height: 1.7; + word-break: break-word; + margin: 1em 0; +} +a { + text-decoration: none; +} +blockquote { + font-size: 13pt; + line-height: 1.7em; + margin: 0 0 0 1.3em; + width: 590px; + padding: 0.5em 0.7em 0.5em 0.7em; + border: 1px solid #cbb7d1; + border-left: 5px #cbb7d1 solid; + border-top-right-radius: 6px; + border-bottom-right-radius: 6px; + background-image: linear-gradient(to bottom, #f3f3f3 0%, #fff 10%); +} +ul { + li { + margin: 0.3em 0em 0.3em 0.5em; + list-style-position: inside; + list-style-type: square; + font-size: 1em; + + p { + padding-left: 1em; + } + } +} + +/* Header +--------------------------*/ + +header { + text-align: center; +} +header img { + margin: 0.5em; + height: 230px; +} +header p { + font-size: 14pt; + font-weight: 500; +} +.icon-lab { + color: #44840b; +} + +.contact { + padding: 0; + font-size: 16pt; +} +.contact > li { + display: inline-block; + list-style: none; + margin: 0 0.4em; + padding: 0; +} +.contact > li a { + color: lighten(#7d6b85, 20%); + transition: 0.35s ease; +} +.contact > li a:hover { + color: $linkcolor; +} + +hr { + width: 626px; + border: none; + border-bottom: 1px solid #e0e0e0; + margin: 2em auto; +} + +/* Content +--------------------------*/ + +article { + margin: 0 auto; + width: 626px; +} +article .meta { + color: #444; + font-size: 0.9em; +} +article .end { + font-size: 1em; + color: #43194f; +} +article h1 { + margin: 0; + font-size: 1.5em; + margin-bottom: 0.3em; +} +article img { + border-radius: 6px; +} +article p:first-of-type { + margin-top: 0.3em; +} +article p:first-of-type::first-letter { + font-size: 1.35em; + text-transform: uppercase; +} +article a { + color: $linkcolor; + text-decoration: none; + font-weight: 500; + padding: 0; +} +article a:focus, article a:hover, article a:active { + text-decoration: none; + background-image: -webkit-gradient(linear, left top, left bottom, color-stop(50%, #fff), color-stop(50%, #666)); + background-image: -webkit-linear-gradient(top, #fff 50%, #666 50%); + background-image: linear-gradient(to bottom, #fff 50%, #666 50%); + background-repeat: repeat-x; + -webkit-background-size: 2px 2px; + background-size: 2px 2px; + background-position: 0 1.1em; +} +article a:active { + position: relative; + top: 1px; +} + +article a[href^="http"]:not([href*="level42.us"]):not([href*="youtube.com"])::after { + color: #444; + font-family: icomoon, sans-serif; + font-weight: 400; + content: '\e602'; + margin: 0 0.05em 0 0.25em; +} +article a[href$="pdf"]::after { + font-weight: 400; + font-family: icomoon, sans-serif; + content: '\e60d'; + margin: 0 0.05em 0 0.25em; +} +article a[href$="zip"]::after, article a[href$="rar"]::after, article a[href$="gz"]::after, article a[href$="7z"]::after { + font-weight: 400; + font-family: icomoon, sans-serif; + content: '\e60e'; + margin: 0 0.05em 0 0.25em; +} +article a[href^="mailto:"]::after { + font-weight: 400; + font-family: icomoon, sans-serif; + content: '\e603'; + margin: 0 0.05em 0 0.25em; +} + +.video { + padding-top: 25px; +} +.video + a[href*="youtube.com"] { + color: #a51515; + font-size: 12pt; + font-weight: 400; + line-height: 2; +} +.video + a[href*="youtube.com"]::before { + font-family: icomoon, sans-serif; + content: "\e600"; + margin-right: 0.25em; +} + + + +/* Footer +--------------------------*/ + + + + +/* Responsive Stuff & Media Queries +--------------------------*/ + +@media screen and (max-width: 650px) { + html { + margin: 0; + } + hr { + margin: 1em auto; + } + article, article blockquote, article img { + width: 100%; + } + article img { + border-radius: 0; + } + article p, article h1, article .meta, article a[href*="youtube.com"] { + margin-left: 8px; + margin-right: 8px; + } + article blockquote { + width: 97%; + margin: 0.5em 0.5em 0.5em 0; + padding: 0.5em 0.7em 0.5em 0.7em; + border: 1px solid #cbb7d1; + border-left: 5px #cbb7d1 solid; + border-top-right-radius: 6px; + border-bottom-right-radius: 6px; + background-image: linear-gradient(to bottom, #f3f3f3 0%, #fff 10%); + } +} + +@media print { + a[href]::after { + content: " (" attr(href) ")"; + } +} \ No newline at end of file