1.2.1 (#37)

The release of 1.2.1 version.
Amaimersion · Jan 18, 2019 · acb78ff · acb78ff
1 parent 99e5288
commit acb78ff
Show file tree

Hide file tree

Showing 12 changed files with 11,585 additions and 11,515 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,3 +1,15 @@
+# 1.2.1 (18 января, 2019)
+
+## Расширение
+
+### Исправлено
+
+- Расширение адаптировано под новую верстку сайта.
+
+### Добавлено
+
+- Во время создания скриншота будет скрываться админ-панель.
+
 # 1.2.0 (7 августа, 2018)
 
 ## Расширение

diff --git a/README.md b/README.md
@@ -37,7 +37,7 @@
 Расширение доступно для установки из следующих интернет-магазинов:
 - [Google Chrome Web Store](https://chrome.google.com/webstore/detail/2ch-helper/cdbeejpneccnfkmmmefieghgffglidmm)
 - [Mozilla Firefox Web Store](https://addons.mozilla.org/ru/firefox/addon/2ch-helper/)
-- [Opera Web Store]()
+- ~~Opera Web Store~~
 
 1. Перейдите в один из вышеперечисленных магазинов.
 2. Нажмите `Установить`.

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,63 +1,63 @@
-{
-    "name": "2ch-helper",
-    "version": "1.2.0",
-    "description": "A browser extension which facilitates interaction with the imageboard 2ch.hk.",
-    "scripts": {
-        "watch:chromium:dev": "webpack --watch --config webpack.config.dev --env.platform=chromium --env.dontRemove=true",
-        "watch:firefox:dev": "webpack --watch --config webpack.config.dev --env.platform=firefox --env.dontRemove=true",
-        "build:chromium:prod": "webpack --config webpack.config.prod --env.platform=chromium",
-        "build:chromium:dev": "webpack --config webpack.config.dev --env.platform=chromium",
-        "build:firefox:prod": "webpack --config webpack.config.prod --env.platform=firefox",
-        "build:firefox:dev": "webpack --config webpack.config.dev --env.platform=firefox",
-        "zip:chromium": "bestzip ./dist/chromium.zip ./dist/chromium/*",
-        "zip:firefox": "bestzip ./dist/firefox.zip ./dist/firefox/*",
-        "clean": "rimraf ./dist",
-        "clean:chromium": "rimraf ./dist/chromium ./dist/chromium.zip",
-        "clean:firefox": "rimraf ./dist/firefox ./dist/firefox.zip",
-        "build": "npm run build:prod",
-        "build:prod": "npm run build:chromium:prod && npm run build:firefox:prod",
-        "build:dev": "npm run build:chromium:dev && npm run build:firefox:dev",
-        "zip": "npm run zip:chromium && npm run zip:firefox",
-        "build-zip": "npm run build-zip:chromium:prod && npm run build-zip:firefox:prod",
-        "build-zip:chromium:prod": "npm run build:chromium:prod && npm run zip:chromium",
-        "build-zip:chromium:dev": "npm run build:chromium:dev && npm run zip:chromium",
-        "build-zip:firefox:prod": "npm run build:firefox:prod && npm run zip:firefox",
-        "build-zip:firefox:dev": "npm run build:firefox:dev && npm run zip:firefox"
-    },
-    "author": {
-        "name": "Sergey Kuznetsov",
-        "url": "https://github.com/Amaimersion"
-    },
-    "repository": {
-        "type": "git",
-        "url": "https://github.com/Amaimersion/2ch-helper"
-    },
-    "bugs": {
-        "url": "https://github.com/Amaimersion/2ch-helper/issues"
-    },
-    "license": "MIT",
-    "private": true,
-    "dependencies": {
-        "exif-js": "^2.3.0"
-    },
-    "devDependencies": {
-        "@types/chrome": "0.0.63",
-        "awesome-typescript-loader": "^5.2.0",
-        "bestzip": "^1.1.4",
-        "copy-webpack-plugin": "^4.5.2",
-        "css-loader": "^0.28.11",
-        "extract-text-webpack-plugin": "^4.0.0-beta.0",
-        "html-webpack-plugin": "^3.2.0",
-        "node-sass": "^4.9.2",
-        "pug": "^2.0.3",
-        "pug-loader": "^2.4.0",
-        "remove-files-webpack-plugin": "^1.0.0",
-        "rimraf": "^2.6.2",
-        "sass-loader": "^6.0.7",
-        "typescript": "^2.9.2",
-        "validate-html-links-webpack-plugin": "^1.0.0",
-        "webpack": "^4.15.1",
-        "webpack-cli": "^2.1.5",
-        "webpack-merge": "^4.1.3"
-    }
-}
+{
+    "name": "2ch-helper",
+    "version": "1.2.1",
+    "description": "A browser extension which facilitates interaction with the imageboard 2ch.hk.",
+    "scripts": {
+        "watch:chromium:dev": "webpack --watch --config webpack.config.dev --env.platform=chromium --env.dontRemove=true",
+        "watch:firefox:dev": "webpack --watch --config webpack.config.dev --env.platform=firefox --env.dontRemove=true",
+        "build:chromium:prod": "webpack --config webpack.config.prod --env.platform=chromium",
+        "build:chromium:dev": "webpack --config webpack.config.dev --env.platform=chromium",
+        "build:firefox:prod": "webpack --config webpack.config.prod --env.platform=firefox",
+        "build:firefox:dev": "webpack --config webpack.config.dev --env.platform=firefox",
+        "zip:chromium": "bestzip ./dist/chromium.zip ./dist/chromium/*",
+        "zip:firefox": "bestzip ./dist/firefox.zip ./dist/firefox/*",
+        "clean": "rimraf ./dist",
+        "clean:chromium": "rimraf ./dist/chromium ./dist/chromium.zip",
+        "clean:firefox": "rimraf ./dist/firefox ./dist/firefox.zip",
+        "build": "npm run build:prod",
+        "build:prod": "npm run build:chromium:prod && npm run build:firefox:prod",
+        "build:dev": "npm run build:chromium:dev && npm run build:firefox:dev",
+        "zip": "npm run zip:chromium && npm run zip:firefox",
+        "build-zip": "npm run build-zip:chromium:prod && npm run build-zip:firefox:prod",
+        "build-zip:chromium:prod": "npm run build:chromium:prod && npm run zip:chromium",
+        "build-zip:chromium:dev": "npm run build:chromium:dev && npm run zip:chromium",
+        "build-zip:firefox:prod": "npm run build:firefox:prod && npm run zip:firefox",
+        "build-zip:firefox:dev": "npm run build:firefox:dev && npm run zip:firefox"
+    },
+    "author": {
+        "name": "Sergey Kuznetsov",
+        "url": "https://github.com/Amaimersion"
+    },
+    "repository": {
+        "type": "git",
+        "url": "https://github.com/Amaimersion/2ch-helper"
+    },
+    "bugs": {
+        "url": "https://github.com/Amaimersion/2ch-helper/issues"
+    },
+    "license": "MIT",
+    "private": true,
+    "dependencies": {
+        "exif-js": "^2.3.0"
+    },
+    "devDependencies": {
+        "@types/chrome": "0.0.63",
+        "awesome-typescript-loader": "^5.2.1",
+        "bestzip": "^1.1.6",
+        "copy-webpack-plugin": "^4.6.0",
+        "css-loader": "^0.28.11",
+        "extract-text-webpack-plugin": "^4.0.0-beta.0",
+        "html-webpack-plugin": "^3.2.0",
+        "node-sass": "^4.11.0",
+        "pug": "^2.0.3",
+        "pug-loader": "^2.4.0",
+        "remove-files-webpack-plugin": "^1.0.0",
+        "rimraf": "^2.6.3",
+        "sass-loader": "^6.0.7",
+        "typescript": "^2.9.2",
+        "validate-html-links-webpack-plugin": "^1.0.0",
+        "webpack": "^4.15.1",
+        "webpack-cli": "^2.1.5",
+        "webpack-merge": "^4.1.3"
+    }
+}
diff --git a/src/interaction/js/content/exif.ts b/src/interaction/js/content/exif.ts
@@ -180,7 +180,7 @@ abstract class Exif {
      * Defaults to `API.getThread()`.
      */
     public static bindFigures(element: HTMLElement = API.getThread()): void {
-        const figures = element.querySelectorAll<HTMLElement>("figure.image");
+        const figures = element.querySelectorAll<HTMLElement>("figure.post__image");
 
         figures.forEach((figure) => {
             this.bindFigure(figure);
@@ -200,7 +200,7 @@ abstract class Exif {
         }).href;
         const spanFileSize = API.getElement<HTMLSpanElement>({
             dcmnt: figure,
-            selector: "figcaption > span.filesize",
+            selector: "figcaption > span.post__filezise",
             errorMessage: "Could not find a span."
         });
 

diff --git a/src/interaction/js/content/notifications.ts b/src/interaction/js/content/notifications.ts
@@ -33,7 +33,7 @@ abstract class Observer {
     protected static observerEvent: MutationCallback = (mutations) => {
         for (let mutation of mutations) {
             for (let node of mutation.addedNodes) {
-                if (!Observer.isNewPostNode(node as HTMLElement)) {
+                if (!Observer.isPostNode(node as HTMLElement)) {
                     continue;
                 }
 
@@ -49,15 +49,27 @@ abstract class Observer {
      *
      * @param node The node for checking.
      */
-    protected static isNewPostNode(node: HTMLElement): boolean {
+    protected static isPostNode(node: HTMLElement): boolean {
         const postTags = ["div"];
         const postId = new RegExp(/((post)-*)/, "");
 
         return (
             node.tagName &&
             postTags.includes(node.tagName.toLowerCase()) &&
-            node.id &&
-            postId.test(node.id.toLowerCase())
+            (
+                // old layout, without empty parent div.
+                (
+                    node.id &&
+                    postId.test(node.id.toLowerCase()
+                )) ||
+
+                // now all new posts is wrapped in empty div.
+                (
+                    node.firstElementChild &&
+                    node.firstElementChild.id &&
+                    postId.test(node.firstElementChild.id.toLowerCase())
+                )
+            )
         );
     }
 
@@ -67,10 +79,12 @@ abstract class Observer {
      * @param post The post for checking.
      */
     protected static isReplyPost(post: HTMLElement): boolean {
-        const replyPostClasses = ["reply-posts-marker"];
+        const replyPostClasses = [
+            ".post_type_replied"
+        ];
 
         const containClass = replyPostClasses.some((element) => {
-            return post.classList.contains(element);
+            return !!post.querySelector(element);
         });
 
         return containClass;
@@ -143,9 +157,15 @@ export abstract class Notifications {
      * @param node The post div.
      */
     protected static getPostInfo(node: HTMLElement): PostInfo {
-        const messageElement = node.querySelector<HTMLElement>(".post-message");
+        const messageElement = node.querySelector<HTMLElement>(".post__message");
         const messageText = messageElement ? messageElement.innerText : "Не удалось получить сообщение поста.";
 
+        if (!node.id) {
+            // in new layout a new posts is wrapped in empty div.
+            // so, we are searching for actual post.
+            node = node.querySelector(`[id*=post]`);
+        }
+
         const href = node.id ? `${window.location.pathname}#${node.id}` : window.location.pathname;
 
         return {message: messageText, href: href};

diff --git a/src/interaction/js/content/page-elements.ts b/src/interaction/js/content/page-elements.ts
@@ -405,7 +405,7 @@ abstract class Custom {
         try {
             figures = API.getElements<Elements.Element>({
                 dcmnt: element,
-                selector: "figure.image",
+                selector: "figure.post__image",
                 errorMessage: "Could not find a figure elements."
             });
         } catch (error) {

diff --git a/src/interaction/js/content/screenshot.ts b/src/interaction/js/content/screenshot.ts
@@ -277,6 +277,7 @@ interface ElementsInstances {
     postPanelInstance: HTMLElement;
     checkboxInstance: HTMLElement;
     spoilerInstance: HTMLElement;
+    adminbarInstance: HTMLElement;
     customDownloadButton: HTMLDivElement;
     customInfoButton: HTMLDivElement;
 }
@@ -297,6 +298,7 @@ interface DefaultOptions {
     postPanelDisplay: string;
     checkboxDisplay: string;
     spoilerColor: string;
+    adminbarDisplay: string;
     customDownloadButtonDisplay: string;
     customInfoButtonDisplay: string;
 }
@@ -311,9 +313,10 @@ export abstract class PageOptions {
         boardStatsBox: "#boardstats-box",
         favoritesBox: "#favorites-box",
         autorefresh: "#autorefresh-checkbox-bot",
-        postPanel: ".postpanel",
-        checkbox: `.post-details > input[type="checkbox"]`,
+        postPanel: ".post__details .post__detailpart:last-of-type",
+        checkbox: `.post__details > input[type="checkbox"]`,
         spoiler: ".spoiler",
+        adminbar: ".adminbar",
         customDownloadButton: `.${PageElements.customClasses.downloadButton}`,
         customInfoButton: ".custom-2ch-helper-info-button"
     };
@@ -334,7 +337,8 @@ export abstract class PageOptions {
             customInfoButton: this.getElement(this.selectors.customInfoButton) as HTMLDivElement,
             postPanelInstance: this.getElement(this.selectors.postPanel),
             checkboxInstance: this.getElement(this.selectors.checkbox),
-            spoilerInstance: this.getElement(this.selectors.spoiler)
+            spoilerInstance: this.getElement(this.selectors.spoiler),
+            adminbarInstance: this.getElement(this.selectors.adminbar)
         };
     }
 
@@ -360,6 +364,7 @@ export abstract class PageOptions {
             postPanelDisplay: this._elements.postPanelInstance ? this._elements.postPanelInstance.style.display : undefined,
             checkboxDisplay: this._elements.checkboxInstance ? this._elements.checkboxInstance.style.display : undefined,
             spoilerColor: this._elements.spoilerInstance ? this._elements.spoilerInstance.style.color : undefined,
+            adminbarDisplay: this._elements.adminbarInstance ? this._elements.adminbarInstance.style.display : undefined,
             customDownloadButtonDisplay: this._elements.customDownloadButton ? this._elements.customDownloadButton.style.display : undefined,
             customInfoButtonDisplay: this._elements.customInfoButton ? this._elements.customInfoButton.style.display : undefined
         };
@@ -402,6 +407,11 @@ export abstract class PageOptions {
             element.style.color = "inherit";
         });
 
+        const adminbars = document.querySelectorAll<HTMLElement>(this.selectors.adminbar);
+        adminbars.forEach((element) => {
+            element.style.display = "none";
+        });
+
         const customDownloadButtons = document.querySelectorAll<HTMLElement>(this.selectors.customDownloadButton);
         customDownloadButtons.forEach((element) => {
             element.style.display = "none";
@@ -443,6 +453,11 @@ export abstract class PageOptions {
             element.style.color = this._defaults.spoilerColor;
         });
 
+        const adminbars = document.querySelectorAll<HTMLElement>(this.selectors.adminbar);
+        adminbars.forEach((element) => {
+            element.style.display = this._defaults.adminbarDisplay;
+        });
+
         const customDownloadButtons = document.querySelectorAll<HTMLElement>(this.selectors.customDownloadButton);
         customDownloadButtons.forEach((element) => {
             element.style.display = this._defaults.customDownloadButtonDisplay;

diff --git a/src/interaction/js/content/title-generation.ts b/src/interaction/js/content/title-generation.ts
@@ -264,7 +264,7 @@ export abstract class TitleGeneration {
      */
     public static generateTitle(thread: HTMLElement): void {
         // if already exists.
-        if (thread.querySelector(".post-title")) {
+        if (thread.querySelector(".post__title")) {
             return;
         }
 
@@ -278,7 +278,7 @@ export abstract class TitleGeneration {
         }
 
         const span = document.createElement("span");
-        span.classList.add("post-title");
+        span.classList.add("post__title");
         span.innerText = title;
 
         const beforeElement = this.getBeforeInsertElement(thread);
@@ -288,7 +288,7 @@ export abstract class TitleGeneration {
         } else {
             const postDetails = API.getElement<HTMLElement>({
                 dcmnt: thread,
-                selector: ".post-details",
+                selector: ".post__details",
                 errorMessage: "Could not find a post details elements."
             });
             postDetails.appendChild(span);
@@ -306,7 +306,7 @@ export abstract class TitleGeneration {
     protected static createTitle(thread: HTMLElement): string {
         const message = API.getElement<HTMLElement>({
             dcmnt: thread,
-            selector: ".post-message",
+            selector: ".post__message",
             errorMessage: "Could not find a post message."
         });
 
@@ -359,25 +359,25 @@ export abstract class TitleGeneration {
      * @returns Returns `undefined` if cannot find.
      */
     protected static getBeforeInsertElement(thread: HTMLElement): HTMLElement {
-        const details = thread.querySelector("div.post-details");
+        const details = thread.querySelector("div.post__details");
 
         if (!details) return undefined;
 
         let element = undefined;
 
-        element = details.querySelector(".ananimas");
+        element = details.querySelector(".post__anon");
         if (element) return element;
 
-        element = details.querySelector(".post-email");
+        element = details.querySelector(".post__email");
         if (element) return element;
 
-        element = details.querySelector(".posttime");
+        element = details.querySelector(".post__time");
         if (element) return element;
 
-        element = details.querySelector(".reflink");
+        element = details.querySelector(".post__reflink");
         if (element) return element;
 
-        element = details.querySelector(".postpanel");
+        element = details.querySelector(".post__detailpart");
         if (element) return element;
 
         element = details.querySelector(".desktop");

diff --git a/src/interface/html/common/html5.pug b/src/interface/html/common/html5.pug
@@ -1,6 +1,6 @@
 block vars
-  - var version = "1.2.0";
-  - var year = "2018";
+  - var version = "1.2.1";
+  - var year = "2019";
   - var title = "2ch-helper";