Shoora
6/17/2013 - 8:12 AM

очередной букмарклет парсер, но уже для kia.ua

очередной букмарклет парсер, но уже для kia.ua

javascript:
    /**
     * простой букмарклет, который парсит фотки из http://www.kia.ua/
     */
    (function () {
        var a = document.querySelectorAll("#thumbs .thumbs .thumb");
        var docHeight = document.height;
        /**
         * Создаю фон прелоадера
         * @type {*}
         */
        var overlay = document.createElement("div");
        overlay.id = "overlay";
        overlay.style.position = "fixed";
        overlay.style.top = 0;
        overlay.style.left = 0;
        overlay.style.width = "100%";
        overlay.style.height = "100%";
        overlay.style.zIndex = 999;
        overlay.style.background = "rgba(255,255,255,0.9)";
        document.body.appendChild(overlay);

        var loadingWrap = document.createElement("span");
        var loadingText = "Минуточку! \n Загружается содержимое сайта";
        loadingWrap.id = "loading_wrap";
        loadingWrap.style.display = "block";
        loadingWrap.style.width = "100%";
        loadingWrap.style.height = "70px";
        loadingWrap.style.position = "absolute";
        loadingWrap.style.top = "10px";
        loadingWrap.style.color = "#face00";
        loadingWrap.style.font = "italic 700 3.5em \"Georgia\", serif";
        loadingWrap.style.textAlign = "center";
        loadingWrap.textContent = loadingText;

        var progressBar = document.createElement("div");
        progressBar.id = "prgrs_wrap";
        progressBar.style.position = "absolute";
        progressBar.style.top = 0;
        progressBar.style.left = 0;
        progressBar.style.height = "80px";
        progressBar.style.width = "100%";

        var progressBarIn = document.createElement("div");
        progressBarIn.id = "prgrs";
        progressBarIn.style.position = "absolute";
        progressBarIn.style.top = 0;
        progressBarIn.style.left = 0;
        progressBarIn.style.height = "100%";
        progressBarIn.style.width = 0;
        progressBarIn.style.background = "#face00";
        progressBarIn.style.cursor = "pointer";
        progressBarIn.style.zIndex = 9999;

        var listLink = document.createElement("ul");
        listLink.id = "list_link";
        listLink.style.display = "block";
        listLink.style.width = "400px";
        listLink.style.height = docHeight - 90 + "px";
        listLink.style.position = "relative";
        listLink.style.margin = "90px auto 0";
        listLink.style.overflow = "auto";
        listLink.style.font = "0.5em \"Verdana\", sans-serif";
        listLink.style.textAlign = "left";

        document.getElementById("overlay").appendChild(progressBar);
        document.getElementById("prgrs_wrap").appendChild(progressBarIn);
        document.getElementById("overlay").appendChild(loadingWrap);
        document.getElementById("overlay").appendChild(listLink);

        var images = [];
        var download = [];
        var canv = [];

        var canvasWrap = document.createElement("div");
        canvasWrap.id = "cnvs";
        canvasWrap.style.display = "none";
        document.body.appendChild(canvasWrap);

        function makeImgArrs() {
            for (var i = 0; i < a.length; i++) {
                
                var im = a[i].children[0];
                var link = im.src;
                var properLink = link.slice(0,-7);
                var linkTitle = a[i].href;
                var img = new Image();
                var canvas = document.createElement("canvas");
                var listItem = document.createElement("li");
                listItem.id = "list_link"+i;
                listItem.style.margin = "5px 0 2px";
                listItem.style.visibility = "hidden";
                canvas.id = "canv"+i;
                canv.push(canvas);
                document.getElementById("cnvs").appendChild(canvas);
                document.getElementById("list_link").appendChild(listItem);

                images.push(img);
                img.src = properLink + ".jpg";
                img.alt = linkTitle.slice(0,-8);
                img.id = "img" + i;

            }
            return images;
        }

        function setCanvas() {
            var images = makeImgArrs();
            var imgLength = images.length;
            var prgS = 100/imgLength;
            var prgStep = Math.round(prgS);
            var prgW = prgStep;
            var count = 0;
            var li = document.querySelectorAll("#list_link > li");
            for (var i=0; i < imgLength; i++) {

                images[i].onload = function(e){
                    var dataLink = document.createElement("a");
                    dataLink.id = "link"+count;
                    dataLink.style.color = "#f16767";
                    dataLink.style.textDecoration = "none";
                    dataLink.style.borderBottom = "1px solid #face00";
                    var c = document.getElementById("canv"+count);
                    dataLink.download = parseInt(count,10) + "_"+this.alt + "_.jpg";
                    dataLink.textContent = parseInt(count,10) + "_"+this.alt;

                    prgW += prgStep;
                    progressBarIn.style.width = prgW + "%";

                    c.width = this.width;
                    c.height = this.height;
                    var context = c.getContext('2d');
                    context.drawImage(this, 0, 0);
                    var data = c.toDataURL('image/jpeg', '');

                    dataLink.href = data;

                    li[count].appendChild(dataLink);
                    li[count].style.visibility = "visible";

                    count++;
                };
            }
        }

        document.getElementById("prgrs").onclick = function(){
            var overlayWarp = document.getElementById("overlay");
            var canvasWrap = document.getElementById("cnvs");
            overlayWarp.parentNode.removeChild(overlayWarp);
            canvasWrap.parentNode.removeChild(canvasWrap);
        };

        setCanvas();
    })();