vue-dadan-sdk

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

Parameter	Type	Description
type	string	Required. either record or select , else will show error
title	string	Optional. button title
buttonClass	string	Optional. the default class , or your custom class
buttonStyle	string	Optional. the default style , or your custom style as string
showSvg	boolean	Optional. to show Svg icon in button
showPreview	boolean	Optional. to show preview dialog of recorded video
copyToClipboard	boolean	Optional. to notify user that video shared url was copied to clipboard as toast message

License

MIT