LiveCode Forums.

Posted: **Sun May 09, 2021 9:30 am**

I recently had to use Lc 6.7.9 to make contact with an https url as versions below this are flakey with how they handle the connection, 6.6.2 being the first version that even *can* communicate with modern https addresses.

I'm assuming there were changes in "revsecurity.so" since replacing it with a later version allows earlier Lc versions to connect.

Anyhow, I was attempting to convert a webpage (NOAA) to a condensed version to display the weather without using the API, that worked out fairly well, although I still have some formatting to finish...

While I was writing this, I of course used "imageSource" to replace the character I inserted before each line with the forecast image that accompanied that part of the page.

This worked out fine, but I came across "<img src=...>" in the htmlText entry of the dictionary, and was wondering exactly how it could be used ? From the dictionary:

<img src="imageSpecifier">
Replaces a character whose imageSource property is not empty. The value of the imageSource property is included as the value of the "src" attribute.

That is all fine and well, but when I tried to add some of the other elements of the "<img src>" tag, like width or size, they don't seem to have any effect.

Is there a way to set them? Or alternately, is there a way outside of this to alter the imageSources properties such as size, alt text, etc ?

Let me know if the above rambling isn't clear, and I'll try again

Posted: **Sun May 09, 2021 12:12 pm**

Also, I can't seem to figure out why <img src> doesn't seem to work across fields from 2 separate stacks ?

Posted: **Sun May 09, 2021 5:42 pm**

In my experience the image must be the correct size when used with imageSource. If you need full html support you can use a browser control. LC just uses the image as-is for imageSource. You could import the image invisibly and resize it before applying imageSource.

I'm not entirely sure what you mean about fetching an image across stacks. It should work if you reference the image with a full path description as long as the both stacks are in memory and the image is imported into the stack. You need to reference the image itself, not just the imageSource name in the htmltext. If the image is on disk it's better to reference the file.

Posted: **Sun May 09, 2021 6:19 pm**

jacque wrote: ↑
Sun May 09, 2021 5:42 pm
In my experience the image must be the correct size when used with imageSource. If you need full html support you can use a browser control. LC just uses the image as-is for imageSource.

Well, that answers my questions about <img src=>, all it supports I guess is the image location (of an already referenced imageSource'd character), and doesn't support any of the tag extras included in basic html 4, at least, not that I've been able to determine

That is too bad, really, in a way.

If you need full html support you can use a browser control.

Listen young lady, if I want to hear language like that...

I don't actually need full html support, I literally stripped out most of the html in the page I am displaying.

You could import the image invisibly and resize it before applying imageSource.

Yes, initially I was importing the images into an image object, and then displaying them at the size I wanted. I may wind up going back to that, but I thought it was kind of cool that using <img src> would let me wrap text at the end of the image in the field.

1.)I'm not entirely sure what you mean about fetching an image across stacks. It should work if you reference the image with a full path description as long as the both stacks are in memory and the image is imported into the stack. 2.) You need to reference the image itself, not just the imageSource name in the htmltext.

1.) if you look at the 2nd picture in the first post, it should show you what I mean. In the original (top) text box, I used 'imageSource' and the path you see to setup the picture, and typed out regular html to reference the imageSource'd image. As the code below that shows, you should then only have to set the 2nd field to the htmlText of the first to get the picture to show, instead of having to code in 'imageSource' again.

Code: Select all

# operating on the original field 1....
	set the imageSource of character 1 of line 7 to "full path to image"

# operating on the display field 2....
	set the htmlText of field 2 to field 1

# in the text of field 1 is an asterisk and <img src> tag....
*<img src="full path to image" <!- this should replace the asterisk in character 1 of fld 1 with the image in fld 2 when you set the htmlText of 2 to 1 --/>

Those fields are both on the same card, and it works well as you can see, starting the text after the character that is now a picture.

In the post below that one, the two fields are on a mainStack and a subStack of the same project, card 1 of both. The arrows, highlighted words, and green rectangular frame show the same parts and the referenced picture.

In the html field, I've referenced the character using imageSource, and filled out the html <img src> tag to include the reference, just like the example in post 1. The picture shows up in the html field, but not in the field that is set to the htmlText of that field, hence although both stacks are part of the same stack/project, my question about it not seeming to work as it does in the first example.

Not sure if that is clearer or not? I agree it should work, I don't see any reason it should *not* work, but it doesn't appear to work (at least, not in 6.7).

2.) Yes, I might have scaled the picture a bit too much, I could read that it is listing a fully referenced image, but not sure others would have been able too

Posted: **Sun May 09, 2021 7:48 pm**

bogs wrote: ↑
Sun May 09, 2021 6:19 pm

If you need full html support you can use a browser control.
Listen young lady, if I want to hear language like that...

Mea culpa.

You could import the image invisibly and resize it before applying imageSource.
Yes, initially I was importing the images into an image object, and then displaying them at the size I wanted. I may wind up going back to that, but I thought it was kind of cool that using <img src> would let me wrap text at the end of the image in the field.

I meant, continue to use imagesource but import and resize the image first, invisibly if you want. Then point imagesource to the newly resized copy.

Code: Select all

# operating on the original field 1....
	set the imageSource of character 1 of line 7 to "full path to image"

# operating on the display field 2....
	set the htmlText of field 2 to field 1

# in the text of field 1 is an asterisk and <img src> tag....
*<img src="full path to image" <!- this should replace the asterisk in character 1 of fld 1 with the image in fld 2 when you set the htmlText of 2 to 1 --/>

Those fields are both on the same card, and it works well as you can see

I'm a little surprised, since what I think is needed in both cases (same stack and substack) is:

Code: Select all

set the htmlText of field 2 to the htmltext of field 1

Posted: **Sun May 09, 2021 11:24 pm**

From experience, it's a bad idea to think of htmText as html.

Also... when setting the imagesource of a character, you want the ID of the image, not a path to the image.

Posted: **Mon May 10, 2021 10:57 am**

mwieder wrote: ↑
Sun May 09, 2021 11:24 pm
From experience, it's a bad idea to think of htmText as html.

Well, I'm not thinking of Lc's htmlText as actual html, however, where the tags match, at least in function, I don't see the problem in using them as they are supposed to be used for replacement ? After all, if the htmlText subset in Lc was actual html, scraping pages like this would be no trick at all hahah.

Also... when setting the imagesource of a character, you want the ID of the image, not a path to the image.

Also, I'm kinda curious if you could clarify what the difference would be - I was going by this (from the dictionary) ~

Important! Do not use the URL keyword when specifying an imageURL. The imageSource of a character is a file location (or image ID or name), not the image data itself. If you use the URL keyword, the imageSource property is set to the contents of the URL, not the URL itself, and this is usually not what's wanted.

... all three of those methods show the image just fine ?

Posted: **Mon May 10, 2021 11:13 am**

jacque wrote: ↑
Sun May 09, 2021 7:48 pm
I'm a little surprised, since what I think is needed in both cases (same stack and substack) is:
Code: Select all
set the htmlText of field 2 to the htmltext of field 1

Heh, that is what I am using. I really need to figure out how to make my posts less confusing

Posted: **Mon May 10, 2021 4:46 pm**

Well, I'm not thinking of Lc's htmlText as actual html, however, where the tags match, at least in function, I don't see the problem in using them as they are supposed to be used for replacement ? After all, if the htmlText subset in Lc was actual html, scraping pages like this would be no trick at all hahah.

Right, but you were expecting to be able to set the height and width and... in the imgsrc tag. And while you can do that with html, the htmlText property doesn't support those properties.

Posted: **Mon May 10, 2021 4:49 pm**

I was looking at this line:

Code: Select all

set the htmlText of field 2 to field 1

Referencing "field 1" will give you the text, not the htmltext. I expected you'd see the asterisk rather than the imageSource.

Theoretically you can use the name for an imageSource, and I think I've done that, but I generally use the ID. It seems less likely to have conflicts with other controls.

Posted: **Mon May 10, 2021 5:06 pm**

Here's why you need to use the ID (this will cause a hard crash in LC, so don't have any unsaved work hanging around)

The one line of code is in the button:

Code: Select all

set the imagesource of char 1 of field 1 to image 1 of card 2

To get it not to crash, use

Code: Select all

set the imagesource of char 1 of field 1 to the id of image 1 of card 2

Posted: **Mon May 10, 2021 9:33 pm**

jacque wrote: ↑
Mon May 10, 2021 4:49 pm
I was looking at this line:
Code: Select all
set the htmlText of field 2 to field 1
Referencing "field 1" will give you the text, not the htmltext. I expected you'd see the asterisk rather than the imageSource.

Actually, it seems to work exactly that way, or setting the htmlText of one field to the text of the other, because if you set the htmlText of 2 to the htmlText of 1, you get the base html scripting in 2.

This is a simple diddy I was working with to play with Lc's inbuilt html.

stWorkingHtml.livecode.zip: htmlDemo; (5.47 KiB) Downloaded 222 times

As you can see, just using

Code: Select all

set the htmlText of field "txtDisplay" to field "txtSource"

works, although the pictures I posted earlier show setting "to the text of" as well.

Posted: **Mon May 10, 2021 9:44 pm**

mwieder wrote: ↑
Mon May 10, 2021 4:46 pm

Well, I'm not thinking of Lc's htmlText as actual html, however, where the tags match, at least in function, I don't see the problem in using them as they are supposed to be used for replacement ? After all, if the htmlText subset in Lc was actual html, scraping pages like this would be no trick at all hahah.
Right, but you were expecting to be able to set the height and width and... in the imgsrc tag. And while you can do that with html, the htmlText property doesn't support those properties.

Expecting might be a little much, I was actually just laying out what I had tried, and asking if there were a way to accomplish it.

The reason I asked was because of the way some of the Lc tags are laid out, take the "font" tag for instance. This is perfectly legitimate -

Code: Select all

<p><threedbox><font size="20"; color="blue">21ordered pressedinto labor preordered</threedbox></p>

...so I merely wondered if it were able to be done the same with the "img src" tag as well. The dictionary is pretty skimpy in some places.

At least I get why your talking about the ID now, but I don't see how that trumps the full address path still. Your mainly referring to an image already imported into a stack, I presume in an image object, and I'm pretty much working from files on disk that don't have IDs (yet). Or am I missing something?

Posted: **Mon May 10, 2021 11:21 pm**

Ah. I see. You're working with images on disk and not already imported into the stack.
And I'd be remiss not to ask "why?" because your stack will be limited to just working in that one location.
But I'm sure you're aware of that and you're going to surprise us with some totally gnarly application.

Posted: **Tue May 11, 2021 10:35 am**

mwieder wrote: ↑
Mon May 10, 2021 11:21 pm
m
Ah. I see. You're working with images on disk and not already imported into the stack.

Yah, kinda, they start out on the web, and for now come down to the folder the application is in, then get imageSourced directly from there.

And I'd be remiss not to ask "why?" because your stack will be limited to just working in that one location.

Not really, wherever the application is put, the pictures will follow.

But I'm sure you're aware of that and you're going to surprise us with some totally gnarly application.

LOL ! More like disappoint you with an application a 3 year old could write hahha. Here is the low down on why I am looking at this, and how it got to here.

(For the easily bored, I suggest moving on to the next thread you were going to look at

)

Andy P. resurrected something called "1001 things to do with Lc". Reading it, I came across a post by Jacque talking about how she had made a weather widget before there were such things. Linux has many fine weather widgets, but for whatever reason, many of them have problems. They either -
are based on weather sites in countries other than the U.S. (where I am) or...

like my favorite one, work for a time then don't work or...

act weirdly (crashing the panel for instance)...

something else, like look too garish for my tastes, etc.

Jacque's post on 1001 things just prompted me to attempt making one of my own, that is all.

Someone else (James) posted about Free APIs, which are certainly the easier way to go about this, but I had some problems with that approach as well, the main one being that I didn't want to have to sign up for anything (like a key), and I know that api formats can be changed (out of my control).

Besides that, I often want to scrape a webpage and I figured building this from scratch would let me find ways to do just that. Unfortunately, while I can scrape the page just fine, the methods I'm using are far less universal at this point that you would need for a general scraper. They are, however, good enough to have produced these results for my home made weather thingie -

About the directions I've taken in doing this app -
I initially loaded the images directly from the website into an image object that had a matching field paired in size that I could set the scroll to independantly, and grouped the 7 pairs, set the background of the group to white, and that worked the best so far for display.

Any forecast larger than the picture popped up a scroller, if it was the same height (or less) it didn't. It also looked like a one page unified document. However, it was rare that I saw too many forecasts that exceeded the size of the picture, which started me looking at imageSource and the htmlText version <img src> tags.

After muddling around with those tags, and seeing how some tags could include subsections controlling size etc, I began to wonder whether other tags could be similarly expanded, not as actual html, but something like Lc's version of html.

I think I will likely roll it back to the individual image object + paired field in a group set though, as that seems to work best for alignment.

As for the images themselves, and whether things can be moved around, I could take them directly from NOAA's addresses, but that seemed to take longer to do than just downloading them locally to the app's folder and then displaying them. Not horrifically longer mind you, but enough longer to be an irritation.

I also decided to make my coding easier to save them as the final name instead of something incomprehensible like "sct.png".

I'll keep the downloading / renaming part of it, simply because it gives me an easy way to match the picture to the text it sits beside.

If your still awake, that is the whole story, pretty low level code (much of which is brute force stuff), put an entire webpage into a variable, use lineOffset to reduce the amount of code to wade through, replace unusable tags with Lc tags for formatting, then display it as the Lc version of html in a 2nd field.

The simple html utility above like I said was just so I didn't have to keep popping the dictionary up to look at certain things, and to find out what those things looked like by copying / modifying the source code in the top box.

LiveCode Forums.

ImageSource vs. <img src="your image"> ?

ImageSource vs. <img src="your image"> ?

Re: ImageSource vs. <img src="your image"> ?

Re: ImageSource vs. <img src="your image"> ?

Re: ImageSource vs. <img src="your image"> ?

Re: ImageSource vs. <img src="your image"> ?

Re: ImageSource vs. <img src="your image"> ?

Re: ImageSource vs. <img src="your image"> ?

Re: ImageSource vs. <img src="your image"> ?

Re: ImageSource vs. <img src="your image"> ?

Re: ImageSource vs. <img src="your image"> ?

Re: ImageSource vs. <img src="your image"> ?

Re: ImageSource vs. <img src="your image"> ?

Re: ImageSource vs. <img src="your image"> ?

Re: ImageSource vs. <img src="your image"> ?

Re: ImageSource vs. <img src="your image"> ?