Merge branch 'master' into refactor/image-loading
This commit is contained in:
GitHub
44
.drone.yml
Normal file
44
.drone.yml
Normal file
@@ -0,0 +1,44 @@
|
||||
---
|
||||
kind: pipeline
|
||||
type: docker
|
||||
name: seasoned build
|
||||
|
||||
platform:
|
||||
os: linux
|
||||
arch: amd64
|
||||
|
||||
steps:
|
||||
- name: frontend_install
|
||||
image: node:13.6.0
|
||||
commands:
|
||||
- node -v
|
||||
- yarn --version
|
||||
- name: deploy
|
||||
image: appleboy/drone-ssh
|
||||
pull: true
|
||||
secrets:
|
||||
- ssh_key
|
||||
when:
|
||||
event:
|
||||
- push
|
||||
branch:
|
||||
- master
|
||||
- drone-test
|
||||
status: success
|
||||
settings:
|
||||
host: 10.0.0.114
|
||||
username: root
|
||||
key:
|
||||
from_secret: ssh_key
|
||||
command_timeout: 600s
|
||||
script:
|
||||
- /home/kevin/deploy/seasoned.sh
|
||||
|
||||
trigger:
|
||||
branch:
|
||||
- master
|
||||
event:
|
||||
include:
|
||||
- pull_request
|
||||
- push
|
||||
|
||||
@@ -21,10 +21,6 @@
|
||||
<symbol id="icon_now_playing" viewBox="0 0 30 30">
|
||||
<title>Now Playing</title>
|
||||
<path d="M27.9847266,7.50322266 C25.9822852,4.03494141 22.749082,1.55390625 18.8806055,0.517382812 C15.0121875,-0.519257812 10.9716797,0.0127148437 7.50322266,2.01527344 C4.03482422,4.01777344 1.55390625,7.25097656 0.517382812,11.1194531 C-0.519140625,14.9878711 0.0128320312,19.0284961 2.01527344,22.4967773 C4.01765625,25.9650586 7.25097656,28.4460937 11.1193945,29.4826172 C12.4111523,29.8287891 13.7219531,30 15.0244336,30 C17.6224219,30 20.1866016,29.3186133 22.4968359,27.9847852 C25.9651172,25.9823437 28.4461523,22.7491406 29.4826758,18.8806641 C30.5192578,15.0121289 29.987168,10.9716211 27.9847266,7.50322266 Z M27.9743555,18.476543 C27.0457617,21.9421289 24.8231836,24.8387109 21.715957,26.6326172 C18.6088477,28.426582 14.989043,28.9030664 11.523457,27.9745898 C8.0578125,27.0459961 5.16128906,24.823418 3.36732422,21.7161914 C1.57341797,18.609082 1.096875,14.9892188 2.02552734,11.5235742 C2.95417969,8.05798828 5.17675781,5.16152344 8.28392578,3.3675 C10.35375,2.17248047 12.6505664,1.56210937 14.9782031,1.56210937 C16.1448047,1.56210937 17.3195508,1.71550781 18.4763672,2.02552734 C21.9419531,2.95412109 24.8385352,5.17669922 26.6324414,8.28392578 C28.4264063,11.3910937 28.9030078,15.0108984 27.9743555,18.476543 Z M22.1940234,13.5850781 L12.5538281,8.01925781 C12.0422461,7.72388672 11.4314648,7.72400391 10.9198828,8.01919922 C10.4083008,8.31451172 10.1028516,8.84355469 10.1028516,9.43423828 L10.1028516,20.5658789 C10.1028516,21.1565625 10.4082422,21.6855469 10.9198828,21.980918 C11.1756445,22.1286328 11.4561328,22.2024023 11.7367383,22.2024023 C12.0174023,22.2024023 12.2980078,22.128457 12.5537695,21.9808594 L22.194082,16.4150977 C22.7056055,16.119668 23.0109375,15.5906836 23.0109375,15 C23.0109375,14.409375 22.7055469,13.8803906 22.1940234,13.5850781 Z M21.4132031,15.0629297 L11.7729492,20.6286914 C11.7611719,20.6355469 11.7366211,20.649668 11.7005273,20.6286914 C11.6643164,20.6077734 11.6643164,20.5795312 11.6643164,20.5659375 L11.6643164,9.43429687 C11.6643164,9.42070312 11.6643164,9.39246094 11.7005273,9.37154297 C11.714707,9.36333984 11.7270703,9.36052734 11.7376172,9.36052734 C11.7540234,9.36052734 11.7658594,9.36738281 11.7730664,9.37154297 L21.4132617,14.9373633 C21.4250391,14.9441602 21.4494727,14.9582812 21.4494727,15.0001172 C21.4494727,15.0419531 21.4249219,15.0561328 21.4132031,15.0629297 Z M24.2169727,7.87734375 C22.3601953,5.47863281 19.5689648,3.86707031 16.5588867,3.45580078 C16.1321484,3.39738281 15.7380469,3.69638672 15.6796289,4.12371094 C15.6213281,4.55091797 15.920332,4.94455078 16.3475391,5.00296875 C18.9556641,5.35927734 21.3738867,6.75544922 22.9822266,8.83318359 C23.1360937,9.03193359 23.3668945,9.13599609 23.6001562,9.13599609 C23.7670898,9.13599609 23.9353125,9.08273437 24.0774609,8.97257813 C24.418418,8.70867187 24.4808789,8.21830078 24.2169727,7.87734375 Z" fill-rule="nonzero"></path>
|
||||
</symbol>
|
||||
<symbol id="icon_top_rated" viewBox="0 0 30 30">
|
||||
<title>Top Rated</title>
|
||||
<path d="M24.7750847,5.22491532 C24.7021599,5.15199056 24.6169531,5.09595364 24.52407,5.05757218 C24.4304192,5.01919073 24.3313951,5 24.2323709,5 L8.84447835,5.00076763 C8.41997947,5.00076763 8.07684927,5.34466546 8.07684927,5.76839671 C8.07684927,6.19289559 8.4207471,6.53602579 8.84447835,6.53602579 L22.3785467,6.53525816 L5.22510723,23.6894653 C4.92496426,23.9896082 4.92496426,24.4747498 5.22510723,24.7748928 C5.3747949,24.9245804 5.57130794,24.9998081 5.76782099,24.9998081 C5.96433403,24.9998081 6.16084708,24.9245804 6.31053475,24.7748928 L23.4647418,7.62068568 L23.4647418,21.1539864 C23.4647418,21.5784853 23.807872,21.9216155 24.2323709,21.9216155 C24.6568698,21.9216155 25,21.5784853 25,21.1539864 L25,5.76762908 C25,5.66860493 24.9808093,5.56958078 24.9424278,5.47593003 C24.9040464,5.38304691 24.8480094,5.29784008 24.7750847,5.22491532 Z"></path>
|
||||
</symbol>
|
||||
<symbol id="icon_popular" viewBox="0 0 30 30">
|
||||
<title>Popular</title>
|
||||
@@ -129,5 +125,4 @@
|
||||
</body>
|
||||
|
||||
<script src="https://cdn.ravenjs.com/3.23.1/vue/raven.min.js" crossorigin="anonymous"></script>
|
||||
<!-- <script>Raven.config('https://c1fa1a17de3d4b24abcd05161648fe4d@sentry.io/300063').install();</script> -->
|
||||
</html>
|
||||
|
||||
@@ -28,12 +28,12 @@ import img from '../directives/v-image'
|
||||
export default {
|
||||
props: {
|
||||
movie: {
|
||||
required: true,
|
||||
type: Object
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
shortList: {
|
||||
required: false,
|
||||
type: Boolean
|
||||
type: Boolean,
|
||||
required: false
|
||||
}
|
||||
},
|
||||
directives: {
|
||||
|
||||
@@ -1,13 +1,14 @@
|
||||
<template>
|
||||
<div>
|
||||
|
||||
<div class="search">
|
||||
<input
|
||||
ref="input"
|
||||
type="text"
|
||||
placeholder="Search for a movie or show"
|
||||
aria-label="Search input for finding a movie or show"
|
||||
autocorrect="off"
|
||||
autocapitalize="off"
|
||||
tabindex="1"
|
||||
v-model="query"
|
||||
@input="handleInput"
|
||||
@click="focus = true"
|
||||
@@ -16,20 +17,38 @@
|
||||
@keydown.up="navigateUp"
|
||||
@keydown.down="navigateDown" />
|
||||
|
||||
<svg class="search--icon" fill="currentColor"><use xlink:href="#iconSearch"></use></svg>
|
||||
<svg class="search-icon" fill="currentColor" @click="handleSubmit"><use xlink:href="#iconSearch"></use></svg>
|
||||
</div>
|
||||
|
||||
<transition name="fade">
|
||||
<div class="dropdown" v-if="!disabled && focus && query.length > 0">
|
||||
<div class="dropdown--results">
|
||||
<div class="filter">
|
||||
<h2>Filter your search:</h2>
|
||||
|
||||
<div class="filter-items">
|
||||
<toggle-button :options="searchTypes" :selected.sync="selectedSearchType" />
|
||||
|
||||
<label>Adult
|
||||
<input type="checkbox" value="adult" v-model="adult">
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr />
|
||||
|
||||
<div class="dropdown-results" v-if="elasticSearchResults.length">
|
||||
<ul v-for="(item, index) in elasticSearchResults"
|
||||
@click="$popup.open(item.id, item.type)"
|
||||
@click="openResult(item, index + 1)"
|
||||
:class="{ active: index + 1 === selectedResult}">
|
||||
|
||||
{{ item.name }}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div v-else class="dropdown">
|
||||
<div class="dropdown-results">
|
||||
<h2 class="not-found">No results for query: <b>{{ query }}</b></h2>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<seasoned-button class="end-section" fullWidth="true"
|
||||
@@ -37,14 +56,14 @@
|
||||
close
|
||||
</seasoned-button>
|
||||
</div>
|
||||
|
||||
</transition>
|
||||
</div>
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import SeasonedButton from '@/components/ui/SeasonedButton'
|
||||
import ToggleButton from '@/components/ui/ToggleButton';
|
||||
|
||||
import { elasticSearchMoviesAndShows } from '@/api'
|
||||
import config from '@/config.json'
|
||||
@@ -52,18 +71,23 @@ import config from '@/config.json'
|
||||
export default {
|
||||
name: 'SearchInput',
|
||||
components: {
|
||||
SeasonedButton
|
||||
SeasonedButton,
|
||||
ToggleButton
|
||||
},
|
||||
props: ['value'],
|
||||
data() {
|
||||
return {
|
||||
adult: true,
|
||||
searchTypes: ['all', 'movie', 'show', 'person'],
|
||||
selectedSearchType: 'all',
|
||||
|
||||
query: this.value,
|
||||
focus: false,
|
||||
disabled: false,
|
||||
scrollListener: undefined,
|
||||
scrollDistance: 0,
|
||||
elasticSearchResults: '',
|
||||
selectedResult: 0
|
||||
elasticSearchResults: [],
|
||||
selectedResult: 0,
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
@@ -74,6 +98,9 @@ export default {
|
||||
window.removeEventListener('scroll', this.disableFocus)
|
||||
this.scrollDistance = 0
|
||||
}
|
||||
},
|
||||
adult: function(value) {
|
||||
this.handleInput()
|
||||
}
|
||||
},
|
||||
beforeMount() {
|
||||
@@ -102,6 +129,10 @@ export default {
|
||||
input.setSelectionRange(textLength, textLength + 1)
|
||||
}, 1)
|
||||
},
|
||||
openResult(item, index) {
|
||||
this.selectedResult = index;
|
||||
this.$popup.open(item.id, item.type)
|
||||
},
|
||||
handleInput(e){
|
||||
this.selectedResult = 0
|
||||
this.$emit('input', this.query);
|
||||
@@ -114,25 +145,44 @@ export default {
|
||||
.then(resp => {
|
||||
const data = resp.hits.hits
|
||||
|
||||
this.elasticSearchResults = data.map(item => {
|
||||
let results = data.map(item => {
|
||||
const index = item._index.slice(0, -1)
|
||||
if (index === 'movie' || item._source.original_title) {
|
||||
return {
|
||||
name: item._source.original_title,
|
||||
id: item._source.id,
|
||||
adult: item._source.adult,
|
||||
type: 'movie'
|
||||
}
|
||||
} else if (index === 'show' || item._source.original_name) {
|
||||
return {
|
||||
name: item._source.original_name,
|
||||
id: item._source.id,
|
||||
adult: item._source.adult,
|
||||
type: 'show'
|
||||
}
|
||||
}
|
||||
})
|
||||
console.log(this.elasticSearchResults)
|
||||
results = this.removeDuplicates(results)
|
||||
this.elasticSearchResults = results
|
||||
})
|
||||
},
|
||||
removeDuplicates(searchResults) {
|
||||
let filteredResults = []
|
||||
searchResults.map(result => {
|
||||
const numberOfDuplicates = filteredResults.filter(filterItem => filterItem.id == result.id)
|
||||
if (numberOfDuplicates.length >= 1) {
|
||||
return null
|
||||
}
|
||||
filteredResults.push(result)
|
||||
})
|
||||
|
||||
if (this.adult == false) {
|
||||
filteredResults = filteredResults.filter(result => result.adult == false)
|
||||
}
|
||||
|
||||
return filteredResults
|
||||
},
|
||||
handleSubmit() {
|
||||
let searchResults = this.elasticSearchResults
|
||||
|
||||
@@ -144,7 +194,8 @@ export default {
|
||||
this.$popup.open(resultItem.id, resultItem.type)
|
||||
} else {
|
||||
const encodedQuery = encodeURI(this.query.replace('/ /g, "+"'))
|
||||
this.$router.push({ name: 'search', query: { query: encodedQuery }});
|
||||
const media_type = this.selectedSearchType !== 'all' ? this.selectedSearchType : null
|
||||
this.$router.push({ name: 'search', query: { query: encodedQuery, adult: this.adult, media_type }});
|
||||
this.focus = false
|
||||
this.selectedResult = 0
|
||||
}
|
||||
@@ -179,6 +230,41 @@ export default {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.filter {
|
||||
// background-color: rgba(004, 122, 125, 0.2);
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin: 1rem 2rem;
|
||||
|
||||
h2 {
|
||||
margin-top: 0.5rem;
|
||||
margin-bottom: 0.5rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
&-items {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
|
||||
> :not(:first-child) {
|
||||
margin-left: 1rem;
|
||||
// background-color: red !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
hr {
|
||||
display: block;
|
||||
height: 1px;
|
||||
border: 0;
|
||||
border-bottom: 1px solid $text-color-50;
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
width: 90%;
|
||||
}
|
||||
|
||||
.dropdown {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
@@ -196,7 +282,11 @@ export default {
|
||||
width: calc(100%);
|
||||
}
|
||||
|
||||
&--results {
|
||||
.not-found {
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
&-results {
|
||||
padding-left: 60px;
|
||||
width: 100%;
|
||||
|
||||
@@ -268,7 +358,7 @@ export default {
|
||||
}
|
||||
}
|
||||
|
||||
&--icon{
|
||||
&-icon{
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
fill: $text-color-50;
|
||||
|
||||
Reference in New Issue
Block a user