videomail-client 8.3.1 → 8.3.3

package/src/js/client.js

@@ -1,210 +0,0 @@
-import deepmerge from "deepmerge";
-import readystate from "readystate";
-import inherits from "inherits";
-
-import defaultOptions from "./options";
-import Constants from "./constants";
-import Events from "./events";
-import CollectLogger from "./util/collectLogger";
-import EventEmitter from "./util/eventEmitter";
-import Container from "./wrappers/container";
-import Replay from "./wrappers/visuals/replay";
-import OptionsWrapper from "./wrappers/optionsWrapper";
-import Browser from "./util/browser";
-import Resource from "./resource";
-
-let collectLogger;
-let browser;
-
-function adjustOptions(options = {}) {
-  const localOptions = deepmerge(defaultOptions, options, {
-    arrayMerge(destination, source) {
-      return source;
-    },
-  });
-
-  collectLogger ||= new CollectLogger(localOptions);
-
-  localOptions.logger = collectLogger;
-  localOptions.debug = localOptions.logger.debug;
-
-  OptionsWrapper.addFunctions(localOptions);
-
-  return localOptions;
-}
-
-function getBrowser(localOptions) {
-  if (!browser) {
-    browser = new Browser(localOptions);
-  }
-
-  return browser;
-}
-
-const VideomailClient = function (options) {
-  const localOptions = adjustOptions(options);
-  const container = new Container(localOptions);
-  const { debug } = localOptions;
-
-  let replay;
-
-  EventEmitter.call(this, localOptions, "VideomailClient");
-
-  // expose all possible events
-  this.events = Events;
-
-  function build() {
-    let building = false;
-
-    readystate.interactive(function (previousState) {
-      debug(
-        "Client: interactive(),",
-        "previousState =",
-        `${previousState},`,
-        "!building =",
-        `${!building},`,
-        "!isBuilt() =",
-        !container.isBuilt(),
-      );
-
-      /*
-       * it can happen that it gets called twice, i.E. when an error is thrown
-       * in the middle of the build() fn
-       */
-      if (!building && !container.isBuilt()) {
-        building = true;
-        container.build();
-        building = false;
-      }
-    });
-  }
-
-  this.show = function () {
-    if (container.isBuilt()) {
-      container.show();
-    } else {
-      this.once(Events.BUILT, container.show);
-    }
-  };
-
-  /*
-   * automatically adds a <video> element inside the given parentElement and loads
-   * it with the videomail
-   */
-  this.replay = function (videomail, parentElement) {
-    function buildReplay() {
-      if (typeof parentElement === "string") {
-        parentElement = document.getElementById(parentElement);
-      }
-
-      if (!parentElement) {
-        if (!container.isBuilt()) {
-          // this will try build all over again
-          container.build();
-        }
-
-        if (!container.hasElement()) {
-          // if container.setElement() failed too, then complain
-          readystate.removeAllListeners();
-          throw new Error(
-            "Unable to replay video without a container nor parent element.",
-          );
-        }
-      } else if (container.isOutsideElementOf(parentElement)) {
-        replay = new Replay(parentElement, localOptions);
-        replay.build();
-      }
-
-      if (!replay) {
-        replay = container.getReplay();
-      }
-
-      if (!parentElement) {
-        parentElement = replay.getParentElement();
-      }
-
-      if (videomail) {
-        videomail = container.addPlayerDimensions(videomail, parentElement);
-      }
-
-      if (container.isOutsideElementOf(parentElement)) {
-        // replay element must be outside of the container
-        container.hideForm({ deep: true });
-      } else {
-        container.loadForm(videomail);
-      }
-
-      // slight delay needed to avoid HTTP 416 errors (request range unavailable)
-      setTimeout(function () {
-        replay.setVideomail(videomail);
-        container.showReplayOnly();
-      }, 10e2); // not sure, but probably can be reduced a bit
-    }
-
-    readystate.interactive(buildReplay);
-  };
-
-  this.startOver = function (params) {
-    if (replay) {
-      replay.hide();
-      replay.reset();
-    }
-
-    container.startOver(params);
-  };
-
-  this.unload = function (e) {
-    readystate.removeAllListeners();
-    container.unload(e);
-  };
-
-  this.hide = function () {
-    container.hide();
-  };
-
-  this.get = function (alias, cb) {
-    new Resource(localOptions).get(alias, function (err, videomail) {
-      if (err) {
-        cb(err);
-      } else {
-        cb(null, container.addPlayerDimensions(videomail));
-      }
-    });
-  };
-
-  this.canRecord = function () {
-    return getBrowser(localOptions).canRecord();
-  };
-
-  // return true when a video has been recorded but is not sent yet
-  this.isDirty = function () {
-    return container.isDirty();
-  };
-
-  this.isRecording = function () {
-    return container.isRecording();
-  };
-
-  this.submit = function () {
-    container.submit();
-  };
-
-  this.getLogLines = function () {
-    if (localOptions.logger && localOptions.logger.getLines) {
-      return localOptions.logger.getLines();
-    }
-  };
-
-  build();
-};
-
-inherits(VideomailClient, EventEmitter);
-
-Object.keys(Constants.public).forEach(function (name) {
-  VideomailClient[name] = Constants.public[name];
-});
-
-// just another convenient thing
-VideomailClient.events = Events;
-
-export default VideomailClient;

package/src/js/constants.js

@@ -1,11 +0,0 @@
-// constants (changing these only break down functionality, so be careful)
-
-export default {
-  SITE_NAME_LABEL: "x-videomail-site-name",
-  VERSION_LABEL: "videomailClientVersion",
-
-  public: {
-    ENC_TYPE_APP_JSON: "application/json",
-    ENC_TYPE_FORM: "application/x-www-form-urlencoded",
-  },
-};

package/src/js/events.js

@@ -1,46 +0,0 @@
-import keymirror from "keymirror";
-
-export default keymirror({
-  BUILT: null, // all dom elements are ready, are in the DOM
-  FORM_READY: null, // form is ready, available in the DOM
-  LOADING_USER_MEDIA: null, // asking for webcam access
-  USER_MEDIA_READY: null, // user media (= webcam) is ready, loaded
-  CONNECTING: null, // socket is connecting to server
-  CONNECTED: null, // socket is connected to server
-  DISCONNECTED: null, // socket to server is disconnected
-  COUNTDOWN: null, // countdown for recording has started
-  RECORDING: null, // webcam is recording
-  STOPPING: null, // recording is being stopped (= preview)
-  STOPPED: null, // recording has stopped
-  PROGRESS: null, // start sending
-  BEGIN_AUDIO_ENCODING: null, // encoding video
-  BEGIN_VIDEO_ENCODING: null, // encoding video
-  RESETTING: null, // resetting everything to go back to initial state
-  PAUSED: null, // recording is being paused
-  RESUMING: null, // recording is resumed
-  PREVIEW: null, // video preview is set
-  PREVIEW_SHOWN: null, // video preview is shown
-  REPLAY_SHOWN: null, // submitted video is shown
-  INVALID: null, // form is invalid
-  VALIDATING: null, // form is being validated
-  VALID: null, // form is valid
-  SUBMITTING: null, // form is being submitted
-  SUBMITTED: null, // form has been successfully submitted
-  ERROR: null, // an error occured
-  BLOCKING: null, // something serious, most likely an error, is shown and blocks
-  SENDING_FIRST_FRAME: null, // emitted before the first frame is being computed
-  FIRST_FRAME_SENT: null, // emitted once when fist frame has been sent to server
-  HIDE: null, // emitted when hidden
-  NOTIFYING: null, // notifies user about something (not blocking)
-  ENABLING_AUDIO: null, // about to enable audio
-  DISABLING_AUDIO: null, // about to disable audio
-  LOADED_META_DATA: null, // raised when webcam knows its dimensions
-  EVENT_EMITTED: null, // for debugging only, is emitted when an event is emitted lol,
-  GOING_BACK: null, // switch from replaying back to recording
-  STARTING_OVER: null, // starting all over again back to its inital state
-  ASKING_WEBCAM_PERMISSION: null, // when about to ask for webcam permissions
-  VISIBLE: null, // document just became visible
-  INVISIBLE: null, // document just became INvisible
-  SWITCH_FACING_MODE: null, // to switch camera on mobiles between fron and back
-  SERVER_READY: null, // Gets emitted when the ready command is sent through sockets from the server for recording
-});

package/src/js/index.js

@@ -1,15 +0,0 @@
-import standardize from "./util/standardize";
-import Client from "./client";
-
-if (!navigator) {
-  throw new Error("Navigator is missing!");
-} else {
-  // Ensures Videomail functionality is not broken on exotic browsers with shims.
-  standardize(window, navigator);
-}
-
-// Provide both ways
-
-// export { Client };
-
-export default Client;

package/src/js/options.js

@@ -1,180 +0,0 @@
-import { version } from "../../package.json";
-
-const PRODUCTION = process.env.NODE_ENV === "production";
-
-/* eslint-disable no-multi-spaces */
-/* eslint indent: ["error", 2, { "ignoreComments": true }] */
-
-export default {
-  logger: null, // define logging instance. leave null for default, console.
-  logStackSize: 30, // limits the stack size of log outputs to collect
-  verbose: !PRODUCTION, // set true to log more info
-  baseUrl: "https://videomail.io", // leave as it, permanent url to post videos
-  socketUrl: "wss://videomail.io", // leave as it, permanent url to send frames
-  siteName: "videomail-client-demo", // Required for API, use https://videomail.io/whitelist
-  cache: true, // reduces GET queries when loading videos
-  insertCss: true, // inserts predefined CSS, see examples
-  enablePause: true, // enable pause/resume button
-  enableAutoPause: true, // automatically pauses when window becomes inactive
-  enableSpace: true, // hitting space can pause recording
-  submitWithVideomail: false, // when enabled, all videomail metadata is submitted
-  // under the `videomail` key inside the form data body.
-  disableSubmit: false, // set this to true if you do not want to submit videos,
-  // but just want to record and replay these temporarily
-  enableAutoValidation: true, // automatically validates all form inputs if any exist and
-  /*
-   * does not /enable disable submit button after recording
-   * when something else seems invalid.
-   */
-  enableAutoSubmission: true, // automatically submits the form where the videomail-client
-  /*
-   * appears upon press of submit button. disable it when
-   * you want a framework to deal with the form submission itself.
-   */
-
-  enctype: "application/json", // enctype for the form submission. currently implemented are:
-  // 'application/json' and 'application/x-www-form-urlencoded'
-
-  // default CSS selectors you can alter, see examples
-  selectors: {
-    containerId: "videomail",
-    replayClass: "replay",
-    userMediaClass: "userMedia",
-    visualsClass: "visuals",
-    buttonClass: null, // can also be used as a default class for all buttons
-    buttonsClass: "buttons",
-
-    recordButtonClass: "record",
-    pauseButtonClass: "pause",
-    resumeButtonClass: "resume",
-    previewButtonClass: "preview",
-    recordAgainButtonClass: "recordAgain",
-    submitButtonClass: "submit",
-
-    subjectInputName: "subject", // the form input name for subject
-    fromInputName: "from", // the form input name for the from email
-    toInputName: "to", // the form input name for the to email
-    ccInputName: "cc", // the form input name for the cc email
-    bccInputName: "bcc", // the form input name for the bcc email
-    bodyInputName: "body", // the form input name for the message (body)
-    sendCopyInputName: "sendCopy", // the form checkbox name for sending myself a copy
-
-    keyInputName: "videomail_key",
-    parentKeyInputName: "videomail_parent_key",
-    aliasInputName: "videomail_alias",
-
-    formId: null, // automatically detects form if any
-    submitButtonId: null, // semi-automatically detects submit button in the form
-    // but if that does not work, try using the
-    submitButtonSelector: null, // submitButtonSelector
-  },
-
-  audio: {
-    enabled: false, // set to true for experimental audio recording
-    switch: false, // enables a switcher for audio recording (on/off)
-    volume: 0.2, // must be between 0 .. 1 but 0.20 is recommended to avoid
-    // distorting at the higher volume peaks
-    bufferSize: "auto", // decides how often the audio is being sampled,
-    /*
-     * can be 'auto' or an integer being a power of two like 512 or 2048
-     * the higher the less traffic, but harder to adjust with rubberband
-     * to match with the video length on server side during encoding
-     */
-  },
-
-  video: {
-    fps: 15, // depends on your connection
-    limitSeconds: 30, // recording automatically stops after that limit
-    countdown: 3, // set it to 0 or false to disable it
-
-    /*
-     * it is recommended to set one dimension only and leave the other one to auto
-     * because each webcam has a different aspect ratio
-     */
-
-    width: "auto", // or use an integer for exact pixels
-    height: "auto", // or use an integer for exact pixels
-    facingMode: "user", // can be 'user', 'environment', 'left' or 'right'. useful for mobiles.
-    facingModeButton: false,
-
-    stretch: false, // Set to true if you want the video to take the full width of the parent container
-  },
-
-  image: {
-    quality: 0.42,
-    types: ["webp", "jpeg"], // recommended settings to make most of all browsers
-  },
-
-  // alter these text for internationalisation
-  text: {
-    pausedHeader: "Paused",
-    pausedHint: null,
-    sending: "Teleporting",
-    encoding: "Encoding",
-    limitReached: "Limit reached",
-    audioOff: "Audio off",
-    audioOn: "Audio on",
-    buttons: {
-      record: "Record video",
-      recordAgain: "Record again",
-      resume: "Resume",
-      pause: "Pause",
-      preview: "Preview",
-    },
-  },
-
-  notifier: {
-    entertain: false, // when true, user is entertained while waiting, see examples
-    entertainClass: "bg",
-    entertainLimit: 6,
-    entertainInterval: 9000,
-  },
-
-  timeouts: {
-    userMedia: 20e3, // in milliseconds, increase if you want user give more time to enable webcam
-    connection: 1e4, // in seconds, increase if api is slow
-    pingInterval: 35e3, // in milliseconds, keeps web stream (connection) alive when pausing
-  },
-
-  loadUserMediaOnRecord: false, // when true, user media is loaded only when record button is pressed
-
-  callbacks: {
-    /*
-     * a custom callback to tweak form data before posting to server
-     * this is for advanced use only and shouldn't be used if possible
-     */
-    adjustFormDataBeforePosting: null,
-  },
-
-  defaults: {
-    from: null, // define default FROM email address
-    to: null, // define default TO email address
-    cc: null, // define default CC email address
-    bcc: null, // define default BCC email address
-    subject: null, // define default subject line
-    body: null, // define default body content
-  },
-
-  /*
-   * a special flag to indicate that everything to be initialised
-   * serves only for playing existing videomails with the replay function
-   */
-  playerOnly: false,
-
-  // show errors inside the container?
-  displayErrors: true,
-
-  // true = all form inputs get disabled and disappear when browser can't record
-  adjustFormOnBrowserError: false,
-
-  /*
-   * when true, any errors will be sent to the videomail server for analysis
-   * ps: can be a function too returning a boolean
-   */
-  reportErrors: false,
-
-  // just for testing purposes to simulate browser agent handling
-  fakeUaString: null,
-
-  version,
-};

package/src/js/resource.js

@@ -1,206 +0,0 @@
-import superagent from "superagent";
-
-import Constants from "./constants";
-
-const CACHE_KEY = "alias";
-const timezoneId = Intl.DateTimeFormat().resolvedOptions().timeZone;
-
-export default function (options) {
-  const cache = {};
-
-  function applyDefaultValue(videomail, name) {
-    if (options.defaults[name] && !videomail[name]) {
-      videomail[name] = options.defaults[name];
-    }
-
-    return videomail;
-  }
-
-  function applyDefaultValues(videomail) {
-    if (options.defaults) {
-      videomail = applyDefaultValue(videomail, "from");
-      videomail = applyDefaultValue(videomail, "to");
-      videomail = applyDefaultValue(videomail, "cc");
-      videomail = applyDefaultValue(videomail, "bcc");
-      videomail = applyDefaultValue(videomail, "subject");
-      videomail = applyDefaultValue(videomail, "body");
-    }
-
-    return videomail;
-  }
-
-  function packError(err, res) {
-    if (res && res.body && res.body.error) {
-      // use the server generated text instead of the superagent's default text
-      err = res.body.error;
-
-      if (!err.message && res.text) {
-        err.message = res.text;
-      }
-    }
-
-    return err;
-  }
-
-  function fetch(alias, cb) {
-    superagent
-      .get(`/videomail/${alias}/snapshot`)
-      .set("Accept", "application/json")
-      .set("Timezone-Id", timezoneId)
-      .set(Constants.SITE_NAME_LABEL, options.siteName)
-      .timeout(options.timeouts.connection)
-      .end(function (err, res) {
-        err = packError(err, res);
-
-        if (err) {
-          cb(err);
-        } else {
-          const videomail = res.body ? res.body : null;
-
-          if (options.cache) {
-            cache[CACHE_KEY] = videomail;
-          }
-
-          cb(null, videomail);
-        }
-      });
-  }
-
-  function write(method, videomail, identifier, cb) {
-    if (!cb) {
-      cb = identifier;
-      identifier = null;
-    }
-
-    const queryParams = {};
-
-    let url = `${options.baseUrl}/videomail/`;
-
-    if (identifier) {
-      url += identifier;
-    }
-
-    const request = superagent(method, url);
-
-    queryParams[Constants.SITE_NAME_LABEL] = options.siteName;
-
-    request
-      .query(queryParams)
-      .set("Timezone-Id", timezoneId)
-      .send(videomail)
-      .timeout(options.timeout)
-      .end(function (err, res) {
-        err = packError(err, res);
-
-        if (err) {
-          cb(err);
-        } else {
-          const returnedVideomail =
-            res.body && res.body.videomail ? res.body.videomail : null;
-
-          if (options.cache && videomail[CACHE_KEY]) {
-            cache[videomail[CACHE_KEY]] = returnedVideomail;
-          }
-
-          cb(null, returnedVideomail, res.body);
-        }
-      });
-  }
-
-  this.get = function (alias, cb) {
-    if (options.cache && cache[alias]) {
-      // keep all callbacks async
-      setTimeout(() => {
-        cb(null, cache[alias]);
-      }, 0);
-    } else {
-      fetch(alias, cb);
-    }
-  };
-
-  this.reportError = function (err, cb) {
-    const queryParams = {};
-    const url = `${options.baseUrl}/client-error/`;
-    const request = superagent("post", url);
-
-    queryParams[Constants.SITE_NAME_LABEL] = options.siteName;
-
-    request
-      .query(queryParams)
-      .send(err)
-      .timeout(options.timeout)
-      .end(function (err, res) {
-        err = packError(err, res);
-        if (err) {
-          cb && cb(err);
-        } else {
-          cb && cb();
-        }
-      });
-  };
-
-  this.post = function (videomail, cb) {
-    videomail = applyDefaultValues(videomail);
-
-    /*
-     * always good to know the version of the client
-     * the videomail was submitted with
-     */
-    videomail[Constants.VERSION_LABEL] = options.version;
-
-    if (options.callbacks.adjustFormDataBeforePosting) {
-      options.callbacks.adjustFormDataBeforePosting(
-        videomail,
-        function (err, adjustedVideomail) {
-          if (err) {
-            cb(err);
-          } else {
-            write("post", adjustedVideomail, cb);
-          }
-        },
-      );
-    } else {
-      write("post", videomail, cb);
-    }
-  };
-
-  this.put = function (videomail, cb) {
-    write("put", videomail, videomail.key, cb);
-  };
-
-  this.form = function (formData, url, cb) {
-    let formType;
-
-    switch (options.enctype) {
-      case Constants.public.ENC_TYPE_APP_JSON:
-        formType = "json";
-        break;
-      case Constants.public.ENC_TYPE_FORM:
-        formType = "form";
-        break;
-      default:
-        // keep all callbacks async
-        setTimeout(() => {
-          cb(new Error(`Invalid enctype given: ${options.enctype}`));
-        }, 0);
-    }
-
-    if (formType) {
-      superagent
-        .post(url)
-        .type(formType)
-        .set("Timezone-Id", timezoneId)
-        .send(formData)
-        .timeout(options.timeout)
-        .end(function (err, res) {
-          err = packError(err, res);
-
-          if (err) {
-            cb(err);
-          } else {
-            cb(null, res);
-          }
-        });
-    }
-  };
-}