• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

Animate CC html5 canvas Dragging issue when test it in mobile

New Here ,
Feb 16, 2020 Feb 16, 2020

Copy link to clipboard

Copied

Hi

I'm making a mobile web app that has drag and drop. I made it and it works well on pc browsers but when I test it on mobile it not works. you can check it from the following address:

 https://globalwdf.000webhostapp.com/html5Works/HTML5_language_lessons/en/en_unit1_html5_Exercises.ht...

I hope someone knows why this happening?

I use the following codes for drag and drop: 

 

//=== first three drag&drop ===
answer1_1_1.on("pressmove", function (evt){ pressM(evt); });
answer1_1_1.on("pressup", function (evt){ pressU(evt,tripleArr);});

answer1_1_2.on("pressmove", function (evt){ pressM(evt); });
answer1_1_2.on("pressup", function (evt){ pressU(evt,tripleArr);});

answer1_1_3.on("pressmove", function (evt){ pressM(evt); });
answer1_1_3.on("pressup", function (evt){ pressU(evt,tripleArr);});

//=== second three drag&drop ===

answer1_1_4.on("pressmove", function (evt){ pressM(evt); });
answer1_1_4.on("pressup", function (evt){ pressU(evt,tripleArr2);});

answer1_1_5.on("pressmove", function (evt){ pressM(evt); });
answer1_1_5.on("pressup", function (evt){ pressU(evt,tripleArr2);});

answer1_1_6.on("pressmove", function (evt){ pressM(evt); });
answer1_1_6.on("pressup", function (evt){ pressU(evt,tripleArr2);});

//=== third three drag&drop ===
answer1_1_7.on("pressmove", function (evt){ pressM(evt); });
answer1_1_7.on("pressup", function (evt){ pressU(evt,tripleArr3);});

answer1_1_8.on("pressmove", function (evt){ pressM(evt); });
answer1_1_8.on("pressup", function (evt){ pressU(evt,tripleArr3);});

answer1_1_9.on("pressmove", function (evt){ pressM(evt); });
answer1_1_9.on("pressup", function (evt){ pressU(evt,tripleArr3);});

firstPlaceArr=[];
function pressM(evt)
{	
	var p = evt.currentTarget.parent.globalToLocal(evt.stageX, evt.stageY);
	
	if(firstPlaceArr.length==0)
	{
		firstPlaceArr=[evt.currentTarget.x,evt.currentTarget.y];
		console.log(tripleArr);	
	}	
	
	if(mpAr[0]==0){mpAr = [p.x - evt.currentTarget.x  , p.y - evt.currentTarget.y];}//correct place of draging
	dragStage1.setChildIndex(evt.currentTarget, dragStage1.getNumChildren()-1);
	evt.currentTarget.x = p.x - mpAr[0];
	evt.currentTarget.y = p.y - mpAr[1];
	stage.update();	
}

function pressU(evt,arr,yy)
{			
	mpAr = [0,0];
	
	var placed=false;
	//check is it above placing space
	for(var i=0;i<3;i++)
	{		
		if(evt.currentTarget!=arr[i] && intersect(arr[i]))
		{			
			//=== swap with tween ===
			createjs.Tween.get(evt.currentTarget).to({x:arr[i].x,y:arr[i].y}, 350);
			createjs.Tween.get(arr[i+3]).to({x:firstPlaceArr[0],y:firstPlaceArr[1]}, 350);
			
			//=== swap drag movieclips in array ===
			arr[arr.indexOf(evt.currentTarget)]=arr[i+3];
			arr[i+3]=evt.currentTarget;
			stage.update(evt);
			placed=true;
		}
	}
	
	if(placed==false){evt.currentTarget.x = firstPlaceArr[0]; evt.currentTarget.y = firstPlaceArr[1];}
	
	firstPlaceArr=[];
}

 

TOPICS
Code , Error , How to , Other , Performance , Product issue , Tablet

Views

233

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Nov 18, 2020 Nov 18, 2020

Copy link to clipboard

Copied

LATEST

I have the same problem. I drag a clip onto the stage. It works fine in a PC browser but not in an Android or iPad browser.
Thanks for your help.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines