Anders Gregow´s home

This page is read only. You can view the source, but not change it. Ask your administrator if you think this is wrong.
====== Open ePaper link ======
[[https://github.com/OpenEPaperLink/OpenEPaperLink/wiki/Json-template]]

===== AP konfigurering =====
  - Strömsätt AP'n via USB-C.
  - Anslut dator till WiFi-nätverket OpenEpaperLink.
  - Gå in på 192.168.4.1 via browser.
  - Gå in på inställningar i AP'n (kugghjulet) och välj "WiFi config", och konfigurera nätverk.
  - AP'n startar om. Hitta den via IP-adressen i din routers lista över klienter.

==== Alt 1. OpenEpaperLink-appen (sägs dra mycket ström) ====
  - Installera Homey-appen OpenEpaperLink.
  - Konfigurera AP'ns IP-adress i OpenEpaperLink-appen.
  - Lägg till taggarna som enheter i Homey.
  - Ev. behöver man starta om OpenEpaperLink-appen.

==== Alt 2. Local-API-appen (rekommenderas) ====
  - Installera appen i Homey.
  - Skapa ett flow som triggas med Local-API-kortet "GET request received on url". Hitta på ett namn på taggen.
  - Svara med JSON-strängen i respons-kortet för Local-API.
  - Ställ in dispaly-taggen i ePaper-AP'n att hämta json-template från [[http://<Homey-IP>:3000/<namnet ovan>]]. Ställ in intervallet.

{{:links:smarthome:homey:epaper.png?direct&400|}} 

==== Exempel ====
Example json file:
<code>
[
    {"text": [5,5,"Bahnschrift 20","fonts/bahnschrift20",1]},
    {"box": [10,30,20,20,1]},
    {"box": [35,30,20,20,2]},
    {"triangle": [60,30,60,50,80,40,1]},
    {"text": [5,80,"Plain text glasstown_nbp_tf","glasstown_nbp_tf",1]},
    {"text": [5,95,"Plain text 7x14_tf","7x14_tf",2]},
    {"text": [5,110,"Plain text t0_14b_tf","t0_14b_tf",1]},
    {"text": [135,5,"30","fonts/bahnschrift30",2]},
    {"text": [215,5,"70","fonts/bahnschrift70",1]},
    {"text": [150,80,"50","fonts/calibrib50",2,0]},
    {"text": [205,60,"80","fonts/calibrib80",2]},
    {"text": [90,35,"calibrib30","fonts/calibrib30",1]},
    {"line": [10,120,290,120,1]},
    {"line": [10,115,290,115,2]}
]
</code>

==== Text ====
{ "text": [x, y, "text", "fontname", color] }
{ "text": [x, y, "text", "fontname", color, alignment] }
{ "text": [x, y, "text", "fontname", color, alignment, size] }
{ "text": [x, y, "text", "fontname", color, alignment, size, background_color] }

==== Paragraph Text ====
A text, bounded by a box. The text flows to the next lines (breaking on spaces, hyphen and CR). Only works for .vlw bitmap fonts. Available from release 2.06

{ "textbox": [x, y, w, h, "text", "fontname" }
{ "textbox": [x, y, w, h, "text", "fontname", color ] }
{ "textbox": [x, y, w, h, "text", "fontname", color, line height] }
{ "textbox": [x, y, w, h, "text", "fontname", color, line height, alignment] }
Default line height = 1. Try values like 1.25 for a slightly bigger line spacing.

==== Graphics ====
{ "box": [x, y, width, height, color] }
{ "box": [x, y, width, height, color, bordercolor, borderwidth] }
{ "rbox": [x, y, width, height, corner-radius, color] }
{ "rbox": [x, y, width, height, corner-radius, color, bordercolor, borderwidth] }
{ "line": [x1, y1, x2, y2, color] }
{ "triangle": [x1, y1, x2, y2, x3, y3, color] }
{ "circle": [x, y, radius, color] }

==== Image ====
{ "image": [filename, x, y] }
Places a JPG image (RGB, so no grayscale (can be tricky in some graphic software), baseline (non progressive)), located on the flash partition. The image cannot be scaled, so upload it the right size. It can be any size smaller than the tag, for example an icon. { "image": ["/testicon.jpg", 200, 50] } Tip: use an image with fixed design elements for the background, and fill in any other data using the json commands.

==== Parameters ====
x: X pixel coordinate (x1, x2 and x3 being multiple positions)
y: Y pixel coordinate (y1, y2 and y3 being multiple positions)
width: Width in pixels
height: Height in pixels
"text": Text to display
"fontname": Name of font -> see Fonts section further down
size: Font size
color: see below
bordercolor, borderwidth: color and width of the border around the textbox
alignment: One of 0 (left), 1 (center) and 2 (right) (note that the x,y coordinates are also from the top left/center/rightmost point depending on the chosen alignment)
When entering coordinates, take note of the following: The small bitmap fonts have their origin at the left bottom corner. The vlw bitmap fonts have their origin at the top left. And the origin of the truetype fonts is as much as possible at the baseline, but that can differ depending on the font. So, it's a bit trial and error.

==== Color parameter ====
0 or "white": white
1 or "black": black
2 or "red": red
3 or "yellow": yellow (if the tag supports it)
4 or "lightgray" (uses pattern dither, not suitable for small fonts)
5 or "darkgray" (uses pattern dither, not suitable for small fonts)
6 or "pink" (uses pattern dither, not suitable for small fonts)
7 or "brown"
8 or "green"
9 or "blue"
10 or "orange"
"#rrggbb" for a custom color

==== Fonts ====
=== Bitmap fonts ===
any fonts in the /fonts folder:

bahnschrift20.vlw upper case, lower case, numbers, and äöüßÄÖÜåÅ!\"#$%&'()*+,-./:;<=>?@[\\]^_{|}~°
bahnschrift30.vlw upper case, lower case, numbers, and äöüßÄÖÜåÅ!\"#$%&'()*+,-./:;<=>?@[\\]^_{|}~°
bahnschrift70.vlw only 0123456789.
calibrib30.vlw upper case, lower case, numbers, and äöüßÄÖÜåÅ!\"#$%&'()*+,-./:;<=>?@[\\]^_{|}~°
twcondensed20.vlw Only SUMOTWEHFRAZDIV0123456789. Use for weekday names and numbers.
If you want to add extra fonts to this list, you can convert them from Truetype by using Processing (https://processing.org/) and this script https://github.com/Bodmer/TFT_eSPI/tree/master/Tools/Create_Smooth_Font/Create_font . Make sure you set smooth = false in the script, to prevent antialissing. Place the .vlw font file in the /fonts folder. No need to update/rebuild the firmware.

=== Truetype fonts ===
{ "text": [x, y, "text", "fontname", color, alignment, size] }

Put the truetype font in the /fonts folder. Make sure you select your truetype font file carefully: some are very big, and that will not fit in the file system.

example: { "text": [0, 10, "Use any font in any size!", "Inkfree.ttf", 1, 0, 40] }

Tip: if you want icons and symbols, the Font Awesome font works quite well.

==== Rotate Screen ====
It is possible to rotate the complete display:

{ "rotate": 0 }

The possible Values are 0 for default orientation, 1 for 90° , 2 for 180° and 3 for 270°