ngn/libremdb
1
0
Fork 0
Code Issues 1 Pull Requests 9 Actions Packages Activity

initial commit

Browse Source
This commit is contained in:
zyachel
2022-03-19 17:22:07 +05:30
commit d660f9ea58
55 changed files with 5999 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
views/pug/_footer.pug Normal file
View File

@@ -0,0 +1,26 @@
mixin list-maker(name, link)
li.footer__nav-item
a.footer__link(class=`${page === name ? 'footer__link--active' : ''}`,href=link)= name
footer.footer
.footer__logo-box
svg.footer__logo: use(href='/img/misc/sprite.svg#icon-logo')
span.footer__logo-text libremdb
ul.footer__nav
//- +list-maker('Home Page','/')
+list-maker('About','/about')
+list-maker('Privacy','/privacy')
+list-maker('Contact','/contact')
li.footer__nav-item
a.footer__link(href="#") Back to top
.footer__text
p.footer__disclaimer
span.footer__name libremdb 
| takes no credit for the movies shown and the all the accompanying data.
p.footer__copyleft
a.footer__link(href='https://github.com/zyachel/libremdb') Code
|  for the website and the server is licensed under 
a.footer__link(href='https://www.gnu.org/licenses/agpl-3.0-standalone.html') GNU AGPLv3

26
views/pug/_header.pug Normal file
View File

@@ -0,0 +1,26 @@
header(class=`${page === 'About'? 'about__header' : ''} header`)
block header
.header__nav-bar
a.header__logo-box(href="/")
svg.header__logo: use(href='/img/misc/sprite.svg#icon-logo')
span.header__logo-text libremdb
nav.header__nav
ul.header__nav-links
- if(page === 'About')
li.header__nav-item
a.header__link(href='#features') Features
li.header__nav-item
a.header__link(href="#faqs") FAQs
- else
li.header__nav-item
a.header__link(href='/about') About
li.header__nav-item
-const link = page === 'Contact' ? 'Privacy' : 'Contact';
a.header__link(href=`/${link.toLowerCase()}`)= link
li.header__nav-item
a.header__link(href="https://github.com/zyachel/libremdb") Code
//- for theme
label.theme-switcher__label(for="theme-switcher", name="theme switcher label", title="change theme")
svg.theme-switcher__icon: use(href='/img/misc/sprite.svg#icon-theme-switcher')

94
views/pug/about.pug Normal file
View File

@@ -0,0 +1,94 @@
extends base
block append header
.header__text-box
h1.heading.heading__primary.header__main-text A FOSS alternative front-end to IMDb
h2.header__sub-text Inspired by projects like
a.header__sub-text.header__sub-text-links(href="https://codeberg.org/teddit/teddit") teddit
span , 
a.header__sub-text.header__sub-text-links(href="https://github.com/zedeus/nitter") nitter
span  and 
a.header__sub-text.header__sub-text-links(href="/similar-projects") many others
| .
a.button.button__primary.header__button(href='#features') features
block content
main.main.about
.about__features#features
h2.heading.heading__secondary.about__features-heading Features
.features
.feature
svg.feature__icon: use(href='/img/misc/sprite.svg#icon-eye-slash')
h3.heading.heading__tertiary.feature__title No ads or tracking
p.feature__text Browse any movie info without being tracked or bombarded by annoying ads.
.feature
svg.feature__icon: use(href='/img/misc/sprite.svg#icon-link-slash')
h3.heading.heading__tertiary.feature__title No connection to IMDb
.feature__text All requests go through the backend; client never talks to IMDb except for a bunch of requests to m.media-amazon.com for images.
.feature
svg.feature__icon: use(href='/img/misc/sprite.svg#icon-code-document')
h3.heading.heading__tertiary.feature__title No JavaScript required
p.feature__text Just a few lines(50 or so) of code to save theme preference, which itself is optional.
.feature
svg.feature__icon: use(href='/img/misc/sprite.svg#icon-feather')
h3.heading.heading__tertiary.feature__title Lightweight
p.feature__text up movie page:
br
| libremdb: ~35 HTTP requests(1.35MB) vs IMDb: ~280 requests(7.75MB)
.feature
svg.feature__icon: use(href='/img/misc/sprite.svg#icon-palette')
h3.heading.heading__tertiary.feature__title Modern interface
p.feature__text Modern interface with curated colors supporting both dark and light themes.
.feature
svg.feature__icon: use(href='/img/misc/sprite.svg#icon-responsive')
h3.heading.heading__tertiary.feature__title Responsive design
p.feature__text Be it your small mobile or big computer screen, it's fully responsive.
.about__faqs#faqs
h2.heading.heading__secondary.about__faqs-heading Frequently asked questions
.faqs
details.faq
summary.faq__question This website is so basic!
p.faq__answer Yes, it is! I don't think a website that shows you some quick info of something needs to be overly fancy.
details.faq
summary.faq__question This website is slow.
p.faq__answer Whenever you request info about a movie/show on libremdb, 4 trips are made(2 between your browser and libremdb's server, and 2 between libremdb's server and IMDb's server) instead of the usual 2 trips when you visit a website. For this reason there's a noticable delay. This is a bit of inconvenience you'll have to face should you wish to use this website.
details.faq
summary.faq__question It doesn't have all routes.
p.faq__answer I think most of the people just check IMDb to get a quick glimpse of a movie/show. That's why there is just one route for now. However, I will try to implement other important routes if time allows. More info on 
a.faq__link(href='https://github.com/zyachel/libremdb') Github
| .
details.faq
summary.faq__question Why is libremdb connecting to m.media-amazon.com?
p.faq__answer For now, images are directly served from amazon. If I have enough time in the future, I'll implement a way to serve the images from libremdb instead.
details.faq
summary.faq__question Will amazon track me then?
p.faq__answer They may log your IP address. I'd recommend using a VPN for mitigating this risk.
details.faq
summary.faq__question Why not just use IMDb?
p.faq__answer Refer to the 
a.faq__link(href='#features') features section
|  above.
details.faq
summary.faq__question Why didn't you use other databases like 
a.faq__link(href="https://www.themoviedb.org/") TMDB
| or 
a.faq__link(href="https://www.omdbapi.com/") OMDb
| ?
p.faq__answer IMDb simply has superior dataset compared to all other alternatives. With that being said, I'd encourage you to check out those alternatives too.
details.faq
summary.faq__question Why did you deploy it on heroku? Why not just buy your own domain name?
p.faq__answer It's just a proof-of-concept for now. However, if you'd like to do so, you are very welcome.
details.faq
summary.faq__question Your website name is very, ehm, lame.
p.faq__answer Let's just say I'm not very good at naming things.
details.faq
summary.faq__question I have some ideas/want to contribute, how do I contact you?
p.faq__answer Here are a couple of ways to 
a.faq__link(href="/contact") reach me
|. Send your beautiful suggestions or just drop a hi.

33
views/pug/base.pug Normal file
View File

@@ -0,0 +1,33 @@
doctype html
html(lang="en")
head
//- essential stuff
meta(charset="UTF-8")
meta(http-equiv="X-UA-Compatible", content="IE=edge")
meta(name="viewport", content="width=device-width, initial-scale=1.0")
title #{title} | libremdb
meta(name="description", content="A Free and Open Soruce alternative front-end to IMDb. Look up movie overviews without being tracked.")
//- preloading these for performance gains
link(rel="preload stylesheet", href="/css/styles.css", as='style' crossorigin)
link(rel="preload", href="/font/Montserrat-SemiBold.woff2", as="font", type="font/woff2" crossorigin)
link(rel="preload", href="/font/NunitoSans-Regular.woff2", as="font", type="font/woff2" crossorigin)
script(src="/js/index.js", defer)
//- for favicons and stuff
meta(name='color-scheme', content='light dark')
meta(name='theme-color', content='#0f2c67')
meta(name='msapplication-TileColor', content='#b91d47')
link(rel='apple-touch-icon', sizes='180x180', href='/favicon/apple-touch-icon.png')
link(rel='icon', type='image/png', sizes='32x32', href='/favicon/favicon-32x32.png')
link(rel='icon', type='image/png', sizes='16x16', href='/favicon/favicon-16x16.png')
link(rel='manifest', href='/site.webmanifest')
link(rel='mask-icon', href='/favicon/safari-pinned-tab.svg', color='#5bbad5')
body
//input is actually a checkbox hack to enable changing themes without js
input#theme-switcher.theme-switcher__input(type="checkbox", name="theme switcher checkbox")
.page
include _header
block content
h1 this is a placeholder text
include _footer

20
views/pug/contact.pug Normal file
View File

@@ -0,0 +1,20 @@
extends base
block content
main.main.contact
h1.heading.heading__primary.contact__heading Got any feedback?
p.contact__text reach me via:
.contact__mediums
.contact__medium
p.contact__medium-name [matrix]
figure.contact__ways
img.contact__ways-image(src="/img/contact/matrix.png", alt="QR Code for matrix")
figcaption.contact__ways-text
a.contact__ways-link(href="https://matrix.to/#/@ninal:matrix.org") @ninal:matrix.org
.contact__medium
p.contact__medium-name Email
figure.contact__ways
img.contact__ways-image(src="/img/contact/email.png", alt="QR Code for email")
figcaption.contact__ways-text
a.contact__ways-link(href="mailto:aricla@protonmail.com") aricla@protonmail.com

13
views/pug/error.pug Normal file
View File

@@ -0,0 +1,13 @@
extends base
block content
main.main.error
h1.heading.heading__primary.error__status-code= statusCode
h2.heading.heading__secondary.error__message= message
if stack
.error__stack-box
pre.error__stack: code= stack
p.error__text go back to the 
a.error__link(href="/") home page
p.error__text if you believe this itself is an error, 
a.error__link(href="/contact") contact us

155
views/pug/movie.pug Normal file
View File

@@ -0,0 +1,155 @@
extends base
block content
main.main.movie
.movie__basic.basic
figure.basic__image-box(style=`background-image: url(${movie.basic.poster})`)
if movie.basic.poster
img.basic__image(
src=movie.basic.poster,
alt=`${movie.basic.name} cover image`,
title=`${movie.basic.name} cover image`
)
else
svg.basic__image-na: use(href='/img/misc/sprite.svg#icon-image-slash')
.basic__about
h1.basic__title= movie.basic.name
.basic__metadata
each metadata in movie.basic.metadata
span.basic__metadata-data= metadata
.basic__stats
.basic__rating
span.basic__rating-num= movie.basic.rating || '\u2013'
svg.basic__rating-icon.basic__icon: use(href='/img/misc/sprite.svg#icon-rating')
span.basic__rating-text avg. rating
.basic__votes
span.basic__votes-num= movie.basic.numVotes || '\u2013'
svg.basic__votes-icon.basic__icon: use(href='/img/misc/sprite.svg#icon-like-dislike')
span.basic__votes-text number of votes
.basic__popularity
span.basic__popularity-num=movie.basic.popularity || '\u2013'
svg.basic__popularity-icon.basic__icon: use(href='/img/misc/sprite.svg#icon-graph-rising')
span.basic__popularity-text popularity
.basic__genres
span.basic__genre-heading Genres:
-if (movie.basic.genres.length)
each genre in movie.basic.genres
span.basic__genre= genre
-else
span.basic__genre –
.basic__description
p.basic__description-heading Overview
p.basic__description-text= movie.basic.plotBrief || '\u2013'
.basic__directors
span.basic__director-heading Director:
-if (movie.basic.directors.length)
each director in movie.basic.directors
span.basic__director= director
- else
span.basic__director –
.basic__writers
span.basic__writer-heading Writers:
-if (movie.basic.writers.length)
each writer in movie.basic.writers
span.basic__writer= writer || '\u2013'
- else
span.basic__writer –
.movie__cast
h2.movie__heading-main Top Cast
ul.movie__cast-list.actors
each cast in movie.topCast.actors
li.actor: figure.actor__details
if cast.avatar
img.actor__image(src=cast.avatar, alt=`image of ${cast.name}`)
else
svg.actor__image-na: use(href='/img/misc/sprite.svg#icon-image-slash')
figcaption.actor__name= cast.name
figcaption.actor__character-name= cast.characterName ? 'as '+ cast.characterName : ''
.movie__storyline
h2.movie__heading-main Storyline
.movie__storyline-details.storyline
.storyline__story
p.movie__heading-sub Story
span= movie.storyline.plotExpanded || '\u2013'
.storyline__tagline
span.movie__heading-sub Tagline: 
span= movie.storyline.tagline || '\u2013'
.storyline__pg
span.movie__heading-sub Parental Guidance: 
span= movie.storyline.parentalGuidance || '\u2013'
.movie__details
h2.movie__heading-main Details
.movie__details-container.details
p.details__release-date
span.movie__heading-sub Release Date: 
span=movie.details.releaseDate || '\u2013'
p.details__country
span.movie__heading-sub Countries: 
span=movie.details.countries.join(', ') || '\u2013'
p.details__languages
span.movie__heading-sub Languages: 
span= movie.details.languages.join(', ')
p.details__alt-name
span.movie__heading-sub Also known as: 
span= movie.details.alternateTitle || '\u2013'
p.details__-locations
span.movie__heading-sub Filming locations: 
span= movie.details.filmingLocations.join(', ') || '\u2013'
p.details__companies
span.movie__heading-sub Companies: 
span= movie.details.companies.join(', ')
-if(movie.details.officialSite)
a.movie__link(href=movie.details.officialSite) Official website
span  →
.movie__boxoffice
h2.movie__heading-main Box Office
.movie__boxoffice-details.boxoffice
- if (movie.boxoffice.grossWorldwide)
p.boxoffice__budget
span.movie__heading-sub Budget: 
span= movie.boxoffice.budget || '\u2013'
p.boxoffice__opening-weekend-domestic
span.movie__heading-sub Opening Weekend: 
span= movie.boxoffice.openingWeekendDomestic[0] || '\u2013'
p.boxoffice__domestic
span.movie__heading-sub Gross Domestic: 
span= movie.boxoffice.grossDomestic || '\u2013'
p.boxoffice__worldwide
span.movie__heading-sub Gross Worldwide: 
span= movie.boxoffice.grossWorldwide || '\u2013'
- else
p.boxoffice__na Data not available
.movie__technical
h2.movie__heading-main Technical Specs
.movie__technical-details.technical
p.technical__runtime
span.movie__heading-sub Runtime: 
span= movie.technicalSpecs.runtime || '\u2013'
p.technical__color
span.movie__heading-sub Color: 
span= movie.technicalSpecs.color || '\u2013'
p.technical__ratio
span.movie__heading-sub Aspect ratio: 
span= movie.technicalSpecs.aspectRatio || '\u2013'
p.technical__sound
span.movie__heading-sub Sound: 
span= movie.technicalSpecs.sound.join(', ') || '\u2013'
.movie__media
h2.movie__heading-main Media
-if (movie.media.images.length)
.movie__media-box
each image, index in movie.media.images
figure.movie__media-image-secondary-box
img.movie__media-image(src=image, alt=`image ${index + 1} from ${movie.basic.name}`)
-else
p.movie-media__na no media avaiable

16
views/pug/privacy.pug Normal file
View File

@@ -0,0 +1,16 @@
extends base
block content
main.main.privacy
h1.heading.heading__primary.privacy__heading Privacy Policy
p.privacy__jist In short: libremdb doesn't collect any data at all.
.privacy__item
h2.heading.heading__secondary.privacy__item-heading Data you directly provide
p.privacy__item-text None.
.privacy__item
h2.heading.heading__secondary.privacy__item-heading Data you passively provide
p.privacy__item-text Heroku might log some things(like IP address). So, consider hosting your own instance or using a VPN.
.privacy__item
h2.heading.heading__secondary.privacy__item-heading Data stored in your browser
p.privacy__item-text To remember theme preferences, the website stores a key named 'theme' in Local Storage provided by your browser. Apart from that, there is nothing stored in your browser. To remove the key, press F12 > Storage(or Application in chromium-based browsers) > Local Storage > right click > Delete.
p.privacy__item-text To permamently disable libremdb from storing your theme prefrences, either turn off JavaScript or disable access to Local Storage for libremdb.

50
views/pug/similarProjects.pug Normal file
View File

@@ -0,0 +1,50 @@
extends base
mixin project(name, description, website, instance, official=true)
.project
a.project__name(href=website)=name
p.project__about=description
a.project__instance(href=instance)=`${official ? 'Official' : 'Community'} instance `
span.project__instance-arrow →
block content
main.main.similar-projects
h1.heading.heading__primary.similar-projects__heading Other cool projects you should check out:
.similar-projects__list
+project(
'Teddit',
'Teddit is an alternative Reddit front-end focused on privacy.',
"https://codeberg.org/teddit/teddit",
"https://teddit.net/"
)
+project(
'Nitter',
'Nitter is a free and open source alternative Twitter front-end focused on privacy.',
'https://github.com/zedeus/nitter',
'https://nitter.net/'
)
+project(
'Bibliogram',
'Bibliogram is an alternative front-end for Instagram.',
'https://sr.ht/~cadence/bibliogram/',
'https://bibliogram.art/'
)
+project(
'Invidious',
'Invidious is an alternative front-end to YouTube.',
'https://invidious.org',
'https://invidious.snopyta.org/feed/popular',
false
)
+project(
'Libreddit',
'Libreddit is an alternative private front-end to Reddit.',
'https://github.com/spikecodes/libreddit',
'https://libreddit.spike.codes/'
)
+project(
'Scribe',
'Scribe is an alternative Medium frontend.',
'https://git.sr.ht/~edwardloveall/scribe',
'https://scribe.rip/'
)