Polymer Gestures - Pinch Event (0.4.2) - javascript

On this page:
https://github.com/Polymer/polymer-gestures
it says that the "pinch" gesture should already be developed but other ones like hold, holdpulse and release shouldn't, playing with the provided sample:
http://polymer.github.io/polymer-gestures/samples/simple/index.html
I cannot recreate the pinch gesture no matter what, but hold, holdpulse and release keep coming out quite easily, do you know what can be the case?
I've created a simple jsfiddle but it's quite hard to use it on a mobile:
<div on-pinch="{{pinchAction}}" on-tap="{{tapAction}}">{{txt}}</div>
http://jsfiddle.net/mLT5G/77/
I'm using Google Nexus 5.0 either with most recent Chrome or Chrome Beta.
Thanks!
PS In this example:
http://jsfiddle.net/Lhwc6woa/
I cannot get any events coming from the second finger, so I guess that's why pinch doesn't work..

It looks like it was a temporary issue, it works at the moment, you can check that out using a jsfiddle attached above.

Related

Drag and drop with dataTransfer between windows possible for touch devices?

I'm a bit surprised - and maybe I'm just searching for the wrong terms - but to me it currently looks like you can't have drag and drop with data transfer on touch devices, is that true?
At least all I find is libraries like interact.js or draggable making drag & drop inside a browser easier and consistent among different browsers and devices but they don't support data transfer. For data transfer you use the Drag and Drop API which seems to not support touch devices.
This article seems to suggest this, too. Though it's old enough to keep up the hope that things have changed..
Am I missing something?
And in case I want drag and drop for item movement and data transfer for mouse and touch devices - would I have to implement for both interdependently?
I found this repository on github:
https://github.com/Bernardo-Castilho/dragdroptouch
Seems nice if it works as advertised. I tested it on Android 12 with the stock browser and it worked. Then I tested it on iOS 12, which is only 4 years old, in Safari and it didn't work.
This is going to be difficult. Support will still be patchy. I also don't quite understand what you mean by "datatransfer between windows". You mean drag and drop between browser windows?

Any possible method to detect click on cross-domain iframe on mobile?

been a few weeks trying different ways to detect a cross-domain iframe click on mobile without success.
I have tried all that has come through, all plugins, all forum tips, and yet i can't get a way to do it.
I coded whatever way i through will work and i got no positive results.
Some plugins are working on newest phones like s6/7 (maybe for other older phones too?) using blur events but i need a reliable solution that will work with most to date phones.
Maybe there is a workaround with touchstart function for mobile..
I lost my chances into believing that there's a way to do it so today i am asking here maybe someone figured it out.
Thank you.
Ps this is a demo of a plugin called iframetracker.
Can someone tell me if it works on old mobiles? http://cdn.rawgit.com/vincepare/iframeTracker-jquery/master/demo/index.html
The answer in short is No.
Regarding your plugin, on the github, it states very clearly:
About mobile devices
This plugin doesn't work on mobile devices such as smartphones and tablets, because this hardware uses a touchscreen instead of a mouse as click input. This design makes the boundary monitoring trick useless
This is why you won't find a solution for your issue.
There is no known work around for your particular problem with touch screen devices.

300 ms delay on three.js touch events

I'm working on a three.js project in which I am using TrackballControls to enable touch events. But I found that my code were not working properly. I also evaluated some working examples like http://threejs.org/examples/canvas_geometry_cube.html and found at start there is a small delay of 300 ms. But it do affect a lot in my project. How could I remove this 300 ms delay?
Note : I uses both single and multi touches in my project.
I went through the concept of fastclick ( https://github.com/ftlabs/fastclick ), but for me it doesn't seem to support multi touch. If I'm wrong, please correct me.
I remember hearing something about this: http://code.google.com/p/chromium/issues/detail?id=133391
According to the linked issue, in Chrome for Android the reason for the 300 ms delay is to recognize a double-tap zoom gesture. With the change made there (in October 2012), the delay will not be imposed if the page cannot be zoomed. So, at least in this case, what you need to do is set your page meta viewport options so that the page fits the device screen and doesn't zoom.
(Disclaimer: I've never tried this myself; I just heard about it once. I have no idea if this behavior is in current released Chrome for Android, and I don't know whether other mobile browsers, such as the stock Android browser, do the same.)
(Other disclaimer: I work for Google, but I don't work on Chrome, and I am not answering on behalf of Google here.)
Finally I found a way... I was using touch to drag and drop an object in the scene... The actual problem was as follows... The 300 ms delay of touch events get combined to form a large delay... In order to overcome this, I gave a condition so that touch move events are taken with a delay of 300 ms... i.e if one event is taken, the next event taken will be the event after 300 ms... and its working quite fine...

How to actually implement drag'n'drop in Javascript / Metro-UI under Windows 8

Somehow I must've missed the proper documentation for something as simple as this. Searching via Google does not exactly yield useful results either.
So, here's what I want to do: Draw a rectangle (div), make it draggable and drop it somewhere else, with a proper validation that the drop point is an actually valid one.
How would I go about doing that with the tools provided by the Visual Studio 11 Beta?
All I've found so far is the onDragging-Event which is not really helpful due to the scarcity of information provided.
Code sample would be great, I could also live with a link to some blog or such.
Edit: Drag and drop through touchscreen input, that is, not through the "normal" mouse interaction.
Just got a reply from a Microsoft employee: It's a bug:
http://social.msdn.microsoft.com/Forums/en-US/winappswithhtml5/thread/88cfb689-2e38-417c-a2be-9682f1a23ae4/
So, until that bug is fixed, it seems you really have to roll your own.
The following link a walkthrough of HTML5 drag/drop in IE10 from the IE blog. IE10 is the engine for Windows Web Apps so this will work in your Windows 8 app.
http://blogs.msdn.com/b/ie/archive/2011/07/27/html5-drag-and-drop-in-ie10-ppb2.aspx
Up until and including the beta (CP) we were able to use the dragstart, drag, dragend events even for touch input in Metro. In the newer builds this has stopped working (events don't fire anymore) and it looks like we'll have to switch to MSPointerMove et al. for handling touch-dragging.
From a few samples I created it seems that standalone IE has never supported dragstart, drag and dragend for touch - in other words touch drag works in my sample inside beta Metro, but same file doesn't work inside normal IE there.
Re the answer from Microsoft employee mentioned below, I believe that bug is unrelated to the issue of touch-dragging.

How to make use of the "pinch" touch effect in the Sencha Touch framework?

I'm trying to figure out how to make use of the "pinch" touch effect with Sencha Touch. Do you know of any examples that help with the first steps?
The documentation seems to be rather silent about it.
Specifically I'm looking for a common task as a starter:
I want to zoom it - and - zoom out of an image in JPEG format. Do you know if the "pinch" method allows that?
i havent seen an example for that yet.
but the Kitchensink example shows how to catch these events. Click the source button.
http://dev.sencha.com/deploy/touch/examples/kitchensink/
you can look at the sourcecode of the pinch gesture to find out what info you get with the event object.
http://dev.sencha.com/deploy/touch/docs/source/Pinch.html
maybe the deltaScale value is what you need

Categories

Resources