Custom Widget: Enturno widget

Apps & Services HABPanel
1

Hi!

I have created widget to display bus (or other transportation departures) for Enturno binding

00
Screenshot 2019-11-16 at 11.08.00.png2514×1538 124 KB

Widget:

Installation

  • Install and configure Enturno binding (add-on) in openHAB
  • openHAB thing and items configuration example is in “example” folder
  • Import the downloaded widget to your HABPanel.
  • Download enturno.js and place it in /etc/openhab2/html/enturno-widget/
  • In the settings of the widget:
    • Set color for real-time departures

There is still work remaining so please feel free to contribute in both binding and widget (more in CONTRIBUTE/TODO files respectively)

2

Hi Michal and thank you for this! :smiley:

Is there any way for format the times in HABopen to show only hh:mm and not hh:mm:ss as shown today? I assume this is part of your code and not a global setting somwhere?

Thnx :slight_smile:

-Roger-

3

Hi Roger,

You can download widget and go into widget settings and edit the code in line 31 and 48 by removing :ss from display:

			<h2 ng-style="{{directionTwoDepartures[i].isLive}} ? {'color': config.realtime_color} : {'color': ''}">{{directionTwoDepartures[i].time | date:'HH:mm**:ss**}</h2>

Screenshot 2020-08-29 at 20.54.57
Screenshot 2020-08-29 at 20.54.575102×1728 434 KB

1 Like
4

Thnx! :smiley:

I am having issues with the times not being showed in a single row on my wall mounted tablet (each time is shown as a column downwards), but its showing correctly on my Mac… I have played around with the code with no luck :confused: If you have any ideas, all tips are appreciated :wink:

5

Hi again :slight_smile:

I think I had same problem some time ago. Please try to change col-md- classes with col-xs-

 <div id="direction01" class="entur-top-padding">
			<div class="row"> 
        <div class="col-xs-1">
        </div>
        <div class="col-xs-11">
          <h2 class="text-left">{{stopPlaceName}}</h2>
          <h2 class="text-left">{{lineCode}} - {{directionOne}}</h2>
        </div>
      </div>
			<div class="row">
        <div class="col-xs-1">
        </div>
        <div class="col-xs-2" data-ng-repeat="i in range">
  				<h2 ng-style="{{directionOneDepartures[i].isLive}} ? {'color': config.realtime_color} : {'color': ''}">{{directionOneDepartures[i].time | date:'HH:mm:ss'}}</h2>
      	</div>
      </div>

Let me know if that helped - then I will update widget in repository.

Thnx :slight_smile:

Michal

1 Like
6

Lol, the one column size I did not try - it worked, I also had to change the coulom to col-xs-3 (if not the text was displayed over each other) and qty of shown times to 3 instead of 5 because of size restrictions on my tablet - but now it is just as.i would like it!

Thnx for the prompt assistance! :smiley: