a Plex landing page that redirects you to various sites.

Last update: Dec 29, 2022

Related tags

Overview

PlexRedirect

a Plex landing page that redirects you to various sites. Blank spaces are where your server name goes. If you don't have a server name you can replace it with whatever you want.

Features:

Link to Plex.tv
Link to PlexRequests
Link to PlexEmail
Shows Plex status (online or offline) using ping.js

Contributors:

@EldonMcGuinness: Added ping.js to the code so the website now checks the server status automatically.

@lienma: Fixed Google fonts so it now chooses between https and http.

@HeroCC: There was a missing semicolon in the JS, added it to where it should be.

@nagarjuna993: Thanks for the puff img.

TheDarocker: Add a closing > and remove a few unneeded(?) HTML tags.

Installing:

Add this to your webserver root folder. You can rename it to your server name if you would like. Access it via your IP address.

Editing:

You can edit the index.html to your liking and add your server name and links. You can also change the "document.domain" and port if it doesn't get it automatically. That way it can check the server status and update the page accordingly.

How I installed it:

The way I have it set up is forwarded my domain with masking to my public IP address and port.

Ex: www.example.com points to x.x.x.x:xxxx/PlexRedirect. I then have a subdomain for PlexRequests (requests.example.com) which then forwards it to my public IP address and port x.x.x.x:3245 with masking. I did the same for the PlexEmail site (right now it takes you to a "Coming Soon" website since I haven't set up PlexEmail yet.) Clicking on the "Access Server," "Request," and "What's New" redirects you to those addresses.

Want to help out?

Want to make PlexRedirect better? Feel free to fork the repo and submit a pull request!

Troubleshooting

I can't get ping to show my server online or offline!

Check to see if you can semicolons where you changed "document.domain" to your IP address or to a DNS service. Something like "192.168.1.1" or "mydns.dnservice.com"

License

Licensed under The MIT License. The Plex logo and name are copyright of Plex Inc.

Comments

Live Ping of server

Have you considered doing a ping of the plex server on the plex port to see if the server is available then letting that change the image as needed?

On fail it could give a red screen and on success it could be the green one; while waiting the screen could be yellow.

ping via JS https://github.com/alfg/ping.js

opened by EldonMcGuinness 9
Up and reachable even if plex is not running

I think this is not the way it should work. I have mine installed locally on a synology nas, and it reports back to be up and running even if plex is not running. I tried the same setup on my mac, and ultimately with my webserver.

I am getting an error is console, that shows GET http://xxx.xxx.xxx.xxx:32400/?1455904989253 400 (Bad Request)

the xxx.xxx.xxx.xxx being my local ip address.

Using a website like, http://ping.eu/port-chk/, can actually tell if the port is open or closed.

opened by smckay79 8
Ping never resolving?

When navigating to my Plex landing page, the ping process never resolves, good or bad. I know the server is up and accessible from the outside network, and I know that the IP address/port is correct and open. What should I do next?

opened by justinerwin 5

Keeps checking

My PlexRedirect just keeps checking if my server is online here is my index.html:

<!DOCTYPE html>
<html lang="en">
  <head>
    <link rel="shortcut icon" type="image/x-icon" href="plexlanding.ico" />`
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">
    <style>
        body.offline #link-bar {
            display:none;
        }

        body.online  #link-bar{
            display:block;
        }
    </style>
    <script src="assets/js/ping.js"></script>
    <script type='text/javascript'>
        HTMLElement.prototype.hasClass = function (className) {
            if (this.classList) {
                return this.classList.contains(className);
            } else {
                return (-1 < this.className.indexOf(className));
            }
        };

        HTMLElement.prototype.addClass = function (className) {
            if (this.classList) {
                this.classList.add(className);
            } else if (!this.hasClass(className)) {
                var classes = this.className.split(" ");
                classes.push(className);
                this.className = classes.join(" ");
            }
            return this;
        };

        HTMLElement.prototype.removeClass = function (className) {
            if (this.classList) {
                this.classList.remove(className);
            } else {
                var classes = this.className.split(" ");
                classes.splice(classes.indexOf(className), 1);
                this.className = classes.join(" ");
            }
            return this;
        };

        function checkServer() {
            var p = new Ping();
            var server = mydyn.duckdns.org //Try to get it automagically, but you can manually specify this
            var timeout = 2000; //Milliseconds
            var body = document.getElementsByTagName("body")[0];
            p.ping(server+":myexternalport", function(data) {
                var serverMsg = document.getElementById( "server-status-msg" );
                var serverImg = document.getElementById( "server-status-img" );
                if (data < 1000){
                    serverMsg.innerHTML ='Up and reachable';
                    serverImg.src = "assets/img/ipad-hand-on.png";
                    body.addClass('online').removeClass("offline");
                }else{
                    serverMsg.innerHTML = 'Down and unreachable';
                    serverImg.src = "assets/img/ipad-hand-off.png";
                }
            }, timeout);
        }
    </script>


    <title>Fast Debian Server</title>


    <!-- Bootstrap core CSS -->
    <link href="assets/css/bootstrap.css" rel="stylesheet">

    <!-- Custom styles -->
    <link href="assets/css/main.css" rel="stylesheet">

    <!-- Fonts from Google Fonts -->
    <link href='//fonts.googleapis.com/css?family=Lato:300,400,900' rel='stylesheet' type='text/css'>


  </head>

  <body onload="checkServer()" class="offline">

    <!-- Fixed navbar -->
    <div class="navbar navbar-default navbar-fixed-top">
      <div class="container">
        <div class="navbar-header">

          </button>
          <a href="http://mydyn.duckdns.org:24515/web"
          <a class="navbar-brand" href="#"><b>Fast Debian Server</b></a>
        </div>

          </ul>
        </div><!--/.nav-collapse -->
      </div>
    </div>
    <div class="container" id="link-bar">
        <div class="row mt centered">
            <div class="col-lg-6 col-lg-offset-3">


            </div>
        </div><!-- /row -->

        <div class="row mt centered">
            <div class="col-lg-4">
                <a href="http://app.plex.tv/web/app" target="_top">
                <img src="assets/img/s01.png" width="180" alt="">
                <h4>Access Fast Debian Server</h4>
                <p>Access the Fast Debian Server library with over X Movies & X TV Shows available instantly.<p>
                    </a>
            </div><!--/col-lg-4 -->

            <div class="col-lg-4">
                <a href="http://mydyn.duckdns.org:3000" target="_top">
                <img src="assets/img/s02.png" width="180" alt="">
                <h4>Request</h4>
                <p>Want to watch a Movie or TV Show but it's not currently on Fast Debian Server? Request it here!</p>
</a>
            </div><!--/col-lg-4 -->

            <div class="col-lg-4">
                <a href="PLEXEMAIL LINK HERE" target="_top">
                <img src="assets/img/s03.png" width="180" alt="">
                <h4>What's New</h4>
                <p>See what has been recently added to Fast Debian Server without having to log in.</p>
</a>
            </div><!--/col-lg-4 -->
        </div><!-- /row -->
    </div><!-- /container -->
    <p>

    <div id="headerwrap">
        <div class="container">
            <div class="row">
                <div class="col-lg-6">
                    <h1><br/>
                    <center>Fast Debian Server Status:</h1></center>
                    <center><h4 id="server-status-msg"><img src="assets/img/puff.svg">   Checking...</h4></center><br/>
                    <br/>
                    <br/>
                    <form class="form-inline" role="form">
                      <div class="form-group">

                      </div>

                </div><!-- /col-lg-6 -->
                <div class="col-lg-6">
                    <img id="server-status-img" class="img-responsive" src="assets/img/ipad-hand.png" alt="">
                </div><!-- /col-lg-6 -->

            </div><!-- /row -->
        </div><!-- /container -->
    </div><!-- /headerwrap -->
  </body>
</html>

Chrome tells me this:

Uncaught SyntaxError: Unexpected token <
SVG's SMIL animations (<animate>, <set>, etc.) are deprecated and will be removed. Please use CSS animations or Web animations instead.
(index):52 Uncaught ReferenceError: Ping is not definedcheckServer @ (index):52onload @ 192.168.1.123/:87

opened by donflex42 4

Disable ping.js

Hi, as my knowledge of html is far worse than 'limited' I thought I'd ask here, is it possible to disable the checking and jump straight to the mainpage and simply show it as "online". As I'm running my webserver on my plexserver there is really no need to check if its up. Is there a simple line of code I can change or something?

opened by yeyeoke 2

ping crashes plex media server

I have the following in index.html

        function checkServer() {
            var p = new Ping();
            var server = "publicipinquotes" //Try to get it automagically, but you can manually specify this
            var timeout = 2000; //Milliseconds
            var body = document.getElementsByTagName("body")[0];
            p.ping(server+":32400/web", function(data) {
                var serverMsg = document.getElementById( "server-status-msg" );
                var serverImg = document.getElementById( "server-status-img" );
                if (data < 1000){
                    serverMsg.innerHTML ='Up and reachable';
                    serverImg.src = "assets/img/ipad-hand-on.png";
                    body.addClass('online').removeClass("offline");
                }else{
                    serverMsg.innerHTML = 'Down and unreachable';
                    serverImg.src = "assets/img/ipad-hand-off.png";
                }
            }, timeout);

Whenever it pings my plex server, plex media server immediately crashes. These are the last entries on the Plex Media Server.log file in the appdata.

May 10, 2016 23:20:31:461 [10488] DEBUG - It took 0.0 sec to serialize a list with 0 elements.
May 10, 2016 23:20:31:463 [10372] DEBUG - Completed: [192.168.1.100:55566] GET /status/sessions (4 live) TLS GZIP 2ms 404 bytes 200
May 10, 2016 23:20:36:533 [4928] ERROR - Had trouble breaking 1462940436498
May 10, 2016 23:20:36:533 [4928] ERROR - ERROR: Parsing request failed.
May 10, 2016 23:20:36:533 [4928] DEBUG - Request: [192.168.1.1:55600] GET /web/?1462940436498 (3 live) GZIP

opened by boangliu 2

[Suggestion] Use PlexPy server down/up tricker for Plex Status

I would suggest looking into using the PlexPy tricker for tracker server up or down as you can now make your own custom scripts. This will add a nice automation of the status in case the Plex Media Server service dies.

opened by ghost 2
What to do when Plex Redirect and Plex Media Server are on different machines?

I have an ngnix server running on a Raspberry Pi that's configured to work with a domain name. My Plex server is on the same network with a local ip of 192.168.1.15. Obviously though, if I'm not connected to my local network when I go to my domain, it shows Plex as down and unreachable. How can I fix this? I don't want to install Plex on my RPi, and I don't want to have my public IP viewable in the source code.

Relevant section of index.html.

var server = "192.168.1.15" //Try to get it automagically, but you can manually specify this var timeout = 2000; //Milliseconds var body = document.getElementsByTagName("body")[0]; p.ping(server+":32400", function(data) {

opened by CKyle22 1
Suggestion: separate online status displays

Just another way of doing things:

I just wrapped your base page (after some heavy editing) into the front-end I use (Organizr)

Imgur

I can give you the code I used if you're interested.

opened by seanvree 0
Added ping

This adds the ping feature and will try to guess the domain name for you. You can always change the name to what ever you like by changing line 14.

You can see it in action here: http://eldonmcguinness.github.io/PlexRedirect/down.html http://eldonmcguinness.github.io/PlexRedirect/up.html

Up simply leaves out the port number so that it will connect to the server on port 80.

opened by EldonMcGuinness 0
Ping server Issue

Hey :)

first off great project :)

i got everything setup but i cant get to figure out how to ping my server.

I am using an ubuntu 16.04 dedicated server with pms installed in docker and accesed over reverse proxy.

Can someone help me out maybe?

Thanks

opened by cyb3rgh05t 0
Question on server address and port

Forgive my stupidity, but I can't seem to figure out the server status side of PlexRedirect. I self-host the PlexRedirect page on my macOS server, which is running on a Mac mini in a closet. My Plex server runs on another machine.

I've put "" around the server name, and can get that status to "turn green" with weird combinations of my internal IP address and my external IP address, and the internal and external ports Plex uses. I'm not entirely sure which set I'm supposed to be using. The problem is, if I turn PMS off the status stays green, no matter the combination of IP/port. Am I doing something wrong, or is the status only checking if the PMS machine is up, not PMS itself.

opened by joecan00 6

Load PlexRedirect from a config file

I started working on loading PlexRequest from a config file. I did it since I adjusted some texts, changed pictures etc. This means I have to do it all again if you update PlexRequest. I ended up with something which I think is easily customizable; you can add more custom applications, overwrite any texts that are used. Here are a few screenshots with what's possible (and I'll provide the config files that you need).

What you'll need to do when installing is create a config.json file in the root project (this will not be overwritten if you pull changes).

Simple config:

Simple config

Config:

{
  "server": {
    "name": "LocalServer",
    "brand_url": "/",
    "plex_domain": "localhost",
    "plex_port": "32400"
  },
  "applications": [
    {
      "PlexWeb": {

      },
      "PlexRequests": {
        "header": "Request a new movie!"
      },
      "PlexEmail": {

      }
    },
    {
      "PlexPy": {

      },
      "Sonarr": {

      },
      "Radarr": {

      }
    }
  ]
}

Minimal layout with a "custom" PlexPy logo

Minimal layout

{
  "server": {
    "name": "Plex",
    "brand_url": "/",
    "plex_domain": "localhost",
    "plex_port": "32400"
  },
  "applications": [
    {
      "PlexWeb": {
        "header": "Plex",
        "description": "View a movie"
      },
      "PlexPy": {
        "header": "PlexPy",
        "description": "Server stats",
        "image": "https://raw.githubusercontent.com/JonnyWong16/plexpy/master/data/interfaces/default/images/favicon.png"
      },
      "Sonarr": {
        "header": "Sonarr",
        "description": "Add new series"
      },
      "Radarr": {
        "header": "Radarr",
        "description": "Add new series"
      }
    }
  ]
}

If you have any questions or suggestions, I'm happy to answer/help! :)

opened by RobertBoes 0

Changes how to add?

Hello,

I can't seem to figure out how to add a submit. I have a variation with a lot of added info that users may like. However all personal information needs to be removed then uploaded but i tried and keep messing it up.

Please see screen shot of what it looks like.

opened by LexusSpeed03 30

Releases(1.1.5)

1.1.5(Dec 4, 2016)

1.1.5 Updated README.md

1.1.4: There was a missing semicolon in the JS, added it to where it should be. Thanks to @HeroCC for noticing.
Source code(tar.gz)
Source code(zip)
1.1.4(Nov 17, 2016)

1.1.4: There was a missing semicolon in the JS, added it to where it should be. Thanks to @HeroCC for noticing.

1.1.3: Added puff image to show activity when checking to see if the server is up. Thanks to @nagarjuna993 for the puff img.
Source code(tar.gz)
Source code(zip)
1.1.3(Mar 12, 2016)

1.1.3: Added puff image to show activity when checking to see if the server is up. Thanks to @nagarjuna993 for the puff img.

1.1.2: Updated readme and license.
Source code(tar.gz)
Source code(zip)
1.1.2(Feb 19, 2016)

1.1.2: Updated readme and license.

1.1.1: Added so that the images in the status area now shows the correct image. So whenever the website is checking if the server is online it shows an orange image, then if it's offline it shows a red image or if it's online it shows a green image.
Source code(tar.gz)
Source code(zip)
1.1.1(Feb 19, 2016)

1.1.1: Added so that the images in the status area now shows the correct image. So whenever the website is checking if the server is online it shows an orange image, then if it's offline it shows a red image or if it's online it shows a green image.

1.1 Added ping.js to check the server status and automatically update the webpage thanks to EldonMcGuinness who helped out by adding ping.js to the code.
Source code(tar.gz)
Source code(zip)
1.1(Feb 18, 2016)

1.1: Added ping.js to check the server status and automatically update the webpage thanks to EldonMcGuinness who helped out by adding ping.js to the code.

1.0: Initial release.
Source code(tar.gz)
Source code(zip)
1.0(Feb 18, 2016)

Initial release.
Source code(tar.gz)
Source code(zip)

Owner

GitHub

coala Landing Page - https://gitlab.com/coala/landing is needed as backend

landing-frontend coala Landing Page - https://gitlab.com/coala/landing is needed as backend Usage To run locally: $ git clone https://github.com/coala

31 Oct 30, 2022

A service to add web page screenshots to your Eleventy sites.

Screenshot API A runtime service to use live website screenshots on your site. Usage Image URLs have the formats: https://v1.screenshot.11ty.dev/:url/

91 Dec 24, 2022

🖼 A pure client-side landing page template that you can fork, customize and host freely. Relies on Mailchimp and Google Analytics.

landing-page-boilerplate A pure client-side landing page template that you can freely fork, customize, host and link to your own domain name (e.g. usi

129 Dec 24, 2022

A Unique Food order landing page web application called 'HOMELY' where you can select available meals and add them to cart then order them.

End Result Click the link : https://foodapp-by-eniola.netlify.com Getting Started with Create React App This project was bootstrapped with Create Reac

26 Dec 31, 2022

A responsive, Bootstrap landing page template created by Start Bootstrap

Start Bootstrap - Landing Page Landing Page is a multipurpose landing page template for Bootstrap created by Start Bootstrap. Preview View Live Previe

1.4k Jan 3, 2023

Minimal landing page for developers

Dev Landing Page Minimal landing page for developers. Developers don't talk much. Their code does all the talking. So here's a minimal landing page fo

1.2k Jan 4, 2023

Increase your landing page conversion rates.

Ouibounce Originally created by Carl Sednaoui from MailCharts. Maintained and improved by generous contributors. Ouibounce: A small library enabling y

2.3k Dec 9, 2022

Esri GitHub landing page

esri.github.io Landing page for Esri open source projects. Both the project categories and search suggestions in http://esri.github.io are powered by

470 Dec 31, 2022

Tailwind CSS Starter Template - Landing Page

Tailwind Toolbox - Landing Page Template Landing Page is an open source, generic landing page template for Tailwind CSS created by Tailwind Toolbox. G

908 Jan 8, 2023

A web app landing page theme created by Start Bootstrap

Start Bootstrap - New Age New Age is a web app landing page theme for Bootstrap created by Start Bootstrap. Preview View Live Preview Status Download

996 Dec 26, 2022

Landing page starter

?? Fresh Fresh is a free landing page starter built by cssninjaStudio. ✌️ preview Check out the live demo by clicking here. Fresh is built with Bulma

486 Dec 23, 2022

Startup Landing Page Components for React.js

neal-react neal-react is a collection of reactjs components to quickly build landing pages. I found that using hosted services like Launchrock doesn't

1.4k Nov 30, 2022

Serverless Pre-Rendering Landing Page

Serverless Pre-Rendering Demo Read the blog post Checkout the demo Developing By default, the content on the site is based off our public Notion page.

389 Dec 21, 2022

🎉 Personal landing page template

Landing Page Personal landing page template. Designed to keep simplicity in mind in both setup and UI. Stack HTML CSS Font Awesome Themes Couple custo

77 Dec 22, 2022

FREE Bootstrap Landing Page Template for Developers and Startups

Theme Details & Demo Details: https://themes.3rdwavemedia.com/bootstrap-templates/startup/appkit-landing-free-bootstrap-theme-for-developers-and-start

158 Nov 30, 2022

Projeto responsivo, que simula uma Landing Page de uma site de turismos.

FlexTurismos Projeto responsivo, que simula uma Landing Page de um site de turismos. Tecnologias utilizadas: Site com a tela interia Click aqui para a

1 Jan 29, 2022

Ta-vivo Landing page

Ta-vivo landing page Getting Started Prerequisites Node.js 12+ (versions below could work, but are not tested) Installing Clone the repository Install

6 Oct 10, 2022

The most advanced responsive front-end framework in the world. Quickly create prototypes and production code for sites that work on any kind of device.

Install | Documentation | Releases | Contributing Foundation is the most advanced responsive front-end framework in the world. Quickly go from prototy

29.4k Jan 4, 2023

:mountain_bicyclist: Landing Pages of Ant Design System

Ant Design Landing Landing Pages of Ant Design System English | 简体中文 What is Landing? Landing is a template built by Ant Motion's motion components. I

5.2k Dec 31, 2022