🧹 moved files around
This commit is contained in:
14
src/App.vue
14
src/App.vue
@@ -10,25 +10,25 @@
|
||||
<!-- Display the component assigned to the given route (default: home) -->
|
||||
<router-view class="content" :key="$route.fullPath"></router-view>
|
||||
|
||||
<!-- Movie popup that will show above existing rendered content -->
|
||||
<movie-popup></movie-popup>
|
||||
<!-- Popup that will show above existing rendered content -->
|
||||
<popup />
|
||||
|
||||
<darkmode-toggle />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import NavigationHeader from "@/components/NavigationHeader";
|
||||
import NavigationIcons from "@/components/NavigationIcons";
|
||||
import MoviePopup from "@/components/MoviePopup";
|
||||
import DarkmodeToggle from "@/components/ui/darkmodeToggle";
|
||||
import NavigationHeader from "@/components/header/NavigationHeader";
|
||||
import NavigationIcons from "@/components/header/NavigationIcons";
|
||||
import Popup from "@/components/Popup";
|
||||
import DarkmodeToggle from "@/components/ui/DarkmodeToggle";
|
||||
|
||||
export default {
|
||||
name: "app",
|
||||
components: {
|
||||
NavigationHeader,
|
||||
NavigationIcons,
|
||||
MoviePopup,
|
||||
Popup,
|
||||
DarkmodeToggle
|
||||
}
|
||||
};
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<header :class="{ sticky: sticky }">
|
||||
<header>
|
||||
<h2>{{ prettify }}</h2>
|
||||
<h3>{{ subtitle }}</h3>
|
||||
|
||||
@@ -34,11 +34,6 @@ export default {
|
||||
required: false,
|
||||
default: null
|
||||
},
|
||||
sticky: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: true
|
||||
},
|
||||
info: {
|
||||
type: [String, Array],
|
||||
required: false
|
||||
@@ -77,15 +72,12 @@ header {
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0.5rem 0.75rem;
|
||||
background-color: $background-color;
|
||||
|
||||
&.sticky {
|
||||
background-color: $background-color;
|
||||
|
||||
position: sticky;
|
||||
position: -webkit-sticky;
|
||||
top: $header-size;
|
||||
z-index: 1;
|
||||
}
|
||||
position: sticky;
|
||||
position: -webkit-sticky;
|
||||
top: $header-size;
|
||||
z-index: 1;
|
||||
|
||||
h2 {
|
||||
font-size: 1.4rem;
|
||||
@@ -125,6 +117,7 @@ header {
|
||||
@include tablet-min {
|
||||
padding-left: 1.25rem;
|
||||
}
|
||||
|
||||
@include desktop-lg-min {
|
||||
padding-left: 1.75rem;
|
||||
}
|
||||
|
||||
@@ -11,8 +11,8 @@
|
||||
|
||||
<script>
|
||||
import { mapActions, mapGetters } from "vuex";
|
||||
import Movie from "./movie/Movie";
|
||||
import Person from "./Person";
|
||||
import Movie from "@/components/popup/Movie";
|
||||
import Person from "@/components/popup/Person";
|
||||
|
||||
export default {
|
||||
components: { Movie, Person },
|
||||
@@ -5,7 +5,7 @@
|
||||
class="results"
|
||||
:class="{ shortList: shortList }"
|
||||
>
|
||||
<movies-list-item
|
||||
<results-list-item
|
||||
v-for="(movie, index) in results"
|
||||
:key="`${movie.type}-${movie.id}-${index}`"
|
||||
:movie="movie"
|
||||
@@ -17,10 +17,10 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import MoviesListItem from "@/components/MoviesListItem";
|
||||
import ResultsListItem from "@/components/ResultsListItem";
|
||||
|
||||
export default {
|
||||
components: { MoviesListItem },
|
||||
components: { ResultsListItem },
|
||||
props: {
|
||||
results: {
|
||||
type: Array,
|
||||
|
||||
@@ -177,67 +177,4 @@ export default {
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
|
||||
.no-image {
|
||||
background-color: var(--text-color);
|
||||
color: var(--background-color);
|
||||
width: 100%;
|
||||
height: 383px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
span {
|
||||
font-size: 1.5rem;
|
||||
width: 70%;
|
||||
text-align: center;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "src/scss/variables";
|
||||
|
||||
.progress {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
margin-bottom: 0.8rem;
|
||||
|
||||
> progress {
|
||||
width: 95%;
|
||||
}
|
||||
|
||||
> span {
|
||||
position: absolute;
|
||||
font-size: 1rem;
|
||||
line-height: 1.4rem;
|
||||
color: $white;
|
||||
}
|
||||
|
||||
progress {
|
||||
border-radius: 4px;
|
||||
height: 1.4rem;
|
||||
}
|
||||
progress::-webkit-progress-bar {
|
||||
background-color: rgba($black, 0.55);
|
||||
border-radius: 4px;
|
||||
}
|
||||
progress::-webkit-progress-value {
|
||||
background-color: $green-70;
|
||||
border-radius: 4px;
|
||||
}
|
||||
progress::-moz-progress-bar {
|
||||
/* style rules */
|
||||
background-color: green;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div ref="resultSection" class="resultSection">
|
||||
<list-header v-bind="{ title, info, shortList }" :sticky="true" />
|
||||
<list-header v-bind="{ title, info, shortList }" />
|
||||
|
||||
<div
|
||||
v-if="!loadedPages.includes(1) && loading == false"
|
||||
|
||||
@@ -23,14 +23,14 @@
|
||||
|
||||
<script>
|
||||
import { mapGetters, mapActions } from "vuex";
|
||||
import TmdbLogo from "../icons/tmdb-logo";
|
||||
import IconProfile from "../icons/IconProfile";
|
||||
import IconProfileLock from "../icons/IconProfileLock";
|
||||
import IconSettings from "../icons/IconSettings";
|
||||
import IconActivity from "../icons/IconActivity";
|
||||
import SearchInput from "@/components/SearchInput";
|
||||
import NavigationIcons from "src/components/NavigationIcons";
|
||||
import NavigationIcon from "src/components/ui/NavigationIcon";
|
||||
import TmdbLogo from "@/icons/tmdb-logo";
|
||||
import IconProfile from "@/icons/IconProfile";
|
||||
import IconProfileLock from "@/icons/IconProfileLock";
|
||||
import IconSettings from "@/icons/IconSettings";
|
||||
import IconActivity from "@/icons/IconActivity";
|
||||
import SearchInput from "@/components/header/SearchInput";
|
||||
import NavigationIcons from "src/components/header/NavigationIcons";
|
||||
import NavigationIcon from "src/components/header/NavigationIcon";
|
||||
import Hamburger from "@/components/ui/Hamburger";
|
||||
|
||||
export default {
|
||||
@@ -15,7 +15,7 @@
|
||||
import { mapGetters, mapActions } from "vuex";
|
||||
|
||||
export default {
|
||||
name: "NavigationIcons",
|
||||
name: "NavigationIcon",
|
||||
props: {
|
||||
active: {
|
||||
type: String,
|
||||
@@ -11,13 +11,13 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import NavigationIcon from "./ui/NavigationIcon";
|
||||
import IconInbox from "../icons/IconInbox";
|
||||
import IconNowPlaying from "../icons/IconNowPlaying";
|
||||
import IconPopular from "../icons/IconPopular";
|
||||
import IconUpcoming from "../icons/IconUpcoming";
|
||||
import IconSettings from "../icons/IconSettings";
|
||||
import IconActivity from "../icons/IconActivity";
|
||||
import NavigationIcon from "@/components/header/NavigationIcon";
|
||||
import IconInbox from "@/icons/IconInbox";
|
||||
import IconNowPlaying from "@/icons/IconNowPlaying";
|
||||
import IconPopular from "@/icons/IconPopular";
|
||||
import IconUpcoming from "@/icons/IconUpcoming";
|
||||
import IconSettings from "@/icons/IconSettings";
|
||||
import IconActivity from "@/icons/IconActivity";
|
||||
|
||||
export default {
|
||||
name: "NavigationIcons",
|
||||
@@ -44,7 +44,7 @@
|
||||
<script>
|
||||
import { mapActions, mapGetters } from "vuex";
|
||||
import SeasonedButton from "@/components/ui/SeasonedButton";
|
||||
import AutocompleteDropdown from "@/components/AutocompleteDropdown";
|
||||
import AutocompleteDropdown from "@/components/header/AutocompleteDropdown";
|
||||
|
||||
import IconSearch from "src/icons/IconSearch";
|
||||
import IconClose from "src/icons/IconClose";
|
||||
@@ -26,35 +26,35 @@
|
||||
<div class="movie__wrap movie__wrap--main">
|
||||
<!-- SIDEBAR ACTIONS -->
|
||||
<div class="movie__actions" v-if="movie">
|
||||
<sidebar-list-element :active="matched" :disabled="true">
|
||||
<action-button :active="matched" :disabled="true">
|
||||
<IconThumbsUp v-if="matched" />
|
||||
<IconThumbsDown v-else />
|
||||
{{ !matched ? "Not yet available" : "Already available 🎉" }}
|
||||
</sidebar-list-element>
|
||||
</action-button>
|
||||
|
||||
<sidebar-list-element @click="sendRequest" :active="requested">
|
||||
<action-button @click="sendRequest" :active="requested">
|
||||
<transition name="fade" mode="out-in">
|
||||
<div v-if="!requested" key="request"><IconRequest /></div>
|
||||
<div v-else key="requested"><IconRequested /></div>
|
||||
</transition>
|
||||
{{ !requested ? `Request ${this.type}?` : "Already requested" }}
|
||||
</sidebar-list-element>
|
||||
</action-button>
|
||||
|
||||
<sidebar-list-element v-if="plexId && matched" @click="openInPlex">
|
||||
<action-button v-if="plexId && matched" @click="openInPlex">
|
||||
<IconPlay />
|
||||
Open and watch in plex now!
|
||||
</sidebar-list-element>
|
||||
</action-button>
|
||||
|
||||
<sidebar-list-element
|
||||
<action-button
|
||||
v-if="credits && credits.cast && credits.cast.length"
|
||||
:active="showCast"
|
||||
@click="() => (showCast = !showCast)"
|
||||
>
|
||||
<IconProfile class="icon" />
|
||||
{{ showCast ? "Hide cast" : "Show cast" }}
|
||||
</sidebar-list-element>
|
||||
</action-button>
|
||||
|
||||
<sidebar-list-element
|
||||
<action-button
|
||||
v-if="admin === true"
|
||||
@click="showTorrents = !showTorrents"
|
||||
:active="showTorrents"
|
||||
@@ -64,12 +64,12 @@
|
||||
<span v-if="numberOfTorrentResults" class="meta">{{
|
||||
numberOfTorrentResults
|
||||
}}</span>
|
||||
</sidebar-list-element>
|
||||
</action-button>
|
||||
|
||||
<sidebar-list-element @click="openTmdb">
|
||||
<action-button @click="openTmdb">
|
||||
<IconInfo />
|
||||
See more info
|
||||
</sidebar-list-element>
|
||||
</action-button>
|
||||
</div>
|
||||
|
||||
<!-- Loading placeholder -->
|
||||
@@ -93,33 +93,29 @@
|
||||
<loading-placeholder :count="5" />
|
||||
</div>
|
||||
|
||||
<MovieDescription
|
||||
<Description
|
||||
v-if="!loading && movie && movie.overview"
|
||||
:description="movie.overview"
|
||||
/>
|
||||
|
||||
<div class="movie__details" v-if="movie">
|
||||
<MovieDetail
|
||||
<Detail
|
||||
v-if="movie.year"
|
||||
title="Release date"
|
||||
:detail="movie.year"
|
||||
/>
|
||||
<MovieDetail
|
||||
v-if="movie.rating"
|
||||
title="Rating"
|
||||
:detail="movie.rating"
|
||||
/>
|
||||
<MovieDetail
|
||||
<Detail v-if="movie.rating" title="Rating" :detail="movie.rating" />
|
||||
<Detail
|
||||
v-if="movie.type == 'show'"
|
||||
title="Seasons"
|
||||
:detail="movie.seasons"
|
||||
/>
|
||||
<MovieDetail
|
||||
<Detail
|
||||
v-if="movie.genres && movie.genres.length"
|
||||
title="Genres"
|
||||
:detail="movie.genres.join(', ')"
|
||||
/>
|
||||
<MovieDetail
|
||||
<Detail
|
||||
v-if="
|
||||
movie.production_status &&
|
||||
movie.production_status !== 'Released'
|
||||
@@ -127,7 +123,7 @@
|
||||
title="Production status"
|
||||
:detail="movie.production_status"
|
||||
/>
|
||||
<MovieDetail
|
||||
<Detail
|
||||
v-if="movie.runtime"
|
||||
title="Runtime"
|
||||
:detail="humanMinutes(movie.runtime)"
|
||||
@@ -141,9 +137,9 @@
|
||||
class="movie__admin"
|
||||
v-if="showCast && credits && credits.cast && credits.cast.length"
|
||||
>
|
||||
<MovieDetail title="cast">
|
||||
<Detail title="cast">
|
||||
<CastList :cast="credits.cast" />
|
||||
</MovieDetail>
|
||||
</Detail>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -172,9 +168,9 @@ import IconBinoculars from "@/icons/IconBinoculars";
|
||||
import IconPlay from "@/icons/IconPlay";
|
||||
import TorrentList from "@/components/TorrentList";
|
||||
import CastList from "@/components/CastList";
|
||||
import MovieDetail from "@/components/movie/Detail";
|
||||
import MovieDescription from "@/components/movie/Description";
|
||||
import SidebarListElement from "@/components/ui/sidebarListElem";
|
||||
import Detail from "@/components/popup/Detail";
|
||||
import ActionButton from "@/components/popup/ActionButton";
|
||||
import Description from "@/components/popup/Description";
|
||||
import store from "@/store";
|
||||
import LoadingPlaceholder from "@/components/ui/LoadingPlaceholder";
|
||||
|
||||
@@ -201,8 +197,9 @@ export default {
|
||||
}
|
||||
},
|
||||
components: {
|
||||
MovieDescription,
|
||||
MovieDetail,
|
||||
Description,
|
||||
Detail,
|
||||
ActionButton,
|
||||
IconProfile,
|
||||
IconThumbsUp,
|
||||
IconThumbsDown,
|
||||
@@ -213,8 +210,7 @@ export default {
|
||||
IconPlay,
|
||||
TorrentList,
|
||||
CastList,
|
||||
LoadingPlaceholder,
|
||||
SidebarListElement
|
||||
LoadingPlaceholder
|
||||
},
|
||||
directives: { img: img }, // TODO decide to remove or use
|
||||
data() {
|
||||
@@ -37,33 +37,33 @@
|
||||
</div>
|
||||
|
||||
<div v-if="person">
|
||||
<MovieDetail v-if="age" title="Age" :detail="age" />
|
||||
<Detail v-if="age" title="Age" :detail="age" />
|
||||
|
||||
<MovieDetail
|
||||
<Detail
|
||||
v-if="person"
|
||||
title="Born"
|
||||
:detail="person.place_of_birth ? person.place_of_birth : '(Not found)'"
|
||||
/>
|
||||
|
||||
<MovieDetail v-if="person.biography" title="Biography">
|
||||
<MovieDescription :description="person.biography" />
|
||||
</MovieDetail>
|
||||
<Detail v-if="person.biography" title="Biography">
|
||||
<Description :description="person.biography" />
|
||||
</Detail>
|
||||
|
||||
<MovieDetail
|
||||
<Detail
|
||||
title="movies"
|
||||
:detail="`Credited in ${movieCredits.length} movies`"
|
||||
v-if="credits"
|
||||
>
|
||||
<CastList :cast="movieCredits" />
|
||||
</MovieDetail>
|
||||
</Detail>
|
||||
|
||||
<MovieDetail
|
||||
<Detail
|
||||
title="shows"
|
||||
:detail="`Credited in ${showCredits.length} shows`"
|
||||
v-if="credits"
|
||||
>
|
||||
<CastList :cast="showCredits" />
|
||||
</MovieDetail>
|
||||
</Detail>
|
||||
</div>
|
||||
</section>
|
||||
</template>
|
||||
@@ -71,8 +71,8 @@
|
||||
<script>
|
||||
import img from "@/directives/v-image";
|
||||
import CastList from "@/components/CastList";
|
||||
import MovieDetail from "@/components/movie/Detail";
|
||||
import MovieDescription from "@/components/movie/Description";
|
||||
import Detail from "@/components/popup/Detail";
|
||||
import Description from "@/components/popup/Description";
|
||||
import LoadingPlaceholder from "@/components/ui/LoadingPlaceholder";
|
||||
|
||||
import { getPerson, getPersonCredits } from "@/api";
|
||||
@@ -90,8 +90,8 @@ export default {
|
||||
}
|
||||
},
|
||||
components: {
|
||||
MovieDetail,
|
||||
MovieDescription,
|
||||
Detail,
|
||||
Description,
|
||||
CastList,
|
||||
LoadingPlaceholder
|
||||
},
|
||||
@@ -39,7 +39,7 @@
|
||||
import { mapGetters, mapActions } from "vuex";
|
||||
import ListHeader from "@/components/ListHeader";
|
||||
import ResultsList from "@/components/ResultsList";
|
||||
import Settings from "@/pages/Settings";
|
||||
import Settings from "@/pages/SettingsPage";
|
||||
import Activity from "@/pages/ActivityPage";
|
||||
import SeasonedButton from "@/components/ui/SeasonedButton";
|
||||
|
||||
@@ -20,7 +20,7 @@ let routes = [
|
||||
name: "profile",
|
||||
path: "/profile",
|
||||
meta: { requiresAuth: true },
|
||||
component: resolve => require(["./pages/Profile.vue"], resolve)
|
||||
component: resolve => require(["./pages/ProfilePage.vue"], resolve)
|
||||
},
|
||||
{
|
||||
name: "list",
|
||||
@@ -40,19 +40,19 @@ let routes = [
|
||||
{
|
||||
name: "register",
|
||||
path: "/register",
|
||||
component: resolve => require(["./pages/Register.vue"], resolve)
|
||||
component: resolve => require(["./pages/RegisterPage.vue"], resolve)
|
||||
},
|
||||
{
|
||||
name: "settings",
|
||||
path: "/settings",
|
||||
meta: { requiresAuth: true },
|
||||
component: resolve => require(["./pages/Settings.vue"], resolve)
|
||||
component: resolve => require(["./pages/SettingsPage.vue"], resolve)
|
||||
},
|
||||
{
|
||||
name: "signin",
|
||||
path: "/signin",
|
||||
alias: "/login",
|
||||
component: resolve => require(["./pages/Signin.vue"], resolve)
|
||||
component: resolve => require(["./pages/SigninPage.vue"], resolve)
|
||||
},
|
||||
// {
|
||||
// name: 'user-requests',
|
||||
|
||||
Reference in New Issue
Block a user