{"action":"created","comment":{"url":"https://api.github.com/repos/mitodl/odl-video-service/pulls/comments/143780277","pull_request_review_id":68342737,"id":143780277,"diff_hunk":"@@ -1,37 +1,216 @@\n // @flow\n+/* global videojs: true */\n import React from 'react';\n \n-import HTML5VideoPlayer from \"./HTML5VideoPlayer\";\n-import USwitchPlayer from \"./USwitchPlayer\";\n+import { makeVideoSubtitleUrl } from \"../lib/urls\";\n+import { getHLSEncodedUrl, videojs } from \"../lib/video\";\n+import type { Video, VideoSubtitle } from \"../flow/videoTypes\";\n+import { FULLSCREEN_API } from \"../util/fullscreen_api\";\n+import { CANVASES } from \"../constants\";\n \n-import { makeEmbedUrl } from \"../lib/urls\";\n+const makeConfigForVideo = (video: Video): Object => ({\n+  autoplay: true,\n+  controls: true,\n+  fluid: false,\n+  playsinline: true,\n+  html5: {\n+    nativeTextTracks: false\n+  },\n+  sources: [{\n+    src: getHLSEncodedUrl(video),\n+    type: 'application/x-mpegURL',\n+  }]\n+});\n \n-import type { Video } from '../flow/videoTypes';\n+const drawCanvasImage = function(canvas, videoNode, shiftX, shiftY) {\n+  const x = shiftX ? Math.floor(videoNode.videoWidth / 2) : 0;\n+  const y = shiftY ? Math.floor(videoNode.videoHeight / 2) : 0;\n+  const context = canvas.getContext('2d');\n+  context.drawImage(\n+    videoNode,\n+    x, y, Math.floor(videoNode.videoWidth / 2), Math.floor(videoNode.videoHeight / 2),\n+    0, 0, canvas.width, canvas.height\n+  );\n+  setTimeout(drawCanvasImage, 20, canvas, videoNode, shiftX, shiftY);","path":"static/js/components/VideoPlayer.js","position":38,"original_position":38,"commit_id":"41ce29880e6bde03f182c983ad4b669e0cbc9c62","original_commit_id":"41ce29880e6bde03f182c983ad4b669e0cbc9c62","user":{"login":"mbertrand","id":187676,"avatar_url":"https://avatars2.githubusercontent.com/u/187676?v=4","gravatar_id":"","url":"https://api.github.com/users/mbertrand","html_url":"https://github.com/mbertrand","followers_url":"https://api.github.com/users/mbertrand/followers","following_url":"https://api.github.com/users/mbertrand/following{/other_user}","gists_url":"https://api.github.com/users/mbertrand/gists{/gist_id}","starred_url":"https://api.github.com/users/mbertrand/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/mbertrand/subscriptions","organizations_url":"https://api.github.com/users/mbertrand/orgs","repos_url":"https://api.github.com/users/mbertrand/repos","events_url":"https://api.github.com/users/mbertrand/events{/privacy}","received_events_url":"https://api.github.com/users/mbertrand/received_events","type":"User","site_admin":false},"body":"@pdpinch does OVS need to support IE9 and below?","created_at":"2017-10-10T16:22:02Z","updated_at":"2017-10-10T16:22:02Z","html_url":"https://github.com/mitodl/odl-video-service/pull/297#discussion_r143780277","pull_request_url":"https://api.github.com/repos/mitodl/odl-video-service/pulls/297","author_association":"CONTRIBUTOR","_links":{"self":{"href":"https://api.github.com/repos/mitodl/odl-video-service/pulls/comments/143780277"},"html":{"href":"https://github.com/mitodl/odl-video-service/pull/297#discussion_r143780277"},"pull_request":{"href":"https://api.github.com/repos/mitodl/odl-video-service/pulls/297"}},"in_reply_to_id":143771481},"pull_request":{"url":"https://api.github.com/repos/mitodl/odl-video-service/pulls/297","id":144770740,"html_url":"https://github.com/mitodl/odl-video-service/pull/297","diff_url":"https://github.com/mitodl/odl-video-service/pull/297.diff","patch_url":"https://github.com/mitodl/odl-video-service/pull/297.patch","issue_url":"https://api.github.com/repos/mitodl/odl-video-service/issues/297","number":297,"state":"open","locked":false,"title":"Multiangle VideoJS","user":{"login":"mbertrand","id":187676,"avatar_url":"https://avatars2.githubusercontent.com/u/187676?v=4","gravatar_id":"","url":"https://api.github.com/users/mbertrand","html_url":"https://github.com/mbertrand","followers_url":"https://api.github.com/users/mbertrand/followers","following_url":"https://api.github.com/users/mbertrand/following{/other_user}","gists_url":"https://api.github.com/users/mbertrand/gists{/gist_id}","starred_url":"https://api.github.com/users/mbertrand/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/mbertrand/subscriptions","organizations_url":"https://api.github.com/users/mbertrand/orgs","repos_url":"https://api.github.com/users/mbertrand/repos","events_url":"https://api.github.com/users/mbertrand/events{/privacy}","received_events_url":"https://api.github.com/users/mbertrand/received_events","type":"User","site_admin":false},"body":"#### What are the relevant tickets?\r\nCloses #283\r\n\r\n#### What's this PR do?\r\nEnables multiangle playback with Video.js and removes the USwitch player.\r\n\r\n#### How should this be manually tested?\r\n- In the admin console, set a video to multiangle=True (ideally one that really is multiangle, but it's not necessary) - one is available with subtitles on [dropbox](https://www.dropbox.com/sh/1dk25zf882skcrc/AAAb8xCJad7nJgsGMirAvbTra?dl=0).\r\n- Go to the video detail page for that video.  The video player should show one corner of the video, with 4 smaller screens to the right showing each angle of the video, with the one currently playing highlighted in red.\r\n- Turn subtitles on. They should be visible/readable.\r\n- Click on one of the other screens.  It should become highlighted in red and the main video should switch to that screen view.  Subtitles should still be on.\r\n- Click the full screen icon.  Both the main video screen and 4 corner screens should be viewable in fullscreen mode, and clicking on each corner screen should still function the same.\r\n- Either click the fullscreen icon again or press the Esc key.  The page should return to it's previous state.\r\n- Resize the browser window.  The main video window and 4 corner screens should adapt in size.\r\n- Try the above in different browsers.\r\n- Load a video detail page for a video that is not multi-angle.  It should display normally (no corner screens, entire video width/height visible).","created_at":"2017-10-04T20:43:02Z","updated_at":"2017-10-10T16:22:02Z","closed_at":null,"merged_at":null,"merge_commit_sha":"14d71c800af0d6d178d39c103e93121a65c86640","assignee":{"login":"noisecapella","id":863262,"avatar_url":"https://avatars2.githubusercontent.com/u/863262?v=4","gravatar_id":"","url":"https://api.github.com/users/noisecapella","html_url":"https://github.com/noisecapella","followers_url":"https://api.github.com/users/noisecapella/followers","following_url":"https://api.github.com/users/noisecapella/following{/other_user}","gists_url":"https://api.github.com/users/noisecapella/gists{/gist_id}","starred_url":"https://api.github.com/users/noisecapella/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/noisecapella/subscriptions","organizations_url":"https://api.github.com/users/noisecapella/orgs","repos_url":"https://api.github.com/users/noisecapella/repos","events_url":"https://api.github.com/users/noisecapella/events{/privacy}","received_events_url":"https://api.github.com/users/noisecapella/received_events","type":"User","site_admin":false},"assignees":[{"login":"noisecapella","id":863262,"avatar_url":"https://avatars2.githubusercontent.com/u/863262?v=4","gravatar_id":"","url":"https://api.github.com/users/noisecapella","html_url":"https://github.com/noisecapella","followers_url":"https://api.github.com/users/noisecapella/followers","following_url":"https://api.github.com/users/noisecapella/following{/other_user}","gists_url":"https://api.github.com/users/noisecapella/gists{/gist_id}","starred_url":"https://api.github.com/users/noisecapella/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/noisecapella/subscriptions","organizations_url":"https://api.github.com/users/noisecapella/orgs","repos_url":"https://api.github.com/users/noisecapella/repos","events_url":"https://api.github.com/users/noisecapella/events{/privacy}","received_events_url":"https://api.github.com/users/noisecapella/received_events","type":"User","site_admin":false}],"requested_reviewers":[],"milestone":null,"commits_url":"https://api.github.com/repos/mitodl/odl-video-service/pulls/297/commits","review_comments_url":"https://api.github.com/repos/mitodl/odl-video-service/pulls/297/comments","review_comment_url":"https://api.github.com/repos/mitodl/odl-video-service/pulls/comments{/number}","comments_url":"https://api.github.com/repos/mitodl/odl-video-service/issues/297/comments","statuses_url":"https://api.github.com/repos/mitodl/odl-video-service/statuses/41ce29880e6bde03f182c983ad4b669e0cbc9c62","head":{"label":"mitodl:mb/multiangle","ref":"mb/multiangle","sha":"41ce29880e6bde03f182c983ad4b669e0cbc9c62","user":{"login":"mitodl","id":7918516,"avatar_url":"https://avatars2.githubusercontent.com/u/7918516?v=4","gravatar_id":"","url":"https://api.github.com/users/mitodl","html_url":"https://github.com/mitodl","followers_url":"https://api.github.com/users/mitodl/followers","following_url":"https://api.github.com/users/mitodl/following{/other_user}","gists_url":"https://api.github.com/users/mitodl/gists{/gist_id}","starred_url":"https://api.github.com/users/mitodl/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/mitodl/subscriptions","organizations_url":"https://api.github.com/users/mitodl/orgs","repos_url":"https://api.github.com/users/mitodl/repos","events_url":"https://api.github.com/users/mitodl/events{/privacy}","received_events_url":"https://api.github.com/users/mitodl/received_events","type":"Organization","site_admin":false},"repo":{"id":88642420,"name":"odl-video-service","full_name":"mitodl/odl-video-service","owner":{"login":"mitodl","id":7918516,"avatar_url":"https://avatars2.githubusercontent.com/u/7918516?v=4","gravatar_id":"","url":"https://api.github.com/users/mitodl","html_url":"https://github.com/mitodl","followers_url":"https://api.github.com/users/mitodl/followers","following_url":"https://api.github.com/users/mitodl/following{/other_user}","gists_url":"https://api.github.com/users/mitodl/gists{/gist_id}","starred_url":"https://api.github.com/users/mitodl/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/mitodl/subscriptions","organizations_url":"https://api.github.com/users/mitodl/orgs","repos_url":"https://api.github.com/users/mitodl/repos","events_url":"https://api.github.com/users/mitodl/events{/privacy}","received_events_url":"https://api.github.com/users/mitodl/received_events","type":"Organization","site_admin":false},"private":false,"html_url":"https://github.com/mitodl/odl-video-service","description":"building blocks for a basic video service for ODL","fork":false,"url":"https://api.github.com/repos/mitodl/odl-video-service","forks_url":"https://api.github.com/repos/mitodl/odl-video-service/forks","keys_url":"https://api.github.com/repos/mitodl/odl-video-service/keys{/key_id}","collaborators_url":"https://api.github.com/repos/mitodl/odl-video-service/collaborators{/collaborator}","teams_url":"https://api.github.com/repos/mitodl/odl-video-service/teams","hooks_url":"https://api.github.com/repos/mitodl/odl-video-service/hooks","issue_events_url":"https://api.github.com/repos/mitodl/odl-video-service/issues/events{/number}","events_url":"https://api.github.com/repos/mitodl/odl-video-service/events","assignees_url":"https://api.github.com/repos/mitodl/odl-video-service/assignees{/user}","branches_url":"https://api.github.com/repos/mitodl/odl-video-service/branches{/branch}","tags_url":"https://api.github.com/repos/mitodl/odl-video-service/tags","blobs_url":"https://api.github.com/repos/mitodl/odl-video-service/git/blobs{/sha}","git_tags_url":"https://api.github.com/repos/mitodl/odl-video-service/git/tags{/sha}","git_refs_url":"https://api.github.com/repos/mitodl/odl-video-service/git/refs{/sha}","trees_url":"https://api.github.com/repos/mitodl/odl-video-service/git/trees{/sha}","statuses_url":"https://api.github.com/repos/mitodl/odl-video-service/statuses/{sha}","languages_url":"https://api.github.com/repos/mitodl/odl-video-service/languages","stargazers_url":"https://api.github.com/repos/mitodl/odl-video-service/stargazers","contributors_url":"https://api.github.com/repos/mitodl/odl-video-service/contributors","subscribers_url":"https://api.github.com/repos/mitodl/odl-video-service/subscribers","subscription_url":"https://api.github.com/repos/mitodl/odl-video-service/subscription","commits_url":"https://api.github.com/repos/mitodl/odl-video-service/commits{/sha}","git_commits_url":"https://api.github.com/repos/mitodl/odl-video-service/git/commits{/sha}","comments_url":"https://api.github.com/repos/mitodl/odl-video-service/comments{/number}","issue_comment_url":"https://api.github.com/repos/mitodl/odl-video-service/issues/comments{/number}","contents_url":"https://api.github.com/repos/mitodl/odl-video-service/contents/{+path}","compare_url":"https://api.github.com/repos/mitodl/odl-video-service/compare/{base}...{head}","merges_url":"https://api.github.com/repos/mitodl/odl-video-service/merges","archive_url":"https://api.github.com/repos/mitodl/odl-video-service/{archive_format}{/ref}","downloads_url":"https://api.github.com/repos/mitodl/odl-video-service/downloads","issues_url":"https://api.github.com/repos/mitodl/odl-video-service/issues{/number}","pulls_url":"https://api.github.com/repos/mitodl/odl-video-service/pulls{/number}","milestones_url":"https://api.github.com/repos/mitodl/odl-video-service/milestones{/number}","notifications_url":"https://api.github.com/repos/mitodl/odl-video-service/notifications{?since,all,participating}","labels_url":"https://api.github.com/repos/mitodl/odl-video-service/labels{/name}","releases_url":"https://api.github.com/repos/mitodl/odl-video-service/releases{/id}","deployments_url":"https://api.github.com/repos/mitodl/odl-video-service/deployments","created_at":"2017-04-18T15:41:48Z","updated_at":"2017-08-19T02:00:28Z","pushed_at":"2017-10-10T13:18:30Z","git_url":"git://github.com/mitodl/odl-video-service.git","ssh_url":"git@github.com:mitodl/odl-video-service.git","clone_url":"https://github.com/mitodl/odl-video-service.git","svn_url":"https://github.com/mitodl/odl-video-service","homepage":null,"size":576,"stargazers_count":1,"watchers_count":1,"language":"Python","has_issues":true,"has_projects":true,"has_downloads":true,"has_wiki":true,"has_pages":false,"forks_count":0,"mirror_url":null,"open_issues_count":69,"forks":0,"open_issues":69,"watchers":1,"default_branch":"master"}},"base":{"label":"mitodl:master","ref":"master","sha":"8151a858bc217af31b85a017100485cdae73637c","user":{"login":"mitodl","id":7918516,"avatar_url":"https://avatars2.githubusercontent.com/u/7918516?v=4","gravatar_id":"","url":"https://api.github.com/users/mitodl","html_url":"https://github.com/mitodl","followers_url":"https://api.github.com/users/mitodl/followers","following_url":"https://api.github.com/users/mitodl/following{/other_user}","gists_url":"https://api.github.com/users/mitodl/gists{/gist_id}","starred_url":"https://api.github.com/users/mitodl/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/mitodl/subscriptions","organizations_url":"https://api.github.com/users/mitodl/orgs","repos_url":"https://api.github.com/users/mitodl/repos","events_url":"https://api.github.com/users/mitodl/events{/privacy}","received_events_url":"https://api.github.com/users/mitodl/received_events","type":"Organization","site_admin":false},"repo":{"id":88642420,"name":"odl-video-service","full_name":"mitodl/odl-video-service","owner":{"login":"mitodl","id":7918516,"avatar_url":"https://avatars2.githubusercontent.com/u/7918516?v=4","gravatar_id":"","url":"https://api.github.com/users/mitodl","html_url":"https://github.com/mitodl","followers_url":"https://api.github.com/users/mitodl/followers","following_url":"https://api.github.com/users/mitodl/following{/other_user}","gists_url":"https://api.github.com/users/mitodl/gists{/gist_id}","starred_url":"https://api.github.com/users/mitodl/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/mitodl/subscriptions","organizations_url":"https://api.github.com/users/mitodl/orgs","repos_url":"https://api.github.com/users/mitodl/repos","events_url":"https://api.github.com/users/mitodl/events{/privacy}","received_events_url":"https://api.github.com/users/mitodl/received_events","type":"Organization","site_admin":false},"private":false,"html_url":"https://github.com/mitodl/odl-video-service","description":"building blocks for a basic video service for ODL","fork":false,"url":"https://api.github.com/repos/mitodl/odl-video-service","forks_url":"https://api.github.com/repos/mitodl/odl-video-service/forks","keys_url":"https://api.github.com/repos/mitodl/odl-video-service/keys{/key_id}","collaborators_url":"https://api.github.com/repos/mitodl/odl-video-service/collaborators{/collaborator}","teams_url":"https://api.github.com/repos/mitodl/odl-video-service/teams","hooks_url":"https://api.github.com/repos/mitodl/odl-video-service/hooks","issue_events_url":"https://api.github.com/repos/mitodl/odl-video-service/issues/events{/number}","events_url":"https://api.github.com/repos/mitodl/odl-video-service/events","assignees_url":"https://api.github.com/repos/mitodl/odl-video-service/assignees{/user}","branches_url":"https://api.github.com/repos/mitodl/odl-video-service/branches{/branch}","tags_url":"https://api.github.com/repos/mitodl/odl-video-service/tags","blobs_url":"https://api.github.com/repos/mitodl/odl-video-service/git/blobs{/sha}","git_tags_url":"https://api.github.com/repos/mitodl/odl-video-service/git/tags{/sha}","git_refs_url":"https://api.github.com/repos/mitodl/odl-video-service/git/refs{/sha}","trees_url":"https://api.github.com/repos/mitodl/odl-video-service/git/trees{/sha}","statuses_url":"https://api.github.com/repos/mitodl/odl-video-service/statuses/{sha}","languages_url":"https://api.github.com/repos/mitodl/odl-video-service/languages","stargazers_url":"https://api.github.com/repos/mitodl/odl-video-service/stargazers","contributors_url":"https://api.github.com/repos/mitodl/odl-video-service/contributors","subscribers_url":"https://api.github.com/repos/mitodl/odl-video-service/subscribers","subscription_url":"https://api.github.com/repos/mitodl/odl-video-service/subscription","commits_url":"https://api.github.com/repos/mitodl/odl-video-service/commits{/sha}","git_commits_url":"https://api.github.com/repos/mitodl/odl-video-service/git/commits{/sha}","comments_url":"https://api.github.com/repos/mitodl/odl-video-service/comments{/number}","issue_comment_url":"https://api.github.com/repos/mitodl/odl-video-service/issues/comments{/number}","contents_url":"https://api.github.com/repos/mitodl/odl-video-service/contents/{+path}","compare_url":"https://api.github.com/repos/mitodl/odl-video-service/compare/{base}...{head}","merges_url":"https://api.github.com/repos/mitodl/odl-video-service/merges","archive_url":"https://api.github.com/repos/mitodl/odl-video-service/{archive_format}{/ref}","downloads_url":"https://api.github.com/repos/mitodl/odl-video-service/downloads","issues_url":"https://api.github.com/repos/mitodl/odl-video-service/issues{/number}","pulls_url":"https://api.github.com/repos/mitodl/odl-video-service/pulls{/number}","milestones_url":"https://api.github.com/repos/mitodl/odl-video-service/milestones{/number}","notifications_url":"https://api.github.com/repos/mitodl/odl-video-service/notifications{?since,all,participating}","labels_url":"https://api.github.com/repos/mitodl/odl-video-service/labels{/name}","releases_url":"https://api.github.com/repos/mitodl/odl-video-service/releases{/id}","deployments_url":"https://api.github.com/repos/mitodl/odl-video-service/deployments","created_at":"2017-04-18T15:41:48Z","updated_at":"2017-08-19T02:00:28Z","pushed_at":"2017-10-10T13:18:30Z","git_url":"git://github.com/mitodl/odl-video-service.git","ssh_url":"git@github.com:mitodl/odl-video-service.git","clone_url":"https://github.com/mitodl/odl-video-service.git","svn_url":"https://github.com/mitodl/odl-video-service","homepage":null,"size":576,"stargazers_count":1,"watchers_count":1,"language":"Python","has_issues":true,"has_projects":true,"has_downloads":true,"has_wiki":true,"has_pages":false,"forks_count":0,"mirror_url":null,"open_issues_count":69,"forks":0,"open_issues":69,"watchers":1,"default_branch":"master"}},"_links":{"self":{"href":"https://api.github.com/repos/mitodl/odl-video-service/pulls/297"},"html":{"href":"https://github.com/mitodl/odl-video-service/pull/297"},"issue":{"href":"https://api.github.com/repos/mitodl/odl-video-service/issues/297"},"comments":{"href":"https://api.github.com/repos/mitodl/odl-video-service/issues/297/comments"},"review_comments":{"href":"https://api.github.com/repos/mitodl/odl-video-service/pulls/297/comments"},"review_comment":{"href":"https://api.github.com/repos/mitodl/odl-video-service/pulls/comments{/number}"},"commits":{"href":"https://api.github.com/repos/mitodl/odl-video-service/pulls/297/commits"},"statuses":{"href":"https://api.github.com/repos/mitodl/odl-video-service/statuses/41ce29880e6bde03f182c983ad4b669e0cbc9c62"}},"author_association":"CONTRIBUTOR"}}
{"actor":{"display_login":"mbertrand"}}