6 Replies Latest reply on Sep 12, 2014 9:02 AM by TonUden

    Touch punch

    TonUden

      Hello,

       

      We have a problem with the function jQuery UI Touch Punch. it doesn't work on the iPad

      The object is possible to move, but it don't drop to his place.
      We spent many hours to find a solution.. but we can't find a solution.. is this a bug??

       

      Please take a look at the project (PC and iPad)

       

      Ton

       

      http://elektrischhandgereedschap.businesscatalyst.com/pc.html

       

       

       

      In the JS folder:

      jquery.ui.touch-punch.min

      jquery-ui-1.10.4.custom.min

       

      Include yepnope

        • 1. Re: Touch punch
          Robyn_cpl Level 2

          Hi,

           

          what does your yepnope code look like?

          I've done a lot of drag drop things, and I've found that sometimes it depends on where your adding you draggable code as well

          • 2. Re: Touch punch
            TonUden Level 1

            Hi Robyn,
            Thanks for responding.. The draggable code, can you give a advise. The animation is code only on the stage.
            The yepnope code is:

             

            indow.AdobeEdge = window.AdobeEdge || {};

            // Include yepnope

            if(!AdobeEdge.yepnope) {

            /*yepnope1.5.x|WTFPL*/

            (function(a,b,c){function d(a){return"[object Function]"==o.call(a)}function e(a){return"string"==typeof a}function f(){}function g(a){return!a||"loaded"==a||"complete"==a||"uninitialized"==a}function h(){var a=p.shift();q=1,a?a.t?m(function(){("c"==a.t?B.injectCss:B.injectJs)(a.s,0,a.a,a.x,a.e,1) },0):(a(),h()):q=0}function i(a,c,d,e,f,i,j){function k(b){if(!o&&g(l.readyState)&&(u.r=o=1,!q&&h(),l.onload=l.onreadystatechange=null,b)){"img "!=a&&m(function(){t.removeChild(l)},50);for(var d in y[c])y[c].hasOwnProperty(d)&&y[c][d].onload()}}var j=j||B.errorTimeout,l=b.createElement(a),o=0,r=0,u={t:d,s:c,e:f,a:i,x:j};1===y[c]&&(r=1,y [c]=[]),"object"==a?l.data=c:(l.src=c,l.type=a),l.width=l.height="0",l.onerror=l.onload=l. onreadystatechange=function(){k.call(this,r)},p.splice(e,0,u),"img"!=a&&(r||2===y[c]?(t.in sertBefore(l,s?null:n),m(k,j)):y[c].push(l))}function j(a,b,c,d,f){return q=0,b=b||"j",e(a)?i("c"==b?v:u,a,b,this.i++,c,d,f):(p.splice(this.i++,0,a),1==p.length&&h ()),this}function k(){var a=B;return a.loader={load:j,i:0},a}var l=b.documentElement,m=a.setTimeout,n=b.getElementsByTagName("script")[0],o={}.toString,p= [],q=0,r="MozAppearance"in l.style,s=r&&!!b.createRange().compareNode,t=s?l:n.parentNode,l=a.opera&&"[object Opera]"==o.call(a.opera),l=!!b.attachEvent&&!l,u=r?"object":l?"script":"img",v=l?"script" :u,w=Array.isArray||function(a){return"[object Array]"==o.call(a)},x=[],y={},z={timeout:function(a,b){return b.length&&(a.timeout=b[0]),a}},A,B;B=function(a){function b(a){var a=a.split("!"),b=x.length,c=a.pop(),d=a.length,c={url:c,origUrl:c,prefixes:a},e,f,g;for(f =0;f<d;f++)g=a[f].split("="),(e=z[g.shift()])&&(c=e(c,g));for(f=0;f<b;f++)c=x[f](c);return c}function g(a,e,f,g,h){var i=b(a),j=i.autoCallback;i.url.split(".").pop().split("?").shift(),i.bypass||(e&&(e=d(e)?e :e[a]||e[g]||e[a.split("/").pop().split("?")[0]]),i.instead?i.instead(a,e,f,g,h):(y[i.url] ?i.noexec=!0:y[i.url]=1,f.load(i.url,i.forceCSS||!i.forceJS&&"css"==i.url.split(".").pop() .split("?").shift()?"c":c,i.noexec,i.attrs,i.timeout),(d(e)||d(j))&&f.load(function(){k(), e&&e(i.origUrl,h,g),j&&j(i.origUrl,h,g),y[i.url]=2})))}function h(a,b){function c(a,c){if(a){if(e(a))c||(j=function(){var a=[].slice.call(arguments);k.apply(this,a),l()}),g(a,j,b,0,h);else if(Object(a)===a)for(n in m=function(){var b=0,c;for(c in a)a.hasOwnProperty(c)&&b++;return b}(),a)a.hasOwnProperty(n)&&(!c&&!--m&&(d(j)?j=function(){var a=[].slice.call(arguments);k.apply(this,a),l()}:j[n]=function(a){return function(){var b=[].slice.call(arguments);a&&a.apply(this,b),l()}}(k[n])),g(a[n],j,b,n,h))}else!c&&l()}v ar h=!!a.test,i=a.load||a.both,j=a.callback||f,k=j,l=a.complete||f,m,n;c(h?a.yep:a.nope,!!i) ,i&&c(i)}var i,j,l=this.yepnope.loader;if(e(a))g(a,0,l,0);else if(w(a))for(i=0;i<a.length;i++)j=a[i],e(j)?g(j,0,l,0):w(j)?B(j):Object(j)===j&&h(j,l);els e Object(a)===a&&h(a,l)},B.addPrefix=function(a,b){z[a]=b},B.addFilter=function(a){x.push(a )},B.errorTimeout=1e4,null==b.readyState&&b.addEventListener&&(b.readyState="loading",b.ad dEventListener("DOMContentLoaded",A=function(){b.removeEventListener("DOMContentLoaded",A, 0),b.readyState="complete"},0)),a.yepnope=k(),a.yepnope.executeStack=h,a.yepnope.injectJs= function(a,c,d,e,i,j){var k=b.createElement("script"),l,o,e=e||B.errorTimeout;k.src=a;for(o in d)k.setAttribute(o,d[o]);c=j?h:c||f,k.onreadystatechange=k.onload=function(){!l&&g(k.read yState)&&(l=1,c(),k.onload=k.onreadystatechange=null)},m(function(){l||(l=1,c(1))},e),i?k. onload():n.parentNode.insertBefore(k,n)},a.yepnope.injectCss=function(a,c,d,e,g,i){var e=b.createElement("link"),j,c=i?h:c||f;e.href=a,e.rel="stylesheet",e.type="text/css";for( j in d)e.setAttribute(j,d[j]);g||(n.parentNode.insertBefore(e,n),m(c,0))}})(this,document);Ado beEdge.yepnope = window.yepnope;

            }

            // end yepnope

            (function(compId){

             

             

               var htFallbacks;

            var testEle=document.createElement("div");function isSupported(a){for(var d=testEle.style,b,g=0;g<a.length;g++)if(b=a[g],void 0!==d[b])return!0;return!1}function supportsRGBA(){testEle.cssText="background-color:rgba(150,255,150,.5)";return 0==(""+testEle.style.backgroundColor).indexOf("rgba")?!0:!1}

            var hasTransform=isSupported(["transformProperty","WebkitTransform","MozTransform","OTransfor m","msTransform"]),hasSVG=!!document.createElementNS&&!!document.createElementNS("http://www.w3.org/2000/svg","svg").createSVGRect,hasRGBA=supportsRGBA(),hasJSON=window.JSON&&window.JSON.parse&&wind ow.JSON.stringify,readyToPlay=!1;function safeColor(a){a=""+a;if(!hasRGBA&&0==a.indexOf("rgba")){var d=a.lastIndexOf(",");0<d&&(a="rgb("+a.substring(5,d)+")")}return a}

            AdobeEdge._preloaders=AdobeEdge._preloaders||[];AdobeEdge._preloaders.push(function(){file sToLoad&&(loadResources(filesToLoad),filesToLoad=void 0)});function doLoadResources(){for(var a=0;a<AdobeEdge._preloaders.length;a++)AdobeEdge._preloaders[a]()}AdobeEdge._readyplayers =AdobeEdge._readyplayers||[];AdobeEdge._readyplayers.push(function(){readyToPlay&&AdobeEdg e.okToLaunchComposition(compId)});

            function playWhenReady(){AdobeEdge._playWhenReady=!0;for(var a=0;a<AdobeEdge._readyplayers.length;a++)AdobeEdge._readyplayers[a]()}function edgeCallback(a,d,b){htFallbacks[a]&&(a=htFallbacks[a]);AdobeEdge.preload.got[a]=!0;a==Ado beEdge.preload.last&&(!AdobeEdge.bootstrapLoading||AdobeEdge._playWhenReady?AdobeEdge.okTo LaunchComposition(compId):readyToPlay=!0,AdobeEdge.preload.busy=!1,0<AdobeEdge.preload.q.l ength&&(a=AdobeEdge.preload.q.pop(),AdobeEdge.requestResources(a.files,a.callback)))}

            AdobeEdge.requestResources=AdobeEdge.requestResources||function(a,d){AdobeEdge.yepnope.err orTimeout=4E3;AdobeEdge.preload.busy=!0;AdobeEdge.preload.got=AdobeEdge.preload.got||{};va r b,g=a.length,f=[],c;for(b=0;b<g;b++){c=a[b];if("string"===typeof c)0===c.indexOf("//")&&0===window.location.href.indexOf("file://")&&(c="http:"+c),url=c,c ={load:url};else if(c.load&&0===c.load.indexOf("//")&&0===window.location.href.indexOf("file://")&&(c.load ="http:"+c.load),url=c.yep||c.load,c.callback){var h=c.callback;

            c.callback=function(a,b,c){h(a,b,c)&&d(a,b,c)}}c.callback||(c.callback=d);AdobeEdge.preloa d.got[url]||(f.push(c),AdobeEdge.preload.last=url)}f.length&&AdobeEdge.yepnope(f)};var filesToLoad,dlContent,preContent,doDelayLoad,signaledLoading,loadingEvt,requiresSVG,htLoo kup={},aLoader,aEffectors,plSTF,ctrPlS,minPlW,maxPlW,plHeight,plWidth;

            function loadResources(a,d){AdobeEdge.preload=AdobeEdge.preload||[];AdobeEdge.preload.q=AdobeEdge. preload.q||[];d||!isCapable()?filesToLoad=a:AdobeEdge.preload.busy?AdobeEdge.preload.q.pus h({files:a,callback:edgeCallback}):AdobeEdge.requestResources(a,edgeCallback)}function splitUnits(a){var d={};d.num=parseFloat(a);"string"==typeof a&&(d.units=a.match(/[a-zA-Z%]+$/));d.units&&"object"==typeof d.units&&(d.units=d.units[0]);return d}

            function defaultUnits(a){var d=a;"auto"!==a&&((a=splitUnits(a))&&a.units||(d+="px"));return d}function findNWC(a,d){if(-1!=String(a.className).indexOf(d))return a;for(var b=a.childNodes,g=0;g<b.length;g++){var f=findNWC(b[g],d);if(!1!=f)return f}return!1}function parent(a){return a.parentElement}function offset(a){a=a.getBoundingClientRect();return{left:a.left+window.pageXOffset,top:a.top+win dow.pageYOffset}}function width(a){return a.offsetWidth}function height(a){return a.offsetHeight}

            function isWrapped(a){return/center-wrapper/.test(parent(a).className)}function wrapForStageScaling(a){if(!isWrapped(a)){var d=document.createElement("div"),b=document.createElement("div");d.className="flow-wrapper ";b.className="center-wrapper";d.style.width="1px";d.appendChild(b);parent(a).insertBefore (d,a);b.appendChild(a)}}

            function bindPSS(a,d){if(!isWrapped(a)){var b=function(){var b=isWrapped(a),f=b?parent(parent(parent(a))):parent(a),c=width(f),h=height(f),k=width(a), n=height(a),m=window.innerHeight,e=1,l=a.style;(f="body"===f.nodeName.toLowerCase())&&(h=m );c=Math.round(c);h=Math.round(h);c/=k;h/=n;"both"===d?e=Math.min(c,h):"height"===d?e=h:"w idth"===d&&(e=c);void 0!==maxPlW&&(e=Math.min(e,parseInt(maxPlW,10)/k));void 0!==minPlW&&(e=Math.max(e,parseInt(minPlW,10)/k));h="scale("+e+")";l.transformOrigin="0 0";l.oTransformOrigin=

            "0 0";l.msTransformOrigin="0 0";l.webkitTransformOrigin="0 0";l.mozTransformOrigin="0 0";l.oTransformOrigin="0 0";l.transform=h;l.oTransform=h;l.msTransform=h;l.webkitTransform=h;l.mozTransform=h;l.oT ransform=h;if(!f||b)parent(a).style.height=Math.round(n*e)+"px",parent(a).style.width=Math .round(k*e)+"px";b&&(b=parent(parent(a)),b.style.height=Math.round(n*e+offset(a).top-offse t(b).top))};wrapForStageScaling(a);window.addEventListener("resize",function(){b()});b()}}

            function centerThePreloadStage(a,d){isWrapped(a)&&(a=parent(a));var b=a.style;/^both$|^horizontal$/.test(d)&&(b.position="absolute",b.marginLeft="auto",b.mar ginRight="auto",b.left="0",b.right="0");/^both$|^vertical$/.test(d)&&(b.position="absolute ",b.marginTop="auto",b.marginBottom="auto",b.top="0",b.bottom="0")}

            function simpleContent(a,d,b){var g=document.getElementsByTagName("body")[0],f=b||findNWC(g,compId),c,h,k;f?"absolute"!=f.s tyle.position&&"relative"!=f.style.position&&(f.style.position="relative"):f=g;plHeight&&( f.style.height=plHeight);plWidth&&(f.style.width=plWidth);/^height$|^width$|^both$/.test(p lSTF)&&d&&!b&&bindPSS(f,plSTF);/^vertical$|^horizontal$|^both$/.test(ctrPlS)&&d&&!b&&cente rThePreloadStage(f,ctrPlS);for(var n=0;n<a.length;n++){b=a[n];"image"===b.type?(g=document.createElement("img"),

            g.src=b.fill[1]):g=document.createElement("div");g.id=b.id;k=g.style;if("text"==b.type){if (c=b.font)c[0]&&""!==c[0]&&(k.fontFamily=c[0]),"object"!=typeof c[1]&&(c[1]=[c[1]]),c[1][1]||(c[1][1]="px"),c[1][0]&&""!==c[1][0]&&(k.fontSize=c[1][0]+c[ 1][1]),c[2]&&""!==c[2]&&(k.color=safeColor(c[2])),c[3]&&""!==c[3]&&(k.fontWeight=c[3]),c[4 ]&&""!==c[4]&&(k.textDecoration=b.font[4]),c[5]&&""!==c[5]&&(k.fontStyle=b.font[5]);b.alig n&&"auto"!=b.align&&(k.textAlign=b.align);b.position&&(k.position=b.position);

            (!b.rect[2]||0>=b.rect[2])&&(!b.rect[3]||0>=b.rect[3])&&(k.whiteSpace="nowrap");g.innerHTM L=b.text}d&&(g.className=d);k.position="absolute";c=b.rect[0];h=b.rect[1];if(b.transform&& b.transform[0]){var m=b.transform[0][0],e=splitUnits(m);if(e&&e.units&&(m=e.num,"%"==e.units&&b.rect[2])){var e=b.rect[2],l=splitUnits(b.rect[2]);l&&l.units&&(e=l.num,"%"==l.units&&(e=e/100*f.offsetW idth));m=m/100*e;0<f.offsetWidth&&(m=m/f.offsetWidth*100)}if(e=splitUnits(c))c=e.num;c+=m; e.units||(e.units="px");c+=e.units;

            if(1<b.transform[0].length){m=b.transform[0][1];(e=splitUnits(m))&&e.units&&(m=e.num,"%"== e.units&&b.rect[3]&&(e=b.rect[3],(l=splitUnits(b.rect[3]))&&l.units&&(e=l.num,"%"==l.units &&(e=e/100*f.offsetHeight)),m=m/100*e,0<f.offsetHeight&&(m=m/f.offsetHeight*100)));if(e=sp litUnits(h))h=e.num;h+=m;e.units||(e.units="px");h+=e.units}}k.left=defaultUnits(c);k.top= defaultUnits(h);k.width=defaultUnits(b.rect[2]);k.height=defaultUnits(b.rect[3]);b.linkURL &&(htLookup[g.id]=b,g.onclick=function(){var a=htLookup[this.id];

            a.linkTarget?window.open(a.linkURL,a.linkTarget):window.location.href=a.linkURL},k.cursor= "pointer");f.appendChild(g);if(b.c)for(k=0;k<b.c.length;k++)simpleContent(b.c[k],d,g)}}var fnCycle=function(a){a?fnCycle&&setTimeout(fnCycle,20):a={event:"loading",progress:0};load ingEvt&&loadingEvt(a)},aBootcompsLoaded=[];window.AdobeEdge.bootstrapListeners||(window.Ad obeEdge.bootstrapListeners=[]);

            window.AdobeEdge.bootstrapCallback=function(a){window.AdobeEdge.bootstrapListeners.push(a) ;if(0<aBootcompsLoaded.length)for(var d=0;d<aBootcompsLoaded.length;d++)a(aBootcompsLoaded[d])};window.AdobeEdge.preloadComplet e||(window.AdobeEdge.preloadComplete={});

            window.AdobeEdge.preloadComplete[compId]=function(a){AdobeEdge.$_(".edgePreload"+a).css("d isplay","none");fnCycle=null;loadingEvt&&loadingEvt({event:"done",progress:1,reason:"compl ete"});aBootcompsLoaded.push(a);for(var d=window.AdobeEdge.bootstrapListeners.length,b=0;b<d;b++)try{window.AdobeEdge.bootstrapLi steners[b](a)}catch(g){console.log("bootstrap error "+g)}};function isCapable(){return hasTransform?requiresSVG&&!hasSVG?!1:!0:!1}

            function onDocLoaded(a){window.AdobeEdge.loaded=!0;fnCycle({event:"begin"});isCapable()?(preConten t&&preContent.dom&&preContent.dom.length&&simpleContent(preContent.dom,"edgePreload"+compI d),filesToLoad&&!signaledLoading&&(loadResources(filesToLoad),filesToLoad=void 0)):dlContent&&dlContent.dom&&(loadingEvt&&loadingEvt({event:"done",progress:1,reason:"do wnlevel"}),simpleContent(dlContent.dom))};

            window.AdobeEdge = window.AdobeEdge || {};

            window.AdobeEdge.framework = 'jquery';

            if(document.addEventListener ){

               window.addEventListener("load", onDocLoaded, false);

            } else if ( document.attachEvent ) {

               window.attachEvent("onload", onDocLoaded );

            }

             

               requiresSVG=false;

             

               doDelayLoad=true;

               htFallbacks={

               };

             

               aLoader = [

                  { load: "edge_includes/jquery-2.0.3.min.js"},

                  { load: "edge_includes/edge.4.0.1.min.js"},

                  { load: "js/jquery-ui-1.10.4.custom.min.js", user: true },

                  { load: "js/jquery.ui.touch-punch.min.js", user: true },

                  { load: "pc_edge.js"},

                  { load: "pc_edgeActions.js"}];

             

            if (AdobeEdge.bootstrapLoading) { signaledLoading = true; AdobeEdge.loadResources=doLoadResources; AdobeEdge.playWhenReady=playWhenReady; }

             

            loadResources(aLoader, doDelayLoad);

             

            var plSTF="none",ctrPlS="none",minPlW="0px",maxPlW="none",plWidth="1024px",plHeight="768px";

             

            preContent={

                dom: [

                {

                    id: 'loader-bar',

                    type: 'image',

                    tag: 'img',

                    rect: ['402', '375','220px','19px','auto', 'auto'],

                    fill: ["rgba(0,0,0,0)",'images/loader-bar.gif','0px','0px']

                }]};//simpleContent

             

            dlContent={dom: [ ]};//simpleContent

             

            })( "EDGE-1597865");

            • 3. Re: Touch punch
              Robyn_cpl Level 2

              Can I ask where about all this code is (Is it within Edge), this looks like the _pagename_edgeActions.js file?

               

              It's hard to look through all this code to find the error (if there is one) because its coded animations in there too.

               

              Within the creationcomplete I add all my code for the drag drop. But the yepnope bit looks like this

               

              yepnope(

              {

              nope:['js/jquery.ui.touch-punch.min.js'], complete: init

              }

              • 4. Re: Touch punch
                TonUden Level 1

                Ok, I will give it a try. Thanks for your respons

                • 5. Re: Touch punch
                  Robyn_cpl Level 2

                  no worries.

                   

                  Just wondering did you add the js file within Edge using the library?

                  If so I think the code i added should work.

                  If not I'll more than happy to advise some more

                  • 6. Re: Touch punch
                    TonUden Level 1

                    Ok, thanks,

                    I found the problem, it was in the sound files. this was stopping all actions