We are using file upload from the gwt but i want to upload the file by drag and drop in the browser. It is working fine with chrome browser but not working with Firefox because in Chrome it is showing choose File and Firefox it is showing Browse option. How can i upload the file in the Firefox browser by Drag and drop?
We are using GWT 2.5.1 and Smart Gwt 4.1.
We could do the drag and drop in any version of chrome but not in any version of firefox browser.
Code Snippet:
import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.ui.FileUpload;
import com.google.gwt.user.client.ui.RootPanel;
import com.smartgwt.client.types.Alignment;
import com.smartgwt.client.widgets.Label;
import com.smartgwt.client.widgets.form.DynamicForm;
import com.smartgwt.client.widgets.form.fields.FileItem;
import com.smartgwt.client.widgets.form.fields.TextItem;
import com.smartgwt.client.widgets.layout.HLayout;
import com.smartgwt.client.widgets.layout.VLayout;
/**
* Entry point classes define <code>onModuleLoad()</code>.
*/
public class TestApp implements EntryPoint {
#Override
public void onModuleLoad() {
VLayout vTest=new VLayout();
vTest.setBackgroundColor("#D3D3D3");
VLayout fileVLayout = new VLayout(10);
fileVLayout.setAutoWidth();
fileVLayout.setAutoHeight();
fileVLayout.setPadding(10);
final DynamicForm form = new DynamicForm();
TextItem filename = new TextItem();
filename.setTitle("File Name");
TextItem uploader = new TextItem();
uploader.setTitle("uploader name");
uploader.setWrapTitle(false);
**// Smart GWT**
final FileItem uploadfile = new FileItem();
uploadfile.setTitle("File Item");
uploadfile.setAlign(Alignment.CENTER);
**// GWT**
final FileUpload fileTest = new FileUpload();
fileTest.setTitle("File Upload");
form.setItems(filename, uploader, uploadfile);
form.draw();
HLayout fileHLayout = new HLayout(10);
fileHLayout.setHeight(10);
Label fileNameStaticLabel = new Label();
fileNameStaticLabel.setContents("File Upload");
fileNameStaticLabel.setWrap(false);
fileNameStaticLabel.setHeight("25px");
fileNameStaticLabel.setAlign(Alignment.RIGHT);
fileVLayout.addMember(form);
fileHLayout.addMember(fileNameStaticLabel);
fileHLayout.addMember(fileTest);
vTest.addMember(fileVLayout);
vTest.addMember(fileHLayout);
RootPanel.get().add(vTest);
}
}
Thanks in advance.
You're on the right track, just replace the native GWT code with Smart GWT code.
You are mixing GWT with Smart GWT components. You should not do that, per http://forums.smartclient.com/showthread.php?t=8159#aMix. "The reason for this is that there are limits to the maximum degree that two Ajax widget kits
(including GWT) can interoperate..."
Smart GWT has its own file picker, see http://www.smartclient.com/smartgwtee/javadoc/index.html?overview-summary.html (FileItem). And also it's own Canvas system: Don't use GWT RootPanel, use Smart GWT Canvas or VLayout, etc.
Though Smart GWT has "GWT" in the name, and though it uses substantial portions of GWT (GWT Compiler, etc), Smart GWT really is a framework unto itself. Aside from rare cases (e.g., login page), it's not advisable to mix Smart GWT with native GWT.
Related
I would like to capture a screenshot of a website including content that you can only see if you scrolled down.
Is that possible?
EDIT:
I already tried https://github.com/ui4j/ui4j/blob/master/ui4j-sample/src/main/java/com/ui4j/sample/ScreenCapture.java, but it did not capture the whole page, just the visible portion(inside my monitor's viewport).
page.show(true);
page.captureScreen(new FileOutputStream(file));
Yes, you could capture screenshot of the whole page with ui4j. Sample code:
package com.ui4j.sample;
import java.io.File;
import java.io.FileNotFoundException;
import java.io.FileOutputStream;
import com.ui4j.api.browser.BrowserFactory;
import com.ui4j.api.browser.Page;
public class ScreenCapture {
public static void main(String[] args) throws FileNotFoundException {
Page page = BrowserFactory.getWebKit().navigate("https://www.google.com");
page.show(true);
page.captureScreen(new FileOutputStream(new File("google.png")));
}
}
Alternative solution:
I highly recommend to use cdp4j library for full page screen capture. Its a Java library which help to automate Chrome/Chromium based browser. Here is the sample code.
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!
I am trying to port my javafx2 application over to javafx8 but have noticed some issues on Linux with popup controls.
The screenshot shows how the popup have a white box around it, which normally should be transparent and drop shadow effect.
This only happens on my Slackware14 Linux, I have test on the Windows VM that runs on the same machine and it renders fine.
I think the issue is related to these issues
https://javafx-jira.kenai.com/browse/RT-33709
https://javafx-jira.kenai.com/browse/RT-33750
My question is are there any workaround until it will be fixed ?
What the Problem Is
The default JavaFX 8 (modena.css) does not take into account that the transparent window feature is optional on some platforms (specifically some Linux platforms).
It is unlikely that the default css will be changed until Java 9 comes out.
How to Fix It
This is a solution for Java 8+ only.
Supply your own css to override the default css so that you can support those platforms without displaying an ugly white border areas around some of your controls. The css you provide can assume that transparent windows are not a feature of the underlying platform and style the UI so that it still looks good on such platforms. As the transparent window feature is a ConditionalFeature, on application startup, check to see if the conditional feature is supported, and if it is not, apply your custom stylesheet via Application.setUserAgentStyleSheet().
Sample Application
I have only tested this on a Mac (which supports the transparent window feature), so I can't really verify it will work as expected on Linux, but I hope it will work fine :-)
import javafx.application.Application;
import javafx.application.ConditionalFeature;
import javafx.application.Platform;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.ColorPicker;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;
public class SolidPick extends Application {
public static void main(String[] args) { launch(args); }
#Override public void start(Stage stage) throws Exception {
ColorPicker picker = new ColorPicker();
if (Platform.isSupported(ConditionalFeature.TRANSPARENT_WINDOW)) {
Application.setUserAgentStylesheet(
this.getClass().getResource(
"solid-pick.css"
).toExternalForm()
);
}
StackPane layout = new StackPane(picker);
layout.setPadding(new Insets(10));
stage.setScene(new Scene(layout));
stage.show();
}
}
Then the file solid-pick.css an exact copy of the entire modena.css with the following additional lines appended to the end:
.color-palette {
-fx-background-radius: 0, 0;
-fx-effect: null;
}
These lines:
Give the color picker popup a square background rather than a rounded one.
Remove the translucent drop shadow effect which normally surrounds the popup.
The combination of these things provide the popup with a shape and border which looks much better in an environment which does not provide transparent windows.
The solid-pick.css file should be placed in the same directory as the SolidPick application, so that it gets bundled into the application jar and will be available to the application classloader.
Sample Output
Here is some sample output of rendering on my Mac with and without the dropshadow border on the popup.
Standard rendering =>
Modified rendering, with square borders and no shadow =>
Suggested Approach
Go through your entire application (and possibly the entire modena.css stylesheet) and, using a similar approach to that done above for the color picker, fix up any rendering issues that arise in a transparent window incapable environment. Then use the resultant stylesheet in your application and (if licensing permits), contribute your custom stylesheet to the community by submitting it to a 3rd party project such as ControlsFX.
What i want is that a user can select a complete path in his local drive and then a file (which is in the war folder of my app right now) will be saved in that selected user location
I am using File upload in GWT to upload my files , its working fine , will i use FileUpload for Download as well?
Also for a second option if there's a possibility to get the location which user have selected for example d:\downloadfolder, my problem will solve, i will do the rest !
below is the code for uploading , Please help me with Download
final String UPLOAD_ACTION_URL = GWT.getModuleBaseURL() + "upload";
initWidget(panelImages);
final FormPanel form = new FormPanel();
form.setAction(UPLOAD_ACTION_URL);
form.setEncoding(FormPanel.ENCODING_MULTIPART);
form.setMethod(FormPanel.METHOD_POST);
VerticalPanel panel = new VerticalPanel();
form.setWidget(panel);
FileUpload upload = new FileUpload();
upload.setName("uploadFormElement");
panel.add(upload);
// Add a 'submit' button.
panel.add(new Button("Submit", new ClickHandler() {
public void onClick(ClickEvent event) {
form.submit();
}
}));
form.addSubmitCompleteHandler(new FormPanel.SubmitCompleteHandler() {
public void onSubmitComplete(SubmitCompleteEvent event) {
if(event.getResults().contains("DataBase Restored")){
Window.alert("Database Restored !");
}
}
});
panelImages.add(form);
You can't do this from GWT because JavaScript has no access to the local hard drive. The best you can do is initiate a download normally (e.g. show a link to a file that the user can click). Depending on their browser settings they'll either choose a location for the file or it will be downloaded to some default location. You cannot know that location with just JavaScript.
If this is a project requirement I think you'll need to include a heavier-weight plugin like java or flash.
I'm developing a GWT application. I need to embed a YouTube video in my application.
I've tried BST player API but I wasn't successful in bringing up the video on the player.
I've downloaded BST Player.jar and added it to my buildpath, then inherited the following jars in gwtapp.gwt.xml:
**inherits name ='com.bramosystems.oss.player.core.Core'**
**inherits name ='com.bramosystems.oss.player.youtube.YouTube'**
Then I tried the example given on BST page:
simplePanel = new SimplePanel();
add(simplePanel);
simplePanel.setSize("", "");
try {
// create the player, specifing URL of media
player = new ChromelessPlayer("http://www.youtube.com/watch?v=O3CZFfyed3M", "80%", "350px");
CustomPlayerControl cpc = new CustomPlayerControl(player);
FlowPanel fp = new FlowPanel();
fp.add(player);
fp.add(cpc);
simplePanel.setWidget(fp); // add player and custom control to panel.
} catch (PluginVersionException e) {
// required Flash plugin version is not available,
// alert user possibly providing a link to the plugin download page.
simplePanel.setWidget(new HTML(".. some nice message telling the " + "user to download plugin first .."));
} catch(PluginNotFoundException e) {
// required Flash plugin not found, display a friendly notice.
simplePanel.setWidget(PlayerUtil.getMissingPluginNotice(e.getPlugin()));
}
I could see the panel with the YouTube player but I couldn't see the video loading nor playing. I've tried player.playMedia() and it was of no help. Any ideas of how to proceed and make the video work?
You probably need to be passing this URL instead:
http://www.youtube.com/v/O3CZFfyed3M
I found a way to embed youtube videos in a GWT vithout using any external library. Integration level is very simple so you can not make any advanced use. Here it is the code fragment of a UIBinder template and its corresponding class:
Using and HTMLPanel put an object element like this:
<g:HTMLPanel>
<object ui:field="videoElement"
type="application/x-shockwave-flash"
width="640" height="480" data="">
</object>
</g:HTMLPanel>
#UIField
ObjectElement videoElement;
[...]
public void displayVideo(String videoId) {
String videoUrl = "http://www.youtube.com/v/".concat(videoId);
videoElement.setData(videoUrl); //change data attribute of object element
String innerHtml = "<param name=\"movie\" value=\""+ videoUrl +"\" />";
//add param element, of course yo can add as many param elements as needed to customize
videoElement.setInnerHTML(innerHtml);
}
To make it work I needed to put this video view inside a Panel and whenever I wanted to view / update the video clear the panel and add the video view again.
Hope this helps
I have created this GWT wrapper on top of YouTubes Iframe api library. Which makes it easier to use YouTube api inside gwt check https://github.com/pandurangpatil/gwt-youtube