Fixed Hulu support

Added support for new Hulu UI
amarcu5 · Dec 3, 2018 · 0eaa689 · 0eaa689
1 parent 7d6d419
commit 0eaa689
Show file tree

Hide file tree

Showing 6 changed files with 37 additions and 17 deletions.
diff --git a/out/PiPer-chrome.zip b/out/PiPer-chrome.zip
diff --git a/out/PiPer-safari-legacy.safariextz b/out/PiPer-safari-legacy.safariextz
diff --git a/out/PiPer-safari.pkg b/out/PiPer-safari.pkg
diff --git a/src/common/scripts/captions.js b/src/common/scripts/captions.js
@@ -76,7 +76,6 @@ const prepareCaptions = function(video) {
   // Otherwise create new caption track
   info('Caption track created');
   track = video.addTextTrack('captions', TRACK_ID, 'en');
-  track.mode = 'showing';
 };
 
 /**
@@ -124,6 +123,7 @@ const removeCaptions = function(video, workaround = true) {
 const addCaption = function(video, caption) {
 
   info(`Showing caption '${caption}'`);
+  track.mode = 'showing';
   track.addCue(new VTTCue(video.currentTime, video.currentTime + 60, caption));
 
   if (getBrowser() == Browser.SAFARI) {

diff --git a/src/common/scripts/resources/hulu.js b/src/common/scripts/resources/hulu.js
@@ -1,31 +1,51 @@
-import { getResource } from './../common.js'
+import { getButton } from './../button.js'
 
 export const domain = 'hulu';
 
 export const resource = {
-  buttonClassName: 'simple-button',
   buttonDidAppear: function() {
-    const buttonParent = getResource().buttonParent();
-    buttonParent.querySelector('.progress-bar-tracker').style.width = 'calc(100% - 380px)';
-    buttonParent.querySelector('.progress-time-container').style.marginRight = '45px';
+
+    // Get localized button title and hide default tooltip
+    const button = getButton();
+    const /** string */ title = button.title;
+    button.title = '';
+
+    // Create stylized tooltip and add to DOM
+    const tooltip = /** @type {HTMLElement} */ (document.createElement('div'));
+    tooltip.className = 'button-tool-tips';
+    tooltip.style.cssText = /** CSS */ (`
+      white-space: nowrap;
+      padding: 0 5px;
+      right: 0;
+    `);
+    tooltip.textContent = title.toUpperCase();
+    button.appendChild(tooltip);
+
+    // Display stylized tooltip on mouseover
+    button.addEventListener('mouseover', function() {
+      tooltip.style.display = 'block';
+    });
+    button.addEventListener('mouseout', function() {
+      tooltip.style.display = 'none';
+    });
   },
   buttonElementType: 'div',
-  buttonHoverStyle: /** CSS */ (`
-    filter: brightness(50%) sepia(1) hue-rotate(58deg) saturate(160%) brightness(110%) !important;
-  `),
+  buttonHoverStyle: /** CSS */ (`opacity: 1.0 !important`),
+  buttonInsertBefore: function(/** Element */ parent) {
+    return document.querySelector('.controls__view-mode-button');
+  },
   buttonParent: function() {
-    return document.querySelector('#site-player .main-bar');
+    return document.querySelector('#dash-player-container .controls__menus-right');
   },
-  buttonScale: 0.7,
   buttonStyle: /** CSS */ (`
-    top: -45px;
-    left: -50px;
-    filter: brightness(80%);
+    opacity: 0.7;
+    cursor: pointer;
+    width: 24px;
   `),
   captionElement: function() {
-    return document.querySelector('.closed-caption-container');
+    return document.querySelector('.closed-caption-outband');
   },
   videoElement: function() {
-    return document.getElementById('content-video-player');
+    return document.querySelector('.video-player');
   },
 };
diff --git a/src/safari-legacy/update.plist b/src/safari-legacy/update.plist
@@ -10,7 +10,7 @@
 			<key>CFBundleShortVersionString</key>
 			<string></string>
 			<key>CFBundleVersion</key>
-			<string>186</string>
+			<string>187</string>
 			<key>Developer Identifier</key>
 			<string>BQ6Q24MF9X</string>
 			<key>URL</key>