146 lines
3.5 KiB
JavaScript
146 lines
3.5 KiB
JavaScript
// DOM ready
|
|
// ------------------------------------------------------------------------------
|
|
$( document ).ready(function() {
|
|
|
|
// Setup
|
|
// ------------------------------------------------------------------------------
|
|
|
|
setup();
|
|
|
|
|
|
|
|
// Modules
|
|
// ------------------------------------------------------------------------------
|
|
|
|
// Explanation module scripts
|
|
var exp_mode = false;
|
|
|
|
// Displays explanation popup
|
|
$(".js_pop").hover(
|
|
function() {
|
|
var $this = $(this);
|
|
|
|
if($(this).attr("emmet")){
|
|
|
|
}
|
|
|
|
$(this).next(".exp_pop").show();
|
|
}, function() {
|
|
$(this).next(".exp_pop").hide();
|
|
}
|
|
).mousemove(
|
|
function(ev) {
|
|
$(this).next(".exp_pop").css({
|
|
"top": ev.pageY - $(this).next(".exp_pop").outerHeight() - 4,
|
|
"left": ev.pageX + 8
|
|
// "left": ev.pageX - $(this).offset().left + 8
|
|
});
|
|
// TODO - needs more love
|
|
console.log(ev.pageX);
|
|
}
|
|
);
|
|
|
|
// WIP Activates layer with explanation elements
|
|
// Besser ::after oder ::before benutzen
|
|
$(".exp_help_btn").click(function(e){
|
|
var $wrap, $pop;
|
|
|
|
if(exp_mode != true){
|
|
exp_mode = true;
|
|
|
|
$(".js_pop").each(function(i, e){
|
|
if($(this).css("position") == "static") {
|
|
$(this).addClass("js_changed_pos");
|
|
$(this).css("position", "relative");
|
|
}
|
|
|
|
$pop = $(this).next(".exp_pop").detach();
|
|
$wrap = $(this).wrap("<span class=\"exp_wrap\"></span>").parent().prepend("<span class=\"exp_marker_pop\"></span>");
|
|
$wrap.after($pop);
|
|
});
|
|
|
|
} else {
|
|
$(".js_pop").each(function(i, e){
|
|
$wrap = $(this).parent(".exp_wrap");
|
|
$pop = $wrap.next(".exp_pop").detach();
|
|
$wrap.find(".exp_marker_pop").remove();
|
|
$(this).unwrap(".exp_wrap");
|
|
$(this).after($pop);
|
|
if($(this).hasClass("js_changed_pos")){
|
|
$(this).css("position", "");
|
|
if($(this).attr("style") == "") {
|
|
$(this).removeAttr("style");
|
|
}
|
|
$(this).removeClass("js_changed_pos");
|
|
}
|
|
});
|
|
|
|
exp_mode = false;
|
|
|
|
}
|
|
console.log("Explanation mode: "+ exp_mode);
|
|
});
|
|
|
|
// WIP Scroll to top
|
|
$('#js_scrolltop').click(function(event) {
|
|
console.log('scroll to the top');
|
|
event.preventDefault();
|
|
// $('body').scrollTop();
|
|
$('body').animate({scrollTop: 0}, basic_ease, function() {
|
|
console.log('arrived at top');
|
|
});
|
|
});
|
|
$('#js_scrolldown').click(function(event) {
|
|
console.log('scroll down');
|
|
event.preventDefault();
|
|
$('body').animate({scrollTop: $(document).height()}, basic_ease * 2, function() {
|
|
console.log('arrived at bottom');
|
|
});
|
|
});
|
|
|
|
|
|
|
|
$( "#gameIcon" ).click(function(event) {
|
|
event.preventDefault();
|
|
$( this ).clone().appendTo( "#gameDetail" );
|
|
$( this ).siblings().clone().appendTo( "#gameDetail" );
|
|
$( "#gameDetail" ).removeClass( "magic" );
|
|
});
|
|
|
|
var i = 0;
|
|
$( ".pass-def dd" ).each(function() {
|
|
$( this ).find( "li" ).each(function( index ) {
|
|
if ( 0 == $( this ).children( "ul" ).length ) {
|
|
//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>" );
|
|
i++;
|
|
}
|
|
})
|
|
});
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
// Scroll
|
|
// ------------------------------------------------------------------------------
|
|
$( 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');
|
|
} else {
|
|
$('#js_scrolltop').parent().addClass('magic');
|
|
}
|
|
|
|
|
|
|
|
});
|