[1.0] First commit

.gitignore

@@ -0,0 +1,3 @@
+*.zip
+.vscode
+Capture

backgroundScripts/background.js

@@ -0,0 +1,29 @@
+var categories = [{
+        name: "tv_show",
+        season: true,
+        urls: ["/filmvid%C3%A9o/s%C3%A9rie-tv/", "/filmvideo/serie-tv/"],
+    }, {
+        name: "anime",
+        season: true,
+        urls: ["/filmvid%C3%A9o/animation-s%C3%A9rie/", "/film-video/animation-serie/"],
+    }, {
+        name: "movie",
+        season: false,
+        urls: [
+            "/filmvid%C3%A9o/film/",
+            "/filmvideo/film/",
+            "/filmvid%C3%A9o/animation/",
+            "/filmvideo/animation/"
+        ],
+    },
+];
+
+chrome.runtime.onInstalled.addListener(function(details){
+    if(details.reason == "install"){
+        chrome.storage.sync.set({ 'defaultCategories': categories});
+        chrome.storage.sync.set({ 'categories': categories});
+    }
+    if(details.reason == "update"){
+        chrome.storage.sync.set({ 'defaultCategories': categories});
+    }
+});

contentScripts/addTorrent/accessAddTorrent.js

@@ -0,0 +1,3 @@
+var downloadButton = document.querySelector('a.butt');
+downloadButton.onclick = function(){}
+downloadButton.removeAttribute('onclick');

contentScripts/addTorrent/addTorrent.js

@@ -0,0 +1,140 @@
+/* Inject scripts don't forget to add them to web_accessible_resources in manifest */
+injectScript(chrome.extension.getURL('contentScripts/addTorrent/accessAddTorrent.js'), 'head');
+injectLink(chrome.extension.getURL("css/style.css"), 'head');
+
+/********************************************************************/
+/********************************************************************/
+/********************************************************************/
+
+var path = window.location.pathname;
+
+/* Add an info line to the table */
+var tableLines =  document.querySelectorAll('table.infos-torrent tbody tr')
+var downloadLine = tableLines[1];
+var torrentInfo = downloadLine.cloneNode(true);
+torrentInfo.style = "display: none";
+downloadLine.insertAdjacentElement('afterend', torrentInfo);
+
+/* Add third party download button */
+var downloadButton = downloadLine.querySelector('a.butt');
+flexButton = document.createElement('a');
+flexButton.appendChild(document.createTextNode("Télécharger via discord "));
+var span = document.createElement('span');
+span.className = "ico_download";
+flexButton.appendChild(span);
+flexButton.className = "butt discord"
+flexButton.style = "display: none";
+flexButton.addEventListener('click', addToDiscord);
+downloadButton.parentElement.appendChild(flexButton);
+
+/* Retrieve torrent data from page*/
+var torrentId = (/.*\/torrent\/.*\/.*\/(\d+)\-/g).exec(window.location.pathname);
+if(torrentId){
+    torrentId = torrentId[1]
+}
+var torrentTitle = document.querySelector('div#title h1').textContent.trim().split(".").join(" ");
+torrentYear = (/(19\d{2}|2\d{3})/g).exec(torrentTitle)
+if(torrentYear){
+    torrentYear = torrentYear[1]
+}
+if(torrentTitle.includes('1080'))
+    torrentQuality = '1080p';
+else if(torrentTitle.includes('720'))
+    torrentQuality = '720p';
+else if(torrentTitle.includes('480'))
+    torrentQuality = '480p';
+
+/* Retrieve credentials from Google Storage*/
+var discordWebhookUrl, discordUserName, categories;
+chrome.storage.sync.get(['yggToken', 'discordWebhookUrl', 'discordUserName', 'displayDiscord', 'displayAddCategories', 'categories', 'defaultCategories'], function(value){
+    if(value.yggToken){
+        downloadButton.setAttribute('href', "https://www2.yggtorrent.gg/rss/download?id=" + torrentId + "&passkey=" + value.yggToken);
+    }
+    else{
+        var alertYggToken = '<div id="error_ygg_button_alert" class="alert alert-danger" role="alert" style="margin-bottom:0;">Une erreur est survenue, Vérifiez que votre token Ygg soit chargé !</div>';
+        if (document.readyState !== "complete"){
+            document.addEventListener('readystatechange', function onReadyStateChange() {
+                downloadLine.childNodes[3].innerHTML = alertYggToken;
+            }, false);
+        } else {
+            downloadLine.childNodes[3].innerHTML = alertYggToken;
+        }
+    }
+    if(value.displayDiscord){
+        if(value.discordWebhookUrl){
+            discordWebhookUrl = value.discordWebhookUrl;
+        }
+        else{
+            showAlert('error_discord_button_alert')
+        }
+        if(value.discordUserName){
+            discordUserName = value.discordUserName;
+        }
+        else{
+            discordUserName = "BetterYGG - Extension"
+        }
+
+        if(value.displayAddCategories){
+            if(value.categories){
+                categories = value.categories;
+                if(categories.length === 0){
+                    showAlert('error_categories_alert')
+                }
+            }
+            else{
+                showAlert('error_categories_alert')
+            }
+        }
+        else {
+            if(value.defaultCategories){
+                categories = value.defaultCategories;
+            }
+        }
+
+        /* Retrieve torrent data from page*/
+        var torrentType = getTypeFromUrl(categories);
+        var torrentEpisode = '', torrentSeason = '', torrentQuality = '';
+        if(torrentType.season){
+            document.querySelectorAll('a.term').forEach(function(element){
+                var key = element.innerHTML
+                if(key.includes('Saison'))
+                    torrentSeason = key.replace('Saison ', '');
+                if(key.includes('Episode'))
+                    torrentEpisode = key.replace('Episode ', '');
+            });
+        }
+
+        /* Style info line */
+        var left = torrentInfo.childNodes[1];
+        left.removeChild(left.childNodes[0]);
+        left.prepend(document.createTextNode("Infos "));
+        left.childNodes[1].className = 'ico_info-circle';
+        var right = torrentInfo.childNodes[3];
+        /* Add alert banners */
+        right.innerHTML = '<div id="valid_form_alert" class="alert alert-success" role="alert" style="display: none">C\'est un succes, le torrent a été envoyé !</div>'
+        right.innerHTML += '<div id="error_form_alert" class="alert alert-danger" role="alert" style="display: none">Une erreur est survenue, Vérifiez le formulaire çi dessous.!</div>';
+        right.innerHTML += '<div id="error_discord_button_alert" class="alert alert-danger" role="alert" style="display: none">Une erreur est survenue, Vérifiez que votre url Discord Webhook soit correcte !</div>';
+        right.innerHTML += '<div id="error_categories_alert" class="alert alert-danger" role="alert" style="display: none">Une erreur est survenue, La liste des catégories est vide !</div>';
+
+        /* Creation of form */
+        var formNode = document.createElement('form');
+        formNode.name = "form_info";
+        formNode.className = "form-horizontal";
+        right.appendChild(formNode);
+
+        var row = document.createElement('div');
+        row.className = "row";
+        row.appendChild(getInputCol("Titre", "title", ["error"], "text", torrentTitle,
+            {
+                onInput:function() {
+                    this.classList.remove('error')
+                }
+            })
+        );
+        formNode.appendChild(row);
+
+        formNode.appendChild(getSecondRow(torrentType, torrentSeason, torrentEpisode, torrentId, torrentYear, torrentQuality, categories));
+        torrentInfo.style.display = "";
+        flexButton.style.display = "";
+    }
+});

contentScripts/addTorrent/functions.js

@@ -0,0 +1,259 @@
+/*************/
+/* FUNCTIONS */
+/*************/
+
+function alert(id){
+    document.querySelectorAll('.alert').forEach(function(elem){
+        elem.style.display = "none";
+    });
+    document.getElementById(id).style.display = "block";
+}
+
+function showAlert(id){
+    if (document.readyState !== "complete"){
+        document.addEventListener('readystatechange', function onReadyStateChange() {
+            alert(id);
+        }, false);
+    } else {
+        alert(id);
+    }
+}
+
+function addToDiscord() {
+    if(discordWebhookUrl === undefined){
+        showAlert('error_discord_button_alert')
+        return;
+    }
+
+    var inputs = document.forms['form_info'].querySelectorAll('input, select');
+    var dict = {}
+
+    for(var i = 0; i < inputs.length; i++){
+        input = inputs[i]
+        if(!input){
+            continue;
+        }
+        if(input.className.includes('error')){
+            showAlert('error_form_alert');
+            return;
+        }
+        dict[input.name] = input.value;
+    }
+
+    data = {
+        content: JSON.stringify(dict),
+        username: discordUserName,
+    }
+
+    xhr = new XMLHttpRequest();
+    xhr.open('POST', discordWebhookUrl);
+    xhr.setRequestHeader('Content-Type', 'multipart/form-data');
+    xhr.onload = function() {
+        if (xhr.status === 204) {
+           showAlert('valid_form_alert');
+        }
+        else{
+            showAlert('error_discord_button_alert');
+        }
+    };
+    xhr.send(JSON.stringify(data));
+}
+
+/*********************/
+/* GET HTML ELEMENTS */
+/*********************/
+
+function getInput(name, classes, type, value, attrs = {}) {
+    var inputNode = document.createElement('input');
+    inputNode.name = name;
+    inputNode.className = "form-control " + classes.join(" ");
+    inputNode.setAttribute("type", type);
+    for (var key in attrs) {
+        inputNode.setAttribute(key, attrs[key]);
+    }
+    inputNode.value = value;
+    return inputNode;
+}
+
+function getSelect(name, classes, options, selected, attrs = {}){
+    var selectNode = document.createElement('select');
+    selectNode.name = name;
+    selectNode.className = "form-control " + classes.join(" ");
+    for (var key in attrs) {
+        selectNode.setAttribute(key, attrs[key]);
+    }
+    for (var index in options){
+        var type = options[index];
+        var option = document.createElement("option");
+        option.value = type;
+        option.text = type;
+        if (type === selected)
+            option.setAttribute("selected", "selected");
+        selectNode.appendChild(option);
+    }
+    return selectNode;
+}
+
+function getFormGroup(input, label, name, size) {
+    var labelNode = document.createElement('label');
+    labelNode.className = "control-label";
+    labelNode.setAttribute("for", name);
+    labelNode.appendChild(document.createTextNode(label));
+
+    var div = document.createElement('div');
+    div.className = "form-group col-" + size;
+    div.appendChild(labelNode);
+    div.appendChild(input);
+    return div;
+}
+
+function getInputCol(label, name, classes, type, value, { size = 12, attrs = {}, onInput = false }){
+    var input = getInput(name, classes, type, value, attrs);
+    if(onInput){
+        input.addEventListener("input", onInput);
+    }
+    return getFormGroup(input, label, name, size);
+}
+
+function getSelectCol(label, name, classes, options, selected, { size = 12, attrs = {}, onInput = false }){
+    var select = getSelect(name, classes, options, selected, attrs);
+    if(onInput){
+        select.addEventListener("input", onInput);
+    }
+    return getFormGroup(select, label, name, size);
+}
+
+function getSecondRow(torrentType, torrentSeason, torrentEpisode, torrentId, torrentYear, torrentQuality, categories){
+    var size = 3;
+    var classes = [];
+    var onInput = false;
+    var row = document.createElement('div');
+    row.className = "row";
+    if(torrentType.season){
+        size = 2;
+        if(torrentSeason == ''){
+            classes = ['error'];
+        }
+        onInput = function() {
+            torrentSeason = formatEpisodeSeason(this.value);
+            this.value = torrentSeason;
+            if(torrentSeason === "")
+                this.className += ' error';
+            else
+                this.classList.remove('error');
+        }
+        row.appendChild(getInputCol("Saison", "season", classes, "number", torrentSeason, { size:size, attrs:{"min": "0"}, onInput:onInput }));
+        classes = [];
+        onInput = false;
+
+        if(torrentEpisode == ''){
+            classes = ['warning'];
+        }
+        onInput = function() {
+            torrentEpisode = formatEpisodeSeason(this.value);
+            this.value = torrentEpisode;
+            if(torrentEpisode === "")
+                this.className += ' warning';
+            else
+                this.classList.remove('warning');
+        }
+        row.appendChild(getInputCol("Episode", "episode", classes, "number", torrentEpisode,{ size:size, attrs:{"min": "0"}, onInput:onInput }));
+        classes = [];
+        onInput = false;
+
+        var space = document.createElement('div');
+        space.className = 'col-1';
+        row.appendChild(space);
+        row.appendChild(getInputCol("ID", "id", [], "text", torrentId, { size:size }));
+        row.appendChild(space.cloneNode());
+    }
+    else{
+        row.appendChild(getInputCol("ID", "id", [], "text", torrentId, { size:size }));
+        row.appendChild(getInputCol("Year", "year", ['warning'], "text", torrentYear, { size:size,
+                onInput:function() {
+                    if(this.value.length != 4){
+                        this.classList.remove('warning')
+                        this.classList += ' error'
+                    }
+                    else{
+                        this.classList.remove('error')
+                        this.classList.remove('warning')
+                    }
+                }
+            })
+        );
+    }
+
+    row.appendChild(getInputCol("Quality", "quality", [], "text", torrentQuality, { size:size }));
+
+    onInput = function() {
+        torrentType = getTypeFromName(categories, this.options[this.selectedIndex].value)
+        if(torrentType.name === 'unknown'){
+            this.className += ' error';
+        }
+        else{
+            this.classList.remove('error');
+            row.replaceWith(getSecondRow(torrentType, torrentSeason, torrentEpisode, torrentId, torrentYear, torrentQuality, categories))
+        }
+    }
+    categoriesNameList = categories.map(x => x.name);
+    if(torrentType.name === 'unknown'){
+        classes = ['error'];
+        categoriesNameList.push('unknown');
+    }
+    row.appendChild(getSelectCol('Types', 'type', classes, categoriesNameList, torrentType.name, { size:size, onInput:onInput }));
+    classes = []
+    onInput = false;
+
+    return row
+}
+
+
+/*********/
+/* Utils */
+/*********/
+
+/* Ensure the episode and season number is nice */
+function formatEpisodeSeason(value){
+    if(value > 0 && value <= 9){
+        if(value.includes("0")){
+            value = "" + parseInt(value);
+        }
+        value = "0" + value;
+    }
+    else{
+        while(value.substring(0,1) === "0"){
+            value = value.substring(1, value.length);
+        }
+    }
+    return value;
+}
+
+function getTypeFromUrl(categories) {
+    for (var i in categories) {
+        var urls = categories[i].urls
+        for(var j in urls){
+            if(path.indexOf(urls[j]) != -1){
+                return categories[i];
+            }
+        }
+    }
+    return {
+        name: "unknown",
+        season: false,
+        urls: ["/"]
+    };
+};
+
+function getTypeFromName(categories, name) {
+    for (var i in categories) {
+        if (categories[i].name === name){
+                return categories[i];
+        }
+    }
+    return {
+        name: "unknown",
+        season: false,
+        urls: ["/"]
+    };
+};

contentScripts/allPages/accessAllPages.js

@@ -0,0 +1,9 @@
+hideSidebar();
+
+$(window).on('resize', function(){
+    hideSidebar();
+});
+
+function hideSidebar() {
+    $(window).width() < 1750 ? $('#cat, .back-cat').removeClass('active') : $('#cat, .back-cat').addClass('active');
+}

contentScripts/allPages/allPages.js

@@ -0,0 +1,7 @@
+/* Inject scripts don't forget to add them to web_accessible_resources in manifest */
+injectScript(chrome.extension.getURL('/contentScripts/allPages/accessAllPages.js'), 'head');
+
+/* disable annoying fuckn popup */
+popup = document.querySelector('div.ad-alert-wrapper');
+if(popup && popup.style.display !== "none")
+    document.querySelector('button.ad-alert-message-continue-btn').click()

contentScripts/homePage.js

@@ -0,0 +1,2 @@
+var iframeYoutube = document.querySelector('iframe[src="https://www.youtube.com/embed/8dmTl4xAefk"]');
+iframeYoutube.remove();

css/style.css

@@ -0,0 +1,50 @@
+td a.butt.discord {
+    color: #E96B24 !important;
+    border: 3px solid #E96B24 !important;
+}
+td a.butt.discord:hover {
+    color: #ffffff !important;
+    background: #E96B24 !important;
+}
+
+.field-label-responsive {
+    padding-top: .5rem;
+    text-align: right;
+}
+
+input.error{
+    border-color: red;
+    background-color: #ffcfcf;
+}
+input.error:focus{
+    background-color: #ffcfcf;
+}
+
+
+select.error{
+    border-color: red;
+    background-color: #ffcfcf;
+}
+select.error:focus{
+    background-color: #ffcfcf;
+}
+
+input.warning{
+    border-color: orange;
+    background-color: #ffffd7;
+}
+input.warning:focus{
+    background-color: #ffffd7;
+}
+
+select.warning{
+    border-color: orange;
+    background-color: #ffffd7;
+}
+select.warning:focus{
+    background-color: #ffffd7;
+}
+
+select.form-control {
+    height: auto !important;
+}

js/utilsFunctions.js

@@ -0,0 +1,16 @@
+function injectScript(file, node) {
+    var th = document.getElementsByTagName(node)[0];
+    var s = document.createElement('script');
+    s.setAttribute('type', 'text/javascript');
+    s.setAttribute('src', file);
+    th.appendChild(s);
+}
+
+function injectLink(file, node) {
+    var th = document.getElementsByTagName(node)[0];
+    var link = document.createElement("link");
+    link.href = file;
+    link.type = "text/css";
+    link.rel = "stylesheet";
+    th.appendChild(link);
+}

manifest.json

@@ -0,0 +1,45 @@
+{
+    "name": "BetterYGG",
+    "version": "1.0",
+    "description": "Téléchargez des torrents sur YGG sans ètre connecté et autres !!!",
+    "icons": {
+      "16": "img/flexgg16.png",
+      "24": "img/flexgg24.png",
+      "32": "img/flexgg32.png",
+      "48": "img/flexgg48.png",
+      "64": "img/flexgg64.png",
+      "128": "img/flexgg128.png"
+    },
+    "options_page": "options/options.html",
+    "background": {
+      "scripts": ["backgroundScripts/background.js"],
+      "persistent": false
+    },
+    "permissions": [
+      "activeTab",
+      "storage"
+    ],
+    "web_accessible_resources" : [
+      "contentScripts/addTorrent/accessAddTorrent.js",
+      "contentScripts/allPages/accessAllPages.js",
+      "css/style.css"
+    ],
+    "content_scripts": [
+      {
+        "matches": ["https://*.yggtorrent.gg/torrent/*"],
+        "run_at": "document_idle",
+        "js": ["js/utilsFunctions.js", "contentScripts/addTorrent/functions.js", "contentScripts/addTorrent/addTorrent.js"]
+      },
+      {
+        "matches": ["https://*.yggtorrent.gg/"],
+        "run_at": "document_idle",
+        "js": [ "contentScripts/homePage.js"]
+      },
+      {
+        "matches": ["https://*.yggtorrent.gg/*"],
+        "run_at": "document_idle",
+        "js": ["js/utilsFunctions.js", "contentScripts/allPages/allPages.js"]
+      }
+    ],
+    "manifest_version": 2
+}

options/options.html

@@ -0,0 +1,83 @@
+<html>
+<head>
+    <title>Flexgg Options</title>
+    <style>
+        .center {
+            display: block;
+            margin-left: auto;
+            margin-right: auto;
+        }
+        #discordIntegrationSection {
+            display: none;
+        }
+        #displayAddCategoriesSection {
+            display: none;
+        }
+        #addCategoriesSection {
+            display: none;
+        }
+        ul {
+            list-style-type: none;
+        }
+        li {
+            margin: 0 0 5px 0;
+        }
+        li.section {
+            margin: 15px 0 5px 0;
+        }
+        table, th, td {
+            border: 1px solid black;
+            border-collapse: collapse;
+        }
+    </style>
+</head>
+<body cz-shortcut-listen="true">
+    <img class="center" src="../img/ygg.png" id="yggImage"><br/>
+    <ul>
+        <li>
+            <span>Ygg token: </span>
+            <input id="yggToken" type="text" size="35"/>
+        </li>
+        <li class="section">
+            <span>Afficher le formulaire discord: </span>
+            <input id="displayDiscord" type="checkbox"/>
+        </li>
+        <div id="discordIntegrationSection">
+            <li>
+                <span>Discord Webhook url: </span>
+                <input id="discordWebhookUrl" type="text" size="150"/>
+            </li>
+            <li>
+                <span>Discord Username: </span>
+                <input id="discordUserName" type="text"/>
+            </li>
+        </div>
+        <li id="displayAddCategoriesSection" class="section">
+            <span>Modifier les cat&eacute;gories: </span>
+            <input id="displayAddCategories" type="checkbox"/>
+        </li>
+        <div id="addCategoriesSection">
+            <li>
+                <button id="saveCategories">Sauvegarder</button>
+                <button id="restoreCategories">Restaurer valeurs par d&eacute;faut</button>
+            </li>
+            <li>
+                <table id="categoriesTable">
+                    <thead>
+                        <tr>
+                            <th>Nom de cat&eacute;gorie</th>
+                            <th>Saisonnier</th>
+                            <th>Url sur YGG</th>
+                        </tr>
+                    </thead>
+                    <tbody>
+
+                    </tbody>
+                </table>
+            </li>
+        </div>
+    </ul>
+
+    <script src="options.js"></script>
+</body>
+</html>

options/options.js

@@ -0,0 +1,199 @@
+var yggToken = document.getElementById('yggToken');
+var discordWebhookUrl = document.getElementById('discordWebhookUrl');
+var discordUserName = document.getElementById('discordUserName');
+var displayDiscord = document.getElementById('displayDiscord');
+var displayAddCategories = document.getElementById('displayAddCategories');
+
+var discordIntegration = document.getElementById('discordIntegrationSection');
+var displayAddCategoriesSection = document.getElementById('displayAddCategoriesSection');
+var addCategories = document.getElementById('addCategoriesSection');
+
+var categoriesTable = document.getElementById('categoriesTable').children[1];
+var buttonSaveCategories =  document.getElementById('saveCategories');
+var buttonRestoreCategories =  document.getElementById('restoreCategories');
+var defaultCategories = [];
+var categories = [];
+
+chrome.storage.sync.get(['yggToken', 'discordWebhookUrl', 'discordUserName', 'displayDiscord', 'displayAddCategories', 'categories', 'defaultCategories'], function(value){
+    if(value.yggToken)
+        yggToken.value = value.yggToken;
+    if(value.discordWebhookUrl)
+        discordWebhookUrl.value = value.discordWebhookUrl;
+    if(value.discordUserName)
+        discordUserName.value = value.discordUserName;
+    if(value.displayDiscord){
+        displayDiscord.checked = value.displayDiscord;
+        if (displayDiscord.checked){
+            discordIntegration.style.display = "block";
+            displayAddCategoriesSection.style.display = "block";
+            if (displayAddCategories.checked){
+                addCategories.style.display = "block";
+            }
+        }
+        else {
+            discordIntegration.style.display = "none";
+            displayAddCategoriesSection.style.display = "none";
+            addCategories.style.display = "none";
+        }
+        if(value.displayAddCategories){
+            displayAddCategories.checked = value.displayAddCategories;
+            if (displayAddCategories.checked){
+                addCategories.style.display = "block";
+            }
+            else {
+                addCategories.style.display = "none";
+            }
+        }
+    }
+    if(value.categories){
+        categories = value.categories;
+        makeCategoriesTable(categories);
+    }
+    if(value.defaultCategories){
+        defaultCategories = value.defaultCategories;
+        buttonSaveCategories.addEventListener('click', saveCategories)
+        buttonRestoreCategories.addEventListener('click', restoreDefaultCategories)
+    }
+});
+
+function addToStorage(name, value) {
+    chrome.storage.sync.set({ [name]: value });
+}
+
+document.addEventListener('DOMContentLoaded', function () {
+    yggToken.addEventListener('input', function(){
+        addToStorage('yggToken', this.value);
+    });
+    discordWebhookUrl.addEventListener('input', function(){
+        addToStorage('discordWebhookUrl', this.value);
+    });
+    discordUserName.addEventListener('input', function(){
+        addToStorage('discordUserName', this.value);
+    });
+    displayDiscord.addEventListener('input', function(){
+        addToStorage('displayDiscord', this.checked);
+        if (this.checked){
+            discordIntegration.style.display = "block";
+            displayAddCategoriesSection.style.display = "block";
+            if (displayAddCategories.checked){
+                addCategories.style.display = "block";
+            }
+        }
+        else {
+            discordIntegration.style.display = "none";
+            displayAddCategoriesSection.style.display = "none";
+            addCategories.style.display = "none";
+        }
+    });
+    displayAddCategories.addEventListener('input', function(){
+        addToStorage('displayAddCategories', this.checked);
+        if (this.checked)
+            addCategories.style.display = "block";
+        else {
+            addCategories.style.display = "none";
+        }
+    });
+});
+
+/***********************/
+/* Element constructor */
+/***********************/
+
+function makeCategoriesArray() {
+    lines = Array.from(categoriesTable.children)
+    var categoriesArray = []
+    for(var i in lines){
+        var line = lines[i];
+        name = line.getElementsByTagName('input').namedItem('name').value;
+        season = line.getElementsByTagName('input').namedItem('season').checked;
+        urls = line.getElementsByTagName('textarea').namedItem('urls').value;
+        urlsArray = urls.split('\n').filter(x => x != '')
+        if(name != ''){
+            categoriesArray.push({
+                name: name,
+                season: season,
+                urls: urlsArray
+            })
+        }
+    }
+    return categoriesArray;
+}
+
+function makeCategoriesTable(categories) {
+    var tbody = document.createElement('tbody');
+    for (var i in categories){
+        var line = categories[i];
+        var tr = getTr(line.name, line.season, line.urls, "Supprimer", deleteLine);
+        tbody.appendChild(tr)
+    }
+    var tr = getTr('', false, [], "Ajouter", addLine);
+    tbody.appendChild(tr)
+    categoriesTable.parentNode.replaceChild(tbody, categoriesTable)
+    categoriesTable = tbody;
+}
+
+function getTr(name, season, urls, buttonText, buttonOnClick){
+    var tr = document.createElement('tr');
+
+    var tdName = document.createElement('td');
+    var inputName = document.createElement('input');
+    inputName.type = "text";
+    inputName.name = "name";
+    inputName.value = name;
+    tdName.appendChild(inputName);
+    tr.appendChild(tdName);
+
+    var tdSeason = document.createElement('td');
+    var inputSeason = document.createElement('input');
+    inputSeason.type = "checkbox";
+    inputSeason.name = "season";
+    inputSeason.checked = season;
+    tdSeason.appendChild(inputSeason);
+    tr.appendChild(tdSeason);
+
+    var tdUrls = document.createElement('td');
+    var textareaUrls = document.createElement('textarea');
+    textareaUrls.name = "urls";
+    textareaUrls.rows="5";
+    textareaUrls.cols="75";
+    textareaUrls.value = urls.join('\n');
+    tdUrls.appendChild(textareaUrls);
+    tr.appendChild(tdUrls);
+
+    var tdTrash = document.createElement('td');
+    var button = document.createElement('button');
+    button.innerText = buttonText
+    button.addEventListener("click", buttonOnClick);
+    tdTrash.appendChild(button);
+    tr.appendChild(tdTrash);
+
+    return tr;
+}
+
+/*******************/
+/* Events Handlers */
+/*******************/
+
+function addLine(){
+    this.innerText = "Supprimer"
+    this.removeEventListener("click", addLine);
+    this.addEventListener("click", deleteLine);
+    var tr = getTr('', false, [], "Ajouter", addLine);
+    categoriesTable.appendChild(tr)
+}
+
+function deleteLine(){
+    this.parentElement.parentElement.remove()
+}
+
+function saveCategories(){
+    categories = makeCategoriesArray();
+    addToStorage('categories', categories);
+    makeCategoriesTable(categories);
+}
+
+function restoreDefaultCategories(){
+    categories = defaultCategories
+    addToStorage('categories', categories);
+    makeCategoriesTable(categories);
+}