GWT native drag & drop - DragStartEvent not firing on IE9 - gwt

I have GWT 2.4.0 native drag and drop working with Chrome, Safari and Firefox. But on IE9, the drag start event does not fire and the cursor seems to go into a text selection mode.
Any ideas?
public class BaseFlowComponent extends Composite {
public BaseFlowComponent() {
this.initWidget(panel);
this.addDomHandler(new DragStartHandler() {
public void onDragStart(DragStartEvent event) {
event.setData("text", componentName);
event.getDataTransfer().setDragImage(getElement(), 10, 10);
}
}, DragStartEvent.getType());
this.getElement().setDraggable(Element.DRAGGABLE_TRUE);
}
}

This issue is fixed since http://code.google.com/p/google-web-toolkit/source/detail?spec=svn10138&r=10138.
GWT Team Test URL - http://gwt-cloudtasks.appspot.com
GWT Team Sample Code - http://code.google.com/p/google-web-toolkit/source/browse/trunk/samples/mobilewebapp/src/main/java/com/google/gwt/sample/mobilewebapp/client/desktop/DesktopTaskEditView.java
Ensure that you are running the sample code in the same browser and document mode in Hosted and Production mode. Also keep in mind GWT teams recommendation. https://developers.google.com/web-toolkit/doc/latest/DevGuideIE9
Ensure IE9 is not running under some IE8/IE7 compatibility mode.
For IE7 and IE8 the feature is disabled.
Reference -
http://code.google.com/p/google-web-toolkit/source/detail?spec=svn10138&r=10138
https://groups.google.com/forum/?fromgroups=#!topic/google-web-toolkit/0MkjaHsVfO4

Related

Virtual Keyboard not opening in Unity3D with Steam/MRTK

I'm developing with Unity using the MRTK (if that matters) and my project setup is using "PC,Mac &Linux Stand Alone", my player settings are set to enable VR.
I'm copying and pasting directly the code from Unity to open the keyboard, and that function is the first one I call when opening the scene, and yet I can't see it. Is there anything wrong/buggy with it?
I even tried it on a completely empty project. Nothing happens.
Directly from Microsoft:
public TouchScreenKeyboard keyboard;
private void Start()
{
OpenSystemKeyboard();
}
public void OpenSystemKeyboard()
{
keyboard = TouchScreenKeyboard.Open("", TouchScreenKeyboardType.Default, false, false, false, false);
}
No error message, no console message, just nothing....
The API in question I believe is only documented to work for the following platforms:
iOS
Android
Windows Store Apps (AKA UWP apps AKA Universal Windows Platform apps)
Since the build process is uses PC/Mac/Linux, it's not a WSA/UWP app, so I wouldn't expect that to show up given Unity's documentation here:
https://docs.unity3d.com/ScriptReference/TouchScreenKeyboard.html
The older version of the MRTK (HTK) had a keyboard prefab that could be used, though note that that branch is fairly old at this point:
https://github.com/microsoft/MixedRealityToolkit-Unity/blob/htk_release/Assets/HoloToolkit/UX/Prefabs/Keyboard.prefab

Java annotation using Pyjnius

I copied this code to use android native WebView in my Kivy application. Works perfectly :)
Now, I would like to bind my JavaScript with my Kivy application.
I've read through this guide:
...
/** Show a toast from the web page */
#JavascriptInterface
public void showToast(String toast) {
...
How can I create a PyJnius class that has #JavascriptInterface annotation?
Thanks!

Opacity FadeIn/FadeOut GWT Query Internet Explorer

i am using
$("div.content").fadeOut(300, new Function() {
public void f(Element e) {
absolutePanel.clear();
show(comp);
}
});
to hide/show content. It works fine in Chrome and FF but in IE 7, 8, 9 the Opacity wont work. I know there are a lot of problems with IE but i haven't found anything specified for GQuery how to solve this issue.
Is there any workaround? Or maybe I am using it wrong for IE?
Thanks in advance
Edit:
This works with IE:
Style style = absolutePanel.getElement().getStyle();
style.setOpacity(0.0d);
This does not:
$("div.content").animate("opacity:0.4");

GWT - Fullscreen

Is there a way to start a gwt-app in fullscreen mode (without toolbar, navigation)?
I found only a hint to open a new window:
Window.open("SOMEURL","SOMETITLE",
"fullscreen=yes,hotkeys=no,scrollbars=no,location=no,menubar=no,status=no,
toolbar=no,resizable=no");
Is this the only way?
If yes, what's the best way to use the "Window.open" (Example)?
This works for me:
private native void requestFullscreen() /*-{
var element = $doc.documentElement;
if (element.requestFullscreen) {
element.requestFullscreen();
} else if (element.mozRequestFullScreen) {
element.mozRequestFullScreen();
} else if (element.webkitRequestFullscreen) {
element.webkitRequestFullscreen();
} else if (element.msRequestFullscreen) {
element.msRequestFullscreen();
}
}-*/;
This isn't really a GWT question - this is a browser-provided API that GWT happens to wrap for you.
It's worth noting that modern browsers have a tendency to ignore some or all of these flags. For example, good luck getting Chrome to hide its address bar. The reason for this is that if they honoured all of the flags, you could write a web app which looked exactly like a desktop app and the user wouldn't know it - which is exactly what you sound like you're trying to do!
or use https://github.com/wokier/gwt-fullscreen
Caffeinate response has been used as a basis. I also added an event to be notified of fullscreen state change.

Native HTML5 Drag and Drop in Mobile Safari (iPad, iPod, iPhone)?

I've successfully implemented native HTML5 Drag and Drop for moving HTML elements inside a page (just, say, a div from one place to another, nothing related to interacting with the host OS' files whatsoever). This works fine in Chrome and Safari on a PC but I can't start a drag operation in my iPad's Safari.
I've found this so far:
Using Drag and Drop From JavaScript
Safari, Dashboard, and WebKit-based
applications include support for
customizing the behavior of drag and
drop operations within your HTML
pages.
Note: This technology is supported
only on desktop versions of Safari.
For iPhone OS, use DOM Touch,
described in Handling Events (part of
Safari Web Content Guide) and Safari
DOM Additions Reference.
Here. But it's outdated (2009-06-08).
Doe's anyone know if it is possible to use native HTML5 in Mobile Safari? (I don't want javascript-framework like solutions like jQuery UI).
Thanks!
I've just been trying to get native drag&drop working in ios safari (ipad pro with 14.0.1), and I'm updating this answer as it kept coming up as my first google result (and no other q&a seems to be up to date).
Following https://developer.apple.com/library/archive/documentation/AppleApplications/Conceptual/SafariJSProgTopics/DragAndDrop.html
I have found native html5 drag&drop now works in safari, with a few specific notes;
You MUST set some data in OnDragStart's event; (the effect settings seem to be optional) Event.dataTransfer.setData('text/plain', 'hello');
you MUST Event.preventDefault(); in OnDrop otherwise safari will load the data you added (unless that's your intention)
OnDragOver event handler needs Event.preventDefault(); otherwise drop fails (unless intended, as docuemnted)
On ios safari, if you set OnDragStart's Event.dataTransfer.dropEffect='copy' and in OnDragOver's Event.dataTransfer.dropEffect='link' the drop fails (no OnDrop()); Seems to be the only combination that fails
I thought you required
CSS -webkit-user-drag: Element; and `-webkit-user-drop: element;
or if you prefer
Element.style.setProperty('webkitUserDrag','element');
Element.style.setProperty('webkitUserDrop','element');
but it seems just the usual draggable attribute is enough
Element.setAttribute('draggable',true);
This seems to be the bare minimum to drag & drop an element
Element.setAttribute('draggable',true);
function OnDragOver(Event)
{
Element.setAttribute('DragOver',true);
Event.stopPropagation(); // let child accept and don't pass up to parent element
Event.preventDefault(); // ios to accept drop
Event.dataTransfer.dropEffect = 'copy';// move has no icon? adding copy shows +
}
function OnDragLeave(Event)
{
Element.removeAttribute('DragOver');
}
function OnDrop(Event)
{
Element.removeAttribute('DragOver');
Event.preventDefault(); // dont let page attempt to load our data
Event.stopPropagation();
}
function OnDragStart(Event)
{
Event.stopPropagation(); // let child take the drag
Event.dataTransfer.dropEffect = 'move';
Event.dataTransfer.setData('text/plain', 'hello');
}
Element.addEventListener('dragstart',OnDragStart);
Element.addEventListener('drop',OnDrop);
Element.addEventListener('dragover',OnDragOver);
Element.addEventListener('dragleave',OnDragLeave);
Touch events do work now on Safari too (including Mobile). This article has nice code snippets that you can start from:
http://www.html5rocks.com/en/mobile/touch/