{"action":"created","comment":{"url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/pulls/comments/153403003","pull_request_review_id":79400388,"id":153403003,"diff_hunk":"@@ -5,148 +5,612 @@\n <dom-module id='ha-color-picker'>\n   <template>\n     <style>\n-      canvas {\n+      :host {\n+        user-select: none;\n+        -webkit-user-select: none;\n+      }\n+\n+      #canvas {\n+        position: relative;\n+        width: 100%;\n+        max-width: 330px;\n+      }\n+      #canvas > * {\n+        display: block;\n+      }\n+      #interactionLayer {\n+        color: white;\n+        position: absolute;\n         cursor: crosshair;\n+        width: 100%;\n+        height: 100%;\n+        overflow: visible;\n+      }\n+      #backgroundLayer {\n+        width: 100%;\n+        overflow: visible;\n+        --wheel-bordercolor: var(--ha-color-picker-wheel-bordercolor, white);\n+        --wheel-borderwidth: var(--ha-color-picker-wheel-borderwith, 3);\n+        --wheel-shadow: var(--ha-color-picker-wheel-shadow, rgb(15, 15, 15) 10px 5px 5px 0px);\n       }\n-    </style>\n \n-    <canvas width='[[width]]' height='[[height]]' id='canvas'></canvas>\n+      #marker {\n+        fill: currentColor;\n+        stroke: var(--ha-color-picker-marker-bordercolor, white);\n+        stroke-width: var(--ha-color-picker-marker-borderwith, 3);","path":"src/components/ha-color-picker.html","position":39,"original_position":39,"commit_id":"42e15dfe3985d25d575c03cb0d653781d1ab5887","original_commit_id":"42e15dfe3985d25d575c03cb0d653781d1ab5887","user":{"login":"balloob","id":1444314,"avatar_url":"https://avatars3.githubusercontent.com/u/1444314?v=4","gravatar_id":"","url":"https://api.github.com/users/balloob","html_url":"https://github.com/balloob","followers_url":"https://api.github.com/users/balloob/followers","following_url":"https://api.github.com/users/balloob/following{/other_user}","gists_url":"https://api.github.com/users/balloob/gists{/gist_id}","starred_url":"https://api.github.com/users/balloob/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/balloob/subscriptions","organizations_url":"https://api.github.com/users/balloob/orgs","repos_url":"https://api.github.com/users/balloob/repos","events_url":"https://api.github.com/users/balloob/events{/privacy}","received_events_url":"https://api.github.com/users/balloob/received_events","type":"User","site_admin":false},"body":"`width`","created_at":"2017-11-28T06:16:39Z","updated_at":"2017-11-28T06:16:39Z","html_url":"https://github.com/home-assistant/home-assistant-polymer/pull/695#discussion_r153403003","pull_request_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/pulls/695","author_association":"OWNER","_links":{"self":{"href":"https://api.github.com/repos/home-assistant/home-assistant-polymer/pulls/comments/153403003"},"html":{"href":"https://github.com/home-assistant/home-assistant-polymer/pull/695#discussion_r153403003"},"pull_request":{"href":"https://api.github.com/repos/home-assistant/home-assistant-polymer/pulls/695"}}},"pull_request":{"url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/pulls/695","id":154837373,"html_url":"https://github.com/home-assistant/home-assistant-polymer/pull/695","diff_url":"https://github.com/home-assistant/home-assistant-polymer/pull/695.diff","patch_url":"https://github.com/home-assistant/home-assistant-polymer/pull/695.patch","issue_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/issues/695","number":695,"state":"open","locked":false,"title":"Replacing the color picker with a Hue-Saturation color wheel.","user":{"login":"NovapaX","id":411716,"avatar_url":"https://avatars3.githubusercontent.com/u/411716?v=4","gravatar_id":"","url":"https://api.github.com/users/NovapaX","html_url":"https://github.com/NovapaX","followers_url":"https://api.github.com/users/NovapaX/followers","following_url":"https://api.github.com/users/NovapaX/following{/other_user}","gists_url":"https://api.github.com/users/NovapaX/gists{/gist_id}","starred_url":"https://api.github.com/users/NovapaX/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/NovapaX/subscriptions","organizations_url":"https://api.github.com/users/NovapaX/orgs","repos_url":"https://api.github.com/users/NovapaX/repos","events_url":"https://api.github.com/users/NovapaX/events{/privacy}","received_events_url":"https://api.github.com/users/NovapaX/received_events","type":"User","site_admin":false},"body":"I've been working on a replacement of the color picker. this PR is the result.\r\n\r\nThis replaces the color picker with a color wheel. I put a lot of work in making it touch-friendly. It doesn't interfere with scrolling on touch-screens, if you want to drag around the wheel you should 'pick' the marker to start dragging. (on mouse-devices you can click-and-drag anywhere)\r\nIt also shows a circle with the 'current' color above your fingers when you're dragging.\r\n\r\nUpdate frequency is set with the 'throttle' attribute. Set it to the same 500ms that was used with the old color picker.\r\nMaybe 200ms is nicer, but I have no idea how several light platforms would react on such a speedy inflow of updated states.\r\n\r\nThere are some options for styling and color segments. I settled on 24 hue-segments and 8 saturation segments. This way it fits the 'material design' a bit better. But it also restricts the possible colors that can be chosen. (to 7x24+1=169 colors)\r\nIf that is undesired we could add the ignore-segments attribute (but that would be a little confusing, because you can select colors that are not even shown) Or we could just completely leave out the segments attributes and show it as a traditional color wheel with smooth gradients.\r\n(styling and segments are done by the 'host' which is including the color picker.)\r\n\r\nThis picker does Hue and saturation, as the brightness is (or at least should be) controlled with the brightness slider.\r\nSince the backend is still based on RGB, the chosen Hue and Saturation are converted to RGB with a maximum brightness.\r\nPlatforms that rely on setting brightness by choosing a 'dark' RGB color should really just use the slider.\r\nThere has been a lot of talk about improving the light platform. (and even migrating to separate hue, saturation and brightness attributes). This can be easily converted to return those values.\r\n\r\nPlease test it out, any comments on both code and functionality are more than welcome.\r\nI'm not a javascript ninja, so forgive me any (noob) mistakes.\r\n\r\n<img width=\"404\" alt=\"schermafbeelding 2017-11-27 om 15 56 46\" src=\"https://user-images.githubusercontent.com/411716/33273174-cb5ce10c-d38c-11e7-9405-c3db3c723d77.png\">\r\n<img width=\"371\" alt=\"schermafbeelding 2017-11-27 om 16 23 43\" src=\"https://user-images.githubusercontent.com/411716/33274089-67016126-d38f-11e7-8c94-87c70d909ed9.png\">\r\n","created_at":"2017-11-27T15:22:38Z","updated_at":"2017-11-28T06:16:39Z","closed_at":null,"merged_at":null,"merge_commit_sha":"bcb9ca28d0962241a008668cd175919407dc9848","assignee":null,"assignees":[],"requested_reviewers":[],"milestone":null,"commits_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/pulls/695/commits","review_comments_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/pulls/695/comments","review_comment_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/pulls/comments{/number}","comments_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/issues/695/comments","statuses_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/statuses/42e15dfe3985d25d575c03cb0d653781d1ab5887","head":{"label":"NovapaX:color-wheel","ref":"color-wheel","sha":"42e15dfe3985d25d575c03cb0d653781d1ab5887","user":{"login":"NovapaX","id":411716,"avatar_url":"https://avatars3.githubusercontent.com/u/411716?v=4","gravatar_id":"","url":"https://api.github.com/users/NovapaX","html_url":"https://github.com/NovapaX","followers_url":"https://api.github.com/users/NovapaX/followers","following_url":"https://api.github.com/users/NovapaX/following{/other_user}","gists_url":"https://api.github.com/users/NovapaX/gists{/gist_id}","starred_url":"https://api.github.com/users/NovapaX/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/NovapaX/subscriptions","organizations_url":"https://api.github.com/users/NovapaX/orgs","repos_url":"https://api.github.com/users/NovapaX/repos","events_url":"https://api.github.com/users/NovapaX/events{/privacy}","received_events_url":"https://api.github.com/users/NovapaX/received_events","type":"User","site_admin":false},"repo":{"id":109685355,"name":"home-assistant-polymer","full_name":"NovapaX/home-assistant-polymer","owner":{"login":"NovapaX","id":411716,"avatar_url":"https://avatars3.githubusercontent.com/u/411716?v=4","gravatar_id":"","url":"https://api.github.com/users/NovapaX","html_url":"https://github.com/NovapaX","followers_url":"https://api.github.com/users/NovapaX/followers","following_url":"https://api.github.com/users/NovapaX/following{/other_user}","gists_url":"https://api.github.com/users/NovapaX/gists{/gist_id}","starred_url":"https://api.github.com/users/NovapaX/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/NovapaX/subscriptions","organizations_url":"https://api.github.com/users/NovapaX/orgs","repos_url":"https://api.github.com/users/NovapaX/repos","events_url":"https://api.github.com/users/NovapaX/events{/privacy}","received_events_url":"https://api.github.com/users/NovapaX/received_events","type":"User","site_admin":false},"private":false,"html_url":"https://github.com/NovapaX/home-assistant-polymer","description":":lollipop: Polymer frontend for Home Assistant","fork":true,"url":"https://api.github.com/repos/NovapaX/home-assistant-polymer","forks_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/forks","keys_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/keys{/key_id}","collaborators_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/collaborators{/collaborator}","teams_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/teams","hooks_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/hooks","issue_events_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/issues/events{/number}","events_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/events","assignees_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/assignees{/user}","branches_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/branches{/branch}","tags_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/tags","blobs_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/git/blobs{/sha}","git_tags_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/git/tags{/sha}","git_refs_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/git/refs{/sha}","trees_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/git/trees{/sha}","statuses_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/statuses/{sha}","languages_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/languages","stargazers_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/stargazers","contributors_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/contributors","subscribers_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/subscribers","subscription_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/subscription","commits_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/commits{/sha}","git_commits_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/git/commits{/sha}","comments_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/comments{/number}","issue_comment_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/issues/comments{/number}","contents_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/contents/{+path}","compare_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/compare/{base}...{head}","merges_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/merges","archive_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/{archive_format}{/ref}","downloads_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/downloads","issues_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/issues{/number}","pulls_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/pulls{/number}","milestones_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/milestones{/number}","notifications_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/notifications{?since,all,participating}","labels_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/labels{/name}","releases_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/releases{/id}","deployments_url":"https://api.github.com/repos/NovapaX/home-assistant-polymer/deployments","created_at":"2017-11-06T11:14:23Z","updated_at":"2017-11-06T11:14:25Z","pushed_at":"2017-11-27T21:16:41Z","git_url":"git://github.com/NovapaX/home-assistant-polymer.git","ssh_url":"git@github.com:NovapaX/home-assistant-polymer.git","clone_url":"https://github.com/NovapaX/home-assistant-polymer.git","svn_url":"https://github.com/NovapaX/home-assistant-polymer","homepage":"https://home-assistant.io","size":3602,"stargazers_count":0,"watchers_count":0,"language":"HTML","has_issues":false,"has_projects":true,"has_downloads":true,"has_wiki":true,"has_pages":false,"forks_count":0,"mirror_url":null,"archived":false,"open_issues_count":0,"forks":0,"open_issues":0,"watchers":0,"default_branch":"master"}},"base":{"label":"home-assistant:master","ref":"master","sha":"326fa0036597a72720cbafd4819ccd6ab1400844","user":{"login":"home-assistant","id":13844975,"avatar_url":"https://avatars3.githubusercontent.com/u/13844975?v=4","gravatar_id":"","url":"https://api.github.com/users/home-assistant","html_url":"https://github.com/home-assistant","followers_url":"https://api.github.com/users/home-assistant/followers","following_url":"https://api.github.com/users/home-assistant/following{/other_user}","gists_url":"https://api.github.com/users/home-assistant/gists{/gist_id}","starred_url":"https://api.github.com/users/home-assistant/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/home-assistant/subscriptions","organizations_url":"https://api.github.com/users/home-assistant/orgs","repos_url":"https://api.github.com/users/home-assistant/repos","events_url":"https://api.github.com/users/home-assistant/events{/privacy}","received_events_url":"https://api.github.com/users/home-assistant/received_events","type":"Organization","site_admin":false},"repo":{"id":38982731,"name":"home-assistant-polymer","full_name":"home-assistant/home-assistant-polymer","owner":{"login":"home-assistant","id":13844975,"avatar_url":"https://avatars3.githubusercontent.com/u/13844975?v=4","gravatar_id":"","url":"https://api.github.com/users/home-assistant","html_url":"https://github.com/home-assistant","followers_url":"https://api.github.com/users/home-assistant/followers","following_url":"https://api.github.com/users/home-assistant/following{/other_user}","gists_url":"https://api.github.com/users/home-assistant/gists{/gist_id}","starred_url":"https://api.github.com/users/home-assistant/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/home-assistant/subscriptions","organizations_url":"https://api.github.com/users/home-assistant/orgs","repos_url":"https://api.github.com/users/home-assistant/repos","events_url":"https://api.github.com/users/home-assistant/events{/privacy}","received_events_url":"https://api.github.com/users/home-assistant/received_events","type":"Organization","site_admin":false},"private":false,"html_url":"https://github.com/home-assistant/home-assistant-polymer","description":":lollipop: Polymer frontend for Home Assistant","fork":false,"url":"https://api.github.com/repos/home-assistant/home-assistant-polymer","forks_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/forks","keys_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/keys{/key_id}","collaborators_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/collaborators{/collaborator}","teams_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/teams","hooks_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/hooks","issue_events_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/issues/events{/number}","events_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/events","assignees_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/assignees{/user}","branches_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/branches{/branch}","tags_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/tags","blobs_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/git/blobs{/sha}","git_tags_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/git/tags{/sha}","git_refs_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/git/refs{/sha}","trees_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/git/trees{/sha}","statuses_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/statuses/{sha}","languages_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/languages","stargazers_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/stargazers","contributors_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/contributors","subscribers_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/subscribers","subscription_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/subscription","commits_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/commits{/sha}","git_commits_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/git/commits{/sha}","comments_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/comments{/number}","issue_comment_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/issues/comments{/number}","contents_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/contents/{+path}","compare_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/compare/{base}...{head}","merges_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/merges","archive_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/{archive_format}{/ref}","downloads_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/downloads","issues_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/issues{/number}","pulls_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/pulls{/number}","milestones_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/milestones{/number}","notifications_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/notifications{?since,all,participating}","labels_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/labels{/name}","releases_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/releases{/id}","deployments_url":"https://api.github.com/repos/home-assistant/home-assistant-polymer/deployments","created_at":"2015-07-12T23:58:06Z","updated_at":"2017-11-10T02:20:55Z","pushed_at":"2017-11-27T22:10:10Z","git_url":"git://github.com/home-assistant/home-assistant-polymer.git","ssh_url":"git@github.com:home-assistant/home-assistant-polymer.git","clone_url":"https://github.com/home-assistant/home-assistant-polymer.git","svn_url":"https://github.com/home-assistant/home-assistant-polymer","homepage":"https://home-assistant.io","size":3708,"stargazers_count":184,"watchers_count":184,"language":"HTML","has_issues":true,"has_projects":true,"has_downloads":true,"has_wiki":true,"has_pages":false,"forks_count":264,"mirror_url":null,"archived":false,"open_issues_count":65,"forks":264,"open_issues":65,"watchers":184,"default_branch":"master"}},"_links":{"self":{"href":"https://api.github.com/repos/home-assistant/home-assistant-polymer/pulls/695"},"html":{"href":"https://github.com/home-assistant/home-assistant-polymer/pull/695"},"issue":{"href":"https://api.github.com/repos/home-assistant/home-assistant-polymer/issues/695"},"comments":{"href":"https://api.github.com/repos/home-assistant/home-assistant-polymer/issues/695/comments"},"review_comments":{"href":"https://api.github.com/repos/home-assistant/home-assistant-polymer/pulls/695/comments"},"review_comment":{"href":"https://api.github.com/repos/home-assistant/home-assistant-polymer/pulls/comments{/number}"},"commits":{"href":"https://api.github.com/repos/home-assistant/home-assistant-polymer/pulls/695/commits"},"statuses":{"href":"https://api.github.com/repos/home-assistant/home-assistant-polymer/statuses/42e15dfe3985d25d575c03cb0d653781d1ab5887"}},"author_association":"CONTRIBUTOR"}}
{"actor":{"display_login":"balloob"}}