[Modern Media Controls] Implement the pageScaleFactor property
[WebKit-https.git] / Source / WebCore / Modules / modern-media-controls / controls / media-controls.js
1 /*
2  * Copyright (C) 2016 Apple Inc. All Rights Reserved.
3  *
4  * Redistribution and use in source and binary forms, with or without
5  * modification, are permitted provided that the following conditions
6  * are met:
7  * 1. Redistributions of source code must retain the above copyright
8  *    notice, this list of conditions and the following disclaimer.
9  * 2. Redistributions in binary form must reproduce the above copyright
10  *    notice, this list of conditions and the following disclaimer in the
11  *    documentation and/or other materials provided with the distribution.
12  *
13  * THIS SOFTWARE IS PROVIDED BY APPLE INC. ``AS IS'' AND ANY
14  * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
15  * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
16  * PURPOSE ARE DISCLAIMED.  IN NO EVENT SHALL APPLE INC. OR
17  * CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
18  * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
19  * PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR
20  * PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
21  * OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
22  * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
23  * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
24  */
25
26 class MediaControls extends LayoutNode
27 {
28
29     constructor({ width = 300, height = 150, layoutTraits = LayoutTraits.Unknown } = {})
30     {
31         super(`<div class="media-controls">`);
32
33         this._scaleFactor = 1;
34
35         this.width = width;
36         this.height = height;
37         this.layoutTraits = layoutTraits;
38
39         this.startButton = new StartButton(this);
40
41         this.playPauseButton = new PlayPauseButton(this);
42         this.skipBackButton = new SkipBackButton(this);
43         this.airplayButton = new AirplayButton(this);
44         this.pipButton = new PiPButton(this);
45         this.fullscreenButton = new FullscreenButton(this);
46
47         this.statusLabel = new StatusLabel(this)
48         this.timeControl = new TimeControl(this);
49
50         this.controlsBar = new ControlsBar(this);
51
52         this.airplayPlacard = new AirplayPlacard(this);
53         this.invalidPlacard = new InvalidPlacard(this);
54         this.pipPlacard = new PiPPlacard(this);
55
56         this.showsStartButton = false;
57     }
58
59     // Public
60
61     get showsStartButton()
62     {
63         return !!this._showsStartButton;
64     }
65
66     set showsStartButton(flag)
67     {
68         if (this._showsStartButton === flag)
69             return;
70        
71         this._showsStartButton = flag;
72         this._invalidateChildren();
73     }
74
75     get usesLTRUserInterfaceLayoutDirection()
76     {
77         return this.element.classList.contains("uses-ltr-user-interface-layout-direction");
78     }
79
80     set usesLTRUserInterfaceLayoutDirection(flag)
81     {
82         this.element.classList.toggle("uses-ltr-user-interface-layout-direction", flag);
83     }
84
85     get scaleFactor()
86     {
87         return this._scaleFactor;
88     }
89     
90     set scaleFactor(scaleFactor)
91     {
92         if (this._scaleFactor === scaleFactor)
93             return;
94     
95         this._scaleFactor = scaleFactor;
96         this.markDirtyProperty("scaleFactor");
97     }
98
99     get showsPlacard()
100     {
101         return this.children[0] instanceof Placard;
102     }
103
104     showPlacard(placard)
105     {
106         const children = [placard];
107         if (placard === this.airplayPlacard)
108             children.push(this.controlsBar);
109
110         this.children = children;
111     }
112
113     hidePlacard()
114     {
115         if (this.showsPlacard)
116             this.children[0].remove();
117         this._invalidateChildren();
118     }
119
120     fadeIn()
121     {
122         this.element.classList.add("fade-in");
123     }
124
125     // Protected
126
127     commitProperty(propertyName)
128     {
129         if (propertyName === "scaleFactor")
130             this.element.style.zoom = 1 / this._scaleFactor;
131         else
132             super.commitProperty(propertyName);
133     }
134
135     // Private
136
137     _invalidateChildren()
138     {
139         if (!this.showsPlacard)
140             this.children = [this._showsStartButton ? this.startButton : this.controlsBar];
141     }
142
143 }