Custom Widget - RSS Ticker

I could share what I have so far if you (or someone else) wanted to take a look. I used one of the widgets I have as a model. The external reference to the JavaScript just doesn’t seem to be working.

In addition to a stock one, I was thinking about a sports one too (maybe news also). I was going to have my main Dashboard show the weather and the tickers as part of a home automation control panel in my kitchen (a tablet or Echo Show is my current idea).

By all means do share it will help me & others understand things your trying a bit more.
I had played with RSS feeds a few years back in one of the programs I created with
visual studio VB. I’ll try to find that code as it may be useful once converted to C#.

Here is the Program and Widget code I have so far.

homegenie_generic_ticker.zip (2.1 KB)

1037-RSS_Ticker.hgx (908 Bytes)

I had a quick look today at this and it appears to be based of the info widget .
I think the script should be in the Java section, however I didn’t get a chance to play around any.
Java script I have little understanding of and HTTP not much more.

Well, I think i have it working - I still need to figure out how. I ended up going back to the original website and using chrome tools inspected the container that the page was using to display the ticker - I then copied that and pasted into my Widget and now it works (and by works I mean displays the info).

Will need to take some time to review it now and figure out what its doing that I was missing the first time - and then adapt it from there. Update program and widget attached,
image

1037-RSS_Ticker.hgx (983 Bytes)

homegenie_generic_ticker.zip (2.6 KB)

Well done.

Sometimes when you step back and reevaluate the problem the solution becomes clearer. The manic approach never pays off in the long run. You managed to resolve the problem yourself in the end.

For what it’s worth. it appears the iframe tag is what got it working. I’m not an HTML expert by any means so I looked into it - the iframes are used to display a web page within a web page.
https://www.w3schools.com/html/html_iframe.asp

I’m going to work on this some more, trying to allow the user to define the Stock Symbols to display etc.

Nice work! The user define stock options would make things simpler for some.
I still haven’t remembered what I wanted to do with something like this. :roll_eyes: :blush: But do remember I wanted it to scroll sideways like this https://www.tradingview.com/widget/ticker-tape/ :thinking: Maybe it will come to me before I forget what HG is for :rofl:

I got the ticker to scroll the way I wanted! :thinking: Maybe I just wanted the breaking news but most likely it was status of my off grid solar production, man it sucks getting old.

Nice. Was going to do a scrolling one next. Want a sports version and a news one too. Wonder if I can get my solar panel production - there is an app but not sure if they have some kind of API call.

My solar setup has a web info page that gets updated with my info. So Ill need to parse the info I want displayed then put it into the ticker tape. My solar setup is mostly magnum stuff thougth I do have a morning star charge controler which has a serial port to get info also have a outback controler but I don’t have a way to pull info from it yet. There is very little to change to what you have for a scrolling ticker for the stock info!
ticker-tape

I had a bit of time to play last night with this and although I don’t follow the stock market I thought I’d see how much I could strip this down and customize it to match my other widgets look wise.
You can remove all code starting with the line that starts off with <div class=“tradingview-widget-copyright” to the line " TradingView Widget END -->" with out affecting the performance.
that should help when you start to add optionsticker-tape

I happened to notice this morning when I was playing with this that the URL inside the iframe definition is what is controlling the stock symbols and description that appear.

So I have been trying to figure out how to have a JavaScript defined variable for the iframe src and then define that using some widget params.

But not having much luck with that.

If I have a chance I’ll look at that. I suspect you’d have to list the stocks available and just have users select them.
I also started to play with having the ticker tape go from one side of HG to the other side using the groups bar and it is possible.

Here is the latest widget I have.

At the end of the HTML code, I have this code:

The iframe in the body of the widget has src=“blank.hlml”

This is updating the src with that link (I used some text here for illustration purposes as the actual link is very long).

In the JavaScript code for the Widget, I have vars defined with the ConfigureOptions from the Program - 5 sets of them, one each for a symbol and a description so a total of 5 stocks.

I am trying to build the url to pass to the aforementioned script code in the HTML portion of the widget with a variable called source.- using an encore url function.

Trying to get the variable to work, at this point I just have the hardcoded url example from the site assigned to variable source.

However, I cannot seem to reference that variable in the HTML portion. I have tried the following but each gives me an error when I try and run the widget code:

  1. document.getElementById(“stocks”).src=source;
  2. document.getElementById(“stocks”).src=data-ui-field=“source”
  3. document.getElementById(“stocks”).src=widget.find(’[data-ui-field=source]’).Value

Assuming I can reference the variable on the HTML page, then its just a matter of building the url and passing it along (also want to base the width of the widget on the number of symbols defined).

Any assistance would be appreciated. Thanks

1037-Stock_Ticker.hgx (1.7 KB)
homegenie_generic_ticker (1).zip (2.6 KB)

I believe your options should be handled by the program not the widget.
Build a string in the program then pass that to the java script part of the widget
Look at the homegenie/generic/status widget to see how info is passed from the JavaScript to html
in order to pass the info from the java script to the html part you need to define in the html section a ui field
<div data-ui-field="stockstatus"></div>

Then in your java script side add the line after you’ve defined your source
widget.find('[data-ui-field=stockstatus]').html(source);
that should give you a starting point

Ok, that makes sense - not sure why but I was making it more complicated than it needed to be.

That’s the good news.

Bad news - doesn’t look like it takes an actual URL but needs it to be structured more like the embedded code they give you - each stock looks like a separate div in the end. I need to play with it some more - but making some progress.

I found a different source to use for the actual ticker widget - it allows customization of the contents etc and then its more a straightforward plug and play into the widget I created.

This is a working version, still could use some tweaking which I will work on next.

image

1037-Stock_Ticker.hgx (1.5 KB)
homegenie_generic_ticker.zip (1.7 KB)

1 Like

I found a free code generator for RSS feeds it will allow up to 5 RSS feeds. You may wish to look at it for your RSS feed ideas https://surfing-waves.com/feed.htm
Maybe allow combining all your needs into one widget.

I finally got around to finishing the sports score one - will post that in a separate thread. When I get a chance I will try the RSS feed one.