2019-03-08 22:17:59 +00:00
|
|
|
import Vue from 'vue'
|
|
|
|
import Vuex from 'vuex'
|
|
|
|
|
2019-03-11 16:46:21 +00:00
|
|
|
import { capture } from '/services/capture.js'
|
|
|
|
import { encode } from '/services/encode.js'
|
2019-03-10 03:13:25 +00:00
|
|
|
|
2019-03-08 22:17:59 +00:00
|
|
|
Vue.use(Vuex)
|
|
|
|
|
|
|
|
export default new Vuex.Store({
|
2019-03-12 09:34:41 +00:00
|
|
|
strict: process.env.NODE_ENV !== 'production',
|
2019-03-08 22:17:59 +00:00
|
|
|
state: {
|
2019-03-12 16:41:30 +00:00
|
|
|
welcomed: false,
|
2019-03-10 01:28:07 +00:00
|
|
|
mediaStream: null,
|
2019-03-09 21:54:07 +00:00
|
|
|
timer: {
|
|
|
|
selected: 2,
|
|
|
|
list: [2, 3, 5]
|
2019-03-09 23:14:30 +00:00
|
|
|
},
|
|
|
|
capturing: {
|
|
|
|
status: false,
|
2019-03-12 16:41:30 +00:00
|
|
|
shouldFaceUser: true,
|
2019-03-09 23:14:30 +00:00
|
|
|
state: 0
|
2019-03-09 23:28:47 +00:00
|
|
|
},
|
|
|
|
encoding: {
|
|
|
|
status: false
|
2019-03-09 23:55:37 +00:00
|
|
|
},
|
|
|
|
downloading: {
|
2019-03-10 03:49:55 +00:00
|
|
|
status: false,
|
2019-03-10 22:35:26 +00:00
|
|
|
objectUrl: null,
|
2019-03-10 04:58:19 +00:00
|
|
|
timestamp: null
|
2019-03-09 21:54:07 +00:00
|
|
|
}
|
2019-03-08 22:17:59 +00:00
|
|
|
},
|
|
|
|
mutations: {
|
2019-03-12 16:41:30 +00:00
|
|
|
welcome (state) {
|
|
|
|
state.welcomed = true;
|
|
|
|
},
|
|
|
|
startCamera (state, mediaStream) {
|
|
|
|
state.mediaStream = mediaStream
|
|
|
|
},
|
|
|
|
stopCamera (state) {
|
|
|
|
if (state.mediaStream) {
|
|
|
|
state.mediaStream.getTracks().forEach(track => track.stop())
|
2019-03-10 01:28:07 +00:00
|
|
|
}
|
2019-03-12 16:41:30 +00:00
|
|
|
},
|
|
|
|
inverseFacingMode (store) {
|
|
|
|
store.capturing.shouldFaceUser = !store.capturing.shouldFaceUser
|
2019-03-09 21:54:07 +00:00
|
|
|
},
|
|
|
|
updateTimer (store, time) {
|
|
|
|
store.timer.selected = time
|
2019-03-09 23:14:30 +00:00
|
|
|
},
|
|
|
|
startCapture (store) {
|
|
|
|
store.capturing.status = true
|
|
|
|
},
|
|
|
|
stopCapture (store) {
|
|
|
|
store.capturing.status = false
|
|
|
|
},
|
|
|
|
updateCaptureState (store, percent) {
|
|
|
|
store.capturing.state = percent
|
2019-03-09 23:28:47 +00:00
|
|
|
},
|
|
|
|
startEncoding (store) {
|
|
|
|
store.encoding.status = true
|
|
|
|
},
|
|
|
|
stopEncoding (store) {
|
|
|
|
store.encoding.status = false
|
2019-03-09 23:55:37 +00:00
|
|
|
},
|
2019-03-10 22:35:26 +00:00
|
|
|
startDownloading (store, objectUrl) {
|
2019-03-09 23:55:37 +00:00
|
|
|
store.downloading.status = true
|
2019-03-10 22:35:26 +00:00
|
|
|
store.downloading.objectUrl = objectUrl
|
2019-03-10 04:58:19 +00:00
|
|
|
store.downloading.timestamp = Date.now()
|
2019-03-09 23:55:37 +00:00
|
|
|
},
|
|
|
|
stopDownloading (store) {
|
2019-03-10 22:35:26 +00:00
|
|
|
if (store.downloading.objectUrl) {
|
|
|
|
URL.revokeObjectURL(store.downloading.objectUrl)
|
|
|
|
}
|
|
|
|
|
2019-03-09 23:55:37 +00:00
|
|
|
store.downloading.status = false
|
2019-03-10 22:35:26 +00:00
|
|
|
store.downloading.objectUrl = null
|
2019-03-10 04:58:19 +00:00
|
|
|
store.downloading.timestamp = null
|
2019-03-09 21:54:07 +00:00
|
|
|
}
|
2019-03-08 22:17:59 +00:00
|
|
|
},
|
|
|
|
actions: {
|
2019-03-12 16:41:30 +00:00
|
|
|
welcome ({ commit, dispatch }) {
|
|
|
|
commit('welcome')
|
|
|
|
dispatch('requestCamera', false)
|
|
|
|
},
|
|
|
|
requestCamera ({ state, commit }, inverseFacingMode) {
|
|
|
|
const shouldFaceUser = inverseFacingMode
|
|
|
|
? !state.capturing.shouldFaceUser
|
|
|
|
: state.capturing.shouldFaceUser
|
|
|
|
|
|
|
|
const constraints = {
|
2019-03-10 05:34:37 +00:00
|
|
|
video: {
|
2019-03-12 16:41:30 +00:00
|
|
|
facingMode: shouldFaceUser ? 'user' : 'environment'
|
2019-03-10 05:34:37 +00:00
|
|
|
},
|
|
|
|
audio: false
|
|
|
|
}
|
|
|
|
|
2019-03-12 16:41:30 +00:00
|
|
|
commit('stopCamera')
|
|
|
|
|
|
|
|
navigator.mediaDevices.getUserMedia(constraints)
|
2019-03-10 01:28:07 +00:00
|
|
|
.then(mediaStream => {
|
2019-03-12 16:41:30 +00:00
|
|
|
commit('startCamera', mediaStream)
|
|
|
|
|
|
|
|
if (inverseFacingMode) {
|
|
|
|
commit('inverseFacingMode')
|
|
|
|
}
|
2019-03-10 01:28:07 +00:00
|
|
|
})
|
|
|
|
.catch(error => console.error(error))
|
2019-03-10 03:13:25 +00:00
|
|
|
},
|
|
|
|
capture ({ commit, dispatch, state }) {
|
|
|
|
commit('startCapture')
|
|
|
|
|
|
|
|
capture(commit, state.mediaStream, state.timer.selected * 1000)
|
|
|
|
.then(captureData => {
|
|
|
|
commit('stopCapture')
|
|
|
|
commit('updateCaptureState', 0)
|
|
|
|
dispatch('encode', captureData)
|
|
|
|
})
|
|
|
|
.catch(error => console.error(error))
|
|
|
|
},
|
|
|
|
encode ({ commit }, captureData) {
|
|
|
|
commit('startEncoding')
|
|
|
|
|
|
|
|
console.log(captureData)
|
|
|
|
|
|
|
|
encode(captureData)
|
2019-03-10 03:49:55 +00:00
|
|
|
.then(dataUrl => {
|
2019-03-10 03:13:25 +00:00
|
|
|
commit('stopEncoding')
|
2019-03-10 03:49:55 +00:00
|
|
|
commit('startDownloading', dataUrl)
|
2019-03-10 03:13:25 +00:00
|
|
|
})
|
2019-03-10 03:49:55 +00:00
|
|
|
.catch(error => console.error(error))
|
2019-03-10 01:28:07 +00:00
|
|
|
}
|
2019-03-08 22:17:59 +00:00
|
|
|
}
|
|
|
|
})
|