light9 Changeset - 4248f40ddcae

Changeset - 4248f40ddcae

Parent rev.

Child rev.

[Not reviewed]

default

2 1 4

drewp@bigasterisk.com - 3 years ago 2022-06-01 06:38:40
drewp@bigasterisk.com

effects/ is now at effectListing/

5 files changed with 131 insertions and 104 deletions:

bin/effectListing

light9/effect/listing/web/Light9EffectListing.ts

101

light9/effect/listing/web/index.html

light9/effect/listing/web/vite.config.ts

show/dance2019/networking.n3

0 comments (0 inline, 0 general)

bin/effectListing

➞

Show inline comments

@@ new file 100755 @@
 #!/bin/sh
 pnpx vite -c light9/effect/listing/web/vite.config.ts &
 wait

light9/effect/listing/web/Light9EffectListing.ts

➞

Show inline comments

 Polymer
   is: "light9-effects"
   properties:
     graph: {type: Object}
     effectClasses: { type: Array }
   ready: ->
     @graph.runHandler(@getClasses.bind(@), 'getClasses')
 import debug from "debug";
 import { css, html, LitElement } from "lit";
 import { customElement, property } from "lit/decorators.js";
 import { NamedNode } from "n3";
 import { sortBy } from "underscore";
 import { getTopGraph } from "../../../web/RdfdbSyncedGraph";
 import { SyncedGraph } from "../../../web/SyncedGraph";
 export {ResourceDisplay} from "../../../web/ResourceDisplay"
 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>
   getClasses: ->
     U = (x) => @graph.Uri(x)
     @effectClasses = @graph.subjects(U('rdf:type'), U(':Effect'))
     @effectClasses = _.sortBy(@effectClasses, (ec) => @graph.stringValue(ec, U('rdfs:label')))
       ${this.effectClasses.map((e: NamedNode) => html`<light9-effect-class .uri=${e}></light9-effect-class>`)}
     `;
+  }
   graph!: SyncedGraph;
   effectClasses: NamedNode[] = [];
   constructor() {
     super();
     getTopGraph().then((g) => {
       this.graph = g;
       this.graph.runHandler(this.getClasses.bind(this), "getClasses");
     });
+  }
   getClasses() {
     const U = this.graph.U();
     this.effectClasses = this.graph.subjects(U("rdf:type"), U(":Effect")) as NamedNode[];
     this.effectClasses = sortBy(this.effectClasses, (ec: any) => this.graph.stringValue(ec, U("rdfs:label")));
     this.requestUpdate();
+  }
+}
 Polymer
   is: "light9-effect-class"
   properties:
     graph: {type: Object}
     uri: {type: Object}
   onAdd: ->
     @$.songEffects.body = {drop: @uri.value}
     @$.songEffects.generateRequest()
 @customElement("light9-effect-class")
 export class Light9EffectClass extends LitElement {
   static styles = [
     css`
       :host {
         display: block;
         padding: 5px;
         border: 1px solid green;
         background: #1e271e;
         margin-bottom: 3px;
+      }
       a {
         color: #7992d0;
         background: #00000859;
         min-width: 4em;
         min-height: 2em;
         display: inline-block;
         text-align: center;
         vertical-align: middle;
+      }
       resource-display {
         min-width: 12em;
         font-size: 180%;
+      }
     `,
   ];
   render() {
     if (!this.uri) {
       return html`loading...`;
+    }
     return html`
       Effect
       <resource-display .uri=${this.uri} rename></resource-display>
       <a href="../live?effect=${this.uri.value}">Edit</a>
       <iron-ajax id="songEffects" url="/effectEval/songEffects" method="POST" content-type="application/x-www-form-urlencoded"></iron-ajax>
       <span style="float:right">
         <button disabled @click=${this.onAdd}>Add to current song</button>
         <button disabled @mousedown=${this.onMomentaryPress} @mouseup=${this.onMomentaryRelease}>Add momentary</button>
       </span>
     `;
+  }
   graph!: SyncedGraph;
   uri?: NamedNode;
   onMomentaryPress: ->
     @$.songEffects.body = {drop: @uri.value, event: 'start'}
     @lastPress = @$.songEffects.generateRequest()
     @lastPress.completes.then (request) =>
       @lastMomentaryNote = request.response.note
   onAdd() {
     // this.$.songEffects.body = { drop: this.uri.value };
     // this.$.songEffects.generateRequest();
+  }
   onMomentaryRelease: ->
     return unless @lastMomentaryNote
     @$.songEffects.body = {drop: @uri.value, note: @lastMomentaryNote}
     @lastMomentaryNote = null
     @$.songEffects.generateRequest()
   onMomentaryPress() {
     // this.$.songEffects.body = { drop: this.uri.value, event: "start" };
     // this.lastPress = this.$.songEffects.generateRequest();
     // return this.lastPress.completes.then((request: { response: { note: any } }) => {
     //   return (this.lastMomentaryNote = request.response.note);
     // });
+  }
   onMomentaryRelease() {
     // if (!this.lastMomentaryNote) {
     //   return;
     // }
     // this.$.songEffects.body = { drop: this.uri.value, note: this.lastMomentaryNote };
     // this.lastMomentaryNote = null;
     // return this.$.songEffects.generateRequest();
+  }
+}
@@ \ No newline at end of file @@

light9/effect/listing/web/index.html

➞

Show inline comments

 <!doctype html>
 <html>
   <head>
-    <title>subserver effects2</title>
+    <title>effect listing</title>
     <meta charset="utf-8" />
     <link rel="stylesheet" href="/style.css">
     <script src="/lib/webcomponentsjs/webcomponents-lite.min.js"></script>
     <script src="/lib/debug/debug-build.js"></script>
     <script>
      debug.enable('*');
     </script>
     <link rel="import" href="/lib/polymer/polymer.html">
     <link rel="import" href="/lib/iron-ajax/iron-ajax.html">
     <script src="/node_modules/n3/n3-browser.js"></script>
     <script src="/lib/async/dist/async.js"></script>
     <script src="/lib/underscore/underscore-min.js"></script>
     <link rel="import" href="/rdfdb-synced-graph.html">
     <link rel="import" href="/resource-display.html">
     <link rel="stylesheet" href="./style.css">
     <script type="module" src="../effectListing/Light9EffectListing"></script>
   </head>
   <body>
     <!-- replaces effects.jade for subserver -->
     <dom-module id="light9-effect-class">
       <template>
         <style>
          :host {
              display: block;
              padding: 5px;
              border: 1px solid green;
              background: #1e271e;
              margin-bottom: 3px;
+         }
          a {
              color: #7992d0;
              background: #00000859;
              min-width: 4em;
              min-height: 2em;
              display: inline-block;
              text-align: center;
              vertical-align: middle;
+         }
          resource-display {
              min-width: 12em;
              font-size: 180%;
+         }
         </style>
         Effect
         <resource-display graph="{{graph}}" uri="{{uri}}" rename></resource-display>
         <a href="../live?effect={{uri.value}}">Edit</a>
         <iron-ajax id="songEffects"
                    url="/effectEval/songEffects"
                    method="POST"
                    content-type="application/x-www-form-urlencoded"></iron-ajax>
         <span style="float:right">
           <button on-click="onAdd">Add to current song</button>
           <button on-mousedown="onMomentaryPress"
                   on-mouseup="onMomentaryRelease">Add momentary</button>
         </span>
       </template>
     </dom-module>
     <dom-module id="light9-effects">
       <template>
         <style>
         </style>
         <h1>Effects</h1>
         <rdfdb-synced-graph graph="{{graph}}"></rdfdb-synced-graph>
         <template is="dom-repeat" items="{{effectClasses}}">
           <light9-effect-class graph="{{graph}}" uri="{{item}}"></light9-effect-class>
         </template>
       </template>
     </dom-module>
     <light9-effects></light9-effects>
     <script src="effects.js"></script>
     <light9-effect-listing></light9-effect-listing>
   </body>
 </html>

light9/effect/listing/web/vite.config.ts

➞

Show inline comments

@@ new file 100644 @@
 import { defineConfig } from "vite";
 const servicePort = 8218;
 export default defineConfig({
   base: "/effectListing/",
   root: "./light9/effect/listing/web",
   publicDir: "../web",
   server: {
     host: "0.0.0.0",
     strictPort: true,
     port: servicePort + 100,
     hmr: {
       port: servicePort + 200,
     },
   },
   clearScreen: false,
   define: {
     global: {},
   },
 });

show/dance2019/networking.n3

➞

Show inline comments

@@ @@ -20,6 +20,7 @@ sh:netHome @@
   :webServer        <http://localhost:8200/>;
   :timeline         <http://localhost:8216/>;
   :live             <http://localhost:8217/>;
   :effectListing    <http://localhost:8218/>;
   :collector        <http://localhost:8202/>;
   :collectorZmq     <http://localhost:8203/> .
@@ @@ -37,3 +38,4 @@ sh:netHome @@
 :vidref           :urlPath "vidref" .
 :timeline         :urlPath "timeline" .
 :live             :urlPath "live" .
 :effectListing    :urlPath "effectListing" .
@@ \ No newline at end of file @@

0 comments (0 inline, 0 general)