How do I load images dynamically?

How do I add an image to my app after it has already been exported as a Node-Webkit? I cannot add these images as Project Files but I still need to load and show them.

I need to deliver an app to my client and they want to be able to add more images to the app in the future.

This leaves me stuck, forced to update their app for them anytime they want to add more pictures unless I can figure out a way to do this.

I have a CSV with all the image names and I can manage the data with an array. After that I need to be able to call the images from the stored names in the array.

I have no idea how many pictures will be added or what they will be called.

Where should l look to try and build a solution for this?

Below is my original post

****************************

I can load an image from a URL/URI but how do I display it?

I have followed this tutorial: https://www.scirra.com/tutorials/541/ho ... from-files

And made this tiny app:

https://drive.google.com/file/d/0B1xzGDQ6NDI-TElEcTZWRHVmMlk/edit?usp=sharing

But I can't figure out how to show the image after its been loaded.

The Manual says that:

Load an image from a given URL. The current animation frame will be replaced with the image. It is not shown until the image has finished downloading, and On image URL loaded triggers.

and:

On image URL loaded

Triggered when Load image from URL finishes downloading the image and is ready to display it.

My Sprite has only 1 animation frame... so when its complete and ready to display how do I tell the Sprite to show the image? Or what do I tell to show the image?

Does anything change then using Node-Webkit?

Did you import the Test.png file into your project. Try hitting F12 to see the debug console.

I am confused... I have to import the Test.png file into the project? At that point I'm not calling a URL I'm calling a Project File...

I can't call images from the web and display them without knowing exactly what they are ahead of time (all cross-domain issues being considered...) ?

URL images have to be pre-loaded into the Project File?

I guess don't understand the purpose of "load image from URL" then...

Or I am missing some concept...

I placed the Test.png in the root folder of my project Win32 export folder...

F12 does not get me a debug because I am using Node-Webkit export. Again I may be missing something but I can't seem to get F12 to do anything...

You didn't provide a fully qualified URL though. The default is to go to the 'Files' location. This example works for me, via NodeWebkit.

Ok this works for me as well...

But there are some major differences in the way the app works as well. Using the full link in my app doesn't work.

Do the images have to be loaded On Start Of Load Up? I may possibly have 1000s of images... trying to load that many images is insane. I need to call images as-needed on the fly...

Does this work with local images as well? I am not sure where the default 'Files' location is... there is no 'Files' folder in my Node-Webkit export folder, nor am I aware of any 'Files' folder in the C2 installation.

Thanks for the help so far!

goblynn93 I don't know if you ever found an solution or not but I just faced the same problems. For the next one who is searching for it... here is how I did it.

http://i.imgur.com/VzBowpY.png

You can get the folder path with the NW.js plugin expressions "NWjs.AppFolder", this will return the path to the install folder of the .exe once exported.

For test purposes you can set the "pathToApp" variable manually to your project folder.

After you exportet your project you have to manually create the folder "yourFolderName" in the win32 and win64 folder (the same folder where the exported .exe files are located) and put the images in it. I dont know if this works with osx and linux, because I have no way to test this (if some one does let me know if it works ). But osx has a "Resources" folder and i guess you can put the files in there no problem.