Maintenance and a little bit more content
- added favicon - changes to the gulp sprite module - changes to gulp linting - fixed javascript scroll function and added setup function content - fixed javascript indentation - new error pages - changed css for link colors - fixed css sprites
This commit is contained in:
Stephan
parent
8d9f440ac2
commit
90894f3253
35 changed files with 273 additions and 200 deletions
|
|
@ -1,6 +1,9 @@
|
|||
"use strict";
|
||||
|
||||
function setup() {
|
||||
console.log('\n', hippie_brand, '\n\n');
|
||||
console.info('Debug information:\n\nHTML height is', html_height, '\nBODY height is', body_height, '\nVIEW height is', view_height);
|
||||
|
||||
if($('#js_tph').length && full_view_hover) {
|
||||
// $('body').prepend("<div id=\"js_tph\" class=\"layer__hover hover_full_view_change\"></div>");
|
||||
$('#js_tph').addClass("hover_full_view_change");
|
||||
|
|
@ -9,33 +12,31 @@ function setup() {
|
|||
|
||||
// get document coordinates of the element
|
||||
function getCoords(elem) {
|
||||
let box = elem.getBoundingClientRect();
|
||||
let box = elem.getBoundingClientRect();
|
||||
|
||||
return {
|
||||
top: box.top + pageYOffset,
|
||||
left: box.left + pageXOffset
|
||||
};
|
||||
return {
|
||||
top: box.top + pageYOffset,
|
||||
left: box.left + pageXOffset
|
||||
};
|
||||
}
|
||||
|
||||
// https://stackoverflow.com/a/488073/1444149
|
||||
function Utils() {
|
||||
|
||||
}
|
||||
function Utils() {}
|
||||
|
||||
Utils.prototype = {
|
||||
constructor: Utils,
|
||||
isElementInView: function (element, fullyInView) {
|
||||
var pageTop = $(window).scrollTop();
|
||||
var pageBottom = pageTop + $(window).height();
|
||||
var elementTop = $(element).offset().top;
|
||||
var elementBottom = elementTop + $(element).height();
|
||||
constructor: Utils,
|
||||
isElementInView: function (element, fullyInView) {
|
||||
var pageTop = $(window).scrollTop();
|
||||
var pageBottom = pageTop + $(window).height();
|
||||
var elementTop = $(element).offset().top;
|
||||
var elementBottom = elementTop + $(element).height();
|
||||
|
||||
if (fullyInView === true) {
|
||||
return ((pageTop < elementTop) && (pageBottom > elementBottom));
|
||||
} else {
|
||||
return ((elementTop <= pageBottom) && (elementBottom >= pageTop));
|
||||
}
|
||||
}
|
||||
if (fullyInView === true) {
|
||||
return ((pageTop < elementTop) && (pageBottom > elementBottom));
|
||||
} else {
|
||||
return ((elementTop <= pageBottom) && (elementBottom >= pageTop));
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
var Utils = new Utils();
|
||||
|
|
@ -51,7 +52,7 @@ function scrollNav() {
|
|||
$('.'+theClass).parent('li').addClass('active');
|
||||
//Animate
|
||||
$('html, body').stop().animate({
|
||||
scrollTop: $( $(this).attr('href') ).offset().top - 160
|
||||
scrollTop: $( $(this).attr('href') ).offset().top - 160
|
||||
}, 400);
|
||||
return false;
|
||||
});
|
||||
|
|
|
|||
|
|
@ -38,13 +38,13 @@ $( document ).ready(function() {
|
|||
// "left": ev.pageX - $(this).offset().left + 8
|
||||
});
|
||||
// TODO - needs more love
|
||||
console.log(ev.pageX);
|
||||
// console.log(ev.pageX);
|
||||
}
|
||||
);
|
||||
|
||||
// WIP Activates layer with explanation elements
|
||||
// Besser ::after oder ::before benutzen
|
||||
$(".exp_help_btn").click(function(e){
|
||||
$(".js_showmeta").click(function(e){
|
||||
var $wrap, $pop;
|
||||
|
||||
if(exp_mode !== true){
|
||||
|
|
@ -80,24 +80,32 @@ $( document ).ready(function() {
|
|||
exp_mode = false;
|
||||
|
||||
}
|
||||
console.log("Explanation mode: "+ exp_mode);
|
||||
console.log("Explanation mode", exp_mode);
|
||||
});
|
||||
|
||||
// WIP Scroll to top
|
||||
$('#js_scrolltop').click(function(event) {
|
||||
$('.js_scrolltop').click(function(event) {
|
||||
event.preventDefault();
|
||||
console.log('scroll to the top');
|
||||
event.preventDefault();
|
||||
// $('body').scrollTop();
|
||||
$('body').animate({scrollTop: 0}, basic_ease, function() {
|
||||
console.log('arrived at top');
|
||||
});
|
||||
|
||||
document.documentElement.scrollTop = document.body.scrollTop = 0;
|
||||
|
||||
// var body = document.querySelector('body');
|
||||
// // get scroll position in px
|
||||
// console.log(body.scrollTop);
|
||||
// // set scroll position in px
|
||||
// body.scrollTop = 0;
|
||||
|
||||
// $('body')[0].scrollTop = 0;
|
||||
// $('body').animate({scrollTop: 0}, basic_ease, function() {
|
||||
// console.log('arrived at top');
|
||||
// });
|
||||
});
|
||||
$('#js_scrolldown').click(function(event) {
|
||||
console.log('scroll down');
|
||||
$('.js_scrolldown').click(function(event) {
|
||||
event.preventDefault();
|
||||
$('body').animate({scrollTop: $(document).height()}, basic_ease * 2, function() {
|
||||
console.log('arrived at bottom');
|
||||
});
|
||||
var pos = Math.max(html_height, body_height) - view_height;
|
||||
console.log('scroll down to', pos);
|
||||
document.documentElement.scrollTop = pos;
|
||||
});
|
||||
|
||||
|
||||
|
|
@ -113,10 +121,10 @@ $( document ).ready(function() {
|
|||
$( ".pass-def dd" ).each(function() {
|
||||
$( this ).find( "li" ).each(function( index ) {
|
||||
if ( 0 === $( this ).children( "ul" ).length ) {
|
||||
//console.log( index + ": " + $( this ).text() );
|
||||
//console.log(index, ":", $( this ).text());
|
||||
var tempContent = $( this ).html();
|
||||
//$( this ).html( "<span class=\"list-count\"></span>" );
|
||||
$( this ).html( tempContent +"<span class=\"list-count\">"+ i +"</span>" );
|
||||
$( this ).html(tempContent + "<span class=\"list-count\">" + i + "</span>");
|
||||
i++;
|
||||
}
|
||||
});
|
||||
|
|
@ -135,12 +143,11 @@ $( document ).scroll(function() {
|
|||
// Toggle navigation elements
|
||||
doc_pos_y = $( document ).scrollTop();
|
||||
// console.log(doc_pos_y);
|
||||
var h = scroll_y_margin;
|
||||
// var demo_margin = $('.header__fix');
|
||||
if (doc_pos_y > h) {
|
||||
$('#js_scrolltop').parent().removeClass('magic');
|
||||
if (doc_pos_y > scroll_y_margin) {
|
||||
$('.js_scrolltop').parent().removeClass('magic');
|
||||
} else {
|
||||
$('#js_scrolltop').parent().addClass('magic');
|
||||
$('.js_scrolltop').parent().addClass('magic');
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -1,14 +1,16 @@
|
|||
"use strict";
|
||||
var hippie_brand = "|-| | |^ |^ | [- ";
|
||||
|
||||
var w = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
|
||||
var h = Math.max(document.documentElement.clientHeight, window.innerHeight || 0);
|
||||
var view_width = Math.max(document.documentElement.offsetWidth, document.documentElement.clientWidth, window.innerWidth, 0);
|
||||
var view_height = Math.max(document.documentElement.clientHeight, window.innerHeight, 0);
|
||||
var html_height = Math.max(document.documentElement.offsetHeight, document.documentElement.clientHeight, 0);
|
||||
var body_height = Math.max(document.body.offsetHeight, document.body.clientHeight, 0);
|
||||
var body_width = Math.max(document.body.offsetWidth, document.body.clientWidth, window.innerWidth, 0);
|
||||
|
||||
var full_view_hover = true;
|
||||
|
||||
var doc_pos_y = 0;
|
||||
var basic_ease = 600;
|
||||
var scroll_y_margin = h;
|
||||
var scroll_y_margin = view_height;
|
||||
|
||||
|
||||
// TEST
|
||||
// var fixed_containers = [];
|
||||
var onerow_alphabet = "/\\ ]3 ( |) [- /= (_, |-| | _T /< |_ |\\/| |\\| () |^ ()_ /? _\\~ ~|~ |_| \\/ \\/\\/ >< `/ ~/_ ";
|
||||
var onerow_digits = "\'| ^/_ -} +| ;~ (o \"/ {} \"| (\\) ";
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue