#!/bin/zsh

pdm run uvicorn light9.ascoltami.main:app --host 0.0.0.0 --port 8206 --no-access-log

#!/bin/zsh

            server = str(server).rstrip('/')

            print(f'''

  location = /{path} {{ rewrite (.*) $1/ permanent; }}

  location /service/{path}/ {{

    rewrite ^/service/{path}(/.*) $1 break;

    proxy_pass {server};

  }}''',

                  file=out)

        showPath = showconfig.showUri().split('/', 3)[-1]

        root = showconfig.root()[:-len(showPath)].decode('ascii')

        print(f'''

    root {root};

  }}

  location / {{

    proxy_pass http://localhost:8300;

  }}

 }}

}}''', file=out)

if __name__ == '__main__':

    main()

  constructor() {

    super();

    this.status = "startup";

    const prefixes = new Map<string, string>([

      ["", "http://light9.bigasterisk.com/"],

      ["dev", "http://light9.bigasterisk.com/device/"],

      ["effect", "http://light9.bigasterisk.com/effect/"],

      ["rdf", "http://www.w3.org/1999/02/22-rdf-syntax-ns#"],

      ["rdfs", "http://www.w3.org/2000/01/rdf-schema#"],

      ["xsd", "http://www.w3.org/2001/XMLSchema#"],

    ]);

    this.graph = new SyncedGraph(

      prefixes,

      (s: string) => {

        this.status = s;

      }

    );

    setTopGraph(this.graph);

  }

}

// todo: consider if this has anything to contribute:

// https://github.com/webcomponents-cg/community-protocols/blob/main/proposals/context.md

let setTopGraph: (sg: SyncedGraph) => void;

import debug from "debug";

import { css, html, LitElement } from "lit";

import { customElement, property } from "lit/decorators.js";

import { classMap } from "lit/directives/class-map.js";

import { NamedNode } from "n3";

import Sylvester from "sylvester";

import { TimingUpdate } from "./main";

const $V = Sylvester.Vector.create;

debug.enable("*");

const log = debug("asco");

function byId(id: string): HTMLElement {

  return document.getElementById(id)!;

}

async function postJson(url: string, jsBody: Object) {

  return fetch(url, {

    method: "POST",

    headers: { "Content-Type": "applcation/json" },

        min-height: 40px;

        margin-bottom: 10px;

      }

      #songList .row.playing {

        box-shadow: 0 0 30px red;

        background-color: #de5050;

      }

    `,

  ];

  render() {

    return html`<rdfdb-synced-graph></rdfdb-synced-graph>

      <!-- <h1>ascoltami <a href="metrics">[metrics]</a></h1> -->

      <div id="grow">

        <span>

          <div id="songList">

            <table>

              ${this.songList.map(

                (song) => html`

                  <tr

                    class="row ${classMap({

                      playing: !!(this.song && song.equals(this.song)),

  onSelectSong(song: NamedNode, ev: MouseEvent) {

    if (this.selectedSong && song.equals(this.selectedSong)) {

      this.selectedSong = null;

    } else {

      this.selectedSong = song;

    }

  }

  async onPlaySelected(ev: Event) {

    if (!this.selectedSong) {

      return;

    }

  }

  onCmdStop(ev?: MouseEvent): void {

  }

  onCmdPlay(ev?: MouseEvent): void {

  }

  onCmdIntro(ev?: MouseEvent): void {

  }

  onCmdPost(ev?: MouseEvent): void {

      t: this.currentDuration - this.times.post,

      resume: true,

    });

  }

  onCmdGo(ev?: MouseEvent): void {

  }

  bindKeys() {

    document.addEventListener("keypress", (ev) => {

      if (ev.which == 115) {

        this.onCmdStop();

        return false;

      }

      if (ev.which == 112) {

        this.onCmdPlay();

        return false;

      }

      }

      if (ev.key == "g") {

        this.onCmdGo();

        return false;

      }

      return true;

    });

  }

  async musicSetup() {

    // shoveled over from the vanillajs version

    this.show = new NamedNode(config.show);

    this.times = config.times;

    document.title = document.title.replace("{{host}}", config.host);

    try {

      const h1 = document.querySelector("h1")!;

      h1.innerText = h1.innerText.replace("{{host}}", config.host);

    } catch (e) {}

    (window as any).finishOldStyleSetup(this.times, this.onOldStyleUpdate.bind(this));

  }

  onOldStyleUpdate(data: TimingUpdate) {

<!DOCTYPE html>

<html>

  <head>

    <title>ascoltami on {{host}}</title>

    <style>

      #cmd-go {

        min-width: 5em;

      }

      .song-name {

        padding-left: 0.4em;

      }

      .dimStalled #currentTime {

        font-size: 20px;

        background: green;

        color: black;

        padding: 3px;

      #page > p {

        flex: 0 1 auto;

        margin: 0;

      }

      light9-ascoltami-ui {

        flex: 1 1 auto;

      }

    </style>

    <meta

      name="viewport"

      content="user-scalable=no, width=device-width, initial-scale=.7"

    />

  </head>

  <body>

    <div id="page">

      <h1>ascoltami on {{host}}</h1>

      <div class="songs" style="display: none"></div>

      <div class="dimStalled">

        <table>

          <tr>

            <td colspan="3">

              <strong>Song:</strong> <span id="currentSong"></span>

            </td>

          <tr>

            <td colspan="3">

               <span id="states"></span>

            </td>

          </tr>

        </table>

      </div>

      <hr />

      <light9-ascoltami-ui></light9-ascoltami-ui>

      <p><a href="">reload</a></p>

    </div>

  </body>

</html>

  playing: boolean;

  song: string;

  started: number; // unix sec

  t: number; // seconds into song

  state: { current: { name: string }; pending: { name: string } };

}

(window as any).finishOldStyleSetup = async (times: { intro: number; post: number }, timingUpdate: (data: TimingUpdate) => void) => {

  let currentHighlightedSong = "";

  // let lastPlaying = false;

  events.addEventListener("message", (m)=>{

    const update = JSON.parse(m.data) as TimingUpdate

    updateCurrent(update)

    markUpdateTiming();

  })

  async function updateCurrent(data:TimingUpdate) {

    byId("currentSong").innerText = data.song;

    if (data.song != currentHighlightedSong) {

      showCurrentSong(data.song);

    }

    byId("currentTime").innerText = data.t.toFixed(1);

import debug from "debug";

import { html, LitElement } from "lit";

import { customElement, property } from "lit/decorators.js";

import { NamedNode } from "n3";

import ReconnectingWebSocket from "reconnectingwebsocket";

import { sortBy, uniq } from "underscore";

import { Light9CollectorDevice } from "./Light9CollectorDevice";

export { Light9CollectorDevice };

debug.enable("*");

const log = debug("collector");

@customElement("light9-collector-ui")

export class Light9CollectorUi extends LitElement {

  graph!: SyncedGraph;

  render() {

    return html`<rdfdb-synced-graph></rdfdb-synced-graph>

      <h1>Collector <a href="metrics">[metrics]</a></h1>

      <div style="column-width: 11em">${this.devices.map((d) => html`<light9-collector-device .uri=${d}></light9-collector-device>`)}</div> `;

  }

  @property() devices: NamedNode[] = [];

  constructor() {

    super();

    getTopGraph().then((g) => {

      this.graph = g;

      this.graph.runHandler(this.findDevices.bind(this), "findDevices");

    });

    ws.addEventListener("message", (ev: any) => {

      const outputAttrsSet = JSON.parse(ev.data).outputAttrsSet;

      if (outputAttrsSet) {

        this.updateDev(outputAttrsSet.dev, outputAttrsSet.attrs);

      }

    });

  }

  findDevices(patch?: Patch) {

    const U = this.graph.U();

    this.devices = [];

<!DOCTYPE html>

<html>

  <head>

    <title>collector</title>

    <meta charset="utf-8" />

    <style>

      td {

        white-space: nowrap;

      }

    </style>

  </head>

  <body>

    <light9-collector-ui></light9-collector-ui>

  </body>

</html>

import debug from "debug";

import { css, html, LitElement } from "lit";

import { customElement } from "lit/decorators.js";

import { NamedNode } from "n3";

import { sortBy } from "underscore";

debug.enable("*");

const log = debug("listing");

@customElement("light9-effect-listing")

export class Light9EffectListing extends LitElement {

  render() {

    return html`

      <h1>Effects</h1>

      <rdfdb-synced-graph></rdfdb-synced-graph>

      ${this.effects.map((e: NamedNode) => html`<light9-effect-class .uri=${e}></light9-effect-class>`)}

<!doctype html>

<html>

  <head>

    <title>effect listing</title>

    <meta charset="utf-8" />

    <link rel="stylesheet" href="../style.css">    

  </head>

  <body>

    <light9-effect-listing></light9-effect-listing>

  </body>

</html>

import debug from "debug";

import { css, html, LitElement } from "lit";

import { customElement, property, state } from "lit/decorators.js";

import { NamedNode, Quad } from "n3";

import { Literal } from "n3";

export { Light9Fader } from "./Light9Fader";

const log = debug("efffader")

//////////////////////////////////////

const RETURN_URI = new NamedNode("");

const RETURN_FLOAT = 1;

function get2Step<T extends NamedNode | number>(returnWhat: T, graph: SyncedGraph, subj1: NamedNode, pred1: NamedNode, pred2: NamedNode): T | undefined {

  // ?subj1 ?pred1 ?x . ?x ?pred2 ?returned .

  let x: NamedNode;

  try {

import debug from "debug";

import { css, html, LitElement, TemplateResult } from "lit";

import { customElement, property } from "lit/decorators.js";

import * as N3 from "n3";

import { NamedNode, Quad } from "n3";

export { Light9EffectFader } from "./Light9EffectFader";

export { Light9Fader } from "./Light9Fader";

debug.enable("*,autodep");

const log = debug("fade");

class FaderConfig {

  constructor(public uri: NamedNode, public column: number) { }

}

class FadePage {

  constructor(public uri: NamedNode) { }

import debug from "debug";

import { css, html, LitElement, PropertyValueMap } from "lit";

import { customElement, property, query } from "lit/decorators.js";

const log = debug("fade");

class Drag {

  constructor(public startDragPxY: number, public startDragValue: number) {}

}

@customElement("light9-fader")

export class Light9Fader extends LitElement {

  static styles = [

    css`

      :host {

        display: inline-block;

<!DOCTYPE html>

<html>

  <head>

    <title>light9 home</title>

    <meta charset="utf-8" />

    <link rel="stylesheet" href="style.css" />

  </head>

  <body>

    <h1>light9 home page</h1>

    <div style="display: grid">

      <service-button-row name="ascoltami" metrics="1"></service-button-row>

      <service-button-row name="fade"></service-button-row>

      <service-button-row name="effectListing"></service-button-row>

      <service-button-row name="effectSequencer" metrics="1"></service-button-row>

      <service-button-row name="collector" metrics="1"></service-button-row>

      <service-button-row name="rdfdb" metrics="1"></service-button-row>

    </div>

import debug from "debug";

import { Literal, NamedNode, Quad, Quad_Object, Quad_Predicate, Quad_Subject, Term } from "n3";

import { some } from "underscore";

import { SubEvent } from "sub-events";

// todo: Align these names with newtypes.py, which uses HexColor and VTUnion.

type Color = string;

export type ControlValue = number | Color | NamedNode;

const log = debug("effect");

function isUri(x: Term | number | string): x is NamedNode {

  return typeof x == "object" && x.termType == "NamedNode";

}

import debug from "debug";

import { css, html, LitElement, PropertyValues } from "lit";

import { customElement, property, state } from "lit/decorators.js";

import { Literal, NamedNode } from "n3";

import { SubEvent } from "sub-events";

import { ControlValue, Effect } from "./Effect";

import { DeviceAttrRow } from "./Light9DeviceControl";

export { Slider } from "@material/mwc-slider";

export { Light9Listbox } from "./Light9Listbox";

const log = debug("settings.dev.attr");

type DataTypeNames = "scalar" | "color" | "choice";

const makeType = (d: DataTypeNames) => new NamedNode(`http://light9.bigasterisk.com/${d}`);

// UI for one device attr (of any type).

@customElement("light9-attr-control")

export class Light9AttrControl extends LitElement {

  graph!: SyncedGraph;

  static styles = [

import debug from "debug";

import { css, html, LitElement } from "lit";

import { customElement, property } from "lit/decorators.js";

import { NamedNode } from "n3";

import { unique } from "underscore";

import { Choice } from "./Light9Listbox";

import { Light9AttrControl } from "./Light9AttrControl";

import { Effect } from "./Effect";

export { Light9AttrControl };

const log = debug("settings.dev");

export interface DeviceAttrRow {

  uri: NamedNode; //devattr

  device: NamedNode;

  attrClasses: string; // the css kind

  dataType: NamedNode;

  choices: Choice[];

  // choiceSize: number;

  // max: number;

}

import debug from "debug";

import { css, html, LitElement, PropertyValues } from "lit";

import { customElement, property } from "lit/decorators.js";

import { NamedNode } from "n3";

import { sortBy, uniq } from "underscore";

import { Effect, newEffect } from "./Effect";

export { Light9DeviceControl as Light9LiveDeviceControl } from "./Light9DeviceControl";

const log = debug("settings");

@customElement("light9-device-settings")

export class Light9DeviceSettings extends LitElement {

  graph!: SyncedGraph;

  static styles = [

    css`

      :host {

        display: flex;

        flex-direction: column;

import { css, html, LitElement, TemplateResult } from "lit";

import { customElement, property } from "lit/decorators.js";

export { StatsProcess } from "./StatsProcess";

import parsePrometheusTextFormat from "parse-prometheus-text-format";

import debug from "debug";

const log = debug("home");

interface Value {

  labels: { string: string };

  value?: string;

  count?: number;

  sum?: number;

  buckets?: { [value: string]: string };

}

interface Metric {

  name: string;

  help: string;

import { defineConfig } from "vite";

export default defineConfig({

  base: "/",

  root: "./light9/web",

  server: {

    host: "0.0.0.0",

    strictPort: true,

    hmr: {

    },

  },

  clearScreen: false,

  define: {

    global: {},

  },

});