I have the latest kineticjs(4.3.1) and i use hammerjs for touch events initiated within the kineticjs wrapper (div element).
I need to call getIntersectedShapes on the 'onDrag' event. After doing that and checking the drag event on an ipad i only get the dragstart event(i can't debug so i don't know if i got an error).
Doing the same action on a desktop(safari + chrome) or on iPad chrome works like a charm. only safari on iPad is a problem.
I use latest browser versions both on iPad and desktop.
Hope you can help...
thnx
I don't know what your code looks like but if an event is not firing and you want it to you could just do:
.simulate();
for example:
shape.simulate('dragmove');
do be aware, that with new kineticjs 4.3.1 and above, you should set
'dragOnTop: false' //default is true
as an attribute for the shape if you intend to simulate drag events on it.
Let me know if that helped you out.
Related
I am working on a mobile site which needs to be accessible with screen reader. I am testing it with Talk back on android device. Problem is Talk back announce "Double Tap to Activate" on each element, even if it is Header (H1, H2...) or a text only like Span. I am not sure how to disable it.
But it should read "Double Tap to Activate" on button, select, link etc actionable item.
Can it be done by Talk back setting?
Thanks.
I just heard from a knowledgeable accessibility expert, "Apparently, Android thinks anything that has a tabindex of 0 or -1 is automatically an interactive element and will announce the "double-tap to activate" hint."
So possibly you could set your tabindexes to something else and see if that fixes it?
I found the issue exists in jQuery mobile plugin. I am using jQuery.mobile-1.3.1.js plugin in my application which binds "vclick" event on document. And which causes double tap issue. To resolve this, I unbind "vclick" event on document.ready method on master page.
There is one more plugin which can be a reason of this issue i.e. jQuery.validate.js. I found it binds "click" event on , and screen reader (Talk back in my case) takes non-clickable elements as non-clickable. So same unbind is useful for "click" event also. Hope this information would help to some one.
This is now fixed on Android Chrome Canary
https://bugs.chromium.org/p/chromium/issues/detail?id=1023229
I have an app built in angular2 that works fine in browser and when phonegap-bundled for iOS. It uses hammerjs to handle touch events like pan and pinch.
However, when I bundle it for Android, things go haywire.
*update: isolated case on github: https://github.com/daedeloth/phonegap-hammer-zone-angular-issue *
After some debugging I managed to isolate the problem to "tick" not being called as often as it should. On iOS and in browser (any browser really, even IE), during any drag action the tick method is called on even the slightest move. When bundled for android, it is only called at the end of the drag, and even then not always.
I've added a console.log in core.umd.js to monitor the tick method calls, so I'm pretty sure the problem originates here.
Anyone else noticed similar behaviour?
I am using Google Maps javascript API within an angular application. When using the app in Google Chrome on a regular desktop machine with a mouse, various navigation features (pan/zoom) work in the google maps part of the application just fine. However, when I try to use touch gestures on a windows 8.1 screen, the maps do not recognize any of the pan or zoom gestures. If I pinch to zoom, nothing happens. If I double tap on the screen like a mouse, then maps will zoom in. If I drag with a finger, the browser window handles the touch events instead of the maps div, so left and right navigates page history and up and down dragging scrolls the whole page instead of panning the maps.
As another experiment, I tried using google maps http://maps.google.com itself inside of Chrome, and it worked fine. So that means that it can be done somehow....
So, is it a viewport meta tag type of thing? Or does it have to do with sizing the map element? Or is it an angular thing and we need to do something with ngTouch somehow to allow the app to respond to touch events?
Update: the touch events do work on the same page on an iPad. I'm not sure what that says, but it's encouraging that at least it works on mobile safari. It seems that we need to communicate something to Angular to tell it to accept the touch events.
UPDATE
This issue was handled in the bug
https://issuetracker.google.com/issues/35824421
and was solved in version 3.27 of Google Maps JavaScript API in December 2016.
Putting the following code before the google maps api script tag helps me. But, unfortunately, it continues to disable mouse events. Please, can we a find a solution for Google Maps API with both touch and mouse support?
This solution in place of setting the application boot flags of '--user-agent chrome' or '--user-agent safari'
<script>
navigator = navigator || {};
navigator.msMaxTouchPoints = navigator.msMaxTouchPoints || 2;
//navigator.maxTouchPoints = navigator.maxTouchPoints || 2;
//window.ontouchstart = window.ontouchstart || function() {console.log('this is touchstart!');};
</script>
Note that only the first two lines are used, the other two are commented out and were not required.
My inspiration for this solution is from: https://hacks.mozilla.org/2013/04/detecting-touch-its-the-why-not-the-how/ so thank you to Patrick and Robert.
This is in fact a Google Map bug #6425
The fun fact is that Google Map API is not serving the same content based on the User Agent. So, for some use case, the workaround is to spoof the User Agent, ether by :
Chrome Dev tool > Emulation > Model
a user agent spoofing extension
--user-agent chrome flag
Any android or iOS device will work, changing the default desktop google map app to a mobile like app. Drag and pinch will work again on this mobile like app.
After some testing, the minimal UA that switches to the mobile like app is "Chrome" or "AppleWebKit/537", but it sounds hazardous to use it, as it may very well change in the future.
For my purpose, chrome based kioks, this will do the trick until the bug is fixed.
I used the above solution and modified for it to work with a mouse as well
<script>
function MapTouch() {
return true == ("ontouchstart" in window || window.DocumentTouch && document instanceof DocumentTouch);
}
if (MapTouch() === true) {
navigator = navigator || {};
navigator.msMaxTouchPoints = navigator.msMaxTouchPoints || 2;
}
</script>
I had the same problem.
JJ Stiff's solution enabled the touch events.
Apparently if you also want the mouse to work, you have to add the following line:
navigator.msPointerEnabled = true;
I've ran into an issue with Safari on iOS 5.1.1 and Angular where I am doing paginated results. After I decide to leave the page that is hosting the app, and then come back to the page by using the browser's history back button.
The application is not initialized so as I scroll again, the pagination functionality is not triggered.
Since 5.1.1 doesn't provide a web inspector, I had to rely on console.log to print events that I want to see that it's executing. On initial load, I see everything ok, but when I am back through the back button nothing fires.
My usual ways of fixing this are not working. Here are the things I've tried:
Used manual bootstrapping of Angular app
Made the page not support caching and expire the page as soon as it's rendered.
Neither of these helped, which is why I am here asking for some suggestions. Unfortunately it's not a very easy thing to replicate through a Fiddle or a hosted HTML file so I am unable to provide one. Hoping that some of you may have experienced this before.
Thanks in advance for any help.
Answer is quite late and I hope you found a solution already but it might be useful for others.
Unfortunately I won't be able to answer why the app is not initialized (due to the lack of code) but I can give you some tools/tips to ease the debugging (assuming you have the iOS simulator).
Debuging on mobile safari can be done either :
with weinre and get the features of the web concole,
or by enabling remote debugging in Mobile Safari itself, see here
Yea, same problem here with iOS 7. It must send the DOM structure over before running any javascript. Kinda pointless...
Since the problem is with mobile safari and since it supports popstate event, you can use this event to detect when the user is back in combination with $location.path(), for example:
$(window).bind("popstate", function () {
alert(location.pathname + $location.path());
});
I need to create automated tests for a Silverlight application, I use the System.Windows.Automation namespace. My problem is the following:
I use AutomationElement.FindFirst to locate UI elements in the UI tree:
AutomationElement toBeInvoked = browser.FindFirst(TreeScope.Descendants,
new PropertyCondition(AutomationElement.AutomationIdProperty, id));
This works for a few steps, but after it won't find anything. I inspected that after screen changes the UI tree is going to be empty, UISpy sees only the Silverlight control, but nothing more: screenshot
. (I've also tried to use TreeWalker, but the result was the same.) If I click manually, and inspect the elements with UISpy, everything is OK. But when I run my code, it stops (usually at the same button).
Later I realized that if I click through manually the screens that my code will visit, and after I run it, there won't be any issue... Strange. I tried it in FF 3.6, 4.0 and IE8. The problem is the same in every browser.
Has anyone any idea what could be wrong, or where could be the mistake? Am I missed something in my code, or the problem is in the settings of the browser?
Thanks in advance, regards,
Miklos
"If I click manually, and inspect the elements with UISpy, everything is OK. But when I run my code, it stops"
You can simulate manual-click this trouble-causing button by:
1.Get the coordinate of the button you want click by UI Automation;
2.Drive your mouse to click on its coordinate(by win32 mouse_event api);
See that if its following steps can run or not.