Telekom Datenvolumen Widget - edit olikdesign (orig. @Sillium)

telekom-datenvolumen

// Variables used by Scriptable.
// These must be at the very top of the file. Do not edit.
// icon-color: pink; icon-glyph: magic;
// creator: https://github.com/Sillium | functions added https://github.com/LupusArgentum | Color and Layout edit by https://github.com/olikdesign

const apiUrl = "https://pass.telekom.de/api/service/generic/v1/status"

let widget = await createWidget()
widget.backgroundColor = new Color("#E20074")
if (!config.runsInWidget) await widget.presentSmall()
Script.setWidget(widget)
Script.complete()

async function createWidget(items) {
  let fm = FileManager.local()
  let dir = fm.documentsDirectory()
  let jsonLocalPath = fm.joinPath(dir, "scriptable-telekom.json")
  let lastFetchDateLocalPath = fm.joinPath(dir, "lastUpdate.txt")

  const list = new ListWidget()
  list.addSpacer()
 
  try {
    let r = new Request(apiUrl)
  // API only answers for mobile Safari
    r.headers = {
      "User-Agent": "Mozilla/5.0 (iPhone; CPU iPhone OS 13_5_1 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.1.1 Mobile/15E148 Safari/604.1"
    }
    let data = false, api_online = false, lastFetchDate = false
    try {
      // Fetch data from pass.telekom.de
      data = await r.loadJSON()
      // Write JSON to local file
      fm.writeString(jsonLocalPath, JSON.stringify(data, null, 2))
      api_online = true
      lastFetchDate = new Date()
      fm.writeString(lastFetchDateLocalPath, lastFetchDate.toString())
    } catch (err) {
      console.log(err)
      // Read data from local file
      if (fm.fileExists(jsonLocalPath) && fm.fileExists(lastFetchDateLocalPath)) {
        data = JSON.parse(fm.readString(jsonLocalPath), null)
        lastFetchDate = new Date(fm.readString(lastFetchDateLocalPath, null))
      } else {
        const errorList = new ListWidget()
        errorList.addText("Please disable WiFi for initial execution.")
        return errorList
      }
    }
   

    let stack = list.addStack()
    let dataIcon = SFSymbol.named('antenna.radiowaves.left.and.right');
  let dataIconElement = stack.addImage(dataIcon.image)
  dataIconElement.imageSize = new Size(15, 15)
  dataIconElement.tintColor = Color.white()
  stack.addSpacer(4)
  let titlename = stack.addText("Datenvolumen")
  titlename.font = Font.mediumSystemFont(14)
  titlename.textColor = Color.white()
      
      
  	const availabledata = 100 - data.usedPercentage;
	const fontName = "Futura-Medium"  
    const line2 = list.addText(availabledata + "%")
    line2.font = new Font(fontName, 36)
    line2.textColor = new Color("#101e43")
    if (data.usedPercentage >= 75) {
      line2.textColor = Color.orange()
    } else if (data.usedPercentage >= 90) {
      line2.textColor = Color.red()
    }


 let row = list.addStack()
function addUsedData() {
  let stack = row.addStack()
  stack.layoutHorizontally()
	let line3 = stack.addText(data.usedVolumeStr)
    line3.font = Font.boldSystemFont(14)
    line3.textColor = Color.white()
    stack.addSpacer(10)
	const lineSpacer = stack.addText("●")
    lineSpacer.font = Font.heavySystemFont(14)
    lineSpacer.rightAlignText()
    lineSpacer.textColor = Color.green()
    if (data.usedPercentage >= 75) {
      lineSpacer.textColor = Color.orange()
    } else if (data.usedPercentage >= 90) {
      lineS.textColor = Color.red()
    }
}	  
addUsedData();
    const line4 = list.addText("von " + data.initialVolumeStr + " verbraucht")
    line4.font = Font.mediumSystemFont(10)
    line4.textColor = Color.white()
    list.addSpacer(6)
    
    list.addSpacer()
    let line5
	 
    // alt text on line5 if local data instead of Telekom API data:
    if (api_online) {
      let plan = (data.remainingSeconds ? "prepaid" : data.remainingTimeStr ? "postpaid" : "")
      switch (plan) {
        case "prepaid":
          let days = Math.floor(data.remainingSeconds / 86400)
          let hours = Math.floor((data.remainingSeconds % 86400) / 3600)
          line5 = list.addText("noch " + days + " Tage " + hours + " Std.")
          line5.font = Font.mediumSystemFont(10)
          line5.textColor = new Color("#101e43")
          break;
      
        case "postpaid":
          line5 = list.addText("gültig bis:\n" + data.remainingTimeStr)
          line5.font = Font.mediumSystemFont(12)
          break;
      }
      
    } else {
        line5 = list.addText("API Offline")
        line5.font = Font.boldSystemFont(12)
        line5.textColor = new Color("#101e43")
    }
    
    // Add time (and date) of last data fetch
    const df = new DateFormatter()
    const wasFetchedToday = (lastFetchDate.getDate() == new Date().getDate())
    df.dateFormat = (wasFetchedToday ? "HH:mm" : "dd.MM. HH:mm")
    
    let timeLabel = list.addText("aktualisiert " + df.string(lastFetchDate))
    timeLabel.font = Font.mediumSystemFont(9)
    timeLabel.textColor = new Color("#101e43", 0.5)
    list.addSpacer()
      
  } catch (err) {
    console.log(err)
    list.addText("Error fetching JSON from https://pass.telekom.de/api/service/generic/v1/status")
  }
 
  return list
}

Layout Idee @LupusArgentum

Kleinere Optische Merkmale wurden angepasst und geändert.

Hey vielen Dank. Gibt es dir Möglichkeit die Antenne durch das Telekom Logo zu ersetzen?

@marc1234S

Das wäre möglich. Es müsste jedoch das Bild in dein iCloud Ordner gespeichert werden und dann abgefragt.

Ersetzt werden müsste dann diese Variable:

„dataIcon“

mit:

let fm = FileManager.iCloud()
let dataIcon = fm.readImage(fm.documentsDirectory() + "/telekomlogo.png")