Merge branch master into rewrite-watch-video-info

package-lock.json

@@ -17758,7 +17758,8 @@
         },
         "minimist": {
           "version": "1.2.0",
-          "resolved": "",
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
+          "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=",
           "dev": true
         },
         "schema-utils": {
@@ -20368,7 +20369,8 @@
         },
         "minimist": {
           "version": "1.2.0",
-          "resolved": "",
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
+          "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=",
           "dev": true
         },
         "string-width": {

src/renderer/components/ft-icon-button/ft-icon-button.js

@@ -19,10 +19,18 @@ export default Vue.extend({
       type: Boolean,
       default: true
     },
-    dropdownPosition: {
+    forceDropdown: {
+      type: Boolean,
+      default: false
+    },
+    dropdownPositionX: {
       type: String,
       default: 'center'
     },
+    dropdownPositionY: {
+      type: String,
+      default: 'bottom'
+    },
     dropdownNames: {
       type: Array,
       default: () => { return [] }
@@ -43,7 +51,7 @@ export default Vue.extend({
     },
 
     handleIconClick: function () {
-      if (this.dropdownNames.length > 0 && this.dropdownValues.length > 0) {
+      if (this.forceDropdown || (this.dropdownNames.length > 0 && this.dropdownValues.length > 0)) {
         this.toggleDropdown()
       } else {
         this.$emit('click')

src/renderer/components/ft-icon-button/ft-icon-button.vue

@@ -13,12 +13,14 @@
       @click="handleIconClick"
     />
     <div
-      v-if="dropdownNames.length > 0 && showDropdown"
+      v-if="showDropdown"
       class="iconDropdown"
       :class="{
-        left: dropdownPosition === 'left',
-        right: dropdownPosition === 'right',
-        center: dropdownPosition === 'center'
+        left: dropdownPositionX === 'left',
+        right: dropdownPositionX === 'right',
+        center: dropdownPositionX === 'center',
+        bottom: dropdownPositionY === 'bottom',
+        top: dropdownPositionY === 'top'
       }"
     >
       <ul class="list">
@@ -31,6 +33,21 @@
           {{ label }}
         </li>
       </ul>
+      <slot>
+        <ul
+          class="list"
+          v-if="dropdownNames.length > 0"
+        >
+          <li
+            v-for="(label, index) in dropdownNames"
+            :key="index"
+            class="listItem"
+            @click="handleDropdownClick(index)"
+          >
+            {{ label }}
+          </li>
+        </ul>
+      </slot>
     </div>
   </div>
 </template>

src/renderer/components/ft-list-video/ft-list-video.vue

@@ -42,7 +42,7 @@
       title="More Options"
       theme="base"
       :use-shadow="false"
-      dropdown-position="left"
+      dropdown-position-x="left"
       :dropdown-names="optionsNames"
       :dropdown-values="optionsValues"
       @click="handleOptionsClick"

src/renderer/components/watch-video-info/watch-video-info.js

@@ -36,6 +36,10 @@ export default Vue.extend({
       type: String,
       required: true
     },
+    published: {
+      type: Number,
+      required: true
+    },
     viewCount: {
       type: Number,
       required: true

src/renderer/views/Watch/Watch.vue

@@ -25,6 +25,7 @@
       :channel-id="channelId"
       :channel-name="channelName"
       :channel-thumbnail="channelThumbnail"
+      :published="videoPublished"
       :subscription-count-text="channelSubscriptionCountText"
       :like-count="videoLikeCount"
       :dislike-count="videoDislikeCount"