GithubHelp home page GithubHelp logo

jonhue / plaain Goto Github PK

View Code? Open in Web Editor NEW
5.0 5.0 1.0 233.81 MB

A serverless web app to organize and stream media from anywhere.

Home Page: https://jonhue.github.io/plaain

License: MIT License

HTML 3.38% JavaScript 0.64% SCSS 12.55% TypeScript 83.42%
media-library media-player movies tv-shows

plaain's Introduction

Plaain

Stream your media from anywhere. No server. No fee. Plaain works by connecting your device directly to the cloud where your media is hosted. It then stores metadata to all your movies & TV shows on your device.

Getting started

Plaain works by connecting media files you are hosting in a cloud, enriching them with metadata and making them available from everywhere.

To get started, you first have to connect your preferred cloud.

Organize files

Plaain expects your files to be organized in a certain way. Irrespectively of the folder you keep your movies/shows in these folders have to be structured as follows:

Movies

The movies folder must only contain other folders that each house the files for a movie.

Movies
|--Argo
|--|--1080.mp4
|--|--720.mp4
|--|--English.vtt

Shows

The shows is structured similarly to the movies folder only that there is an additional folder for each show and season respectively.

Shows
|--Dark
|--|--1
|--|--|--1
|--|--|--|--1080.mp4
|--|--|--2
|--|--|--|--1080.mp4

Source files

Plaain uses all video files with one of the following extensions

  • mp4
  • m4v
  • kmv
  • webm

and captions with the vtt extension.

Note: Plaain uses your folder names to fetch metadata on your movies and TV shows from TMDb. In the case that one of your movies/shows isn't added to Plaain even though it is located in your cloud, ensure that you can find the title on https://www.themoviedb.org/ by the name of the directory.

Connect with cloud provider

When your files are setup, open Plaain and connect to your preferred cloud.

Currently these cloud providers are supported:

  • OneDrive
  • FTP Servers

To wrap up setting up your cloud provider, Plaain will ask you where you stored your movies and TV shows. More specifically, Plaain will ask you for a path to your movies and a path to your TV shows. The paths should be relative to the root directory of your linked cloud.

You don't have to setup everything at this stage. You will be able to go back and change these settings.

When you finish setting up your provider, Plaain will index your files and enrich them with metadata. Then you're ready to enjoy your favorite movies & TV shows.

Features

Stream anywhere

Stream your media library from wherever you are, with any device. Plaain is a Progressive Web App that runs in your browser and still feels like a native app.

No server

You don't need to setup your own media server to run 24/7 with Plaain. Plaain just needs access to your personal cloud provider.

Privacy first

Plaain runs in your browser. All the data it stores is kept locally on your device.

Built using modern tools

Plaain is built as a Progressive Web App with React & Redux. It uses TMDb to fetch metadata on your movies & tv shows.

Development

This project uses Yarn as package manager.

  1. Clone this repository

    $ git clone ssh://[email protected]/jonhue/plaain.git

  2. Install Node.js and then fetch dependencies

    $ yarn install
    
  3. Start the development server

    $ yarn start

Testing

yarn prettierlint
yarn eslint
yarn stylelint

Deployment

Plaain is hosted on GitHub Pages.

To deploy, run:

$ yarn build
$ yarn deploy

plaain's People

Contributors

dependabot[bot] avatar depfu[bot] avatar jonhue avatar

Stargazers

 avatar  avatar  avatar

Watchers

 avatar  avatar  avatar

Forkers

antonbaumann

plaain's Issues

Publishing

Investigate if it is possible to publish this app with GitHub pages.

Fix loading component

  • the component is not rendered when the user first signs in
  • make a scene
  • display an animated version of the apps logo
  • display a message to hint at what is being done (unless starting the app and loading from storage)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.