add js tactile

This commit is contained in:
2018-09-11 18:43:09 +02:00
parent 2ef1a8e854
commit efa92436f7
3 changed files with 36 additions and 42 deletions
+11
View File
@@ -0,0 +1,11 @@
/*!
* jQuery UI Touch Punch 0.2.3
*
* Copyright 20112014, 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);
+23 -41
View File
@@ -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
@@ -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 %}
<div class="handler hand1">
<img src="user/themes/r2c/images/handler.svg" alt="">
</div>