Correct img format for browser widget.

jonathandlynch at jonathandlynch at
Sun Jul 16 09:22:29 EDT 2017

So - thinking about this dime more - the browser widget uses a dummy URL if not told to load a specific URL, and the dummy URL would not have permission to access local drives, for security reasons.

That would mean the "file:///" prefix would not work either.

So he would have to either save the HTML file to the local disk, or convert to dataURLs.

Fortunately, it is only a few lines of code to convert to a dataURL, and he can build it into his HTML without having to use JavaScript.

Sent from my iPhone

> On Jul 16, 2017, at 9:10 AM, jonathandlynch at wrote:
> Hi Hermann,
> Is this part of the same-source policy for web pages? The HTML file and the image file needing to be in the same folder?
> Sent from my iPhone
>> On Jul 16, 2017, at 5:45 AM, hh via use-livecode <use-livecode at> wrote:
>> You can have that without a (local) server when using a browser widget.
>> Although you can NOT display an image from disk without javascript by
>> only setting the htmltext with a correct filepath, for example as follows.
>> (This is a browser engine thing, can not be influenced by the widget.)
>> Example htmltext of the widget or text of the file "flower2b.html":
>> <html><body><img src='flower2b.png' width='80' height='60'></body></html>
>> But it works if you set the URL of the widget to a (local) html-file that
>> has exactly this text as html (if 'flower.png' is in the same folder).
>> *** Then the htmltext of the widget is 'anchored' in the local file system
>> and can use a full or relative path.
>> BTW. To display an image "/home/jh/images/flower.png" from disk in a field
>> for example at size 80x60 at char 42:
>> 1. create an img "i1"
>> 2. set the filename of img "i1" to "/home/jh/images/flower.png"
>> 3. set the width of img "i1" to 80; set the height of img "i1" to 60
>> 4. set the imagesource of char 42 of fld 1 to "i1"
>>> James H. wrote:
>>>> hh wrote:
>>>> ... Or in case you meant simple HTML load (not canvas2d):
>>>> <img src="...">
>>>> where src = "full http-path to image" (local server is running)
>>>> or src = "relative path to image"
>>> Actually I am not loading a file from a server, I am setting the htmltext of the widget.
>>> The file I am loading is actually a markdown which I convert to xhtml using mergMarkdownToXHTML.
>>> I then set the htmltext of the widget to this converted content.
>>> Now the text etc all display fine as I would expect, however the images don't.
>>> The image tags in the markdown are correctly converted to <img src="..."> but obviously the path to the image file is not being correctly interpreted by LC.
>>> If I was to display this in a text field (by setting its htmltext) I would need to change the img tag's src attribute to include the "binfile:/" prefix.
>>> When I do this the image displays as expected in the text field.
>>> However, this displays the images at the size they exist on disk.
>>> I notice the dictionary (which is using the browser widget) does not do this. It actually scales the images down where required.
>>> So I thought rather than set the htmltext of the field, let me set the htmltext of a browser widget.
>>> However none of the forms of the URL for the images that I have tried work.
>>> I do not know javascript and while I can sort of follow the logic behind the guide display in the dictionary I can't fathom how it actually works.
>>> It is taking the markdown, converting it the a form of html and it correctly shows the text and the images.
>>> I am trying to do this without the javascript.
>> _______________________________________________
>> use-livecode mailing list
>> use-livecode at
>> Please visit this url to subscribe, unsubscribe and manage your subscription preferences:

More information about the Use-livecode mailing list