Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

UI improvements #43

Merged
merged 6 commits into from
Feb 11, 2024
Merged

UI improvements #43

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
8b3dee1
Feat: refactor series headers with improved design
mateussouzaweb Feb 10, 2024
83ca8c0
Feat: update filters style for better responsiveness
mateussouzaweb Feb 10, 2024
4e77299
Feat: update premium icon with new design
mateussouzaweb Feb 10, 2024
3c295d6
Refactor: improve metadata reading with alternative episode number re…
mateussouzaweb Feb 10, 2024
fdb7141
Feat: improve seasons listing with ordered results
mateussouzaweb Feb 10, 2024
85a017c
Style: whitespace cleaning
mateussouzaweb Feb 10, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 3 additions & 1 deletion src/icons/premium.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
6 changes: 3 additions & 3 deletions src/scripts/api.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -61,7 +61,7 @@ const request = async (method: string, endpoint: string, body: any, headers: Hea
}

const result = await fetch(url, requestOptions)

if( result.status === 204 ){
return {} as Result
}
Expand All @@ -85,7 +85,7 @@ const makeLogin = async (username: string, password: string) => {
scope: 'offline_access',
})


const headers = new Headers()
headers.append('Content-Type', 'application/x-www-form-urlencoded')
headers.append('Authorization', 'Basic ' + authToken);
Expand Down Expand Up @@ -314,7 +314,7 @@ const watchlist = async (accessToken: string, accountId: string, filters: Data)
* @returns
*/
const inWatchlist = async (accessToken: string, accountId: string, filters: Data) => {

var headers = new Headers()
headers.append('Authorization', 'Bearer ' + accessToken)
headers.append('Content-Type', 'application/x-www-form-urlencoded')
Expand Down
10 changes: 5 additions & 5 deletions src/scripts/app.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,16 +16,16 @@ const getTemplate = async (name: string, data: any) => {

/**
* Retrieve image information
* @param images
* @returns
* @param images
* @returns
*/
const getImage = (images: any[]) => {

const image = { source: '' }
if( images && images.length ){
image.source = images[0][0].source
}

return image
}

Expand Down Expand Up @@ -589,7 +589,7 @@ const setProgress = async (filters: Data, data: Data) => {
* @returns
*/
const serie = async (serieId: string, filters: Data) => {

await refreshSession()

const accessToken = localStorage.getItem('accessToken')
Expand Down Expand Up @@ -686,7 +686,7 @@ const episode = async (episodeId: string, filters: Data) => {
const accessToken = localStorage.getItem('accessToken')
const preferredContentAudioLanguage = localStorage.getItem('preferredContentAudioLanguage')
const preferredCommunicationLanguage = localStorage.getItem('preferredCommunicationLanguage')

filters['preferred_audio_language'] = preferredContentAudioLanguage
filters['locale'] = preferredCommunicationLanguage

Expand Down
6 changes: 3 additions & 3 deletions src/scripts/explore.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -92,13 +92,13 @@ const listResults: Callback = async ({ state, render }) => {

let total = 0
let items = []

// Special listings
if ( category && special ){
const response = await App.browser({
'type': 'series',
'sort_by': sort,
'start': offset.toString(),
'start': offset.toString(),
'n': limit.toString()
})

Expand All @@ -118,7 +118,7 @@ const listResults: Callback = async ({ state, render }) => {
'type': 'series',
'categories': category,
'sort_by': sort,
'start': offset.toString(),
'start': offset.toString(),
'n': limit.toString()
})

Expand Down
17 changes: 9 additions & 8 deletions src/scripts/history.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,19 +47,20 @@ const listHistory: Callback = async ({ state, render }) => {
const items = response.data.filter((item) => {
return item.panel.type === 'episode'
}).map((item) => {
const metadata = item.panel.episode_metadata
return {
id: item.panel.id,
image: App.getImage(item.panel.images.thumbnail).source,
number: item.panel.episode_metadata.episode_number,
number: metadata.episode_number || metadata.episode,
name: item.panel.title,
description: item.panel.description,
duration: item.panel.episode_metadata.duration_ms / 1000,
duration: metadata.duration_ms / 1000,
playhead: item.playhead,
premium: item.panel.episode_metadata.is_premium_only,
season_id: item.panel.episode_metadata.season_id,
season_name: item.panel.episode_metadata.season_title,
serie_id: item.panel.episode_metadata.series_id,
serie_name: item.panel.episode_metadata.series_title,
premium: metadata.is_premium_only,
season_id: metadata.season_id,
season_name: metadata.season_title,
serie_id: metadata.series_id,
serie_name: metadata.series_title,
}
})

Expand All @@ -71,7 +72,7 @@ const listHistory: Callback = async ({ state, render }) => {
})

} catch (error) {

await render({
loaded: true,
error: true,
Expand Down
30 changes: 16 additions & 14 deletions src/scripts/home.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -64,37 +64,39 @@ const listResults: Callback = async ({ state, render }) => {
const history = (historyResponse.data || []).filter((item) => {
return item.panel.type === 'episode'
}).map((item) => {
const metadata = item.panel.episode_metadata
return {
id: item.panel.id,
image: App.getImage(item.panel.images.thumbnail).source,
number: item.panel.episode_metadata.episode_number,
number: metadata.episode_number || metadata.episode,
name: item.panel.title,
description: item.panel.description,
duration: item.panel.episode_metadata.duration_ms / 1000,
duration: metadata.duration_ms / 1000,
playhead: item.playhead,
premium: item.panel.episode_metadata.is_premium_only,
season_id: item.panel.episode_metadata.season_id,
season_name: item.panel.episode_metadata.season_title,
serie_id: item.panel.episode_metadata.series_id,
serie_name: item.panel.episode_metadata.series_title,
premium: metadata.is_premium_only,
season_id: metadata.season_id,
season_name: metadata.season_title,
serie_id: metadata.series_id,
serie_name: metadata.series_title,
}
})

const watchlistResponse = await App.watchlist({'n': '4'})
const watchlist = (watchlistResponse.data || []).map((item) => {
const metadata = item.panel.episode_metadata
return {
id: item.panel.id,
image: App.getImage(item.panel.images.thumbnail).source,
number: item.panel.episode_metadata.episode_number,
number: metadata.episode_number || metadata.episode,
name: item.panel.title,
description: item.panel.description,
duration: item.panel.episode_metadata.duration_ms / 1000,
duration: metadata.duration_ms / 1000,
playhead: item.playhead,
premium: item.panel.episode_metadata.is_premium_only,
season_id: item.panel.episode_metadata.season_id,
season_name: item.panel.episode_metadata.season_title,
serie_id: item.panel.episode_metadata.series_id,
serie_name: item.panel.episode_metadata.series_title,
premium: metadata.is_premium_only,
season_id: metadata.season_id,
season_name: metadata.season_title,
serie_id: metadata.series_id,
serie_name: metadata.series_title,
}
})

Expand Down
4 changes: 2 additions & 2 deletions src/scripts/login.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,8 +26,8 @@ const makeLogin: Callback = async ({ element, render }) => {
await App.login(username.value, password.value)
Route.redirect('/home')
} catch (error) {
await render({
message: error.message
await render({
message: error.message
})
}

Expand Down
8 changes: 4 additions & 4 deletions src/scripts/search.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -66,13 +66,13 @@ const listResults: Callback = async ({ state, render }) => {
const response = await App.search({
'type': 'series',
'q': query,
'start': offset.toString(),
'start': offset.toString(),
'n': limit.toString()
})

const data = {
count: 0,
items: []
const data = {
count: 0,
items: []
}

if( response.data && response.data.length ){
Expand Down
15 changes: 10 additions & 5 deletions src/scripts/serie.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -124,11 +124,16 @@ const listSerieInfo: Callback = async ({ state }) => {
const seasons = seasonsResponse.items.map((item) => {
return {
id: item.id,
name: 'S' + item.season_number + ': ' + item.title
number: item.season_number,
name: item.title
}
})

state.seasons = seasons
state.seasons = seasons.sort((a, b) => {
if(a.number < b.number) { return -1; }
if(a.number > b.number) { return 1; }
return 0;
})

if( !state.seasonId && seasons.length ){
state.seasonId = seasons[0].id
Expand Down Expand Up @@ -170,7 +175,7 @@ const listEpisodes: Callback = async ({ state, render }) => {
return {
id: item.id,
image: App.getImage(item.images.thumbnail).source,
number: item.episode_number,
number: item.episode_number || item.episode,
name: item.title,
description: item.description,
duration: item.duration_ms / 1000,
Expand Down Expand Up @@ -201,7 +206,7 @@ const listEpisodes: Callback = async ({ state, render }) => {
})

} catch (error) {

await render({
loaded: true,
error: true,
Expand All @@ -227,7 +232,7 @@ const onMount: Callback = async (component) => {
const serieId = component.state.serieId
Route.redirect('/serie/' + serieId + '/season/' + target.value)
})

on(element, 'change', 'input#sort', (_event, target: HTMLInputElement) => {
const serieId = component.state.serieId
const seasonId = component.state.seasonId
Expand Down
25 changes: 14 additions & 11 deletions src/scripts/video.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -100,10 +100,11 @@ const loadEpisode: Callback = async ({ state }) => {
const episodeId = state.episodeId
const episodeResponse = await App.episode(episodeId, {})
const episodeInfo = episodeResponse.data[0]
const episodeMetadata = episodeInfo.episode_metadata

const serieName = episodeInfo.episode_metadata.series_title
const seasonNumber = episodeInfo.episode_metadata.season_number
const episodeNumber = Number(episodeInfo.episode_metadata.episode_number)
const serieName = episodeMetadata.series_title
const seasonNumber = episodeMetadata.season_number
const episodeNumber = episodeMetadata.episode_number || episodeMetadata.episode
const episodeName = episodeInfo.title

const streamsLink = String(episodeInfo.streams_link)
Expand Down Expand Up @@ -140,11 +141,12 @@ const loadClosestEpisodes: Callback = async ({ state }) => {

if( previousResponse.data && previousResponse.data.length ){
const item = previousResponse.data[0].panel
const serieId = item.episode_metadata.series_id
const seasonId = item.episode_metadata.season_id
const metadata = item.episode_metadata
const serieId = metadata.series_id
const seasonId = metadata.season_id
const episodeId = item.id
const seasonNumber = item.episode_metadata.season_number
const episodeNumber = item.episode_metadata.episode_number
const seasonNumber = metadata.season_number
const episodeNumber = metadata.episode_number || metadata.episode
const episodeUrl = '/serie/' + serieId + '/season/' + seasonId + '/episode/' + episodeId + '/video'

previous.dataset.url = episodeUrl
Expand All @@ -157,11 +159,12 @@ const loadClosestEpisodes: Callback = async ({ state }) => {

if( nextResponse.data && nextResponse.data.length ){
const item = nextResponse.data[0].panel
const serieId = item.episode_metadata.series_id
const seasonId = item.episode_metadata.season_id
const metadata = item.episode_metadata
const serieId = metadata.series_id
const seasonId = metadata.season_id
const episodeId = item.id
const seasonNumber = item.episode_metadata.season_number
const episodeNumber = item.episode_metadata.episode_number
const seasonNumber = metadata.season_number
const episodeNumber = metadata.episode_number || metadata.episode
const episodeUrl = '/serie/' + serieId + '/season/' + seasonId + '/episode/' + episodeId + '/video'

next.dataset.url = episodeUrl
Expand Down
15 changes: 8 additions & 7 deletions src/scripts/watchlist.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,19 +47,20 @@ const listWatchlist: Callback = async ({ state, render }) => {
})

const items = response.data.map((item) => {
const metadata = item.panel.episode_metadata
return {
id: item.panel.id,
image: App.getImage(item.panel.images.thumbnail).source,
number: item.panel.episode_metadata.episode_number,
number: metadata.episode_number || metadata.episode,
name: item.panel.title,
description: item.panel.description,
duration: item.panel.episode_metadata.duration_ms / 1000,
duration: metadata.duration_ms / 1000,
playhead: item.playhead,
premium: item.panel.episode_metadata.is_premium_only,
season_id: item.panel.episode_metadata.season_id,
season_name: item.panel.episode_metadata.season_title,
serie_id: item.panel.episode_metadata.series_id,
serie_name: item.panel.episode_metadata.series_title,
premium: metadata.is_premium_only,
season_id: metadata.season_id,
season_name: metadata.season_title,
serie_id: metadata.series_id,
serie_name: metadata.series_title,
}
})

Expand Down
Loading