From efa92436f726f827f49312de9ad5bc98f2d4acae Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?K=C3=A9vin=20Tessier?= Date: Tue, 11 Sep 2018 18:43:09 +0200 Subject: [PATCH] add js tactile --- .../r2c/js/jquery.ui.touch-punch.min.js | 11 ++++ user/themes/r2c/js/script.js | 64 +++++++------------ .../r2c/templates/partials/base.html.twig | 3 +- 3 files changed, 36 insertions(+), 42 deletions(-) create mode 100644 user/themes/r2c/js/jquery.ui.touch-punch.min.js diff --git a/user/themes/r2c/js/jquery.ui.touch-punch.min.js b/user/themes/r2c/js/jquery.ui.touch-punch.min.js new file mode 100644 index 0000000..31272ce --- /dev/null +++ b/user/themes/r2c/js/jquery.ui.touch-punch.min.js @@ -0,0 +1,11 @@ +/*! + * jQuery UI Touch Punch 0.2.3 + * + * Copyright 2011–2014, Dave Furfero + * Dual licensed under the MIT or GPL Version 2 licenses. + * + * Depends: + * jquery.ui.widget.js + * jquery.ui.mouse.js + */ +!function(a){function f(a,b){if(!(a.originalEvent.touches.length>1)){a.preventDefault();var c=a.originalEvent.changedTouches[0],d=document.createEvent("MouseEvents");d.initMouseEvent(b,!0,!0,window,1,c.screenX,c.screenY,c.clientX,c.clientY,!1,!1,!1,!1,0,null),a.target.dispatchEvent(d)}}if(a.support.touch="ontouchend"in document,a.support.touch){var e,b=a.ui.mouse.prototype,c=b._mouseInit,d=b._mouseDestroy;b._touchStart=function(a){var b=this;!e&&b._mouseCapture(a.originalEvent.changedTouches[0])&&(e=!0,b._touchMoved=!1,f(a,"mouseover"),f(a,"mousemove"),f(a,"mousedown"))},b._touchMove=function(a){e&&(this._touchMoved=!0,f(a,"mousemove"))},b._touchEnd=function(a){e&&(f(a,"mouseup"),f(a,"mouseout"),this._touchMoved||f(a,"click"),e=!1)},b._mouseInit=function(){var b=this;b.element.bind({touchstart:a.proxy(b,"_touchStart"),touchmove:a.proxy(b,"_touchMove"),touchend:a.proxy(b,"_touchEnd")}),c.call(b)},b._mouseDestroy=function(){var b=this;b.element.unbind({touchstart:a.proxy(b,"_touchStart"),touchmove:a.proxy(b,"_touchMove"),touchend:a.proxy(b,"_touchEnd")}),d.call(b)}}}(jQuery); \ No newline at end of file diff --git a/user/themes/r2c/js/script.js b/user/themes/r2c/js/script.js index f748a9b..69d4f98 100644 --- a/user/themes/r2c/js/script.js +++ b/user/themes/r2c/js/script.js @@ -18,9 +18,31 @@ function clickhand(){ function drag() { + var $hand = $( ".handler" ); var $hand1 = $( ".hand1" ); var $hand2 = $( ".hand2" ); + // General + // origine + var oW = parseFloat($(window).outerWidth(true)); + var oH = parseFloat($(window).outerHeight(true)); + // pourcent + var p = 100; + + // Blocs + // find + var $recits = $hand.parent('#page').find('#recits'); + var $itw = $hand.parent('#page').find("#interviews"); + var $img = $hand.parent('#page').find("#images"); + var $stmp = $hand.parent('#page').find("#streetmap"); + var $rs = $hand.parent('#page').find("#reseaux-sociaux"); + var $links = $hand.parent('#page').find("#links"); + + // handler + // dimension + var $Whand = $hand.outerWidth(true); + var $Hhand = $hand.outerHeight(true); + $hand1.draggable({ containment: "#start", scroll: false, @@ -32,21 +54,10 @@ function drag() { // // // ui.position.top = Math.max( ui.position.top, ui.helper.prev().offset().top + ui.helper.prev().outerHeight() - dragDistance); // ui.position.top = Math.max(ui.position.top, ui.helper.prev().offset().top + dragDistance); - - // General - // origine - var oW = parseFloat($(window).outerWidth(true)); - var oH = parseFloat($(window).outerHeight(true)); - // pourcent - var p = 100; - // handler // position var pos = $hand1.position(); var pos1 = $hand2.position(); - // dimension - var $Whand = $(this).outerWidth(true); - var $Hhand = $(this).outerHeight(true); // center var ajustW = $Whand / 2 - 1; @@ -70,22 +81,12 @@ function drag() { //handler2 var $handler2 = $(this).parent().find('.hand2'); - - // Blocs - // find - var $recits = $(this).parent('#page').find('#recits'); - var $itw = $(this).parent('#page').find("#interviews"); - var $img = $(this).parent('#page').find("#images"); - var $stmp = $(this).parent('#page').find("#streetmap"); - var $rs = $(this).parent('#page').find("#reseaux-sociaux"); - var $links = $(this).parent('#page').find("#links"); - var PosHand = (parseFloat(xPos3) - parseFloat(xPos)) + "%"; // application dimension $(this).css({ 'left': xPos, - 'top': yPos + 'top': yPos, }) $hand2.css({ @@ -142,20 +143,10 @@ function drag() { // // ui.position.top = Math.max( ui.position.top, ui.helper.prev().offset().top + ui.helper.prev().outerHeight() - dragDistance); // ui.position.top = Math.max(ui.position.top, ui.helper.prev().offset().top + dragDistance); - // General - // origine - var oW = parseFloat($(window).outerWidth(true)); - var oH = parseFloat($(window).outerHeight(true)); - // pourcent - var p = 100; - // handler // position var pos = $hand1.position(); var pos1 = $hand2.position(); - // dimension - var $Whand = $(this).outerWidth(true); - var $Hhand = $(this).outerHeight(true); // center var ajustW = $Whand / 2 - 1; @@ -180,15 +171,6 @@ function drag() { //handler2 var $handler2 = $(this).parent().find('.hand2'); - // Blocs - // find - var $recits = $(this).parent('#page').find('#recits'); - var $itw = $(this).parent('#page').find("#interviews"); - var $img = $(this).parent('#page').find("#images"); - var $stmp = $(this).parent('#page').find("#streetmap"); - var $rs = $(this).parent('#page').find("#reseaux-sociaux"); - var $links = $(this).parent('#page').find("#links"); - var PosHand = (parseFloat(xPos3) - parseFloat(xPos)) + "%"; // application dimension diff --git a/user/themes/r2c/templates/partials/base.html.twig b/user/themes/r2c/templates/partials/base.html.twig index 460e955..87416c9 100644 --- a/user/themes/r2c/templates/partials/base.html.twig +++ b/user/themes/r2c/templates/partials/base.html.twig @@ -34,6 +34,7 @@ {% do assets.addJs('theme://js/script_d3js.js', {group:'bottom'}) %} {% do assets.addJs('theme://js/paper_full.js', {group:'bottom'}) %} {% do assets.addJs('theme://js/paper_full.js', {group:'bottom'}) %} + {% do assets.addJs('theme://js/jquery.ui.touch-punch.min.js', {group:'bottom'}) %} {# % do assets.addJs('theme://js/leaflet.js', {group:'bottom'}) % #} {# do assets.addJs('theme://js/script_paperjs.js', {type:'text/paperscript', canvas:'canvas', group:'bottom'}) #} @@ -72,7 +73,7 @@ {% endblock %} {% block hero %}{% endblock %} - +