Skip to content

Web Guide V : System Data

Dani John edited this page Jun 21, 2024 · 109 revisions

Lively provides powerful API to create webpage wallpapers which works out of the box for the user (no prompt or additional software install needed.)

Contents

--audio

Lively can return a 128 length decimal number array with system audio data.

The values will typically be between 0-1(not always, make sure to verify).

To enable this feature add the following to LivelyInfo.json:

  "Arguments": "--audio",

then handle it in the page:

function livelyAudioListener(audioArray)
{
 //will be fired when data is available.
}

Download sample wallpapers

--system-nowplaying

Gets the currently playing audio track from Windows - works with Browser (Chrome), Spotify, Media players..

Require Lively v2.0.6.0 or above.

To enable this feature add the following to LivelyInfo.json:

  "Arguments": "--system-nowplaying",

then handle it in page:

function livelyCurrentTrack(data) {
  let obj = JSON.parse(data);
  //when no track is playing its null
  if (obj != null)
  {
    console.log(obj.Title);
    if (obj.Thumbnail != null)
    {
        //base64 string
        console.log(obj.Thumbnail);
    }
  }
}

Sample data:

{
  "AlbumArtist": "Various Artists",
  "AlbumTitle": "NCS: The Best of 2015",
  "AlbumTrackCount": 0,
  "Artist": "Cartoon",
  "Genres": [],
  "PlaybackType": "Music",
  "Subtitle": "",
  "Thumbnail": "iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz3..",
  "Title": "On & On",
  "TrackNumber": 0
}

Download sample wallpapers

Note

Any player that supports Windows media overlay will support this function, if not then check the player settings. Some player may require additional setup.

The event is fired whenever the track changes, wallpaper resuming from pause and if any new track data become available (thumbnail loaded.)

When no media is playing null is returned.

--system-information

Gets real-time system hardware information like cpu, gpu usage.

To enable this feature add the following to LivelyInfo.json:

  "Arguments": "--system-information",

then handle it in the page:

function livelySystemInformation(data)
{
    var obj = JSON.parse(data);
    console.log(obj.NameCpu + " " + obj.CurrentCpu);
    console.log(obj.NameGpu + " " + obj.CurrentGpu3D);
    console.log(obj.NameNetCard + " NETDOWN(MB/s): " + obj.CurrentNetDown/(1024*1024) + 
                                  " NETUP(Bytes/s): " + obj.CurrentNetUp);
    console.log("RAM(Total): " + obj.TotalRam + " RAM(Free): " + obj.CurrentRamAvail);
}

Download sample wallpapers

Example:

<!DOCTYPE html>
<head>
  <style>
    body{
      margin: 0;
      overflow: hidden;
    }
  </style>
</head>
<body>
  <h1 id="cpuText">i9 999990k : 10%</h1>
  <h1 id="gpuText">RTX 9900 : 15%</h1>
  <h1 id="netText">WIFI 10x : 99%</h1>
  <h1 id="ramText">Total: 2000 Free: 10000</h1>
</body>
<script type="text/javascript">
  function livelySystemInformation(data)
  {
      var obj = JSON.parse(data);
      document.getElementById("cpuText").innerText = obj.NameCpu + ": " + obj.CurrentCpu.toFixed(2) + "%";
      document.getElementById("gpuText").innerText = obj.NameGpu + ": " + obj.CurrentGpu3D.toFixed(2) + "%";
      document.getElementById("netText").innerText = obj.NameNetCard + ": " 
               + ((obj.CurrentNetDown*8)/(1024*1024)).toFixed(2) + " Mb/s(Down) " + ((obj.CurrentNetUp*8)/(1024*1024)).toFixed(2) + "Mb/s(Up)";
      document.getElementById("ramText").innerText = "Ram: " + obj.TotalRam + "MB(Total) " + (obj.TotalRam - obj.CurrentRamAvail) + "MB(Used)";
  }
</script>
</html>

--area-weather

(THIS FEATURE IS NOT READY) Gets the current weather of the region.

function livelyCurrentWeather(data)
{
   var obj = JSON.parse(data);
   console.log(obj.Units); // metric
   console.log(obj.Current.Temp + " " + obj.Current.TempMin + " " + obj.Current.TempMax + obj.Current.FeelsLike + " " + obj.Current.Humidity + " " + obj.Current.Description);
}

--pause-event

To receive notification when wallpaper playback state is changed add the following string to LivelyInfo.json:

  "Arguments": "--pause-event true",

then handle it in the page:

function livelyWallpaperPlaybackChanged(data)
{
 var obj = JSON.parse(data);
 console.log(obj.IsPaused); //true or false
}

Note

Only rendering is paused when wallpaper is paused, JavaScript code can be still executed during pause.