{"action":"created","comment":{"url":"https://api.github.com/repos/codex-team/cover-generation/pulls/comments/151498242","pull_request_review_id":77214495,"id":151498242,"diff_hunk":"@@ -1,12 +1,371 @@\n+/**\n+ * DOM utility\n+ */\n+let $ = require('./dom').default;\n+\n /**\n  * Canvas module\n  */\n export default class Canvas {\n \n-    constructor( params ) {\n+    /**\n+     * Initialization of canvas module\n+     */\n+    constructor() {\n+\n+        /**\n+         * DOM of this class\n+         */\n+        this.tree = {\n+            svg : null\n+        };\n+\n+        /**\n+         * CSS of this class\n+         */\n+        this.CSS = {\n+            elements: {\n+                text: 'cover-editor__canvas--text'\n+            }\n+        };\n+\n+        /**\n+         * Const text value\n+         */\n+        this.newText = 'New Text';\n+\n+        /**\n+         * Formats of the canvas, using with its sizes\n+         */\n+        this.formats = {\n+            vertical: 'vertical',\n+            horisontal: 'horisontal',\n+            square: 'square'\n+        };\n+\n+        /**\n+         * Sizes of the canvas\n+         */\n+        this.sizes = {\n+            vertical: {width: 510, height: 560},\n+            horisontal: {width: 650, height: 370},\n+            square: {width: 510, height: 510}\n+        };\n+\n+        /**\n+         * Positions of elements at the canvas\n+         */\n+        this.positions = {\n+            mainText: {x: undefined, y: 271},\n+            image: {x: undefined, y: 132},\n+            headline: {x: undefined, y: 115}\n+        };\n+\n+        /**\n+         * Types of elements at the canvas\n+         */\n+        this.elements = {\n+            mainText: 'mainText',\n+            image: 'image',\n+            headline: 'headline'\n+        };\n+\n+        /**\n+         * Padding between the elements and canvas end\n+         */\n+        this.padding = 30;\n+\n+    }\n+\n+    /**\n+     * Check if element is text\n+     *\n+     * @param {Element} - object\n+     */\n+    isText(element) {\n+\n+        if ([this.elements.headline, this.elements.mainText].indexOf(element.dataset.type) != -1 && element.children.length) {\n+\n+            return true;\n+\n+        } else {\n+\n+            return false;\n+\n+        }\n+\n+    }\n+\n+    /**\n+     * Creates an SVG DOMElement\n+     *\n+     * @return {Element} - created SVG\n+     */\n+    create() {\n+\n+        this.tree.rectangle = $.svg('rect', {fill: '#FFFFFF'});\n+        this.setSize(this.tree.rectangle, this.sizes.horisontal);\n+\n+        this.tree.svg = $.svg('svg');\n+        this.setCanvasFormat(this.formats.horisontal);\n+        this.tree.svg.appendChild(this.tree.rectangle);\n+\n+        return this.tree.svg;\n+\n+    }\n+\n+    /**\n+     * Changing the sizes of canvas by using format\n+     * @param {String} format - type of format, can be 'horisontal', 'square' or 'vertical'\n+     */\n+    setCanvasFormat( format ) {\n+\n+        this.setSize(this.tree.svg, this.sizes[format]);\n+        this.setSize(this.tree.rectangle, this.sizes[format]);\n+\n+    }\n+\n+    /**\n+     * Changes the sizes of svg element\n+     *\n+     * @param {Element} element    - element to change size\n+     * @param {Object|String} size - sizes of canvas, if string, then 'auto'\n+     * @param {Number} size.width  - width of canvas\n+     * @param {Number} size.height - height of canvas\n+     */\n+    setSize( element, size ) {\n+\n+        if (size === 'auto' && this.isText(element)) {\n+\n+            let text = element.children[0];\n+\n+            element.setAttribute('width', this.tree.svg.clientWidth);\n+            element.setAttribute('height', this.tree.svg.clientHeight);\n+            size = {width: text.offsetWidth + 10, height: text.offsetHeight + 10};\n+\n+        }\n+\n+        if (size.height) {\n+\n+            element.setAttribute('height', size.height);\n+\n+        }\n+        if (size.width) {\n+\n+            element.setAttribute('width', size.width);\n+\n+        }\n+\n+    }\n+\n+    /**\n+     * Changes the color of svg element\n+     *\n+     * @param {Element} element - element to change size\n+     * @param {String} color    - color of text to set\n+     */\n+    setColor(element, color) {\n+\n+        if (this.isText(element)) {\n+\n+            element.children[0].style.color = color;\n+\n+        }\n+\n+    }\n+\n+    /**\n+     * Changes the font size of svg element\n+     *\n+     * @param {Element} element    - element to change size\n+     * @param {Number} size        - size of text to set\n+     */\n+    setFontSize( element, size ) {\n+\n+        if (this.isText(element)) {\n+\n+            element.children[0].style.fontSize = size;\n+            this.setSize(element, 'auto');\n+            this.setPosition(element, {x: element.dataset.alignment, y: undefined});\n+\n+        }\n+\n+    }\n+\n+    /**\n+     * Changes a position of element\n+     *\n+     * @param {Element}                - element to change position\n+     * @param {Object|String} coords   - where to place text on canvas\n+     * @param {Number} coords.x        - x coord\n+     * @param {Number} coords.y        - y coord\n+     */\n+    setPosition( element, coords ) {\n+\n+        if (typeof coords === 'string') {\n+\n+            coords = this.positions[coords];\n+\n+        }\n+\n+        if (!coords) {\n+\n+            return;\n+\n+        }\n+\n+        let canvasSizes = {width: this.tree.svg.clientWidth, height: this.tree.svg.clientWidth},\n+            elementSizes = {width: element.clientWidth + 5, height: element.clientWidth + 5};\n+\n+        if (this.isText(element) && ['left', 'center', 'rigth'].indexOf(coords.x)) {\n+\n+            element.children[0].style.textAlign = coords.x;\n+\n+        }\n+\n+        if (coords.x === 'left') {","path":"src/canvas.js","position":227,"original_position":227,"commit_id":"5e5fb00a73c8d4f9908e925ccc24a6952b3d5f3a","original_commit_id":"5e5fb00a73c8d4f9908e925ccc24a6952b3d5f3a","user":{"login":"neSpecc","id":3684889,"avatar_url":"https://avatars0.githubusercontent.com/u/3684889?v=4","gravatar_id":"","url":"https://api.github.com/users/neSpecc","html_url":"https://github.com/neSpecc","followers_url":"https://api.github.com/users/neSpecc/followers","following_url":"https://api.github.com/users/neSpecc/following{/other_user}","gists_url":"https://api.github.com/users/neSpecc/gists{/gist_id}","starred_url":"https://api.github.com/users/neSpecc/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/neSpecc/subscriptions","organizations_url":"https://api.github.com/users/neSpecc/orgs","repos_url":"https://api.github.com/users/neSpecc/repos","events_url":"https://api.github.com/users/neSpecc/events{/privacy}","received_events_url":"https://api.github.com/users/neSpecc/received_events","type":"User","site_admin":false},"body":"switch","created_at":"2017-11-16T18:27:12Z","updated_at":"2017-11-16T18:27:26Z","html_url":"https://github.com/codex-team/cover-generation/pull/14#discussion_r151498242","pull_request_url":"https://api.github.com/repos/codex-team/cover-generation/pulls/14","author_association":"OWNER","_links":{"self":{"href":"https://api.github.com/repos/codex-team/cover-generation/pulls/comments/151498242"},"html":{"href":"https://github.com/codex-team/cover-generation/pull/14#discussion_r151498242"},"pull_request":{"href":"https://api.github.com/repos/codex-team/cover-generation/pulls/14"}}},"pull_request":{"url":"https://api.github.com/repos/codex-team/cover-generation/pulls/14","id":150715426,"html_url":"https://github.com/codex-team/cover-generation/pull/14","diff_url":"https://github.com/codex-team/cover-generation/pull/14.diff","patch_url":"https://github.com/codex-team/cover-generation/pull/14.patch","issue_url":"https://api.github.com/repos/codex-team/cover-generation/issues/14","number":14,"state":"open","locked":false,"title":"ui update","user":{"login":"Nikitos9I","id":30830438,"avatar_url":"https://avatars1.githubusercontent.com/u/30830438?v=4","gravatar_id":"","url":"https://api.github.com/users/Nikitos9I","html_url":"https://github.com/Nikitos9I","followers_url":"https://api.github.com/users/Nikitos9I/followers","following_url":"https://api.github.com/users/Nikitos9I/following{/other_user}","gists_url":"https://api.github.com/users/Nikitos9I/gists{/gist_id}","starred_url":"https://api.github.com/users/Nikitos9I/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Nikitos9I/subscriptions","organizations_url":"https://api.github.com/users/Nikitos9I/orgs","repos_url":"https://api.github.com/users/Nikitos9I/repos","events_url":"https://api.github.com/users/Nikitos9I/events{/privacy}","received_events_url":"https://api.github.com/users/Nikitos9I/received_events","type":"User","site_admin":false},"body":"- Пофиксил выделение текста кнопок, если даблкликать на форму\r\n- Добавил изменение цвета бордера главного дива при его нажатии\r\n- (По просьбе Ильи) Изменил элемент, от которого теперь зависят все размеры. Теперь это svg","created_at":"2017-11-05T09:58:33Z","updated_at":"2017-11-16T18:27:26Z","closed_at":null,"merged_at":null,"merge_commit_sha":"8a0312e77c576378338d4eaa61159468eea9138c","assignee":null,"assignees":[],"requested_reviewers":[{"login":"talyguryn","id":15259299,"avatar_url":"https://avatars0.githubusercontent.com/u/15259299?v=4","gravatar_id":"","url":"https://api.github.com/users/talyguryn","html_url":"https://github.com/talyguryn","followers_url":"https://api.github.com/users/talyguryn/followers","following_url":"https://api.github.com/users/talyguryn/following{/other_user}","gists_url":"https://api.github.com/users/talyguryn/gists{/gist_id}","starred_url":"https://api.github.com/users/talyguryn/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/talyguryn/subscriptions","organizations_url":"https://api.github.com/users/talyguryn/orgs","repos_url":"https://api.github.com/users/talyguryn/repos","events_url":"https://api.github.com/users/talyguryn/events{/privacy}","received_events_url":"https://api.github.com/users/talyguryn/received_events","type":"User","site_admin":false}],"milestone":null,"commits_url":"https://api.github.com/repos/codex-team/cover-generation/pulls/14/commits","review_comments_url":"https://api.github.com/repos/codex-team/cover-generation/pulls/14/comments","review_comment_url":"https://api.github.com/repos/codex-team/cover-generation/pulls/comments{/number}","comments_url":"https://api.github.com/repos/codex-team/cover-generation/issues/14/comments","statuses_url":"https://api.github.com/repos/codex-team/cover-generation/statuses/5e5fb00a73c8d4f9908e925ccc24a6952b3d5f3a","head":{"label":"codex-team:ui.update","ref":"ui.update","sha":"5e5fb00a73c8d4f9908e925ccc24a6952b3d5f3a","user":{"login":"codex-team","id":16060815,"avatar_url":"https://avatars0.githubusercontent.com/u/16060815?v=4","gravatar_id":"","url":"https://api.github.com/users/codex-team","html_url":"https://github.com/codex-team","followers_url":"https://api.github.com/users/codex-team/followers","following_url":"https://api.github.com/users/codex-team/following{/other_user}","gists_url":"https://api.github.com/users/codex-team/gists{/gist_id}","starred_url":"https://api.github.com/users/codex-team/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/codex-team/subscriptions","organizations_url":"https://api.github.com/users/codex-team/orgs","repos_url":"https://api.github.com/users/codex-team/repos","events_url":"https://api.github.com/users/codex-team/events{/privacy}","received_events_url":"https://api.github.com/users/codex-team/received_events","type":"Organization","site_admin":false},"repo":{"id":106441316,"name":"cover-generation","full_name":"codex-team/cover-generation","owner":{"login":"codex-team","id":16060815,"avatar_url":"https://avatars0.githubusercontent.com/u/16060815?v=4","gravatar_id":"","url":"https://api.github.com/users/codex-team","html_url":"https://github.com/codex-team","followers_url":"https://api.github.com/users/codex-team/followers","following_url":"https://api.github.com/users/codex-team/following{/other_user}","gists_url":"https://api.github.com/users/codex-team/gists{/gist_id}","starred_url":"https://api.github.com/users/codex-team/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/codex-team/subscriptions","organizations_url":"https://api.github.com/users/codex-team/orgs","repos_url":"https://api.github.com/users/codex-team/repos","events_url":"https://api.github.com/users/codex-team/events{/privacy}","received_events_url":"https://api.github.com/users/codex-team/received_events","type":"Organization","site_admin":false},"private":false,"html_url":"https://github.com/codex-team/cover-generation","description":null,"fork":false,"url":"https://api.github.com/repos/codex-team/cover-generation","forks_url":"https://api.github.com/repos/codex-team/cover-generation/forks","keys_url":"https://api.github.com/repos/codex-team/cover-generation/keys{/key_id}","collaborators_url":"https://api.github.com/repos/codex-team/cover-generation/collaborators{/collaborator}","teams_url":"https://api.github.com/repos/codex-team/cover-generation/teams","hooks_url":"https://api.github.com/repos/codex-team/cover-generation/hooks","issue_events_url":"https://api.github.com/repos/codex-team/cover-generation/issues/events{/number}","events_url":"https://api.github.com/repos/codex-team/cover-generation/events","assignees_url":"https://api.github.com/repos/codex-team/cover-generation/assignees{/user}","branches_url":"https://api.github.com/repos/codex-team/cover-generation/branches{/branch}","tags_url":"https://api.github.com/repos/codex-team/cover-generation/tags","blobs_url":"https://api.github.com/repos/codex-team/cover-generation/git/blobs{/sha}","git_tags_url":"https://api.github.com/repos/codex-team/cover-generation/git/tags{/sha}","git_refs_url":"https://api.github.com/repos/codex-team/cover-generation/git/refs{/sha}","trees_url":"https://api.github.com/repos/codex-team/cover-generation/git/trees{/sha}","statuses_url":"https://api.github.com/repos/codex-team/cover-generation/statuses/{sha}","languages_url":"https://api.github.com/repos/codex-team/cover-generation/languages","stargazers_url":"https://api.github.com/repos/codex-team/cover-generation/stargazers","contributors_url":"https://api.github.com/repos/codex-team/cover-generation/contributors","subscribers_url":"https://api.github.com/repos/codex-team/cover-generation/subscribers","subscription_url":"https://api.github.com/repos/codex-team/cover-generation/subscription","commits_url":"https://api.github.com/repos/codex-team/cover-generation/commits{/sha}","git_commits_url":"https://api.github.com/repos/codex-team/cover-generation/git/commits{/sha}","comments_url":"https://api.github.com/repos/codex-team/cover-generation/comments{/number}","issue_comment_url":"https://api.github.com/repos/codex-team/cover-generation/issues/comments{/number}","contents_url":"https://api.github.com/repos/codex-team/cover-generation/contents/{+path}","compare_url":"https://api.github.com/repos/codex-team/cover-generation/compare/{base}...{head}","merges_url":"https://api.github.com/repos/codex-team/cover-generation/merges","archive_url":"https://api.github.com/repos/codex-team/cover-generation/{archive_format}{/ref}","downloads_url":"https://api.github.com/repos/codex-team/cover-generation/downloads","issues_url":"https://api.github.com/repos/codex-team/cover-generation/issues{/number}","pulls_url":"https://api.github.com/repos/codex-team/cover-generation/pulls{/number}","milestones_url":"https://api.github.com/repos/codex-team/cover-generation/milestones{/number}","notifications_url":"https://api.github.com/repos/codex-team/cover-generation/notifications{?since,all,participating}","labels_url":"https://api.github.com/repos/codex-team/cover-generation/labels{/name}","releases_url":"https://api.github.com/repos/codex-team/cover-generation/releases{/id}","deployments_url":"https://api.github.com/repos/codex-team/cover-generation/deployments","created_at":"2017-10-10T16:15:32Z","updated_at":"2017-10-10T17:04:56Z","pushed_at":"2017-11-16T18:16:17Z","git_url":"git://github.com/codex-team/cover-generation.git","ssh_url":"git@github.com:codex-team/cover-generation.git","clone_url":"https://github.com/codex-team/cover-generation.git","svn_url":"https://github.com/codex-team/cover-generation","homepage":null,"size":425,"stargazers_count":0,"watchers_count":0,"language":"JavaScript","has_issues":true,"has_projects":true,"has_downloads":true,"has_wiki":true,"has_pages":false,"forks_count":0,"mirror_url":null,"archived":false,"open_issues_count":7,"forks":0,"open_issues":7,"watchers":0,"default_branch":"master"}},"base":{"label":"codex-team:master","ref":"master","sha":"2c5a9c41ce90ba06eaf1e46ea09cd7fa10305d59","user":{"login":"codex-team","id":16060815,"avatar_url":"https://avatars0.githubusercontent.com/u/16060815?v=4","gravatar_id":"","url":"https://api.github.com/users/codex-team","html_url":"https://github.com/codex-team","followers_url":"https://api.github.com/users/codex-team/followers","following_url":"https://api.github.com/users/codex-team/following{/other_user}","gists_url":"https://api.github.com/users/codex-team/gists{/gist_id}","starred_url":"https://api.github.com/users/codex-team/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/codex-team/subscriptions","organizations_url":"https://api.github.com/users/codex-team/orgs","repos_url":"https://api.github.com/users/codex-team/repos","events_url":"https://api.github.com/users/codex-team/events{/privacy}","received_events_url":"https://api.github.com/users/codex-team/received_events","type":"Organization","site_admin":false},"repo":{"id":106441316,"name":"cover-generation","full_name":"codex-team/cover-generation","owner":{"login":"codex-team","id":16060815,"avatar_url":"https://avatars0.githubusercontent.com/u/16060815?v=4","gravatar_id":"","url":"https://api.github.com/users/codex-team","html_url":"https://github.com/codex-team","followers_url":"https://api.github.com/users/codex-team/followers","following_url":"https://api.github.com/users/codex-team/following{/other_user}","gists_url":"https://api.github.com/users/codex-team/gists{/gist_id}","starred_url":"https://api.github.com/users/codex-team/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/codex-team/subscriptions","organizations_url":"https://api.github.com/users/codex-team/orgs","repos_url":"https://api.github.com/users/codex-team/repos","events_url":"https://api.github.com/users/codex-team/events{/privacy}","received_events_url":"https://api.github.com/users/codex-team/received_events","type":"Organization","site_admin":false},"private":false,"html_url":"https://github.com/codex-team/cover-generation","description":null,"fork":false,"url":"https://api.github.com/repos/codex-team/cover-generation","forks_url":"https://api.github.com/repos/codex-team/cover-generation/forks","keys_url":"https://api.github.com/repos/codex-team/cover-generation/keys{/key_id}","collaborators_url":"https://api.github.com/repos/codex-team/cover-generation/collaborators{/collaborator}","teams_url":"https://api.github.com/repos/codex-team/cover-generation/teams","hooks_url":"https://api.github.com/repos/codex-team/cover-generation/hooks","issue_events_url":"https://api.github.com/repos/codex-team/cover-generation/issues/events{/number}","events_url":"https://api.github.com/repos/codex-team/cover-generation/events","assignees_url":"https://api.github.com/repos/codex-team/cover-generation/assignees{/user}","branches_url":"https://api.github.com/repos/codex-team/cover-generation/branches{/branch}","tags_url":"https://api.github.com/repos/codex-team/cover-generation/tags","blobs_url":"https://api.github.com/repos/codex-team/cover-generation/git/blobs{/sha}","git_tags_url":"https://api.github.com/repos/codex-team/cover-generation/git/tags{/sha}","git_refs_url":"https://api.github.com/repos/codex-team/cover-generation/git/refs{/sha}","trees_url":"https://api.github.com/repos/codex-team/cover-generation/git/trees{/sha}","statuses_url":"https://api.github.com/repos/codex-team/cover-generation/statuses/{sha}","languages_url":"https://api.github.com/repos/codex-team/cover-generation/languages","stargazers_url":"https://api.github.com/repos/codex-team/cover-generation/stargazers","contributors_url":"https://api.github.com/repos/codex-team/cover-generation/contributors","subscribers_url":"https://api.github.com/repos/codex-team/cover-generation/subscribers","subscription_url":"https://api.github.com/repos/codex-team/cover-generation/subscription","commits_url":"https://api.github.com/repos/codex-team/cover-generation/commits{/sha}","git_commits_url":"https://api.github.com/repos/codex-team/cover-generation/git/commits{/sha}","comments_url":"https://api.github.com/repos/codex-team/cover-generation/comments{/number}","issue_comment_url":"https://api.github.com/repos/codex-team/cover-generation/issues/comments{/number}","contents_url":"https://api.github.com/repos/codex-team/cover-generation/contents/{+path}","compare_url":"https://api.github.com/repos/codex-team/cover-generation/compare/{base}...{head}","merges_url":"https://api.github.com/repos/codex-team/cover-generation/merges","archive_url":"https://api.github.com/repos/codex-team/cover-generation/{archive_format}{/ref}","downloads_url":"https://api.github.com/repos/codex-team/cover-generation/downloads","issues_url":"https://api.github.com/repos/codex-team/cover-generation/issues{/number}","pulls_url":"https://api.github.com/repos/codex-team/cover-generation/pulls{/number}","milestones_url":"https://api.github.com/repos/codex-team/cover-generation/milestones{/number}","notifications_url":"https://api.github.com/repos/codex-team/cover-generation/notifications{?since,all,participating}","labels_url":"https://api.github.com/repos/codex-team/cover-generation/labels{/name}","releases_url":"https://api.github.com/repos/codex-team/cover-generation/releases{/id}","deployments_url":"https://api.github.com/repos/codex-team/cover-generation/deployments","created_at":"2017-10-10T16:15:32Z","updated_at":"2017-10-10T17:04:56Z","pushed_at":"2017-11-16T18:16:17Z","git_url":"git://github.com/codex-team/cover-generation.git","ssh_url":"git@github.com:codex-team/cover-generation.git","clone_url":"https://github.com/codex-team/cover-generation.git","svn_url":"https://github.com/codex-team/cover-generation","homepage":null,"size":425,"stargazers_count":0,"watchers_count":0,"language":"JavaScript","has_issues":true,"has_projects":true,"has_downloads":true,"has_wiki":true,"has_pages":false,"forks_count":0,"mirror_url":null,"archived":false,"open_issues_count":7,"forks":0,"open_issues":7,"watchers":0,"default_branch":"master"}},"_links":{"self":{"href":"https://api.github.com/repos/codex-team/cover-generation/pulls/14"},"html":{"href":"https://github.com/codex-team/cover-generation/pull/14"},"issue":{"href":"https://api.github.com/repos/codex-team/cover-generation/issues/14"},"comments":{"href":"https://api.github.com/repos/codex-team/cover-generation/issues/14/comments"},"review_comments":{"href":"https://api.github.com/repos/codex-team/cover-generation/pulls/14/comments"},"review_comment":{"href":"https://api.github.com/repos/codex-team/cover-generation/pulls/comments{/number}"},"commits":{"href":"https://api.github.com/repos/codex-team/cover-generation/pulls/14/commits"},"statuses":{"href":"https://api.github.com/repos/codex-team/cover-generation/statuses/5e5fb00a73c8d4f9908e925ccc24a6952b3d5f3a"}},"author_association":"NONE"}}
{"actor":{"display_login":"neSpecc"}}