Javascript Image switching

Classic Servoy
1

Hi,

I have simple (newbie) question about images.

I want to load an image with javascript and then show it on a form.

I know how to load the image:
var image = plugins.images.getImage(“C:\asd\asd.png”);

But then I don’t know what element to put in the form to receive the image.

On the form there must be a placeholder or someting, what is the right type of the element knowing that the image is 800*600 and will be switched often?

2

Welcome to Servoy

You can place the image in a media field or onto a Label/Button. Try this:

 var vFile = plugins.file.showFileOpenDialog();
var vImage = plugins.images.getImage(vFile);
var vHeight = 400;
var vWidth = 300;
var vScaled_image = image.resize(vWidth, vHeight);
image_1 = vScaled_image;

image_1 is a field in this case and I’ve hardcoded vHeight & vWidth to shrink your photos by 50% but these would normally be variables selected by the User.

Hope this gets you started.

Graham Greensall
Worxinfo Ltd

3

Hi,

You can’t pass a string as file reference to the image plugin. It needs to be a JSFile object.
The following code would work:

var f = plugins.file.convertToJSFile("C:\\asd\\asd.png")
globals.myBigImage = plugins.images.getImage(f);

As you can see I put the image into a global field. This field is of type Media.
Now you can put a label or a field (with DisplayType set to image_media) and use the global as dataprovider.
You can’t do this with javascript variables, you need to use Servoy globals.

Hope this helps.

4

I must be missing something.

I’ve done that:

var s = "C:\\asdsad\\7141.png";
var file = plugins.file.convertToJSFile(s);
globals.gImgRel = plugins.images.getImage(file);

and I’ve created a label with the dataprovider set to globals.gImgRel.

However when I execute the method all I see inside the label is:

org.mozilla.javascript.NativeJavaObject@1194a34

Same thing with a field.

What have I done wrong?

5

The only thing that seems to work right now is:

elements.placeholderImgRel.setImageURL("file:///C:/Documents%20and%20Settings/Admin/1052.png");

“placeholderImgRel” is the name of a label.

6

imJames:

org.mozilla.javascript.NativeJavaObject@1194a34

Same thing with a field.

What have I done wrong?

You set the dataprovider property of the label or did you used a %%merge code%% in the text property? You should use the dataprovider property.
Also make sure the global is of type MEDIA.
I tested to code I posted and it works fine for me…I am on a Mac though but that shouldn’t make a difference.

Hope this helps.

7

I did what you said: I set the dataprovider to the globas variable of MEDIA type and the text property was empty. And I saw what I saw.

I use Version 3.1-build 404 on Java version 1.6.0-b105 (Windows 2000).

8

Hmm…I see the same thing in 3.1. (Java version 1.5.0_06-64 (Mac OS X))
Originally I tested it in 2.2.7 which worked fine.
Seems it’s utterly broken/changed in 3.1.

9

Yes, this is a bug, it will be fixed in next release.
Rob

10

Thanks Rob.

Can you also check out the getMetaDataProperties function of the image plugin. It seems to return a [Ljava.lang.String;.
Apparently not something javaScript can handle.

Thanks again.

11

ROCLASI:
Can you also check out the getMetaDataProperties function of the image plugin. It seems to return a [Ljava.lang.String

I can’t seem to reproduce this, can you show an example?

Rob

12

Ah, nevermind.

I tried it on a picture without Exif data and I didn’t realised it was an array that was returned. :oops: