@g-s-labs/video-editor-vue2

Video Editor Vue2

Vue2 (Nuxt2 & Vuetify2) component used to cut and crop videos

Installation

Make sure your project is using Vue2, Nuxt2 and Vuetify2.

npm install @g-s-labs/video-editor-vue2

Or, if you want to install it from github:

npm install g-s-labs/video-editor-vue2
    OR
npm install git+ssh://github.com/g-s-labs/video-editor-vue2.git

Usage

<template>
  <div>
    <video-editor
      :loading="loading"
      @save-video="saveVideo"
    />
  </div>
</template>

<script>
import VideoEditor from 'video-editor-vue2/components/VideoEditor.vue'

export default {
  components: {
    VideoEditor
  },

  data () {
    return {
      loading: false
    }
  },

  methods: {
    saveVideo (formData) {
      // The formData object has these properties:
      // - file: the video file (binary)
      // - start: the start time of the video (seconds)
      // - end: the end time of the video (seconds)
      // - audio: if the audio should be included (boolean)
      // - cropX: the x position of the crop (percentage)
      // - cropY: the y position of the crop (percentage)
      // - cropWidth: the width of the crop (percentage)
      // - cropHeight: the height of the crop  (percentage)
      // - rotation: can only be 0, 90, 180 or 270 (degrees)
    }
  }
}
</script>