{"action":"created","issue":{"url":"https://api.github.com/repos/Brightspace/d2l-my-courses-ui/issues/167","repository_url":"https://api.github.com/repos/Brightspace/d2l-my-courses-ui","labels_url":"https://api.github.com/repos/Brightspace/d2l-my-courses-ui/issues/167/labels{/name}","comments_url":"https://api.github.com/repos/Brightspace/d2l-my-courses-ui/issues/167/comments","events_url":"https://api.github.com/repos/Brightspace/d2l-my-courses-ui/issues/167/events","html_url":"https://github.com/Brightspace/d2l-my-courses-ui/pull/167","id":185246424,"number":167,"title":"Responsive image resolutions","user":{"login":"trevorjonesd2l","id":8656538,"avatar_url":"https://avatars.githubusercontent.com/u/8656538?v=3","gravatar_id":"","url":"https://api.github.com/users/trevorjonesd2l","html_url":"https://github.com/trevorjonesd2l","followers_url":"https://api.github.com/users/trevorjonesd2l/followers","following_url":"https://api.github.com/users/trevorjonesd2l/following{/other_user}","gists_url":"https://api.github.com/users/trevorjonesd2l/gists{/gist_id}","starred_url":"https://api.github.com/users/trevorjonesd2l/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/trevorjonesd2l/subscriptions","organizations_url":"https://api.github.com/users/trevorjonesd2l/orgs","repos_url":"https://api.github.com/users/trevorjonesd2l/repos","events_url":"https://api.github.com/users/trevorjonesd2l/events{/privacy}","received_events_url":"https://api.github.com/users/trevorjonesd2l/received_events","type":"User","site_admin":false},"labels":[{"id":352624020,"url":"https://api.github.com/repos/Brightspace/d2l-my-courses-ui/labels/code%20review","name":"code review","color":"5319e7","default":false},{"id":443320183,"url":"https://api.github.com/repos/Brightspace/d2l-my-courses-ui/labels/test","name":"test","color":"e99695","default":false}],"state":"open","locked":false,"assignee":{"login":"ryantmer","id":6231623,"avatar_url":"https://avatars.githubusercontent.com/u/6231623?v=3","gravatar_id":"","url":"https://api.github.com/users/ryantmer","html_url":"https://github.com/ryantmer","followers_url":"https://api.github.com/users/ryantmer/followers","following_url":"https://api.github.com/users/ryantmer/following{/other_user}","gists_url":"https://api.github.com/users/ryantmer/gists{/gist_id}","starred_url":"https://api.github.com/users/ryantmer/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/ryantmer/subscriptions","organizations_url":"https://api.github.com/users/ryantmer/orgs","repos_url":"https://api.github.com/users/ryantmer/repos","events_url":"https://api.github.com/users/ryantmer/events{/privacy}","received_events_url":"https://api.github.com/users/ryantmer/received_events","type":"User","site_admin":false},"assignees":[{"login":"ryantmer","id":6231623,"avatar_url":"https://avatars.githubusercontent.com/u/6231623?v=3","gravatar_id":"","url":"https://api.github.com/users/ryantmer","html_url":"https://github.com/ryantmer","followers_url":"https://api.github.com/users/ryantmer/followers","following_url":"https://api.github.com/users/ryantmer/following{/other_user}","gists_url":"https://api.github.com/users/ryantmer/gists{/gist_id}","starred_url":"https://api.github.com/users/ryantmer/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/ryantmer/subscriptions","organizations_url":"https://api.github.com/users/ryantmer/orgs","repos_url":"https://api.github.com/users/ryantmer/repos","events_url":"https://api.github.com/users/ryantmer/events{/privacy}","received_events_url":"https://api.github.com/users/ryantmer/received_events","type":"User","site_admin":false}],"milestone":null,"comments":3,"created_at":"2016-10-25T22:04:18Z","updated_at":"2016-10-31T19:51:51Z","closed_at":null,"pull_request":{"url":"https://api.github.com/repos/Brightspace/d2l-my-courses-ui/pulls/167","html_url":"https://github.com/Brightspace/d2l-my-courses-ui/pull/167","diff_url":"https://github.com/Brightspace/d2l-my-courses-ui/pull/167.diff","patch_url":"https://github.com/Brightspace/d2l-my-courses-ui/pull/167.patch"},"body":"TODO:\n- [x] Fix tests\n- [x] Write tests\n- [x] Picturefill\n\nUse `srcset` to set the best image based on the image width, approximate width of the image container and the density of the screen. Each browser incorporates `srcset` a little different by how they determine the best image to display - chrome seem so optimize it better for network calls (with cache and lower quality images), but from my testing images will never be distorted (lower resolution than the container).\n\n`srcset` is kind of tricky in how it's implemented with `sizes` being in units of `vw` - I did my best to approximate this based on the media query breakpoints and number of columns in the all courses overlay. The approximations are more accurate on mobile, where I feel the image resolution is a greater concern (mobile data impact), where as on desktop it becomes a bit more approximated (over approximated rather than under).\n\n`srcset` isn't support by IE, in which case it will use the default image instead (note the default image could be reconfigured to default to low-max rather than high-max if that would make sense). Here is the support of it as a whole\n![image](https://cloud.githubusercontent.com/assets/8656538/19705776/5bab887a-9adc-11e6-8a5b-b0f35d6955c3.png)\n"},"comment":{"url":"https://api.github.com/repos/Brightspace/d2l-my-courses-ui/issues/comments/257401039","html_url":"https://github.com/Brightspace/d2l-my-courses-ui/pull/167#issuecomment-257401039","issue_url":"https://api.github.com/repos/Brightspace/d2l-my-courses-ui/issues/167","id":257401039,"user":{"login":"jstefaniuk-d2l","id":14077760,"avatar_url":"https://avatars.githubusercontent.com/u/14077760?v=3","gravatar_id":"","url":"https://api.github.com/users/jstefaniuk-d2l","html_url":"https://github.com/jstefaniuk-d2l","followers_url":"https://api.github.com/users/jstefaniuk-d2l/followers","following_url":"https://api.github.com/users/jstefaniuk-d2l/following{/other_user}","gists_url":"https://api.github.com/users/jstefaniuk-d2l/gists{/gist_id}","starred_url":"https://api.github.com/users/jstefaniuk-d2l/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/jstefaniuk-d2l/subscriptions","organizations_url":"https://api.github.com/users/jstefaniuk-d2l/orgs","repos_url":"https://api.github.com/users/jstefaniuk-d2l/repos","events_url":"https://api.github.com/users/jstefaniuk-d2l/events{/privacy}","received_events_url":"https://api.github.com/users/jstefaniuk-d2l/received_events","type":"User","site_admin":false},"created_at":"2016-10-31T19:51:51Z","updated_at":"2016-10-31T19:51:51Z","body":"I'm thinking that we should move to make all this resizing stuff to it's own polymer component which can easily be thrown anywhere. (just passing in an image size and the image json or organization)\r\n\r\nThis new requirement isn't necessarily part of this PR, but I do feel that it's something we need to have at some point"}}
{"actor":{"display_login":"jstefaniuk-d2l"}}