Series Categorizer

15 May 2015, 17:30
Map Height: Purgatory:
New Show:
Name of Current Show:
Vertical Position:
Horizontal Position:
Font size / em:
HTML Code for Box:

List of Series

← not so good | good →


    Welcome to my Series Categorizer!

    For the last few years I’ve been making my past-year review of TV shows in this form. The best show are more towards the upper border of the box, the worse ones further down. Horizontally, I roughly categorize the shows by their genre.

    For this year (2015), I decided to create a tool for generating my series categorization box. Well, here it is. It is based 100 % on JavaScript and runs solely in your browser. If it’s still slow, it’s probably because I include a bunch of external JavaScript libraries. Although I hope I thought of everything, there’s surely space for bugs in this page. It’s my first project beyond a couple of lines in JavaScript. If you find a bug, I’d gladly like to hear about it.

    I will explain all the features in the following (shorter explanations are available on a mouse over on the boxes/buttons).

    Have fun with the tool!



    The administration console can be shown or hidden with the upper right button. If you’re accessing this page with a parseable Series URL, the admin panel is hidden by default. In all other cases it should fold out.


    You can select the height of the box. Also, you can opt for having a purgatory area at the bottom of the box. Use it as you like. For me it’s for shows which I objectively wouldn’t watch anymore but for some reason do anyway. I also call it the Big-Bang-Theory-Area.


    The center-piece of this page is the series box in the center. Shows are created on the canvas and can be modified afterwards.


    The New Show field creates a new show by the input name, when clicking »Create Show«. Setting a checkmark create the entry with an additional link (use for writing about the show further down on your own page). As soon as a show is created, it’s placed in the center of the map and in the List of Series in the right margins of this page. The list is sorted alphabetically.


    A show can be modified if it’s selected in the right box. Modification means:


    The Cookies line deals with saving the current setup of shows. It can either write all current settings into a cookie or load it from there. Saving automatically overwrites any previously saved entry, be careful! Loading from cookie will append the current list of series by those stored in cookie.


    A URL for the current setup of shows can be generated. Since there is some data for every show, the URL can become long quite quickly. There’s a button to be hit if you want to shorten the generated URL with Google’s URL shortener. I haven’t tried it yet for very long URLs – it might not work. If the shorten button does nothing for you, you probably have Google stuff blocked with a browser plugin (Disconnect, AdBlock). Add the current page to your white list.

    If you’re accessing the page with a parseable URL, the admin console will be hidden, since I expect you’re an user coming here by someone else’s instruction.

    HTML Code

    The current HTML code of the series box can be displayed with HTML Code for Box. The according .css file should be included, making the code self-containing. Use it on your own page! But, if you don’t mind, backlink to my page.

    Known Bugs

    Et Cetera

    If you have any suggestions of improvements, ideally with the fitting code snippets, just sent them over.

    The page, generally, is CC NC-BY-SA and made by Andreas Herten in May 2015.