PIXILAB Wiki

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revisionPrevious revision
Next revision		Previous revision
blocks:app-note:world_clock [2020-10-16 15:18] – mattiasblocks:app-note:world_clock [2022-06-22 19:06] (current) – removed atom references admin
Line 1: Line 1:
 +====== World Clock ======
  
-This application note describes the use of a web block to show a locally stored webpage showing a corporate reception style world clock. +This application note shows how to use a Web Block to show a reception-style world clock. The web page shown uses the local player's time, interpreted using multiple time zones. This applies Daylight Savings Time and GMT offset as appropriate. 
-The application uses a client-side script to fetch the local computer time. The value is parsed out using a time zone setting and applies Daylight Savings Time and GMT offset according to the time zone setting in the configuration. + 
-:!: It is important to have a correct computer time.+:!: This assumes your player's clock is set properly. 
  
 ===== Installation ===== ===== Installation =====
  
-First follow this [[blocks:app-note:start|general setup]]. Use this {{:blocks:app-note:cou{{ :blocks:app-note:world_clock:worldclock-root.zip|PIXILAB-Blocks-root}}, which contains all you need for this application note.  +First follow this [[blocks:app-note:start|general setup]]. Use this {{ :blocks:app-note:world_clock:worldclock-root.zip |PIXILAB-Blocks-root}}, which contains all you need for this application note. Once that is done, follow these steps:
-Once that is done, follow these steps:+
  
  
Line 15: Line 15:
   - Open a second browser window and type in the URL: http://localhost:8080/spot/. If this fails, you may be using a different port on your system. Check the URL bar of the editor window opened before to find the correct port number.   - Open a second browser window and type in the URL: http://localhost:8080/spot/. If this fails, you may be using a different port on your system. Check the URL bar of the editor window opened before to find the correct port number.
   - Locate the main display in the editor, double-click it and reassign it to the ID shown in the test spot window opened in the previous step.   - Locate the main display in the editor, double-click it and reassign it to the ID shown in the test spot window opened in the previous step.
-. 
  
 You should now see the world clock on the display spot.  You should now see the world clock on the display spot. 
Line 29: Line 28:
 ===== Configure locations ===== ===== Configure locations =====
  
-Open the root folder in Atom (or your favourite editor) and open the /public/html/WorldClock/config.json file.+Open the root folder a [[blocks:drivers:tools|code editor]] and open the /public/html/WorldClock/config.json file.
  
 {{:blocks:app-note:world_clock:configtimezones.png?nolink&800|}} {{:blocks:app-note:world_clock:configtimezones.png?nolink&800|}}
Line 40: Line 39:
  
 The default styling is found inline in the index.html file. This can be edited as required or a separate stylesheet can be linked from the index.html file to suit your project.  The default styling is found inline in the index.html file. This can be edited as required or a separate stylesheet can be linked from the index.html file to suit your project. 
-