Local Weather (sample Widget)

In this guide, you will build an AccuWeather widget that detects the location of the player by its IP and displays the local weather.

For this widget, we use the free AccuWeather widget found at http://www.accuweather.com/en/

The widget’s HTML code

The following widget does the following:

  1. embeds the AccuWeather widget.
  2. applies the configuration (unit format).
  3. refreshes the widget every 30 seconds.

Here is the zip with the required code:

accuweather.zip

The widget’s JSON schema

We need the declare a schema for the required configuration fields:

  1. unit: a select field to choose the unit format (Celsius, Fahrenheit) for the widget.

accuweather schema.jsonExpand source

{
  "schema": {
    "removebackdrop": {
      "type": "Boolean",
      "title": "Remove backdrop"
    },
    "bgcolor": {
      "type": "SpectrumColorPicker",
      "title": "Background color"
    },
    "unit": {
      "type": "Select",
      "options": [
        {
          "val": "c",
          "label": "Celsius (°C)"
        },
        {
          "val": "f",
          "label": " Fahrenheit (°F)"
        }
      ],
      "title": "Unit"
    },
    "locationkey": {
      "type": "Text",
      "help": "Location Number",
      "title": "<a href="https://www.yodeck.com/docs/display/YO/Get+Location+number+From+Accu+Weather" target="_blank">how to get location number guide</a>"
    }
  }
}

Widget creation

In the upload widget page, we create a new widget, upload the attached zip file and enter the schema given above.

After that, we can create AccuWeather widgets with the desired configuration.

For any questions, you may have, reach out and our dev team can help you out.