Hi,
within our working Team we got a new Brightsign Box (XD234). Now I have to integrate four time zones into the presentation.
I found out, that I have to do this with HTML5. I also never worked with this.
Could someone help?
Date
Votes
38 comments
-
JRB Technical Can you elaborate a little more?
Do you just need 4 clocks, 1 for each time zone?
Please describe what you visually need to see on the display.
-
Anja .... Hi JRB Technical,
yes exactly. I have a Display, which Looks like this. Number 8 and 9 are currently pictures and should stay like this. Within the squares 3-6 we would like to have the time of (3: Hamburg), (4:Shenzhen), (5: Tulsa), (6: Montreal). It would be great if we would have the letter codes for those cities somewhere included in the clock (behind, under or whatever) This is HAM for Hamburg, SZX for Shenzhen, TUL for Tulsa und YUL for Montreal.
Thanks for your help -
JRB Technical OK, so I had to see if it could be done first.
This is what I have:
I didn't know zone sizes, so I made a guess at 250x720.
What you would need to do is delete Zones 3-6 and create a new single Images zone in the size of all 4 combined.
Then you can add a HTML5 event to that zone, and add a HTML Site with the following URL (for testing):
http://ds-feed.info/html5/testing-only/4-zone-clock-test.html
Make sure you check the box for 'Enable external data' for the HTML Event as well.
I can change background color, font color, etc, and match to what your zone size actually is when I know the actual pixel size it ends up.
I just wanted to make sure this would work on a BrightSign as a starting point first, and it is working.
John
-
Anja .... Hi John,
that is how I try to enter your HTML side. Unfortunatelly it still doesn´t show up on my Screen when I publish it.
It only shows an empty black side.
Anja
-
Anja .... And when I save the HTML5 Scrips localy, only the Name of the cities appears on the Screen
-
JRB Technical Anja,
My apologies, I didn't ask if the player was connected to the Internet or not. This does not need the internet connection to work as written.
It will work also as Local Content (when you add HTML site) but I am assuming it didn't work because you were missing the 2 moment-js files that are also needed.
You can download all 3 files here:
https://app.box.com/s/v07pgf3k2weo6ddn2gyc367srawysesq
Put them all in the same folder, and then do a Add HTML Site, and select the HTML file. The 2 .js files will not show up when you add the html file, but they should be added and transferred to the player automatically when you publish, as long as they are all in the same folder when you add.
Hopefully that will solve the issue. Please let me know if not, but that way worked for me here as well just now.
John
-
Anja .... Hi John,
Thank you so much. It works perfectly. I could change the colour and the size by myself.
Hope you are having a great day :)
-
JRB Technical Glad to hear! Thanks Anja!
-
Jake Cairns Hello, i think i am trying to do something similar to this except i am displaying two time zones. first one is the default timezone of the player which i did and the second one is the standard UTC time? i would also like to display the time zone in 24 hour format?
could you advise me please?
thanks jake
-
JRB Technical Jake:
For 24 hour time, in the HTML code referenced above, look for:
.format('h:mm a');
and change it to
.format('k:mm');
to display 24 hour time.
'k' is for 1 2 ... 23 24
us 'kk' if you want 01 02 ... 23 24
For the TimeZone, in the HTML code referenced above, look for the time zone setting that looks similar to this:
.tz('America/Chicago')
and to display UTC time, change it to this:
.tz('UTC')
I hope that helps!
John
-
Jake Cairns thanks for the quick response,
i have attempted the above instructions but when i add the HTML file all i seem to get is the names of the timezones showing but not the actual times. do you know where i might be going wrong?
thanks jake
-
Jake Cairns All i get is is following text:"HamburgShenzhenTulsaMontréal"thanks again for your helpjake -
JRB Technical Sounds like you are missing the .js files, you need both .js files in the same folder as the html file.
You can download all 3 files here:
https://app.box.com/s/v07pgf3k2weo6ddn2gyc367srawysesq
-
Jake Cairns good morning,
I managed to get this working thank you very much. just one more thing i wanted to ask is what would i need to change in the HTML Code to display the Cyprus time zone?
thanks Jake
-
JRB Technical Sorry, it's been a busy week.
Instead of America/Chicago or UTC
.tz('America/Chicago')
.tz('UTC')
You would change to Europe/Nicosia for Cyprus (most areas)
or change to Asia/Famagusta for Northern Cyprus
.tz('Europe/Nicosia')
.tz('Asia/Famagusta') -
Matthew Whyatt Hi,
trying to do something similar with the clocks but different location and time zones.
looking at all 4 work clocks in zone 3:
looking for time zones of UK / EAST COAST US / SHANGHAI / MUMBAI
is this something you can advise on it would be much appreciated.
Matt
-
Jake Cairns Good Evening Matt,
To add 4 time zones to your zone you will need to add a HTML5 Event to your zone 3.
Download the files from the link below, i would suggest putting them in the same folder as your bright-sign presentation. These are the same files that JRB Technical is providing in the above comments except these ones have been edited for the time zones you require
unlike the comments above you are going to select local content and navigate to the file called "4-zone-clock-test.html
when you now publish your content you should then get something along the lines of the following displaying.
once you've got this please message back with the size of your zone 3 in pixels. Then i will size the text accordingly and resend you the files without a background.
Thanks Jake
-
Matthew Whyatt Hi Jake,
Thank you for coming back to me on this so quickly.
With regards to the Clock i would be using them in a different orientation, not in a portrait layout but in a landscape so would need them next to one and other not on top.
My Zone Dims: 1090x150
If you can change the layout to Side by Side that would be much appreciated.
Thanks
Matt
-
Jake Cairns 
Heres the best i could do. if you want to align it you will need to amend the CSS. Bright sign support may be ale to help you do this. you are effectively just displaying a webpage on the bright sign player
Thanks Jake
-
Christian Brzys Hi,
Wondering if someone may be able to help me out as well. I have a need for 4 horizontal clocks as above except in 24hr format.
Clocks would be as follows:
Fort Bliss, TX
Washington, DC
Kabul
Seoul
Zone resolution is 1920x324
-
Jake Cairns Good Morning, do you still need help with this? i can send you the files i did previously once i'm home tonight.
jake
-
Jake Cairns Managed to find the files you need Christian and have amended the time zones to be the ones i think you require. Here is the download link.
you may need to play around with the CSS for spacing corrections. also the screenshot below has a coral background in. i have removed this. you can change the text colour in the HTML File.
Thanks Jake
-
Christian Brzys Jake,
Thank you so much for getting back to me so quickly. I will test it out today and let you know if I have any other questions.
Thanks again,
Christian
-
Patrick Dudiak Hello,
I have made a test file to test publishing a file with multiple timezones via the HTML5 files JRB posted a while back. I currently do not have a device to test with, so I am trying to use the preview feature in BrightAuthor. Should I be able to see the timezone information in preview? I only see a white box where the timezones should be, and I'm unsure if this is a Programming issue or a Preview issue.
Thank you
-
JRB Technical Unfortunately the BrightAuthor preview doesn't work for many things. BrightSign developers never seemed to really finish that feature, and now it looks like they are abandoning BrightAuthor development completely.
If works in Chrome, it should work on a BrightSign player with HTML5 capabilities, but the only way to really test is to publish to a player.
-
Brandon The BrightAuthor preview is not an accurate representation of the play's output, especially for HTML.
BrightAuthor and BrightSign Network are still being maintained. However, I would not expect any major feature additions as new development is focused on BrightAuthor:connected and BSN.cloud
_________________________________________________________________________
Friendly reminder, the community forum is intended for user-to-user discussion. It is not regularly monitored. For troubleshooting problems and to ensure a timely answer from a BrightSign representative, please submit a support ticket.
-
Patrick Dudiak Hi All,
I'm in the process of trying to publish a show file with the .js files from earlier in this thread. I had success publishing this on to one XT244 by publishing local to an SD card. I tried this again on another machine, with the same files, and I'm getting a prompt that says the html site 'contains 788 files. Would you like to proceed?'. I did not get this prompt the first time, but after clicking continue on the second device, I can't get the file to publish. Any ideas what may have happened?
-
Lyndon Brightauthor assumes the html file you publish needs all files in the same folder as that file. So, if you dropped your html file in the documents folder, it would try to publish everything in the documents folder. So, your html file needs to be in a subfolder with just it's assets, and nothing else.
-
Patrick Dudiak Thank you. That was the issue. I'm now having issues getting all of the data from the html site to play from the player. Is there someone where specific the .js files need loaded? FYI, I'm using BrightAuthor, not BrightAuthor: Connected.
-
Alex Can someone post the HTML5 code to build a widget that displays a time zone text and the MM:HH under it? I would like to ultimately build two (bottom and top of displa) or 8 zones (one for each time zone), whichever will be easier that look like:
Appreciate any help that can be provided.
Please sign in to leave a comment.