Changeset - 1d3594ffd14b
[Not reviewed]
default
0 2 0
drewp@bigasterisk.com - 8 months ago 2024-05-17 23:56:32
drewp@bigasterisk.com
new home-status elt
2 files changed with 41 insertions and 12 deletions:
0 comments (0 inline, 0 general)
web/TiledHome.ts
Show inline comments
 
import debug from "debug";
 
import * as FlexLayout from "flexlayout-react";
 
import { LitElement, html } from "lit";
 
import { customElement } from "lit/decorators.js";
 
import * as React from "react";
 
import { createRoot } from "react-dom/client";
 
import * as FlexLayout from "flexlayout-react";
 
import { getTopGraph } from "./RdfdbSyncedGraph";
 
import { SyncedGraph } from "./SyncedGraph";
 
import { Patch } from "./patch";
 
import { NamedNode } from "n3";
 
export { RdfdbSyncedGraph } from "./RdfdbSyncedGraph";
 
export { Light9CollectorUi } from "./collector/Light9CollectorUi";
 
export { Light9FadeUi } from "./fade/Light9FadeUi";
 
export { Light9DeviceSettings } from "./live/Light9DeviceSettings";
 
export { Light9CollectorUi } from "./collector/Light9CollectorUi";
 
import { showRoot } from "./show_specific";
 
import { HandlerFunc } from "./AutoDependencies";
 
const log = debug("home");
 

	
 
const config: FlexLayout.IJsonModel = {
 
  global: {},
 
  global: {
 
    tabEnableRename: false,
 
  },
 
  borders: [],
 
  layout: {
 
    type: "row",
 
@@ -25,8 +39,6 @@ const config: FlexLayout.IJsonModel = {
 
  },
 
};
 

	
 
const e = React.createElement;
 

	
 
// see https://github.com/lit/lit/tree/main/packages/labs/react
 

	
 
class Main extends React.Component {
 
@@ -38,11 +50,30 @@ class Main extends React.Component {
 

	
 
  factory = (node: any) => {
 
    var component = node.getComponent();
 
    return e(component, null, "");
 
    return React.createElement(component, null, "");
 
  };
 

	
 
  render() {
 
    return e(FlexLayout.Layout, { model: this.state.model, factory: this.factory });
 
    return React.createElement(FlexLayout.Layout, {
 
      model: this.state.model,
 
      realtimeResize: true,
 
      factory: this.factory,
 
    });
 
  }
 
}
 

	
 
@customElement("light9-home-status")
 
export class Light9HomeStatus extends LitElement {
 
  graph!: SyncedGraph;
 
  render() {
 
    return html`<rdfdb-synced-graph></rdfdb-synced-graph>
 
      <a href="metrics/">metrics</a> `;
 
  }
 
  constructor() {
 
    super();
 
    getTopGraph().then((g) => {
 
      this.graph = g;
 
    });
 
  }
 
}
 

	
web/index.html
Show inline comments
 
@@ -5,7 +5,7 @@
 
    <meta charset="utf-8" />
 
    <link rel="stylesheet" href="style.css" />
 
    <link rel="stylesheet" href="flexlayout-react/style/dark.css" />
 
    <script type="module" src="TiledHome.ts"></script>
 
    <script type="module" src="TiledHome"></script>
 
  </head>
 
  <body>
 
    <style>
 
@@ -20,9 +20,7 @@
 
        box-shadow: black 0px -7px 9px 0px;
 
      }
 
    </style>
 
    <div id="container">hello</div>
 
    <div id="footer">
 
      <a href="metrics/">metrics</a>
 
    </div>
 
    <div id="container">loading layout...</div>
 
    <div id="footer"><light9-home-status></light9-home-status> </div>
 
  </body>
 
</html>
0 comments (0 inline, 0 general)