janusweb 1.7.1 → 1.7.3

package/media/assets/webui/apps/comms/voip.js

@@ -1387,7 +1387,9 @@ elation.elements.define('janus-voip-client-callbutton', class extends elation.el
     this.detached = true;
     this.button = elation.elements.create('ui-button', {
       append: this,
-      label: '📞',
+      // buttonlabel lets a host (e.g. the invite menu) relabel the action;
+      // set as an attribute so it survives the deferred create() lifecycle.
+      label: this.getAttribute('buttonlabel') || '📞',
     });
     this.button.addEventListener('click', ev => this.handleClick(ev));
 super.create();
@@ -1416,6 +1418,114 @@ super.create();
     }
   }
 });
+/**
+ * The invite hub in the comms bar. A popup button that gathers the ways to
+ * bring people together: invite people already here into voice, copy a link
+ * that pulls in someone who isn't here, or schedule a meetup at a set time.
+ * Replaces the bare 📞 call button, which it reuses internally for the voice
+ * path so the existing "ring" chat-signaling flow is unchanged.
+ */
+elation.elements.define('janus-comms-invite', class extends elation.elements.ui.popupbutton {
+  create() {
+    this.label = '➕ Invite';
+    this.title = 'Invite people / meet up';
+    super.create();
+    this.popupcontent = this.buildMenu();
+  }
+  createPopup() {
+    super.createPopup();
+    // Class hook for the opaque, high-z popup styling in comms.css. Without an
+    // opaque backdrop the popup (rendered at document root) lets the scene and
+    // the chat transcript bleed through. Repositioning as the async rows lay
+    // out is handled by ui.popupbutton's ResizeObserver.
+    if (this.popup) this.popup.classList.add('janus-comms-invite-popup');
+  }
+  buildMenu() {
+    let menu = elation.elements.create('ui-content');
+    menu.classList.add('janus-comms-invite-menu');
+
+    // Invite people already in the room into voice chat. Reuses the existing
+    // call button element, so the mic picker + "ring ring" chat signaling and
+    // the accept/decline card all keep working exactly as before.
+    this.callbutton = elation.elements.create('janus-voip-client-callbutton', {
+      append: menu,
+      buttonlabel: '🎙 Invite to voice',
+    });
+
+    // Copy a link that brings someone who isn't here into this room.
+    this.copybutton = elation.elements.create('ui-button', { append: menu, label: '🔗 Copy room link' });
+    this.copybutton.addEventListener('click', (ev) => this.handleCopyLink(ev));
+
+    // "Schedule a meetup" is hidden for now: without a backend that persists the
+    // invite and emails/notifies the invitee it can't actually deliver anything.
+    // The seam (handleSchedule + buildRoomLink(time) + comms-schedule-request)
+    // stays below so it can be re-enabled once that backend lands.
+    // this.appendSchedule(menu);
+
+    return menu;
+  }
+  appendSchedule(menu) {
+    let schedule = document.createElement('div');
+    schedule.className = 'janus-comms-schedule';
+    let label = document.createElement('label');
+    label.innerHTML = '📅 Schedule a meetup';
+    this.timeinput = document.createElement('input');
+    this.timeinput.type = 'datetime-local';
+    this.schedulebutton = elation.elements.create('ui-button', { label: 'Copy invite link' });
+    this.schedulebutton.addEventListener('click', (ev) => this.handleSchedule(ev));
+    schedule.appendChild(label);
+    schedule.appendChild(this.timeinput);
+    schedule.appendChild(this.schedulebutton);
+    menu.appendChild(schedule);
+  }
+  buildRoomLink(opts) {
+    opts = opts || {};
+    let base = (typeof janus != 'undefined' && janus.currentroom && janus.currentroom.url)
+             || location.href.replace(/#.*/, '');
+    let url = new URL(base, location.href);
+    if (opts.time) url.searchParams.set('t', Math.floor(opts.time / 1000));
+    // Position anchoring is object-based: a #<js_id> fragment teleports the
+    // arriving player to a named room object. Only meaningful when one exists.
+    if (opts.anchor) url.hash = opts.anchor;
+    return url.toString();
+  }
+  copyToClipboard(text) {
+    if (navigator.clipboard && navigator.clipboard.writeText) {
+      return navigator.clipboard.writeText(text).catch(() => this.copyFallback(text));
+    }
+    this.copyFallback(text);
+    return Promise.resolve();
+  }
+  copyFallback(text) {
+    let ta = document.createElement('textarea');
+    ta.value = text;
+    ta.style.position = 'fixed';
+    ta.style.opacity = '0';
+    document.body.appendChild(ta);
+    ta.select();
+    try { document.execCommand('copy'); } catch (e) {}
+    document.body.removeChild(ta);
+  }
+  flashLabel(button, text, revert) {
+    button.setLabel(text);
+    setTimeout(() => button.setLabel(revert), 1500);
+  }
+  handleCopyLink(ev) {
+    let link = this.buildRoomLink();
+    this.copyToClipboard(link);
+    this.flashLabel(this.copybutton, '✓ Link copied', '🔗 Copy room link');
+  }
+  handleSchedule(ev) {
+    let val = this.timeinput.value;
+    let time = val ? new Date(val).getTime() : null;
+    let link = this.buildRoomLink({ time: time });
+    this.copyToClipboard(link);
+    this.flashLabel(this.schedulebutton, '✓ Invite copied', 'Copy invite link');
+    document.dispatchEvent(new CustomEvent('comms-schedule-request', {
+      detail: { time: time, url: link },
+    }));
+  }
+});
 elation.elements.define('janus-voip-client-incomingcall', class extends elation.elements.base {
   create() {
     this.actions = elation.elements.create('ui-flexpanel', { append: this });

package/media/assets/webui/apps/editor/editor-properties.js

@@ -75,10 +75,41 @@ elation.elements.define('janus-ui-editor-property', class extends elation.elemen
     });
 
     if (this.label) {
-      elation.elements.create('ui-text', {
+      let labelobj = elation.elements.create('ui-text', {
         text: this.label,
         append: this
       });
+      // Clicking the label activates the editor's control, like a standard <label>.
+      elation.events.add(labelobj, 'click', (ev) => this.activateControl(ev));
+    }
+  }
+  mousedown(ev) {
+    // Always (re)fire selection on click, even when this property is already the
+    // selected one — the base ui.item suppresses re-selection, which made
+    // re-clicking a property (to re-assert its edit mode) a no-op.
+    if (this.selectable) {
+      this.select(ev);
+      ev.stopPropagation();
+    }
+  }
+  activateControl(ev) {
+    // Mirror a native <label>: clicking the label activates the editor's control
+    // (the first non-label child; the label is a ui-text we create). Prefer the
+    // element's own focus() — ui-input.focus() focuses its field, ui-toggle.focus()
+    // flips it — and fall back to forwarding the click for controls without focus().
+    let control = null;
+    for (let i = 0; i < this.children.length; i++) {
+      let child = this.children[i];
+      if (child.tagName && child.tagName.toLowerCase() != 'ui-text') { control = child; break; }
+    }
+    if (!control) return;
+    if (typeof control.focus == 'function') {
+      control.focus();
+    } else {
+      control.dispatchEvent(new MouseEvent(ev.type, {
+        bubbles: true, cancelable: true, view: window,
+        clientX: ev.clientX, clientY: ev.clientY, button: ev.button
+      }));
     }
   }
   updateValue(value) {
@@ -381,10 +412,11 @@ elation.elements.define('janus-ui-editor-property-boolean', class extends elatio
       value: { type: 'boolean' },
     });
     if (this.label) {
-      elation.elements.create('ui-text', {
+      let labelobj = elation.elements.create('ui-text', {
         text: this.label,
         append: this
       });
+      elation.events.add(labelobj, 'click', (ev) => this.activateControl(ev));
     }
     this.elements = elation.elements.fromString(`
       <ui-toggle name="toggle"></ui-toggle>

package/media/assets/webui/apps/editor/editor.css

@@ -169,3 +169,30 @@ janus-ui-editor-source ui-button[name="refresh"] {
   top: 0;
   right: 0;
 }
+
+/* Scene-tree type icons (Blender-style): ui.treeviewitem renders an
+   <span class="st-typeicon st-type-<tag>"> in each row's label (via attrs.icon),
+   drawn from the engine object-icon sprite (20px cells). All primitives share the
+   'object' icon; unknown tags (custom elements) fall back to the generic icon.
+   Negative top/bottom margins keep the 20px glyph from inflating the row, and
+   vertical-align centres it with the label text. */
+.st-typeicon {
+  display: inline-block;
+  width: 21px;
+  height: 21px;
+  margin: -5px 2px -5px 0;
+  vertical-align: middle;
+  background-image: url(./objecticons-small.png);
+  background-repeat: no-repeat;
+  background-position: -21px -40px;   /* default / custom element: generic geometry */
+  opacity: .85;
+}
+.st-type-object   { background-position: -21px  -20px; }  /* cube */
+.st-type-light    { background-position: -251px -20px; }  /* point light */
+.st-type-text,
+.st-type-paragraph { background-position: -168px -40px; } /* text */
+.st-type-image    { background-position: -105px -20px; }  /* grid/plane */
+.st-type-video    { background-position: -126px -40px; }  /* camera */
+.st-type-sound    { background-position: -210px -40px; }  /* speaker */
+.st-type-link     { background-position: -189px -60px; }  /* portal */
+.st-type-particle { background-position: -84px  -40px; }  /* particles */