[webkit-changes] [182282] trunk/Source/WebCore

[roger_fong]

Title: [182282] trunk/Source/WebCore

Revision

182282

Author

roger_f...@apple.com

Date

2015-04-02 12:41:35 -0700 (Thu, 02 Apr 2015)

Log Message

Fix slider colors for media controls on OSX.
https://bugs.webkit.org/show_bug.cgi?id=143328.
<rdar://problem/20357858>

Reviewed by Darin Adler.

Fill in bottom portion of volume slider.
Adjust colors to make slider controls look better. Will likely be tweaked later.
* Modules/mediacontrols/mediaControlsApple.js:
(Controller.prototype.drawTimelineBackground):
(Controller.prototype.drawVolumeBackground):

Modified Paths

• trunk/Source/WebCore/ChangeLog
• trunk/Source/WebCore/Modules/mediacontrols/mediaControlsApple.js

Diff

Modified: trunk/Source/WebCore/ChangeLog (182281 => 182282)

--- trunk/Source/WebCore/ChangeLog	2015-04-02 19:14:53 UTC (rev 182281)
+++ trunk/Source/WebCore/ChangeLog	2015-04-02 19:41:35 UTC (rev 182282)
@@ -1,3 +1,17 @@
+2015-04-01  Roger Fong  <roger_f...@apple.com>
+
+        Fix slider colors for media controls on OSX.
+        https://bugs.webkit.org/show_bug.cgi?id=143328.
+        <rdar://problem/20357858>
+
+        Reviewed by Darin Adler.
+
+        Fill in bottom portion of volume slider.
+        Adjust colors to make slider controls look better. Will likely be tweaked later.
+        * Modules/mediacontrols/mediaControlsApple.js:
+        (Controller.prototype.drawTimelineBackground):
+        (Controller.prototype.drawVolumeBackground):
+
 2015-04-02  Yusuke Suzuki  <utatane....@gmail.com>
 
         Clean up EnumerationMode to easily extend

Modified: trunk/Source/WebCore/Modules/mediacontrols/mediaControlsApple.js (182281 => 182282)

--- trunk/Source/WebCore/Modules/mediacontrols/mediaControlsApple.js	2015-04-02 19:14:53 UTC (rev 182281)
+++ trunk/Source/WebCore/Modules/mediacontrols/mediaControlsApple.js	2015-04-02 19:41:35 UTC (rev 182282)
@@ -1131,7 +1131,7 @@
         this.addRoundedRect(ctx, scrubberPosition + 1, 8, width - scrubberPosition - borderSize , trackHeight, trackHeight / 2.0);
         ctx.closePath();
         ctx.clip("evenodd");
-        ctx.fillStyle = "rgba(140, 140, 140, 0.68)";
+        ctx.fillStyle = "rgb(100, 100, 100)";
         ctx.fillRect(0, 0, width, height);
         ctx.restore();
         
@@ -1141,7 +1141,7 @@
         this.addRoundedRect(ctx, 0, 7, width, timelineHeight, timelineHeight / 2.0);
         ctx.closePath();
         ctx.clip();
-        ctx.fillStyle = "rgb(75, 75, 75)";
+        ctx.fillStyle = "rgb(140, 140, 140)";
         ctx.fillRect(0, 0, width * played, height);
         ctx.restore();
         
@@ -1152,7 +1152,7 @@
         this.addRoundedRect(ctx, scrubberPosition, 1, scrubberWidth, scrubberHeight, 1);
         ctx.closePath();
         ctx.clip();
-        ctx.fillStyle = "rgb(140, 140, 140)";
+        ctx.fillStyle = "rgb(175, 175, 175)";
         ctx.fillRect(0, 0, width, height);
         ctx.restore();
         
@@ -1185,14 +1185,25 @@
         
         var scrubberPosition = Math.round(seekerPosition * (width - scrubberDiameter - borderSize));
         
+
+        // Draw portion of volume under slider thumb.
+        ctx.save();
+        ctx.beginPath();
+        this.addRoundedRect(ctx, 0, 3, scrubberPosition + 2, timelineHeight, timelineHeight / 2.0);
+        ctx.closePath();
+        ctx.clip();
+        ctx.fillStyle = "rgb(140, 140, 140)";
+        ctx.fillRect(0, 0, width, height);
+        ctx.restore();
+        
         // Draw volume track border.
         ctx.save();
         ctx.beginPath();
-        this.addRoundedRect(ctx, 0, 3, width, timelineHeight, timelineHeight / 2.0);
-        this.addRoundedRect(ctx, 1, 4, width - borderSize, trackHeight, trackHeight / 2.0);
+        this.addRoundedRect(ctx, scrubberPosition, 3, width - scrubberPosition, timelineHeight, timelineHeight / 2.0);
+        this.addRoundedRect(ctx, scrubberPosition + 1, 4, width - borderSize - scrubberPosition - 1, trackHeight, trackHeight / 2.0);
         ctx.closePath();
         ctx.clip("evenodd");
-        ctx.fillStyle = "rgba(140, 140, 140, 0.68)";
+        ctx.fillStyle = "rgb(100, 100, 100)";
         ctx.fillRect(0, 0, width, height);
         ctx.restore();
         
@@ -1211,7 +1222,7 @@
         this.addRoundedRect(ctx, scrubberPosition + 1, 1, scrubberDiameter, scrubberDiameter, scrubberRadius);
         ctx.closePath();
         ctx.clip();
-        ctx.fillStyle = "rgb(140, 140, 140)";
+        ctx.fillStyle = "rgb(175, 175, 175)";
         ctx.fillRect(0, 0, width, height);
         ctx.restore();
         

_______________________________________________
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes