Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Opening Webcam Links/Stat Tile links in a Modal #220

Closed
Daveiano opened this issue Nov 4, 2023 · 17 comments · Fixed by #227
Closed

Opening Webcam Links/Stat Tile links in a Modal #220

Daveiano opened this issue Nov 4, 2023 · 17 comments · Fixed by #227
Labels
documentation Improvements or additions to documentation enhancement New feature or request
Milestone

Comments

@Daveiano
Copy link
Owner

Daveiano commented Nov 4, 2023

The clickable tiles work verry well! Thank you for that.
But I have yet another small feature request. Would it be possible to open the destination sites or HTML pages in the main I-frame of the skin in stead of in a full browser window?
weewx-wdc

I mean the yellow part of the site in attached screenshot.

Again, thank you for your effort and the quick responses.
Regards,
Ed.

Originally posted by @dystechnic in #211 (comment)

@Daveiano Daveiano added the enhancement New feature or request label Nov 4, 2023
@Daveiano
Copy link
Owner Author

Daveiano commented Nov 4, 2023

I created a new issue for that, because the discussion in #211 should be solved.

So this sounds like kind of a "Kiosk page"?

To be clear: You want only the Gauges and Stat tiles to be shown on the page. Without Navigation and Header Bar, right? Should this only be for the main Index page, or all pages?

@Daveiano Daveiano added the documentation Improvements or additions to documentation label Nov 4, 2023
@dystechnic
Copy link

HI,

No,what I meant was that if you click on a tile the referred page opens in the same area as the gauges and tiles. In that frame.With the Header and navbar still visible. This would be usefull for the tile referrals as well for the webcam / skycam links.
That way you don't have to use the browser's back button to get back to the index page. The screen we use is already in kiosk mode, so without useable browser buttons.

Regards,
Ed.

@Daveiano
Copy link
Owner Author

Daveiano commented Nov 5, 2023

Ah ok, I got you!

as well for the webcam / skycam links

You mean the links from the sidebar?

@dystechnic
Copy link

Yes, the links from the sidebar. But now I think of it, if the linked webcam sites of the images in the externals tile would open in that same frame would be als nice ;-)

@Daveiano
Copy link
Owner Author

Daveiano commented Nov 6, 2023

Ok, I understand. Another user already had a similar idea, but with a Modal.

So the referenced stat tiles pages and/or webcam images are opening in a modal on top of the page. I personally think that's a better solution than replacing the content on the top of the page. What do you think about that approach?

@dystechnic
Copy link

I had to see what a modal was but that seems as a perfect solution.

@Daveiano
Copy link
Owner Author

Daveiano commented Nov 8, 2023

Yeah something like an overlay which sits on top of the page and can be closed easily via a close button/icon, should also work well on a touch screen.

I will include this in the next feature release, but I don't know if I will be able to get this out within this year, could be probably finished in the early 2024.

@Daveiano Daveiano added this to the 3.5.0 milestone Nov 8, 2023
@Daveiano Daveiano changed the title Kiosk Mode Opening Webcam Links/Stat Tile links in a Modal Nov 8, 2023
@Daveiano Daveiano linked a pull request Nov 19, 2023 that will close this issue
2 tasks
@Daveiano
Copy link
Owner Author

Hi, I managed to get some time to implement this!

I released a pre-release, v3.5.0-alpha1, for you to test this out. Please follow the normal update instructions.

You can now set [Extras]open_radar_and_externals_modal and you can use the new option open for the stat tile links:

[[stat_tile_links]]
    [[[ET]]]
        link = "https://en.wikipedia.org/wiki/Evapotranspiration"
        open = modal  # modal, new_tab or same_tab

@Daveiano Daveiano reopened this Nov 22, 2023
@dystechnic
Copy link

Great, thank you.
I'm a bit busy at the moment but I will try it as soon as possible. I'll let you know the result.

@dystechnic
Copy link

Hi, I tried the alpha version today but the skin will not load.
I followed the update instructions and removed the old version, installed the alpha version and changed the skin.conf to suit my installation.
But The skin will not load. I'm stuck with the default Seasons skin.
wee_reports runs without error and the weewx.service is also running without issue.

@Daveiano
Copy link
Owner Author

Daveiano commented Dec 4, 2023

Could you provide the relevant section (or the whole file) of your weewx.conf?

Also the logs of a full report run would be useful.

@dystechnic
Copy link

Attached the complete weewx.conf and the log ofa full wee_report run.
syslog.txt
weewx.conf.txt

@Daveiano
Copy link
Owner Author

Daveiano commented Dec 4, 2023

The sylog tells that you are missing the open property:

Dec  4 18:44:01 weewx wee_reports[29681] ERROR weewx.cheetahgenerator: Evaluation of template /home/weewx/skins/weewx-wdc/year.html.tmpl failed with exception '<class 'KeyError'>'
Dec  4 18:44:01 weewx wee_reports[29681] ERROR weewx.cheetahgenerator: **** Ignoring template /home/weewx/skins/weewx-wdc/year.html.tmpl
Dec  4 18:44:01 weewx wee_reports[29681] ERROR weewx.cheetahgenerator: **** Reason: 'open'

You should provide the open property to every linked stat tile like:

[[stat_tile_links]]
    [[[ET]]]
        link = "https://en.wikipedia.org/wiki/Evapotranspiration"
        open = modal  # modal, new_tab or same_tab

@dystechnic
Copy link

dystechnic commented Dec 6, 2023

Thank you! It works now.
Stupid me. I assumed there was a default so I did not change that after the upgrade.

It is not exactly what I meant. If I click on a link, the whole page, inclusive header and sidebar opens in a modal. In that modal you can go back to the homepage and again click on a link.That link opens in a modal. But now only the referred page opens. Without header and sidebar. I would expect this for the first modal.
In the attached imagethe red square is the first link to a modal page and the green the second(nested) link.
modal

@Daveiano
Copy link
Owner Author

Daveiano commented Dec 8, 2023

While I understand what you want to do, I think this is out of scope for something the skin could do by itself. There is no reliable way to manipulate a website in frame in that way.

What you should do is hide the header and sidebar from your "explanation pages". I assume you created custom template files for your pages. Something like wolkenbasis.html.tmpl?

To do this you can simply paste this snippet into your templates (best suited inside the <head> tags):

<style>
  bx-header {display: none;}
  bx-side-nav {display: none;}
  main.bx--content {margin-top: 0; margin-left: 0 !important;}
  #footer {display: none;} /*This will also hide the footer*/
</style>

I hope this solves this? Sorry, I did not get this right until now.

@dystechnic
Copy link

Sorry for the late reaction but this addition to the templates doe the trick.
Thank you!

I have one other puzzle.Ho can I get the skin to be dark at all times? The default is light until you push the button. I would like to be it default dark so it is dark the first time you open it.
Should I make an other discussion or issue for this?

@Daveiano
Copy link
Owner Author

Sorry for the late reaction but this addition to the templates doe the trick.

Glad to hear that! Then this will be included in the next release!

I have one other puzzle.Ho can I get the skin to be dark at all times? The default is light until you push the button. I would like to be it default dark so it is dark the first time you open it.
Should I make an other discussion or issue for this?

Just to be clear: If you switch to dark mode - it should stay in dark mode until you change it again, also if you close and reopen the page (on the same device). Thats also the case for you, right?

I guess you want to change the default to dark and also hide the dark/light toggle? Yes, would be great if you could open another issue for that, just describe your needs in that ticket! Thank you very much for all the feedback!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
documentation Improvements or additions to documentation enhancement New feature or request
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants