//iWebKit 6.0 Fullscreen + Slide + touch=hover function create_elements() { var inside_html = "
"; $('.toggle_box').each(function(){ $(this).attr('state','off'); $(this).html(inside_html); $('.switch',this).css({'top':($(this).height()/2 - $('.switch',this).height()/2)}); }); } function set_listeners() { $('.toggle_box').mousedown(slide_begin); $('.toggle_box').mousemove(slide_move); $('.toggle_box').mouseup(slide_end); $('.toggle_box').mouseout(slide_end); $('.toggle_box').bind('touchstart',touch_start); $('.toggle_box').bind('touchmove',touch_move); $('.toggle_box').bind('touchend',slide_end); } function touch_start(e) { var parent = $(e.currentTarget); var target = $('.switch',parent); target.stop(); beginTouchDown = parseInt(e.originalEvent.touches[0].pageX,10)-(target.offset().left - parent.offset().left); } function touch_move(e) { e.preventDefault(); var parent = $(e.currentTarget); var parentOffset = parent.offset().left; var target = $('.switch',parent); var currentLeft = 0; var toMove = parseInt(e.originalEvent.touches[0].pageX,10)-beginTouchDown+currentLeft; if(!(toMove+parentOffset+target.width() > parentOffset+parent.width())&&(toMove+parentOffset > parentOffset)) { target.css({'left':toMove+"px"}); $(target).parent().css({'background-position': + 94 + toMove+"px -37px"}); check_place(target); } } function slide_move(e) { if(mouseDown === true) { var parent = $(e.currentTarget); var target = $('.switch',parent); var parentOffset = parent.offset().left; var toMove = e.pageX-parentOffset-target.width()/2; if(!(toMove+parentOffset+target.width() > parentOffset+parent.width())&&(toMove+parentOffset > parentOffset)) { target.css({'left':toMove+"px"}); $(target).parent().css({'background-position': + 94 + toMove+"px -37px"}); check_place(target); } } } function slide_begin(e) { var target = $('.switch',e.currentTarget); if(target.is(':animated')) { target.stop(); } mouseDown = true; } function slide_end(e) { mouseDown = false; check_place($('.switch',e.currentTarget)); slide_to_state($('.switch',e.currentTarget)); } function slide_to_state(target) { var toMove = target.attr('state') === "on" ? target.parent().width()-target.width() : 0; target.animate({'left':toMove+"px"}); $(target).parent().css({'background-position': + 94 + toMove+"px -37px"}); } function check_place(target) { if(target.offset().left+target.width()/2 > target.parent().offset().left+target.parent().width()/2) { target.attr('state','on').addClass('active'); } else { target.attr('state','off').removeClass('active'); } } function hijackLinks() { $('a').live("click", function (e) { e.preventDefault(); if(direction != "leftnav" && direction != "rightnav"){setTimeout(function () {$(this).addClass('click')}, 10);}; var linkhref = $(this).attr('href'); window.location.hash = linkhref; }); $('a,input,fieldset[data-input-type=button],select,fieldset[data-input-type=select],footer a').live("touchstart", function (e) { direction = $(this).attr('class'); if(direction != "leftnav" && direction != "rightnav"){$(this).addClass('temp'); setTimeout(function () { $('.temp').addClass('click'); }, 100);} else{$(this).addClass('click');}; if(direction == "leftnav" || direction == "rightnav"){$('.click').live("touchend", function (e) { $('.click').removeClass('click'); }); } }); $('a').live("touchmove", function (e) { $('.temp').removeClass('temp'); $('.click').removeClass('click'); }); $('select,fieldset[data-input-type=select]').live("click", function (e) { $('.temp').removeClass('temp'); $('.click').removeClass('click'); }); $('input,select,fieldset[data-input-type=select]').live("touchmove change", function (e) { var inputvalue = $(this).val() $('input[value="' + inputvalue + '"] + label').css({ '-webkit-transition': 'opacity 0.2s linear'}); if (e.type == 'touchmove'){ $('input[value="' + inputvalue + '"] + label').css({'-webkit-transition': '0', 'opacity': '1'}); $('.temp').removeClass('temp'); $('.click').removeClass('click');} else{$('input[value="' + inputvalue + '"] + label').addClass('click') var inputvalue = $(this).val() $('input[value="' + inputvalue + '"] + label').css({ 'opacity': '0' }); setTimeout(function () { $('input[value="' + inputvalue + '"] + label').css({'-webkit-transition': '0', 'opacity': '1'}); $('.temp').removeClass('temp'); $('.click').removeClass('click'); }, 200);} }); }; function loadPage(url) { currenthash = window.location.hash.substring(1); if (currenthash === "") { currenthash = "window.location"; } if (url === undefined && currenthash != "") { $('body').load(currenthash, 'header:first,#content,footer', hijackLinks); } else { $.get(url, function (data) { $('body').append(data); sm = $(window).width(); sn = $(window).scrollTop(); window.scrollTo(0, 0); if (direction === "leftnav") { $('body>#content:last,footer:last,body>header:last>h1').css("-webkit-transform", "translate( -" + sm + "px,0px)"); $('body>header:last>nav').css("-webkit-transform", "translate(-" +sm/2+"px, 0px)"); footerheight = $('body>#content:last').outerHeight(false) + $('body>header:last').outerHeight(true); $('footer:last').css("top", footerheight); $('body>header,body>#content,footer,body>header:last>nav,body>header:last>h1,body>header:first>nav,body>header:first>h1,body>header:first').css("-webkit-transition-duration", "0.4s"); $('body>header:first>h1,body>#content:first,footer:first').css("-webkit-transform", "translate(" + sm + "px,0px)"); $('body>header:first>nav').css("-webkit-transform", "translate(" +sm/2+"px, 0px)"); $('body>#content:last,footer:last,body>header:last>nav,body>header:last>h1,body>header:last div').css({ "-webkit-transform": "translate(0,0)" }); $('body>header:last a.leftnav,body>header:last a.rightnav').css({ '-webkit-transition': 'opacity 0.4s linear', 'opacity': '1' }); $('body>header:first a.leftnav,body>header:first a.rightnav').css({ '-webkit-transition': 'opacity 0.4s linear', 'opacity': '0' }); setTimeout(function () { $('body>header:not(:last),body>footer:not(:last),body>#content:not(:last),body>meta,body>title,body>link,body>style,body>script').remove(); $('body>header,body>footer,body>#content').removeAttr('style'); }, 400); } if (direction !== "leftnav") { $('body>#content:last,footer:last,body>header:last>h1').css("-webkit-transform", "translate( " + sm + "px,0px)"); $('body>header:last>nav').css("-webkit-transform", "translate(" +sm/2+"px, 0px)"); footerheight = $('body>#content:last').outerHeight(false) + $('body>header:last').outerHeight(true); $('footer:last').css("top", footerheight); $('body>header,body>#content,footer,body>header:last>nav,body>header:last>h1,body>header:first>nav,body>header:first>h1,body>header:first').css("-webkit-transition-duration", "0.4s"); $('body>header:first>h1,body>#content:first,footer:first').css("-webkit-transform", "translate(-" + sm + "px,0px)"); $('body>header:first>nav').css("-webkit-transform", "translate(-" +sm/2+"px, 0px)"); $('body>#content:last,footer:last,body>header:last>nav,body>header:last>h1,body>header:last div').css({ "-webkit-transform": "translate(0,0)" }); $('body>header:last a.leftnav,body>header:last a.rightnav').css({ '-webkit-transition': 'opacity 0.4s linear', 'opacity': '1' }); $('body>header:first a.leftnav,body>header:first a.rightnav').css({ '-webkit-transition': 'opacity 0.4s linear', 'opacity': '0' }); setTimeout(function () { $('body>header:not(:last),body>footer:not(:last),body>#content:not(:last),body>meta,body>title,body>link,body>style,body>script').remove(); $('body>header,body>footer,body>#content').removeAttr('style'); }, 400); } }); } } $(document).ready(function () { var togglebox = "
"; $('input[type=checkbox]').css('display','none'); $('fieldset[data-input-type=checkbox]').append(togglebox); var mouseDown = false; var beginTouchDown = 0; create_elements(); set_listeners(); loadPage(); currenthash = window.location.hash.substring(1); $(window).bind('hashchange', function () { currenthash = window.location.hash.substring(1); loadPage(currenthash); }); });