[shots] Allow to set frames from previews

src/components/modals/SetFramesFromTaskTypePreviewsModal.vue

@@ -0,0 +1,121 @@
+<template>
+  <div
+    :class="{
+      modal: true,
+      'is-active': active
+    }"
+  >
+    <div class="modal-background" @click="$emit('cancel')"></div>
+
+    <div class="modal-content">
+      <div class="box content">
+        <h1 class="title">
+          {{ $t('shots.get_frames_from_previews') }}
+        </h1>
+
+        <p class="description">
+          {{ $t('shots.get_frames_from_previews_description') }}
+        </p>
+
+        <combobox-task-type
+          :task-type-list="productionShotTaskTypes"
+          :placeholder="$t('task_types.select_task_type')"
+          add-placeholder
+          v-model="taskTypeId"
+        />
+
+        <modal-footer
+          :error-text="$t('shots.get_frames_from_previews_error')"
+          :is-error="isError"
+          :is-loading="isLoading"
+          :is-disabled="!isFormFilled"
+          @confirm="confirm"
+          @cancel="$emit('cancel')"
+        />
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { mapGetters, mapActions } from 'vuex'
+import { modalMixin } from '@/components/modals/base_modal'
+
+import ComboboxTaskType from '@/components/widgets/ComboboxTaskType'
+import ModalFooter from '@/components/modals/ModalFooter'
+
+export default {
+  name: 'get-frames-from-previews-modal',
+  mixins: [modalMixin],
+
+  components: {
+    ComboboxTaskType,
+    ModalFooter
+  },
+
+  props: {
+    active: {
+      type: Boolean,
+      default: false
+    },
+    isLoading: {
+      type: Boolean,
+      default: false
+    },
+    isError: {
+      type: Boolean,
+      default: false
+    },
+    errorText: {
+      type: String,
+      default: ''
+    }
+  },
+
+  data() {
+    return {
+      taskTypeId: null
+    }
+  },
+
+  mounted() {
+    this.reset()
+  },
+
+  computed: {
+    ...mapGetters(['productionShotTaskTypes']),
+
+    isFormFilled() {
+      return this.taskTypeId !== null && this.taskTypeId !== ''
+    }
+  },
+
+  methods: {
+    ...mapActions([]),
+
+    addValue() {},
+
+    confirm() {
+      return this.$emit('confirm', this.taskTypeId)
+    },
+
+    reset() {
+      this.taskType = null
+    }
+  },
+
+  watch: {
+    active() {
+      if (this.active) {
+        this.reset()
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+p.description {
+  font-size: 1.2rem;
+}
+</style>

src/components/pages/Shots.vue

@@ -45,6 +45,13 @@
                 icon="import-files"
                 @click="showAddThumbnailsModal"
               />
+              <button-simple
+                class="flexrow-item"
+                icon="film"
+                :title="$t('shots.get_frames_from_previews')"
+                @click="() => (modals.isSetFramesDisplayed = true)"
+                v-if="isCurrentUserManager"
+              />
               <button-simple
                 class="flexrow-item"
                 :title="$t('main.edl.import_file')"
@@ -258,6 +265,14 @@
       @confirm="confirmAddMetadata"
     />
 
+    <set-frames-from-task-type-previews-modal
+      :active="modals.isSetFramesDisplayed"
+      :is-loading="loading.getFrames"
+      :is-error="errors.getFrames"
+      @cancel="modals.isSetFramesDisplayed = false"
+      @confirm="confirmSetFrames"
+    />
+
     <add-thumbnails-modal
       ref="add-thumbnails-modal"
       entity-type="Shot"
@@ -313,6 +328,7 @@ import HardDeleteModal from '@/components/modals/HardDeleteModal'
 import ManageShotsModal from '@/components/modals/ManageShotsModal'
 import SearchField from '@/components/widgets/SearchField'
 import SearchQueryList from '@/components/widgets/SearchQueryList'
+import SetFramesFromTaskTypePreviewsModal from '@/components/modals/SetFramesFromTaskTypePreviewsModal'
 import SortingInfo from '@/components/widgets/SortingInfo'
 import ShowAssignationsButton from '@/components/widgets/ShowAssignationsButton'
 import ShowInfosButton from '@/components/widgets/ShowInfosButton'
@@ -342,6 +358,7 @@ export default {
     InfoQuestionMark,
     SearchField,
     SearchQueryList,
+    SetFramesFromTaskTypePreviewsModal,
     SortingInfo,
     ShotHistoryModal,
     ShowAssignationsButton,
@@ -385,6 +402,7 @@ export default {
         isDeleteDisplayed: false,
         isDeleteMetadataDisplayed: false,
         isDeleteAllTasksDisplayed: false,
+        isSetFramesDisplayed: false,
         isImportRenderDisplayed: false,
         isImportDisplayed: false,
         isEDLImportDisplayed: false,
@@ -402,6 +420,7 @@ export default {
         deleteMetadata: false,
         edit: false,
         del: false,
+        getFrames: false,
         importing: false,
         restore: false,
         savingSearch: false,
@@ -413,6 +432,7 @@ export default {
         deleteMetadata: false,
         creatingTasks: false,
         deleteAllTasks: false,
+        getFrames: false,
         importing: false,
         importingError: null
       }
@@ -565,6 +585,7 @@ export default {
       'hideAssignations',
       'loadEpisodes',
       'loadShots',
+      'setNbFramesFromTaskTypePreviews',
       'newEpisode',
       'newSequence',
       'newShot',
@@ -1098,6 +1119,23 @@ export default {
         .finally(() => {
           this.loading.importing = false
         })
+    },
+
+    async confirmSetFrames(taskTypeId) {
+      this.loading.getFrames = true
+      try {
+        await this.setNbFramesFromTaskTypePreviews({
+          taskTypeId,
+          productionId: this.currentProduction.id,
+          episodeId: this.currentEpisode ? this.currentEpisode.id : null
+        })
+        this.modals.isSetFramesDisplayed = false
+      } catch (err) {
+        console.error(err)
+        this.errors.getFrames = true
+      } finally {
+        this.loading.getFrames = false
+      }
     }
   },
 

src/components/widgets/ComboboxTaskType.vue

@@ -80,6 +80,10 @@ export default {
       default: false,
       type: Boolean
     },
+    placeholder: {
+      default: '+ Task Type',
+      type: String
+    },
     openTop: {
       default: false,
       type: Boolean
@@ -95,7 +99,7 @@ export default {
       if (this.value) {
         return this.taskTypeMap.get(this.value)
       } else if (this.addPlaceholder) {
-        return { name: '+ Task Type', color: '#E5E5E5', id: '' }
+        return { name: this.placeholder, color: '#E5E5E5', id: '' }
       } else {
         return this.taskTypeList[0]
       }

src/locales/en.js

@@ -1234,6 +1234,7 @@ export default {
     new_task_type: 'Add a task type',
     no_task_types: 'There is no task type for this entity type',
     number: 'task type | task types',
+    select_task_type: 'Select a task type...',
     title: 'Task Types',
     fields: {
       dedicated_to: 'For',
@@ -1359,6 +1360,9 @@ export default {
     empty_list: 'There is no shot in the production. What about creating some?',
     empty_list_client: 'There is no shot in this production.',
     episodes: 'Episodes',
+    get_frames_from_previews: 'Set frame numbers from previews',
+    get_frames_from_previews_description: 'Select a task type to extract the frame numbers from the latest published movie previews.',
+    get_frames_from_previews_error: 'There was an error while extracting the frame numbers from the task type previews. Please contact our support team.',
     history: 'Shot values history',
     multiple_delete_error: 'An error occurred while deleting a shot. There is probably some data linked to a shot. Are you sure there is no task linked to a selected shot?',
     new_shot: 'Add a shot',

src/store/api/shots.js

@@ -191,5 +191,13 @@ export default {
       `/api/data/projects/${productionId}/quotas/` +
         `${taskTypeId}?detail=${detailLevel}&weighted=${weighted}`
     )
+  },
+
+  setNbFramesFromTaskTypePreviews(taskTypeId, productionId, episodeId) {
+    let path =
+      `/api/actions/projects/${productionId}/task-types/` +
+      `${taskTypeId}/set-shot-nb-frames`
+    if (episodeId) path += `?episode_id=${episodeId}`
+    return client.ppost(path)
   }
 }

src/store/modules/shots.js

@@ -759,6 +759,21 @@ const actions = {
         }
       )
     })
+  },
+
+  async setNbFramesFromTaskTypePreviews(
+    { commit, rootGetters },
+    { taskTypeId, productionId, episodeId }
+  ) {
+    const shotNbFrames = await shotsApi.setNbFramesFromTaskTypePreviews(
+      taskTypeId,
+      productionId,
+      episodeId
+    )
+    shotNbFrames.forEach(shot => {
+      commit(UPDATE_SHOT, shot)
+    })
+    return shotNbFrames
   }
 }