2 Einzelne Webcams: Diese Seite gehört zur Homepage der WebcamWidgetsSylt: https://wwsylt.live. Ein iPhone Widget, das Bilder einzelner WebCams auf der wundervollen Nordseeinsel Sylt zeigt. Dies sind die WebCams im Hotel Rungholt und die Surfcam Sylt auf dem Hotel Miramar in Westerland. Was genau zu tun ist, steht ganz unten.

Webcam_Kampen_Rungholt.js

// Variables used by Scriptable.
// These must be at the very top of the file. Do not edit.
// icon-color: blue; icon-glyph: camera-retro;
// Cam URL: https://webtv.feratel.com/webtv/?design=v3v&cam=3150&c24=0
// Preview Cam imgURL "https://cs3.wettercomassets.com/thumbnails/variants/5afdfcba9c6a4/16x9_player.jpg"

const camLocation = "Kampen Hotel Rungholt";

const url = "http://webtv.feratel.com/webtv/?design=v4&cam=3150&pg=5EB12424-7C2D-428A-BEFF-0C9140CD772F";
const imgUrl ="http://wtvpict.feratel.com/picture/37/3150.jpeg?design=noxdesign&dcsdesign=WTP_partner";

const imgReq = await new Request(imgUrl);
const img = await imgReq.loadImage();

let actualdate = new Date();
let lastrefresh = new DateFormatter();
lastrefresh.useShortDateStyle();
lastrefresh.useShortTimeStyle();
camSubtitle = lastrefresh.string(actualdate);
const logoImg = await getImage('WWS-Logo.png');

if (config.runsInWidget) {
  let widget = createWidget(img);
  Script.setWidget(widget);
  Script.complete();
} else {
  let widget = createWidget(img);
  await widget.presentMedium();
}

function createWidget(img) {

  const widget = new ListWidget();
	sourceURL = "https://wwsylt.live";
  widget.backgroundColor = Color.black();
  widget.url = url;
  widget.backgroundImage = img;

  widget.setPadding(3,15,15,3)

  const logoStack = widget.addStack()
  logoStack.addSpacer()
  const logoImageStack = logoStack.addStack()
  logoImageStack.addSpacer()
  const wimg = logoImageStack.addImage(logoImg)
  wimg.imageSize = new Size(80, 80)
  wimg.rightAlignImage()

  widget.addStack
  widget.addSpacer();

  const titleText = widget.addText(camLocation);
  titleText.font = Font.boldSystemFont(12);
  titleText.textColor = Color.white();
  titleText.shadowRadius = 3;
  titleText.shadowColor = Color.black();

  widget.addSpacer(2);

  const subtitleText = widget.addText(camSubtitle);
  subtitleText.font = Font.systemFont(8);
  subtitleText.textColor = Color.white();
  subtitleText.textOpacity = 0.8;
  subtitleText.shadowRadius = 3;
  subtitleText.shadowColor = Color.black();

  const sourceURLText = widget.addText(sourceURL);
	sourceURLText.font = Font.systemFont(8);
	sourceURLText.textColor = Color.white();
	sourceURLText.textOpacity = 0.8;
	sourceURLText.shadowRadius = 3;
	sourceURLText.shadowColor = Color.black();

  return widget
}

// get images from local filestore or download them once
async function getImage(image) {
    let fm = FileManager.local()
    let dir = fm.documentsDirectory()
    let path = fm.joinPath(dir, image)
    if (fm.fileExists(path)) {
        return fm.readImage(path)
    } else {
        // download once
        let logoUrl
        switch (image) {
            case 'WWS-Logo.png':
                logoUrl = "https://wwsylt.live/images/WWS_Logo.png"
                console.log("set URL:  " + logoUrl);
                break
            default:
                console.log(`Sorry, couldn't find ${image}.`);
        }
        console.log("passing URL:  " + logoUrl);
        let iconImage = await loadImage(logoUrl)
        fm.writeImage(path, iconImage)
        return iconImage
    }
}

// helper function to download an image from a given url
async function loadImage(prvlogoUrl) {
  console.log(`passed URL: ${prvlogoUrl}.`);
    const req = new Request(prvlogoUrl)
    return await req.loadImage()
}

Webcam_Westerland_Surfcam-Sylt.js

// Variables used by Scriptable.
// These must be at the very top of the file. Do not edit.
// icon-color: blue; icon-glyph: camera-retro;
// Cam URL https://surfcam-sylt.de
// Preview Cam imgURL "https://www.worldcam.pl/images/webcams/420x236/strand-sylt.jpg"



const camLocation = "Surfcam Sylt - Westerland";
const url = "https://surfcam-sylt.de/";
const imgUrl = "https://surfcam-sylt.de/preview.jpg";

//"https://www.worldcam.pl/images/webcams/420x236/strand-sylt.jpg";

const imgReq = await new Request(imgUrl);
const img = await imgReq.loadImage();
const logoImg = await getImage('WWS-Logo.png');

let actualdate = new Date();
let lastrefresh = new DateFormatter();
lastrefresh.useShortDateStyle();
lastrefresh.useShortTimeStyle();
camSubtitle = lastrefresh.string(actualdate);


if (config.runsInWidget) {
  let widget = createWidget(img);
  Script.setWidget(widget);
  Script.complete();
} else {
  let widget = createWidget(img);
  await widget.presentMedium();
}

function createWidget(img) {

  const widget = new ListWidget();
	sourceURL = "https://wwsylt.live";
  widget.backgroundColor = Color.black();
  widget.url = url;
  widget.backgroundImage = img;

  widget.setPadding(3,15,15,3)

  const logoStack = widget.addStack()
  logoStack.addSpacer()
  const logoImageStack = logoStack.addStack()
  logoImageStack.addSpacer()
  const wimg = logoImageStack.addImage(logoImg)
  wimg.imageSize = new Size(80, 80)
  wimg.rightAlignImage()

  widget.addStack
  widget.addSpacer();

  const titleText = widget.addText(camLocation);
  titleText.font = Font.boldSystemFont(12);
  titleText.textColor = Color.white();
  titleText.shadowRadius = 3;
  titleText.shadowColor = Color.black();

  widget.addSpacer(2);

  const subtitleText = widget.addText(camSubtitle);
  subtitleText.font = Font.systemFont(8);
  subtitleText.textColor = Color.white();
  subtitleText.textOpacity = 0.8;
  subtitleText.shadowRadius = 3;
  subtitleText.shadowColor = Color.black();

  const sourceURLText = widget.addText(sourceURL);
	sourceURLText.font = Font.systemFont(8);
	sourceURLText.textColor = Color.white();
	sourceURLText.textOpacity = 0.8;
	sourceURLText.shadowRadius = 3;
	sourceURLText.shadowColor = Color.black();

  return widget
}

// get images from local filestore or download them once
async function getImage(image) {
    let fm = FileManager.local()
    let dir = fm.documentsDirectory()
    let path = fm.joinPath(dir, image)
    if (fm.fileExists(path)) {
        return fm.readImage(path)
    } else {
        // download once
        let logoUrl
        switch (image) {
            case 'WWS-Logo.png':
                logoUrl = "https://wwsylt.live/images/WWS_Logo.png"
                console.log("set URL:  " + logoUrl);
                break
            default:
                console.log(`Sorry, couldn't find ${image}.`);
        }
        console.log("passing URL:  " + logoUrl);
        let iconImage = await loadImage(logoUrl)
        fm.writeImage(path, iconImage)
        return iconImage
    }
}

// helper function to download an image from a given url
async function loadImage(prvlogoUrl) {
  console.log(`passed URL: ${prvlogoUrl}.`);
    const req = new Request(prvlogoUrl)
    return await req.loadImage()
}

2 einzelne WebCams auf Sylt

---

Diese Seite gehört zur Homepage der WebCamWidgetsSylt:
https://wwsylt.live

Die Scripts auf dieser Seite zeigen von 2 ausgewählten Locations die Bilder von WebCams auf der wundervollen Nordsee-Insel Sylt in Echtzeit direkt auf dem HomeScreen vom iPhone.

Das Script verwendet die App Scriptable

HowTo: (Einfach) (nach unten scrollen für die detaillierte Anleitung)

---

Auf dem iPhone:

1. Das Script über diesem Kommentar markieren (von unten nach oben), kopieren, als neues Script in Scriptable einfügen und unter einem Namen speichern. So geht das
2. Auf den HomeScreen tippen, bis die Icons wackeln und über das Pluszeichen ein neues Scriptable Widget hinzufügen. Das Widget so einstellen, dass es das neue Script verwendet, bei "when interacting" auf "Open URL" stellen So wirds eingerichtet

Bitte Folgendes berücksichtigen:

---

• Für sämtliche Bilder gilt das Copyright des Besitzers der WebCam
• Die WebCams aktualisieren das Bild alle 4 Sekunden, die Surfcam-Sylt aktualiert das Bild 1x pro Minute
• Das iPhone aktualisiert die Bilder alle 15-20 Minuten
• Scriptable bietet einen iPhone Kurzbefehl "Refresh all Widgets" zum sofortigen Aktualisieren der Bilder
• Durch die Nutzung der Widgets erhöht sich der mobile Datenverbrauch

Dieses und andere Widgets teilen:

---

Ihr wollt vielleicht die Links zu diesem und anderen Widgets teilen:

• Homepage der WebcamWidgetsSylt: https://wwsylt.live
• 6 Webcams Autozug Sylt-Shuttle: https://bit.ly/3dj5YcN
• 3 WebCams Syltfähre: https://bit.ly/3eCBe7d
• 5 Livespotting Webcams Sylt: https://bit.ly/3b2wrsd

Auf YouTube:

---

Präsentation der Widgets
https://youtu.be/YtO87t9DvtA

Demo aller Widgets
https://youtu.be/En-h2LZYh1w

Demo Autozug / Sylt-Shuttle
https://youtu.be/okgi-ZKg_PY

Erklärung Script Laden am Beispiel Westerland Kurpromenade
https://youtu.be/tRHFpwIr_l0

Erklärung Widget Einrichten auf dem Homescreen am Beispiel Westerland Kurpromenade
https://youtu.be/LnrikIM3T0U

Erklärung Widget Einrichten auf dem Homescreen am Beispiel Autozug / Sylt-Shuttle
https://youtu.be/vTvw9BsSmVY

2,99 € für die Kaffeedose:

---

Die hier zur Verfügung gestellten Widgets sind kostenlos und "as-is".
Wenn sie Euch gefallen, würde ich mich freuen, wenn Ihr mir einen Kaffee ausgebt.

HowTo: (detaillierte Schritt für Schritt Anleitung)

---

1. Im App Store die App Scriptable auf dem iPhone installieren
2. Dann den Code auf dieser Seite (oben) von unten nach oben markieren und kopieren. Bitte passt auf, dass Ihr alle Zeichen kopiert!
3. Auf die App "Scriptable" wechseln und das blaue Pluszeichen rechts oben antippen. Damit öffnet sich ein leeres Fenster vom Scriptable Editor.
4. Da hineintippen und "Einfügen" wählen, dann "Done" klicken. Jetzt das neue Script lang-tippen (Untitled Script) und unter "Rename" einen neuen Namen eingeben, zB "Webcam_Kampen_Hotel_Rungholt"
5. Zum Schluss noch das "Done" in der oberen linken Ecke antippen und dann sind wir hier fertig: Wir haben in Scriptable das neue Script unter einem Namen abgelegt. Jetzt muss das Widget eingestellt werden:
6. Einmal lange auf den HomeScreen tippen, bis die Icons wackeln. Dann über das Plus-Zeichen oben ein neues Widget erstellen.
7. Nach unten scrollen und "Scriptable" auswählen (Schneller gehts, wenn man in das Suchfenster SC eingibt...), die mittlere Widget-Größe auswählen und "Add Widget" antippen.
8. Die Icons sollten immer noch wackeln. Jetzt das neue Widget antippen, um die Einstellung zu starten
9. Falls die Icons nicht wackeln, einfach den Homescreen lang drücken, bis sie es tun
10. Unter "Script" das neue Script auswählen, zB "Webcam_Kampen_Hotel_Rungholt"
11. Unter "When interacting" auf "Open URL" stellen
12. Das war's. Jetzt auf den HomeScreen tippen, um die Einstellung abzuschliessen.
13. Schritte 1-12 wiederholen, um das nächste Widget zu erstellen.
14. Wenn die Icons wackeln, kann man das neue Widget auf das vorherige ziehen, um einen Smart Stapel zu erzeugen, mit dem man durch die Cams mit dem Daumen durchscrollen kann. Das ist ein Smart Stack

---