@cloudflare/realtimekit-ui 0.0.0 → 1.0.0-staging.11

package/dist/esm/full-screen-1f58c594.js

@@ -0,0 +1,50 @@
+const requestFullScreen = (el) => {
+    if (el == null)
+        return;
+    if (el.requestFullscreen != null) {
+        el.requestFullscreen();
+    }
+    else if (el.mozRequestFullScreen != null) {
+        /* Firefox */
+        el.mozRequestFullScreen();
+    }
+    else if (el.webkitRequestFullscreen != null) {
+        /* Chrome, Safari & Opera */
+        el.webkitRequestFullscreen();
+    }
+    else if (el.msRequestFullscreen != null) {
+        /* IE/Edge */
+        el.msRequestFullscreen();
+    }
+};
+const exitFullSreen = () => {
+    if (document.exitFullscreen != null) {
+        document.exitFullscreen();
+    }
+    else if (document.mozExitFullScreen != null) {
+        /* Firefox */
+        document.mozExitFullScreen();
+    }
+    else if (document.webkitExitFullscreen != null) {
+        /* Chrome, Safari & Opera */
+        document.webkitExitFullscreen();
+    }
+    else if (document.msExitFullscreen != null) {
+        /* IE/Edge */
+        document.msExitFullscreen();
+    }
+};
+const isFullScreenEnabled = () => {
+    return document.fullscreenElement != null || document.webkitCurrentFullScreenElement != null;
+};
+const isFullScreenSupported = () => {
+    if (typeof document !== 'undefined') {
+        return (document.fullscreenEnabled ||
+            document.mozFullscreenEnabled ||
+            document.webkitFullscreenEnabled ||
+            document.msFullscreenEnabled);
+    }
+    return false;
+};
+
+export { isFullScreenSupported as a, exitFullSreen as e, isFullScreenEnabled as i, requestFullScreen as r };

package/dist/esm/grid-a3ca5a3e.js

@@ -0,0 +1,96 @@
+function roundDown(num, places) {
+    const factor = Math.pow(10, places);
+    return Math.floor(num * factor) / factor;
+}
+function useGrid({ dimensions, count, aspectRatio, gap }) {
+    const { width, height, rows, cols } = useGridItemDimensions({
+        dimensions,
+        count,
+        aspectRatio,
+        gap,
+    });
+    const getPosition = useGridPositioning({
+        parentDimensions: dimensions,
+        dimensions: { width, height },
+        rows,
+        cols,
+        count,
+        gap,
+    });
+    return { width, height, getPosition };
+}
+function useGridItemDimensions({ count, dimensions, aspectRatio, gap, }) {
+    let { width: W, height: H } = dimensions;
+    if (W === 0 || H === 0)
+        return { width: 0, height: 0, rows: 1, cols: 1 };
+    W -= gap * 2;
+    H -= gap * 2;
+    const s = gap, N = count;
+    const r = getAspectRatio(aspectRatio);
+    let w = 0, h = 0;
+    let a = 1, b = 1;
+    const widths = [];
+    for (let n = 1; n <= N; n++) {
+        widths.push((W - s * (n - 1)) / n);
+        widths.push((H - s * (n - 1)) / (n * r));
+    }
+    // sort in descending order, largest first
+    widths.sort((a, b) => b - a);
+    for (const width of widths) {
+        // We fix the precision to 4 decimal places to prevent
+        // floating point overflow errors. Anyway, accuracy above
+        // 4 decimal places does not really matter.
+        w = roundDown(width, 4);
+        h = roundDown(w * r, 4);
+        a = Math.floor((W + s) / (w + s));
+        b = Math.floor((H + s) / (h + s));
+        if (a * b >= N) {
+            // recalculate rows, as row calculated above can be inaccurate
+            b = Math.ceil(N / a);
+            break;
+        }
+    }
+    return { width: w, height: h, rows: b, cols: a };
+}
+function useGridPositioning({ parentDimensions, dimensions, rows, cols, count, gap, }) {
+    const { width: W, height: H } = parentDimensions;
+    const { width: w, height: h } = dimensions;
+    const firstTop = (H - (h * rows + (rows - 1) * gap)) / 2;
+    let firstLeft = (W - (w * cols + (cols - 1) * gap)) / 2;
+    const topAdd = h + gap;
+    const leftAdd = w + gap;
+    let col = 0, row = 0;
+    const incompleteRowCols = count % cols;
+    function getPosition(index) {
+        const remaining = count - index;
+        if (remaining === incompleteRowCols) {
+            // in last row with incomplete columns, recalculate firstLeft to make it centered
+            firstLeft = (W - (w * remaining + (remaining - 1) * gap)) / 2;
+        }
+        const top = firstTop + row * topAdd;
+        const left = firstLeft + col * leftAdd;
+        col++;
+        if ((index + 1) % cols === 0) {
+            // if a row has been traversed completely, increment row, reset col
+            row++;
+            col = 0;
+        }
+        return { top, left };
+    }
+    return getPosition;
+}
+/**
+ * Parses the Aspect Ratio value
+ * @param ratio The aspect ratio in the format of `16:9` where `width:height`
+ * @returns The parsed value of aspect ratio
+ */
+const getAspectRatio = (ratio) => {
+    const [width, height] = ratio.split(':');
+    return Number.parseInt(height) / Number.parseInt(width);
+};
+const defaultGridSize = {
+    spotlight: 'sm',
+    mixed: 'sm',
+};
+
+export { defaultGridSize as d, useGrid as u };

package/dist/esm/hark-6327d91e.js

@@ -0,0 +1,299 @@
+/*
+WildEmitter.js is a slim little event emitter by @henrikjoreteg largely based
+on @visionmedia's Emitter from UI Kit.
+
+Why? I wanted it standalone.
+
+I also wanted support for wildcard emitters like this:
+
+emitter.on('*', function (eventName, other, event, payloads) {
+
+});
+
+emitter.on('somenamespace*', function (eventName, payloads) {
+
+});
+
+Please note that callbacks triggered by wildcard registered events also get
+the event name as the first argument.
+*/
+
+var wildemitter = WildEmitter$1;
+
+function WildEmitter$1() { }
+
+WildEmitter$1.mixin = function (constructor) {
+    var prototype = constructor.prototype || constructor;
+
+    prototype.isWildEmitter= true;
+
+    // Listen on the given `event` with `fn`. Store a group name if present.
+    prototype.on = function (event, groupName, fn) {
+        this.callbacks = this.callbacks || {};
+        var hasGroup = (arguments.length === 3),
+            group = hasGroup ? arguments[1] : undefined,
+            func = hasGroup ? arguments[2] : arguments[1];
+        func._groupName = group;
+        (this.callbacks[event] = this.callbacks[event] || []).push(func);
+        return this;
+    };
+
+    // Adds an `event` listener that will be invoked a single
+    // time then automatically removed.
+    prototype.once = function (event, groupName, fn) {
+        var self = this,
+            hasGroup = (arguments.length === 3),
+            group = hasGroup ? arguments[1] : undefined,
+            func = hasGroup ? arguments[2] : arguments[1];
+        function on() {
+            self.off(event, on);
+            func.apply(this, arguments);
+        }
+        this.on(event, group, on);
+        return this;
+    };
+
+    // Unbinds an entire group
+    prototype.releaseGroup = function (groupName) {
+        this.callbacks = this.callbacks || {};
+        var item, i, len, handlers;
+        for (item in this.callbacks) {
+            handlers = this.callbacks[item];
+            for (i = 0, len = handlers.length; i < len; i++) {
+                if (handlers[i]._groupName === groupName) {
+                    //console.log('removing');
+                    // remove it and shorten the array we're looping through
+                    handlers.splice(i, 1);
+                    i--;
+                    len--;
+                }
+            }
+        }
+        return this;
+    };
+
+    // Remove the given callback for `event` or all
+    // registered callbacks.
+    prototype.off = function (event, fn) {
+        this.callbacks = this.callbacks || {};
+        var callbacks = this.callbacks[event],
+            i;
+
+        if (!callbacks) return this;
+
+        // remove all handlers
+        if (arguments.length === 1) {
+            delete this.callbacks[event];
+            return this;
+        }
+
+        // remove specific handler
+        i = callbacks.indexOf(fn);
+        if (i !== -1) {
+            callbacks.splice(i, 1);
+            if (callbacks.length === 0) {
+                delete this.callbacks[event];
+            }
+        }
+        return this;
+    };
+
+    /// Emit `event` with the given args.
+    // also calls any `*` handlers
+    prototype.emit = function (event) {
+        this.callbacks = this.callbacks || {};
+        var args = [].slice.call(arguments, 1),
+            callbacks = this.callbacks[event],
+            specialCallbacks = this.getWildcardCallbacks(event),
+            i,
+            len,
+            listeners;
+
+        if (callbacks) {
+            listeners = callbacks.slice();
+            for (i = 0, len = listeners.length; i < len; ++i) {
+                if (!listeners[i]) {
+                    break;
+                }
+                listeners[i].apply(this, args);
+            }
+        }
+
+        if (specialCallbacks) {
+            len = specialCallbacks.length;
+            listeners = specialCallbacks.slice();
+            for (i = 0, len = listeners.length; i < len; ++i) {
+                if (!listeners[i]) {
+                    break;
+                }
+                listeners[i].apply(this, [event].concat(args));
+            }
+        }
+
+        return this;
+    };
+
+    // Helper for for finding special wildcard event handlers that match the event
+    prototype.getWildcardCallbacks = function (eventName) {
+        this.callbacks = this.callbacks || {};
+        var item,
+            split,
+            result = [];
+
+        for (item in this.callbacks) {
+            split = item.split('*');
+            if (item === '*' || (split.length === 2 && eventName.slice(0, split[0].length) === split[0])) {
+                result = result.concat(this.callbacks[item]);
+            }
+        }
+        return result;
+    };
+
+};
+
+WildEmitter$1.mixin(WildEmitter$1);
+
+var WildEmitter = wildemitter;
+
+function getMaxVolume (analyser, fftBins) {
+  var maxVolume = -Infinity;
+  analyser.getFloatFrequencyData(fftBins);
+
+  for(var i=4, ii=fftBins.length; i < ii; i++) {
+    if (fftBins[i] > maxVolume && fftBins[i] < 0) {
+      maxVolume = fftBins[i];
+    }
+  }
+  return maxVolume;
+}
+
+
+var audioContextType;
+if (typeof window !== 'undefined') {
+  audioContextType = window.AudioContext || window.webkitAudioContext;
+}
+// use a single audio context due to hardware limits
+var audioContext = null;
+var hark = function(stream, options) {
+  var harker = new WildEmitter();
+
+  // make it not break in non-supported browsers
+  if (!audioContextType) return harker;
+
+  //Config
+  var options = options || {},
+      smoothing = (options.smoothing || 0.1),
+      interval = (options.interval || 50),
+      threshold = options.threshold,
+      play = options.play,
+      history = options.history || 10,
+      running = true;
+
+  // Ensure that just a single AudioContext is internally created
+  audioContext = options.audioContext || audioContext || new audioContextType();
+
+  var sourceNode, fftBins, analyser;
+
+  analyser = audioContext.createAnalyser();
+  analyser.fftSize = 512;
+  analyser.smoothingTimeConstant = smoothing;
+  fftBins = new Float32Array(analyser.frequencyBinCount);
+
+  if (stream.jquery) stream = stream[0];
+  if (stream instanceof HTMLAudioElement || stream instanceof HTMLVideoElement) {
+    //Audio Tag
+    sourceNode = audioContext.createMediaElementSource(stream);
+    if (typeof play === 'undefined') play = true;
+    threshold = threshold || -50;
+  } else {
+    //WebRTC Stream
+    sourceNode = audioContext.createMediaStreamSource(stream);
+    threshold = threshold || -50;
+  }
+
+  sourceNode.connect(analyser);
+  if (play) analyser.connect(audioContext.destination);
+
+  harker.speaking = false;
+
+  harker.suspend = function() {
+    return audioContext.suspend();
+  };
+  harker.resume = function() {
+    return audioContext.resume();
+  };
+  Object.defineProperty(harker, 'state', { get: function() {
+    return audioContext.state;
+  }});
+  audioContext.onstatechange = function() {
+    harker.emit('state_change', audioContext.state);
+  };
+
+  harker.setThreshold = function(t) {
+    threshold = t;
+  };
+
+  harker.setInterval = function(i) {
+    interval = i;
+  };
+
+  harker.stop = function() {
+    running = false;
+    harker.emit('volume_change', -100, threshold);
+    if (harker.speaking) {
+      harker.speaking = false;
+      harker.emit('stopped_speaking');
+    }
+    analyser.disconnect();
+    sourceNode.disconnect();
+  };
+  harker.speakingHistory = [];
+  for (var i = 0; i < history; i++) {
+      harker.speakingHistory.push(0);
+  }
+
+  // Poll the analyser node to determine if speaking
+  // and emit events if changed
+  var looper = function() {
+    setTimeout(function() {
+
+      //check if stop has been called
+      if(!running) {
+        return;
+      }
+
+      var currentVolume = getMaxVolume(analyser, fftBins);
+
+      harker.emit('volume_change', currentVolume, threshold);
+
+      var history = 0;
+      if (currentVolume > threshold && !harker.speaking) {
+        // trigger quickly, short history
+        for (var i = harker.speakingHistory.length - 3; i < harker.speakingHistory.length; i++) {
+          history += harker.speakingHistory[i];
+        }
+        if (history >= 2) {
+          harker.speaking = true;
+          harker.emit('speaking');
+        }
+      } else if (currentVolume < threshold && harker.speaking) {
+        for (var i = 0; i < harker.speakingHistory.length; i++) {
+          history += harker.speakingHistory[i];
+        }
+        if (history == 0) {
+          harker.speaking = false;
+          harker.emit('stopped_speaking');
+        }
+      }
+      harker.speakingHistory.shift();
+      harker.speakingHistory.push(0 + (currentVolume > threshold));
+
+      looper();
+    }, interval);
+  };
+  looper();
+
+  return harker;
+};
+
+export { hark as h };

package/dist/esm/index-6aaa85ca.js

@@ -0,0 +1,24 @@
+import { a as getElement } from './index-c1fb98bb.js';
+import { m as appendElement, n as removeElement, u as uiStore } from './ui-store-b453cdf2.js';
+
+function SyncWithStore() {
+    return function (proto, propName) {
+        const { connectedCallback, disconnectedCallback } = proto;
+        proto.connectedCallback = function () {
+            const host = getElement(this);
+            const value = host[propName];
+            if (!value) {
+                const storeValue = uiStore.state[propName];
+                host[propName] = storeValue;
+                appendElement(propName, host);
+            }
+            return connectedCallback === null || connectedCallback === void 0 ? void 0 : connectedCallback.call(this);
+        };
+        proto.disconnectedCallback = function () {
+            removeElement(propName, getElement(this));
+            return disconnectedCallback === null || disconnectedCallback === void 0 ? void 0 : disconnectedCallback.call(this);
+        };
+    };
+}
+
+export { SyncWithStore as S };