Beta 05.02.18 (#1)

* beta-05.02.18

The release of beta-05.02.18 version. Added options: screenshot of thread, download of images, download of video, download of media, download of thread. Soon I'm going to refactor the code, so for now it's raw and uncommented.

* Deleted the old file

* Deleted the old file

* Deleted the old file

* Deleted the old file

* Deleted the old file

interaction/js/scripts/background/background-downloads.js

@@ -0,0 +1,51 @@
+chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
+    if (request.command === 'downloadThread') {
+        downloadThread();
+    } else if (request.command === 'downloadZip') {
+        chrome.downloads.download({url: request.url, filename: "1.zip"});
+    } else if (request.command === 'downloadImages') {
+        // сделать функцию определения формата.
+        for (var i = 0; i != request.images.length; i++) {
+            (function(i) {
+                setTimeout(function() {
+                    chrome.downloads.download({
+                        url: request.images[i], 
+                        filename: String(i) + '.jpg'
+                    });
+
+                    if (i + 1 === request.images.length) {
+                        sendResponse({status: true});
+                    }
+                }, 500 * i);
+            })(i);
+        }
+        return true;
+    } else if (request.command === 'downloadVideo') {
+        // сделать функцию определения формата.
+        for (var i = 0; i != request.videos.length; i++) {
+            (function(i) {
+                setTimeout(function() {
+                    chrome.downloads.download({
+                        url: request.videos[i], 
+                        filename: String(i) + '.webm'
+                    });
+
+                    if (i + 1 === request.videos.length) {
+                        sendResponse({status: true});
+                    }
+                }, 500 * i);
+            })(i);
+        }
+        return true;
+    }
+});
+
+
+function downloadThread() {
+    chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
+        chrome.pageCapture.saveAsMHTML({tabId: tabs[0].id}, function(MHTML) {
+            var url = URL.createObjectURL(MHTML);
+            chrome.downloads.download({url: url, filename: "thread.mhtml"});
+        });
+    });
+}

interaction/js/background/background-screenshot.js → interaction/js/scripts/background/background-screenshot.js

@@ -17,6 +17,8 @@ chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
         return true;
     } else if (request.command === "createImage") {
         createPostsImages();
+    } else if (request.command === "createThreadImage") {
+        createThreadImage();
     } else if (request.command === "error") {
         GLOBAL_BACKGROUND_URI = [];
         GLOBAL_BACKGROUND_IMAGES = [];
@@ -25,6 +27,81 @@ chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
 });
 
 
+function createThreadImage() {
+    GLOBAL_BACKGROUND_POST_COUNT = GLOBAL_BACKGROUND_URI.length;
+    var number = 0;
+    var i = 0;
+
+    while (i !== GLOBAL_BACKGROUND_URI.length - 1) {
+        var coordinate = GLOBAL_BACKGROUND_URI[i].coordinates;
+        var image = new Image();
+        image.src = GLOBAL_BACKGROUND_URI[i].image;
+
+        image.customProperty = {
+            number: number,
+            coordinateWidth: coordinate.width,
+            coordinateHeight: coordinate.height,
+            coordinatePageLeft: coordinate.pageLeft,
+            coordinatePageTop: coordinate.pageTop 
+        };   
+
+        image.onload = function () {
+            GLOBAL_BACKGROUND_IMAGES[this.customProperty.number] = this;
+        };
+
+        number++;
+        i++;
+    }
+
+    // last image should be cropped.
+
+    var coordinate = GLOBAL_BACKGROUND_URI[i].coordinates;
+    var image = new Image(); 
+    image.src = GLOBAL_BACKGROUND_URI[i].image;
+
+    image.customProperty = {
+        number: number,
+        coordinateWidth: coordinate.width,
+        coordinateHeight: coordinate.height,
+        coordinatePageLeft: coordinate.pageLeft,
+        coordinatePageTop: coordinate.pageTop 
+    };   
+
+    image.onload = function () {
+        var canvas = document.createElement("canvas");
+        var context = canvas.getContext("2d");
+        canvas.width = this.customProperty.coordinateWidth;
+        canvas.height = this.customProperty.coordinateHeight
+        context.drawImage(
+            this,
+            this.customProperty.coordinatePageLeft, 
+            0,
+            this.customProperty.coordinateWidth,
+            this.customProperty.coordinateHeight,
+            0,
+            0,
+            this.customProperty.coordinateWidth, 
+            this.customProperty.coordinateHeight
+        );
+
+        var croppedURL = canvas.toDataURL("image/png");
+        var croppedImage = new Image();
+
+        croppedImage.src = croppedURL;
+        croppedImage.customProperty = {
+            number: this.customProperty.number
+        };
+
+        croppedImage.onload = function() {
+            GLOBAL_BACKGROUND_URI = [];
+            GLOBAL_BACKGROUND_IMAGES[this.customProperty.number] = this;
+            createImage();
+        }
+    };
+
+}
+
+
 /**
  * Creates screenshot of visible window and
  * adds a pair (coordinates - image) to the URI.
@@ -161,7 +238,15 @@ function createImage() {
     }
 
     var url = canvas.toDataURL("image/png");
-    chrome.tabs.create({url: url, active: false, selected: false});
+    //chrome.tabs.create({url: url, active: false, selected: false});
+
+    /*
+    var tempImage = new Image();
+    tempImage.src = url;
+    tempImage.onload = function() {
+        chrome.downloads.download({url: url, filename: "thread.mhtml"});
+    };
+    */chrome.downloads.download({url: url, filename: "1.jpg"});
 
     GLOBAL_BACKGROUND_IMAGES = [];
     GLOBAL_BACKGROUND_POST_COUNT = 0;

interaction/js/scripts/content/content-downloads.js

@@ -0,0 +1,187 @@
+function onMessage(request, sender, sendResponse) {
+    if (request.command === 'downloadImages') {
+        downloadImages();
+    } else if (request.command === 'downloadVideo') {
+        downloadVideo();
+    } else if (request.command === 'downloadMedia') {
+        downloadMedia();
+    }
+}
+
+
+function downloadMedia() {
+    downloadImages(function(response) {
+        if (response.status === true) {
+            downloadVideo();
+        }
+    });
+}
+
+
+function downloadVideo(callback) {
+    var thread = document.getElementById('posts-form');
+
+    var previewVideos = thread.querySelectorAll('img.webm-file');
+    var fullVideos = [];
+    var i = 0;
+
+    while (i != previewVideos.length) {
+        var fullVideo = getParent(previewVideos[i], function(element) {
+            return (element.tagName === 'A');
+        });
+
+        fullVideos[i] = fullVideo.href;
+        i++;
+    }
+
+    previewVideos = null;
+
+    callback = callback || function() {};
+
+    sendMessageToBackgroundScript({command: 'downloadVideo', videos: fullVideos}, function(response) {
+        callback(response);
+    });
+}
+
+
+function downloadImages(callback) {
+    var thread = document.getElementById('posts-form');
+
+    var previewImages = thread.querySelectorAll('img.preview:not(.webm-file)');
+    var fullImages = [];
+    var i = 0;
+
+    while (i != previewImages.length) {
+        var fullImage = getParent(previewImages[i], function(element) {
+            return (element.tagName === 'A');
+        });
+
+        fullImages[i] = fullImage.href;
+        i++;
+    }
+
+    previewImages = null;
+    callback = callback || function() {};
+
+    sendMessageToBackgroundScript({command: 'downloadImages', images: fullImages}, function(response) {
+        callback(response);
+    });
+}
+
+
+// It is for archiving files into a .zip archive.
+// However, it is sucks on a large pages.
+// The current version is very raw and try not to use it.
+// I'll turn off it for now. 
+// So, someday i either modify it or delete it.
+/*
+function downloadImagesZip() {
+    var thread = document.getElementById('posts-form');
+
+    var previewImages = thread.getElementsByTagName('img');
+    var fullImages = [];
+    var i = 0;
+
+    while (i != previewImages.length) {
+        var fullImage = getParent(previewImages[i], function(element) {
+            return element.tagName === 'A';
+        });
+
+        fullImages[i] = fullImage.href;
+        i++;
+    }
+
+    previewImages = null;
+    var zip = new JSZip();
+    i = 0;
+    var num = 0;
+
+    while (i != fullImages.length) {
+        toDataURL(fullImages[i], 'image/jpeg', function(uri) {
+            zip.file(String(num) + '.png', uri.slice(22), {base64: true});
+            num++;
+
+            if (num === fullImages.length) {
+                fullImages = null;
+
+                if (JSZip.support.uint8array) {
+                    promise = zip.generateAsync({type : 'blob'});
+                } else {
+                    promise = zip.generateAsync({type : 'string'});
+                }
+
+                promise.then(function(blob) {
+                    var url = URL.createObjectURL(blob);
+                    sendMessageToBackgroundScript({command: 'downloadZip', url: url});
+                });
+            }
+        });
+
+        i++;
+    }
+}
+
+function toDataURL(src, outputFormat, callback) {
+    var img = new Image();
+    img.crossOrigin = 'Anonymous';
+
+    img.onload = function() {
+        var canvas = document.createElement('CANVAS');
+        var ctx = canvas.getContext('2d');
+        var dataURL;
+        canvas.height = this.naturalHeight;
+        canvas.width = this.naturalWidth;
+        ctx.drawImage(this, 0, 0);
+        dataURL = canvas.toDataURL(outputFormat, 1.0);
+        callback(dataURL);
+    };
+
+    img.src = src;
+}
+
+
+// function to create a file in the HTML5 temporary filesystem
+function createFile(filename, callback) {
+    webkitRequestFileSystem(TEMPORARY, 4 * 1024 * 1024, function(fs) {
+      fs.root.getFile(filename, { create : true }, callback);
+    });
+  }
+
+*/
+
+
+/**
+ * Gets a parent of the HTML element.
+ * 
+ * @param {HTMLElement} element 
+ * A beginning element.
+ * 
+ * @param {function(HTMLElement) => Boolean} condition
+ * A condition to complete.
+ * 
+ * @returns {HTMLElement}
+ * If condition was not declared, then document will be return.
+ * Otherwise element which satisfies condition will be return.
+ */
+function getParent(element, condition) {
+    condition = condition || function(element) {return false;};
+    var parent;
+
+    do {
+        parent = element;
+        element = element.parentNode;
+    } while (element && !condition(parent));
+
+    return parent;
+}
+
+function sendMessageToBackgroundScript(message, callback) {
+    callback = callback || function() {};
+
+    chrome.runtime.sendMessage(message, function(response) {
+        callback(response);
+    });
+}
+
+chrome.runtime.onMessage.addListener(onMessage);
+