Merge pull request #1261 from frankrousseau/master

Various fixes

src/components/lists/AssetList.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="data-list">
-    <div class="datatable-wrapper" ref="body" v-scroll="onBodyScroll">
+    <div ref="body" class="datatable-wrapper" v-scroll="onBodyScroll">
       <table-header-menu
         ref="headerMenu"
         :is-minimized="hiddenColumns[lastHeaderMenuDisplayed]"
@@ -430,32 +430,32 @@
           </tr>
         </tbody>
       </table>
-    </div>
 
-    <table-info :is-loading="isLoading" :is-error="isError" />
-
-    <div
-      class="has-text-centered"
-      v-if="isEmptyList && !isCurrentUserClient && !isLoading"
-    >
-      <p class="info">
-        <img src="../../assets/illustrations/empty_asset.png" />
-      </p>
-      <p class="info">{{ $t('assets.empty_list') }}</p>
-      <button-simple
-        class="level-item big-button"
-        :text="$t('assets.new_assets')"
-        @click="$emit('new-clicked')"
-      />
-    </div>
-    <div
-      class="has-text-centered"
-      v-if="isEmptyList && isCurrentUserClient && !isLoading"
-    >
-      <p class="info">
-        <img src="../../assets/illustrations/empty_asset.png" />
-      </p>
-      <p class="info">{{ $t('assets.empty_list_client') }}</p>
+      <div
+        class="has-text-centered"
+        v-if="isEmptyList && !isCurrentUserClient && !isLoading"
+      >
+        <p class="info">
+          <img src="../../assets/illustrations/empty_asset.png" />
+        </p>
+        <p class="info">{{ $t('assets.empty_list') }}</p>
+        <button-simple
+          class="level-item big-button"
+          :text="$t('assets.new_assets')"
+          @click="$emit('new-clicked')"
+        />
+      </div>
+      <div
+        class="has-text-centered"
+        v-if="isEmptyList && isCurrentUserClient && !isLoading"
+      >
+        <p class="info">
+          <img src="../../assets/illustrations/empty_asset.png" />
+        </p>
+        <p class="info">{{ $t('assets.empty_list_client') }}</p>
+      </div>
+
+      <table-info :is-loading="isLoading" :is-error="isError" />
     </div>
 
     <p class="has-text-centered nb-assets" v-if="!isEmptyList && !isLoading">
@@ -977,6 +977,7 @@ td.ready-for {
 
 .datatable-wrapper {
   min-height: 200px;
+  flex: 1;
 }
 
 .datatable-row th.name {

src/components/pages/OpenProductions.vue

@@ -226,22 +226,30 @@ export default {
     },
 
     sectionPath(production, section) {
+      const routeName = production.homepage || section
       const route = {
-        name: section,
+        name: routeName,
         params: {
           production_id: production.id
         },
         query: {}
       }
       if (production.production_type === 'tvshow') {
-        route.name = `episode-${section}`
+        route.name = `episode-${routeName}`
         if (section !== 'edits') {
           route.params.episode_id = production.first_episode_id
         } else {
           route.params.episode_id = 'all'
         }
       }
-      if (['assets', 'shots', 'edits'].includes(section)) {
+      const isEntityPage = [
+        'assets',
+        'shots',
+        'edits',
+        'sequences',
+        'episodes'
+      ].includes(routeName)
+      if (isEntityPage) {
         route.query.search = ''
       }
       return route

src/components/pages/production/ProductionParameters.vue

@@ -14,6 +14,7 @@
           <div class="mr1">
             <date-field
               ref="startDateField"
+              class="mb0"
               :label="$t('productions.fields.start_date')"
               :short-date="true"
               v-model="form.start_date"
@@ -22,28 +23,41 @@
           <div>
             <date-field
               ref="endDateField"
+              class="mb0"
               :label="$t('productions.fields.end_date')"
               :short-date="true"
               v-model="form.end_date"
             />
           </div>
         </div>
-        <combobox
+
+        <combobox-styled
           ref="productionTypeField"
-          localeKeyPrefix="productions.type."
+          class="mb2"
+          locale-key-prefix="productions.type."
           :label="$t('productions.fields.type')"
           :options="productionTypeOptions"
           @enter="runConfirmation"
           v-model="form.production_type"
         />
 
+        <combobox-styled
+          ref="homepage"
+          class="mb2"
+          locale-key-prefix="productions.homepage."
+          :label="$t('productions.fields.homepage')"
+          :options="homepageOptions"
+          @enter="runConfirmation"
+          v-model="form.homepage"
+          v-if="currentProduction && currentProduction.id"
+        />
+
         <text-field
           ref="nbEpisodesField"
           type="number"
           :step="1"
           :label="$t('productions.fields.nb_episodes')"
           @enter="runConfirmation"
-          v-focus
           v-model="form.nb_episodes"
           v-if="currentProduction && currentProduction.id && isLocalTVShow"
         />
@@ -63,39 +77,34 @@
           :step="0.001"
           :label="$t('productions.fields.fps')"
           @enter="runConfirmation"
-          v-focus
           v-model="form.fps"
           v-if="currentProduction && currentProduction.id"
         />
         <text-field
           ref="ratioField"
           :label="$t('productions.fields.ratio')"
           @enter="runConfirmation"
-          v-focus
           v-model="form.ratio"
           v-if="currentProduction && currentProduction.id"
         />
         <text-field
           ref="resolutionField"
           :label="$t('productions.fields.resolution')"
           @enter="runConfirmation"
-          v-focus
           v-model="form.resolution"
           v-if="currentProduction && currentProduction.id"
         />
         <combobox-boolean
           ref="isClientsIsolatedField"
           :label="$t('productions.fields.is_clients_isolated')"
           @enter="runConfirmation"
-          v-focus
           v-model="form.is_clients_isolated"
           v-if="currentProduction && currentProduction.id"
         />
         <combobox-boolean
           ref="isPreviewDownloadAllowed"
           :label="$t('productions.fields.is_preview_download_allowed')"
           @enter="runConfirmation"
-          v-focus
           v-model="form.is_preview_download_allowed"
           v-if="currentProduction && currentProduction.id"
         />
@@ -105,11 +114,9 @@
           :step="1"
           :label="$t('productions.fields.max_retakes')"
           @enter="runConfirmation"
-          v-focus
           v-model="form.max_retakes"
           v-if="currentProduction && currentProduction.id"
         />
-
         <div v-if="currentProduction && currentProduction.id">
           <label class="label">{{ $t('productions.picture') }}</label>
           <file-upload
@@ -140,10 +147,10 @@
 <script>
 import { mapGetters, mapActions } from 'vuex'
 import { formatSimpleDate, parseSimpleDate } from '@/lib/time'
-import { PRODUCTION_TYPE_OPTIONS } from '@/lib/productions'
+import { PRODUCTION_TYPE_OPTIONS, HOME_PAGE_OPTIONS } from '@/lib/productions'
 
-import Combobox from '@/components/widgets/Combobox'
 import ComboboxBoolean from '@/components/widgets/ComboboxBoolean'
+import ComboboxStyled from '@/components/widgets/ComboboxStyled'
 import DateField from '@/components/widgets/DateField'
 import FileUpload from '@/components/widgets/FileUpload'
 import TextField from '@/components/widgets/TextField'
@@ -152,8 +159,8 @@ import ButtonSimple from '@/components/widgets/ButtonSimple.vue'
 export default {
   name: 'production-parameters',
   components: {
-    Combobox,
     ComboboxBoolean,
+    ComboboxStyled,
     DateField,
     FileUpload,
     TextField,
@@ -167,6 +174,7 @@ export default {
       isError: false,
       isLocalTVShow: false,
       productionTypeOptions: PRODUCTION_TYPE_OPTIONS,
+      homepageOptions: HOME_PAGE_OPTIONS,
       form: {
         name: '',
         start_date: new Date(),
@@ -259,7 +267,8 @@ export default {
             ? 'true'
             : 'false',
           ratio: this.currentProduction.ratio,
-          resolution: this.currentProduction.resolution
+          resolution: this.currentProduction.resolution,
+          homepage: this.currentProduction.homepage
         }
       } else {
         this.form = {
@@ -274,7 +283,8 @@ export default {
           is_preview_download_allowed: 'false',
           fps: '',
           ratio: '',
-          resolution: ''
+          resolution: '',
+          homepage: HOME_PAGE_OPTIONS[0].value
         }
       }
     },

src/components/previews/PreviewPlayer.vue

@@ -689,7 +689,7 @@ export default {
     this.configureEvents()
     this.setupFabricCanvas()
     this.reloadAnnotations()
-    if (this.isPicture) this.loadAnnotation(this.getAnnotation(0))
+    if (this.isPicture) this.loadAnnotation()
     this.resetPreviewFileMap()
     this.initPreferences()
     if (this.isSound || this.is3DModel || this.isFile) {
@@ -1065,6 +1065,7 @@ export default {
     },
 
     getCurrentTime() {
+      if (!this.isMovie) return 0
       return this.currentTimeRaw
     },
 
@@ -1184,9 +1185,9 @@ export default {
     },
 
     fixCanvasSize(dimensions) {
-      if (!this.fabricCanvas) {
-        return
-      }
+      if (!this.fabricCanvas) return
+      if (this.isPicture && dimensions.source === 'movie') return
+      if (this.isMovie && dimensions.source === 'picture') return
       const { height, left, top, width } = dimensions
       this.canvasWrapper.style.top = top + 'px'
       this.canvasWrapper.style.left = left + 'px'
@@ -1224,7 +1225,6 @@ export default {
 
     setFullScreen() {
       this.endAnnotationSaving()
-      this.previewViewer.pauseZoom()
       const promise = this.documentSetFullScreen(this.container)
       if (promise) {
         promise.then(() => {
@@ -1234,9 +1234,6 @@ export default {
         // fallback for legacy browsers
         this.fullScreen = true
       }
-      setTimeout(() => {
-        this.previewViewer.resumeZoom()
-      }, 2000)
       this.$nextTick(() => {
         // Needed to avoid fullscreen button to be called with space bar.
         this.clearFocus()
@@ -1245,7 +1242,6 @@ export default {
 
     exitFullScreen() {
       this.endAnnotationSaving()
-      this.previewViewer.pauseZoom()
       const promise = this.documentExitFullScreen()
       if (promise) {
         promise.then(() => {
@@ -1259,9 +1255,6 @@ export default {
         // fallback for legacy browsers
         this.fullScreen = false
       }
-      setTimeout(() => {
-        this.previewViewer.resumeZoom()
-      }, 2000)
       this.isComparing = false
       this.isCommentsHidden = true
       this.$nextTick(() => {
@@ -1455,7 +1448,7 @@ export default {
         if (this.isMovie) {
           this.loadAnnotation()
         } else if (this.isPicture) {
-          this.loadAnnotation(this.getAnnotation(0))
+          this.loadAnnotation()
         }
       }
     },

src/components/previews/PreviewViewer.vue

@@ -43,7 +43,7 @@
       @duration-changed="duration => $emit('duration-changed', duration)"
       @frame-update="frameNumber => $emit('frame-update', frameNumber)"
       @play-ended="$emit('play-ended')"
-      @size-changed="dimensions => $emit('size-changed', dimensions)"
+      @size-changed="onVideoSizeChanged"
       @video-end="$emit('video-end')"
       @video-loaded="$emit('video-loaded')"
       v-show="isMovie"
@@ -60,7 +60,7 @@
       :margin-bottom="marginBottom"
       :panzoom="true"
       :preview="preview"
-      @size-changed="dimensions => $emit('size-changed', dimensions)"
+      @size-changed="onPictureSizeChanged"
       v-show="isPicture"
     />
 
@@ -411,15 +411,25 @@ export default {
     },
 
     resize() {
-      if (this.pictureViewer) this.pictureViewer.resetPicture()
-      if (this.videoViewer) this.videoViewer.mountVideo()
+      if (this.isPicture) this.pictureViewer.resetPicture()
+      if (this.isMovie) this.videoViewer.mountVideo()
       if (this.isSound) this.soundViewer.redraw()
     },
 
     setCurrentFrame(frameNumber) {
       this.videoViewer.setCurrentFrame(frameNumber)
     },
 
+    onPictureSizeChanged(dimensions) {
+      dimensions.source = 'picture'
+      this.$emit('size-changed', dimensions)
+    },
+
+    onVideoSizeChanged(dimensions) {
+      dimensions.source = 'movie'
+      this.$emit('size-changed', dimensions)
+    },
+
     // To use when you don't want to handle back pressure and rounding
     setCurrentTimeRaw(time) {
       this.videoViewer.setCurrentTimeRaw(time)

src/lib/productions.js

@@ -38,6 +38,12 @@ export const PRODUCTION_STYLE_OPTIONS = [
   { label: 'ar', value: 'ar' }
 ]
 
+export const HOME_PAGE_OPTIONS = [
+  { label: 'assets', value: 'assets' },
+  { label: 'shots', value: 'shots' },
+  { label: 'sequences', value: 'sequences' }
+]
+
 export function getTaskTypePriorityOfProd(taskType, production) {
   if (!taskType) {
     return 1