vue-dadan-sdk v2.4.0

Vue Dadan SDK

A lightweight Vue package used for checking validating, and manipulating Google Dadan Extension with Vue.

Install

npm install vue-dadan-sdk
Or
yarn add vue-dadan-sdk

Usage

In Your component import the RecordVideoButton component

<script>
import RecordVideoButton from "vue-dadan-sdk"; //Main component to import
export default {
  name: "App",
  data: function() {
    return {
      videos: [], //initial state used to get recorded or selected videos
    };
  },
  components: {
    RecordVideoButton, //our component
  },
  methods: {
    handleResponse: function({ success, data, message }) {
      if (success) {
        if (data) {
          this.videos = data;
        }
      } else {
        this.videos = [];
        console.log(message);
      }
    },
  },
};
</script>

In Your component template , add the component with props

<template>
  <RecordVideoButton
    title="Select Video"
    v-bind:showSvg="true"
    v-bind:showPreview="true"
    v-bind:copyToClipboard="true"
    buttonClass=""
    buttonStyle=""
    type="select"
    @onFailure="handleResponse"
    @onSuccess="handleResponse"
  />
</template>

the handleResponse function in Methods , is a callback function which accept object with three parameters

handleResponse : function({ success, data, message }) {
  if (success) {
    // only false when user close extension
    if (data) {
      // represnts the selected videos , or recorded video object after stop recording
      this.videos = data;
    }
  } else {
    this.videos = [];
    console.error(message); //User Closed Extension
  }
}

Record Button Props

License

MIT