Litihum73 / Dpstream - My series

// ==UserScript==
// @name         Dpstream - My series
// @copyright	 2017, Lithium73
// @licence		 MIT
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  Save series most viewed on dpstream and display it in mainPage
// @author       You
// @match        https://www.dpstream.net/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';
    var $ = jQuery;
    var url = location.href;
    var title = $("#info-generales .tv_titleststus .tv_title").text();
    title = title.replace(/\n|\r/g,'');
    title = title.trim();
    var item = {};

    if(localStorage.getItem("myselection")){
        item = JSON.parse(localStorage.getItem("myselection"));
    }
    var sortedArray = [];
    if(location.href.indexOf('serie-') != -1){
         if(item[title]){             
             item[title].occurence = item[title].occurence+1;
             localStorage.setItem("myselection",JSON.stringify(item));
         }else{             
             item[title] = {
                 'title' : title,
                 'href' : url,
                 'occurence': 0
             };
             localStorage.setItem("myselection",JSON.stringify(item));
         }
    }
    //sort object
    var security = 0;
    while(Object.keys(item).length){
        security++;
        if(security > 1000)break;
        var lastOccurence = 0;
        var objectToKeep = null;
        for(var serie in item){
            if(lastOccurence <= item[serie].occurence){
                lastOccurence = item[serie].occurence;
                objectToKeep = serie;
            }
        }
        sortedArray.push(item[objectToKeep]);
        delete item[objectToKeep];
    }

    var mainDiv = $('<div>');
    mainDiv.attr('class','myselection pull-right');

    mainDiv.css("width","200px");
    mainDiv.css("height","600px");
    mainDiv.css("background-color","rgba(0,0,0,0.5)");
    mainDiv.css("text-align","center");
    mainDiv.css("margin-top","118px");
    mainDiv.css("overflow-y","auto");
    mainDiv.css("overflow-x","hidden");
    mainDiv.css("border","1px solid black");

    var titleNode = $('<div>');
    titleNode.text('Ma selection série');
    titleNode.css('font-weight','bold');
    titleNode.css('background-color','white');
    mainDiv.append(titleNode);

    for(var serie in sortedArray){
        var itemNode =$('<div>');
        itemNode.css('width','200px');
        itemNode.css('float','left');
        itemNode.css('margin-top','10px');
        itemNode.css('text-align','center');


        var serieTitleNode = $('<div>');
        serieTitleNode.css('width','150px');
        serieTitleNode.css('float','left');
        serieTitleNode.css('text-overflow','ellipsis');
        serieTitleNode.css('overflow','hidden');
        serieTitleNode.css('height','20px');
        serieTitleNode.css('display','inline-block');
        serieTitleNode.css('white-space','nowrap');
        serieTitleNode.css('color','#f1aa22');
        serieTitleNode.css('cursor','pointer');
        serieTitleNode.text(sortedArray[serie].title);
        serieTitleNode.attr('href',sortedArray[serie].href);
        serieTitleNode.on('click',function(e){
            document.location.href = jQuery(e.originalEvent.target).attr('href');
        });

        itemNode.append(serieTitleNode);

        var removeNode = $('<div>');
        removeNode.text('X');
        removeNode.attr('title',sortedArray[serie].title);
        removeNode.css('border','1px solid white');
        removeNode.css('cursor','pointer');
        removeNode.css('color','white');
        removeNode.css('height','20px');
        removeNode.css('width','20px');
        removeNode.css('float','left');
        removeNode.css('margin-left','10px');
        removeNode.on('click',function(e){
            var title =  jQuery(e.originalEvent.target).attr('title');
            var ls = JSON.parse(localStorage.getItem('myselection'));
            delete ls[title];
            localStorage.setItem('myselection',JSON.stringify(ls));
            jQuery(e.originalEvent.target).parent().remove();
        });

        itemNode.append(removeNode);

        mainDiv.append(itemNode);

    }
    var currentWidth = $('#main .container')[0].offsetWidth;
    $('#main .container').css('width',currentWidth+400);
    $('#main .container #content').css('width','64%');
    mainDiv.insertAfter($('#main .container #content'));




    // Your code here...
})();