Spice up 🔥 your sitemap with unicode symbols 💪🐱

Tutorials & Examples
1

Make data displayed on your sitemap more visual by adding unicode symbols to it. They can be used in all visible strings, be it in labels, rules, transformations,…
The only limitation is, that your UI font needs to support the symbol. With BasicUI and the Android or iPhone font that’s mostly the case but you’ll need to give it a try.


http://charmap.de (german)
https://en.wikibooks.org/wiki/Unicode/List_of_useful_symbols
http://unicode.scarfboy.com
http://emojipedia.org

Example

In a transformation .map file:

ON=Active ✔      
OFF=Off ✘
NULL=unknown ⁉

In rules:

val status = if (KodiPlayerState.state == "Play") "⏯" else if (KodiPlayerState.state == "Pause") "⏸" else "⏹"

further Examples:

  • “Speedtest ᐁ 22.0 Mbit/s ᐃ 4.2 Mbit/s (69 ms)”
  • “ARIES=♈ Widder” / “TAURUS=♉ Stier” / “GEMINI=♊ Zwilling”
  • “NEW=🌑 Neumond” / “WAXING_CRESCENT=🌑→🌓 zunehmender Halbmond” / “FIRST_QUARTER=🌓 erstes Viertel” (sadly, the moon symbols are not supported by BasicUI)

And so on. Feel free to post symbols you found working and useful!

8 Likes
2

astro-german.map - Check out the full Astro setup

ARIES=♈ Widder
TAURUS=♉ Stier
GEMINI=♊ Zwilling
CANCER=♋ Krebs
LEO=♌ Löwe
VIRGO=♍ Jungfrau
LIBRA=♎ Waage
SCORPIO=♏ Skorpion
SAGITTARIUS=♐ Schütze
CAPRICORN=♑ Steinbock
AQUARIUS=♒ Wassermann
PISCES=♓ Fisch
//
SPRING=Frühling
SUMMER=Sommer
AUTUMN=Herbst
WINTER=Winter
//
NEW=🌑 Neumond
WAXING_CRESCENT=🌑→🌓 zunehmender Halbmond
FIRST_QUARTER=🌓 erstes Viertel
WAXING_GIBBOUS=🌓→🌕 zunehmender Mond
FULL=🌕 Vollmond
WANING_GIBBOUS=🌕→🌗 abnehmender Mond
THIRD_QUARTER=🌗 letztes Viertel
WANING_CRESCENT=🌗→🌑 abnehmender Halbmond
//
NULL=unbekannt ⁉
3 Likes
3

device-operation.map

0=Aus ✘
1=Standby …
2=Aktiv ↻
3=Fertig ‼
NULL=unbekannt ⁉
2 Likes
4

Scenes
item:

Number Scenes_OG_zimmer "☞" <stern>  (OG_zimmer)

Sitemap:

Switch item=Scenes_OG_zimmer          mappings=[1="♫ 🍷", 2="🕯🕯", 3="📺 🎮", 4="π-π"]
1 Like
5

Yahoo weather german translation viz dze pictures:

AM\u0020Clouds/PM\u0020Sun=vormittags :cloud: bewölkt/nachmittags ☼ sonnig
AM\u0020Drizzle=vormittags🌧 Nieselregen
AM\u0020Drizzle/Wind=vorm. :cloud_with_rain: Nieselregen/:wind_face: Wind
AM\u0020Fog/PM\u0020Clouds=vormittags :foggy: Nebel/nachmittags :cloud:bewölkt
AM\u0020Fog/PM\u0020Sun=vormittags :foggy: Nebel, nachmittags ☼ sonnig
AM\u0020Ice=vorm.:snowflake:️ Eis
AM\u0020Light\u0020Rain=vormittags leichter :cloud_with_rain: Regen
AM\u0020Light\u0020Rain/Wind=vorm. leichter :cloud_with_rain: Regen/:wind_face: Wind
AM\u0020Light\u0020Snow=vormittags leichter :snowflake:️ Schneefall
AM\u0020Rain=vormittags :cloud_with_rain: Regen
AM\u0020Rain/Snow\u0020Showers=vorm.:cloud_with_rain: Regen-/:snowflake:️ Schneeschauer
AM\u0020Rain/Snow=vormittags :cloud_with_rain: Regen/:snowflake:️ Schnee
AM\u0020Rain/Snow/Wind=vorm. :cloud_with_rain: Regen/:snowflake:️ Schnee/:wind_face: Wind
AM\u0020Rain/Wind=vorm. :cloud_with_rain: Regen/:wind_face: Wind
AM\u0020Showers=vormittags :cloud_with_rain: Schauer
AM\u0020Showers/Wind=vormittags :cloud_with_rain: Schauer/:wind_face: Wind
AM\u0020Snow\u0020Showers=vormittags :snowflake:️ Schneeschauer
AM\u0020Snow=vormittags :snowflake:️ Schnee
AM\u0020Thundershowers=vorm. Gewitterschauer
Blowing\u0020Snow=❄️ Schneetreiben
Clear=☼ Klar
Clear/Windy=☼ Klar/:wind_face: Windig
Clouds\u0020Early/Clearing\u0020Late=früh :cloud:️ Wolken/später ☼ klar
Cloudy=☁ Bewölkt
Cloudy/Wind=:cloud:️ Bewölkt/:wind_face: Wind
Cloudy/Windy=:sun_behind_large_cloud: Wolkig/:wind_face: Windig
Drifting\u0020Snow=❄️ Schneetreiben
Drifting\u0020Snow/Windy=:snowflake:️ Schneetreiben/:wind_face: Windig
Drizzle\u0020Early=früh :cloud_with_rain: Nieselregen
Drizzle\u0020Late=später :cloud_with_rain: Nieselregen
Drizzle=🌧 Nieselregen
Drizzle/Fog=:cloud_with_rain: Nieselregen/:foggy: Nebel
Drizzle/Wind=:cloud_with_rain: Nieselregen/:wind_face: Wind
Drizzle/Windy=:cloud_with_rain: Nieselregen/:wind_face: Windig
Fair=Heiter
Fair/Windy=Heiter/:wind_face: Windig
Few\u0020Showers=vereinzelte :umbrella: Schauer
Few\u0020Showers/Wind=vereinzelte :umbrella: Schauer/:wind_face: Wind
Few\u0020Snow\u0020Showers=vereinzelt :snowflake:️ Schneeschauer
Fog\u0020Early/Clouds\u0020Late=früh :foggy: Nebel, später :cloud: Wolken
Fog\u0020Late=später :foggy: neblig
Fog=🌁 Nebel
Fog/Windy=:foggy: Nebel/:wind_face: Windig
Foggy=🌁 Neblig
Freezing\u0020Drizzle=gefrierender :umbrella: Nieselregen
Freezing\u0020Drizzle/Windy=gefrierender :umbrella: Nieselregen/:wind_face: Windig
Freezing\u0020Rain=gefrierender Regen
Haze=Dunst
Heavy\u0020Drizzle=starker :umbrella::umbrella: Nieselregen
Heavy\u0020Rain\u0020Shower=Starker :cloud_with_rain: Regenschauer
Heavy\u0020Rain=Starker :cloud_with_rain: Regen
Heavy\u0020Rain/Wind=starker :cloud_with_rain: Regen/:wind_face: Wind
Heavy\u0020Rain/Windy=Starker :cloud_with_rain: Regen/:wind_face: Windig
Heavy\u0020Snow\u0020Shower=Starker :snowflake:️ Schneeschauer
Heavy\u0020Snow=Starker :snowflake:️:snowflake:️ Schneefall
Heavy\u0020Snow/Wind=Starker :snowflake:️:snowflake:️ Schneefall/:wind_face: Wind
Heavy\u0020Thunderstorm=Schweres :cloud_with_lightning: Gewitter
Heavy\u0020Thunderstorm/Windy=Schweres :cloud_with_lightning: Gewitter/:wind_face: Windig
Ice\u0020Crystals=Eiskristalle
Ice\u0020Late=später Eis
Isolated\u0020T-storms=Vereinzelte :cloud_with_lightning: Gewitter
Isolated\u0020Thunderstorms=Vereinzelte :cloud_with_lightning: Gewitter
Light\u0020Drizzle=Leichter :cloud_with_rain: Nieselregen
Light\u0020Freezing\u0020Drizzle=Leichter gefrierender :cloud_with_rain: Nieselregen
Light\u0020Freezing\u0020Rain=Leichter gefrierender :cloud_with_rain: Regen
Light\u0020Freezing\u0020Rain/Fog=Leichter gefrierender :cloud_with_rain: Regen/:foggy: Nebel
Light\u0020Rain\u0020Early=anfangs leichter :cloud_with_rain: Regen
Light\u0020Rain=Leichter :cloud_with_rain: Regen
Light\u0020Rain\u0020Late=später leichter :cloud_with_rain: Regen
Light\u0020Rain\u0020Shower=Leichter :cloud_with_rain: Regenschauer
Light\u0020Rain\u0020Shower/Fog=Leichter :cloud_with_rain: Regenschauer/:foggy: Nebel
Light\u0020Rain\u0020Shower/Windy=Leichter :cloud_with_rain: Regenschauer/:wind_face: windig
Light\u0020Rain\u0020with\u0020Thunder=Leichter :cloud_with_rain: Regen mit :cloud_with_lightning: Gewitter
Light\u0020Rain/Fog=Leichter :cloud_with_rain: Regen/:foggy: Nebel
Light\u0020Rain/Freezing\u0020Rain=Leichter :cloud_with_rain:Regen/Gefrierender Regen
Light\u0020Rain/Wind\u0020Early=früh leichter :cloud_with_rain: Regen/:wind_face: Wind
Light\u0020Rain/Wind\u0020Late=später leichter :cloud_with_rain: Regen/:wind_face: Wind
Light\u0020Rain/Wind=leichter :cloud_with_rain: Regen/:wind_face: Wind
Light\u0020Rain/Windy=Leichter :cloud_with_rain: Regen/:wind_face: Windig
Light\u0020Sleet=Leichter :snowflake:️ Schneeregen
Light\u0020Snow\u0020Early=früher leichter :snowflake:️ Schneefall
Light\u0020Snow\u0020Grains=Leichter :snowflake:️ Schneegriesel
Light\u0020Snow\u0020Late=später leichter :snowflake:️ Schneefall
Light\u0020Snow\u0020Shower=Leichter :snowflake:️ Schneeschauer
Light\u0020Snow\u0020Shower/Fog=Leichter :snowflake:️ Schneeschauer/:foggy: Nebel
Light\u0020Snow\u0020with\u0020Thunder=Leichter :snowflake:️ Schneefall mit :cloud_with_lightning: Gewitter
Light\u0020Snow=Leichter :snowflake:️ Schneefall
Light\u0020Snow/Fog=Leichter :snowflake:️ Schneefall/:foggy: Nebel
Light\u0020Snow/Freezing\u0020Rain=Leichter :snowflake:️ Schneefall/Gefrierender :cloud_with_rain: Regen
Light\u0020Snow/Wind=Leichter :snowflake:️ Schneefall/:wind_face: Wind
Light\u0020Snow/Windy=Leichter :snowflake:️ Schneeschauer/:wind_face: Windig
Light\u0020Snow/Windy/Fog=Leichter :snowflake:️ Schneefall/:wind_face: Windig/:foggy: Nebel
Mist=🌁 Nebel
Breezy=🌬 Windig
Mostly\u0020Clear=Überwiegend ☼ Klar
Mostly\u0020Cloudy=Überwiegend :partly_sunny: bewölkt
Mostly\u0020Cloudy/Wind=meist :partly_sunny: bewölkt/:wind_face: Wind
Mostly\u0020Sunny=Überwiegend ☼ Sonnig
Partial\u0020Fog=Teilweise :foggy: Nebel
Partly\u0020Cloudy=Teilweise :partly_sunny: bewölkt
Partly\u0020Cloudy/Wind=Teilweise :partly_sunny: bewölkt/:wind_face: Wind
Patches\u0020of\u0020Fog=🌁 Nebelfelder
Patches\u0020of\u0020Fog/Windy=:foggy: Nebelfelder/:wind_face: Windig
PM\u0020Drizzle=nachm. :cloud_with_rain: Nieselregen
PM\u0020Fog=nachmittags :foggy: Nebel
PM\u0020Light\u0020Snow=nachmittags leichter :snowflake:️ Schneefall
PM\u0020Light\u0020Rain=nachmittags leichter :cloud_with_rain: Regen
PM\u0020Light\u0020Rain/Wind=nachm. leichter :cloud_with_rain: Regen/:wind_face: Wind
PM\u0020Light\u0020Snow/Wind=nachm. leichter Schneefall/:wind_face: Wind
PM\u0020Rain=nachmittags :cloud_with_rain: Regen
PM\u0020Rain/Snow\u0020Showers=nachmittags :cloud_with_rain: Regen/:snowflake:️ Schneeschauer
PM\u0020Rain/Snow=nachmittags :cloud_with_rain: Regen/:snowflake:️ Schnee
PM\u0020Rain/Wind=nachm. :cloud_with_rain: Regen/:wind_face: Wind
PM\u0020Showers=nachmittags :umbrella: Schauer
PM\u0020Showers/Wind=nachmittags :umbrella: Schauer/:wind_face: Wind
PM\u0020Snow\u0020Showers=nachmittags :snowflake:️ Schneeschauer
PM\u0020Snow\u0020Showers/Wind=nachm. :snowflake:️ Schneeschauer/:wind_face: Wind
PM\u0020Snow=nachm. :snowflake:️ Schnee
PM\u0020T-storms=nachmittags :cloud_with_lightning: Gewitter
PM\u0020Thundershowers=nachmittags :cloud_with_lightning: Gewitterschauer
PM\u0020Thunderstorms=nachm. :cloud_with_lightning: Gewitter
Rain\u0020and\u0020Snow=❄️🌧 Schneeregen
Rain\u0020and\u0020Snow/Windy=:cloud_with_rain: Regen und :snowflake:️ Schnee/:wind_face: Windig
Rain/Snow\u0020Showers/Wind=:cloud_with_rain: Regen/:snowflake:️ Schneeschauer/:wind_face: Wind
Rain\u0020Early=früh :cloud_with_rain: Regen
Rain\u0020Late=später :cloud_with_rain: Regen
Rain\u0020Shower=🌧 Regenschauer
Rain\u0020Shower/Windy=:cloud_with_rain: Regenschauer/:wind_face: Windig
Rain\u0020to\u0020Snow=:cloud_with_rain:Regen, in :snowflake:️ Schnee übergehend
Rain=🌧 Regen
Rain/Snow\u0020Early=früh :cloud_with_rain: Regen/:snowflake:️ Schnee
Rain/Snow\u0020Late=später :cloud_with_rain: Regen/:snowflake:️ Schnee
Rain/Snow\u0020Showers\u0020Early=früh :cloud_with_rain: Regen-/:snowflake:️ Schneeschauer
Rain/Snow\u0020Showers\u0020Late=später :cloud_with_rain: Regen-/:snowflake:️ Schneeschnauer
Rain/Snow\u0020Showers=:cloud_with_rain: Regen/:snowflake:️ Schneeschauer
Rain/Snow=:cloud_with_rain: Regen/:snowflake:️ Schnee​:snowflake:️
Rain/Snow/Wind=:cloud_with_rain: Regen/:snowflake:️ Schnee/:wind_face: Wind
Rain/Thunder=:cloud_with_rain: Regen/:cloud_with_lightning: Gewitter
Rain/Wind\u0020Early=früh :cloud_with_rain: Regen/:wind_face: Wind
Rain/Wind\u0020Late=später :cloud_with_rain: Regen/:wind_face: Wind
Rain/Wind=:cloud_with_rain: Regen/:wind_face: Wind
Rain/Windy=:cloud_with_rain: Regen/:wind_face: Windig
Scattered\u0020Showers=vereinzelte :umbrella: Schauer
Scattered\u0020Showers/Wind=vereinzelte :umbrella: Schauer/:wind_face: Wind
Scattered\u0020Snow\u0020Showers=vereinzelte :snowflake:️ Schneeschauer
Scattered\u0020Snow\u0020Showers/Wind=vereinzelte :snowflake:️ Schneeschauer/:wind_face: Wind
Scattered\u0020T-storms=vereinzelte :cloud_with_lightning_and_rain: Gewitter
Scattered\u0020Thunderstorms=vereinzelte :cloud_with_lightning_and_rain: Gewitter
Shallow\u0020Fog=flacher :foggy: Nebel
Showers=☔ Schauer
Showers\u0020Early=früh :umbrella: Schauer
Showers\u0020Late=später :umbrella: Schauer
Showers\u0020in the Vicinity=🌧 Regenfälle in der Nähe
Showers/Wind=:umbrella: Schauer/:wind_face: Wind
Sleet\u0020and\u0020Freezing\u0020Rain=❄️🌧 Schneeregen und gefrierender Regen
Sleet/Windy=:snowflake:️:cloud_with_rain: Schneeregen/:wind_face: Windig
Sleet=❄️🌧 Schneeregen
Snow\u0020Grains=❄️ Schneegriesel
Snow\u0020Late=später :snowflake:️ Schnee
Snow\u0020Shower=❄️ Schneeschauer
Snow\u0020Showers\u0020Early=früh :snowflake:️ Schneeschauer
Snow\u0020Showers\u0020Late=später :snowflake:️ Schneeschauer
Snow\u0020Showers=❄️ Schneeschauer
Snow\u0020Showers/Wind=:snowflake:️ Schneeschauer/:wind_face: Wind
Snow\u0020to\u0020Rain=❄️🌧 Schneeregen
Snow=❄️ Schneefall
Snow/Wind=:snowflake:️ Schneefall/:wind_face: Wind
Snow/Windy=:snowflake:️ Schnee/:wind_face: Windig
Squalls=🌬 Böen
Sunny=☼ Sonnig
Sunny/Wind=☼ Sonnig/:wind_face: Wind
Sunny/Windy=☼ Sonnig/:wind_face: Windig
T-showers=⛈ Gewitterschauer
Thunder\u0020in\u0020the\u0020Vicinity=⛈ Gewitter in der Umgebung
Thunder=⛈ Gewitter
ThunderShowers\u0020Early=früh :cloud_with_lightning_and_rain: Gewitterschauer
Thundershowers=⛈ Gewitterschauer
Thunderstorm=⛈ Gewitter
Thunderstorm/Windy=:cloud_with_lightning_and_rain: Gewitter/:wind_face: Windig
Thunderstorms\u0020Early=früh :cloud_with_lightning_and_rain: Gewitter
Thunderstorms\u0020Late=später :cloud_with_lightning_and_rain: Gewitter
Thunderstorms=⛈ Gewitter
Unknown\u0020Precipitation=🌧 Niederschlag
Unknown=unbekannt
Wintry\u0020Mix=❄️ Winterlicher Mix

6 Likes
6

@Oli , habe gerade deine Übersetzung gefunden, finde ich super! :blush:

Ich spiele gerade mit api.ai Plattform und yahooWeatherForecast herum.
Habe dazu wie in einem Tutorial beschrieben ein webhook über heroku erstellt.
Die Antworten funktionieren, nur sind die eben alle auf English, deine Übersetzung wäre die Lösung!
Wie binde ich das ganze ein, kannst du mir helfen?

Dankeschön!

maverick

7

Please, english!

1 Like
8

okay buddy

9

Hello!

Could you please tell me how you’ve integrated weather forecast in api.ai? I was using their Weather Domain, but it stopped working (it was working in the chat bot, but it also worked using their Python API call). All other domains (both free and paid) are still working using Python API. Is there an easy way to query Weather info, or I should create Regular Intents?

Best regards,
Davor

10

Hi Davor, no Problem i can help you!

  1. Go to this Site an klick @deploy to heroku, then give a app name an klick an "deploy"
    https://github.com/api-ai/apiai-weather-webhook-sample

  2. “Your app was successfully deployed.” klick on “Manage App”, than scroll down to “
    Domain”, copy the domain Link!

  3. Go to your api.ai Plattform, go to “Fulfillment” an enable the “webhook”. Now insert the heroku Domain Linkinto the URL and klick on save!

  4. Go now to your Weather “Intents” an insert under Action: yahooWeatherForecast

  5. Active the webhook under Fulfillment in this Intent!

now it should work :smiley:
sry, my english is not so good ^^
maverick

11

Hello!

Thank you for the explanation.

Best regards,
Davor

12

@Oli
can you help me`?

habe gerade deine Übersetzung gefunden, finde ich super! :blush:

Ich spiele gerade mit api.ai Plattform und yahooWeatherForecast herum.
Habe dazu wie in einem Tutorial beschrieben ein webhook über heroku erstellt.
Die Antworten funktionieren, nur sind die eben alle auf English, deine Übersetzung wäre die Lösung!
Wie binde ich das ganze ein, kannst du mir helfen?

Dankeschön!
maverick

13

Hallo @maverick,

you’ll need to copy the text over into a map file and use the map transformation while defining your sitemap. Please have a look at the very similar Astro example here:

14

@ThomDietrich

I think you misunderstood me, I wanted to know how I did the api yahooWeatherForecast(from github) to adjust with the german translation.
Or am just wrong here ;D

15

Looks like others have already chipped in :slight_smile:
Uh…webhook? heroku? I only know Captain Hook and maybe i can write a haiku :wink:
Sorry, clueless…but of course feel free to use the data as is if it helps.
HTH,
Peace out,
-OLI

1 Like
16

Sorry to revive this old thread but i think there is something wrong with the moon symbols and how they eventually get transferred to the generated web page with for example basicui

i followed the astro example and most of the unicode symbols works just fine except the moon symbols (i use chrome on windows)
each moon symbol just ends up as two diamond shaped symbols just like the picture in this thread: Astro Items+Sitemap+Map+♈ Binding Example

but i did an experiment, in chrome i did an inspect and edited the html and replaced the bad moon symbols with the symbols i copied from the astro.map file.
result was working moon symbols in page.

obviously this wont stick and was just a test if browser can display them or not and it can.
so i suspect that some of the unicode symbols gets mangled when page is generated.
maybe a bug in openhab 2.2?

17

there is definitely something odd going on with the moon symbols.
leaving page (basic ui) as is until it updates makes the unicode symbols work but reloading page breaks it.

is there any browser specific checks that makes unicode symbols handled differently depending on browser?

1 Like
18

can someone point me in the right direction where to report this as a bug?

i have again confirmed that unicode symbols that get auto updated AFTER apage loads, for example due to changes works but not initial symbols on page refresh.

so there must be a bug.

19

I noticed the same behavior, but not only for the moon symbols. It seems to apply to several unicode symbols, and also I noticed the behavior for both Chrome (Win64 and Android) and Edge (Win64). Interestingly, in the OpenHAB app the unicode symbols are correctly displayed right away, also if I copy-paste the symbols the pasted symbols are initially displayed using the &#…; notation and, after initiating a search on this string, as correct unicode symbols (tested in Chrome (Win64).

When I inspect the OpenHAB basicui page then I find that initially the symbols are only displayed as diamonds with question marks, yet after a data update they are replaced by, for example,

<span class="emojione-emoji" style="display: inline-block; line-height: normal; font-size: inherit; vertical-align: middle; position: relative; width: 1.1em; height: 1.1em; z-index: 100;"><svg style="padding: 0; margin: 0; width:100%; height:100%;" viewBox="0 0 64 64"><use xlink:href="#e1-1f3e0"></use></svg></span>︎

Here I note that I used the instructions here to complete the unicode character set in Chrome (yet this did not have an effect on the initial display of the symbols, I still have the same behavior of unicode symbols only being shown after a data update).

So it indeed seems that browsers do only interpret the unicode symbols after a data update took place. Any suggestions on how this could be fixed would be much appreciated.

20

i would not be surprised if there is some clever code in the web server trying to figure out what browser it is and then adjust unicode characters accordingly or something similar.
probably based on the user-agent string.

would be interesting to see if behavior changes if you fake the user agent with something else.
since browser clearly can display the unicode symbols propperly the fault must lie with openhab and its web server.