@latest-thinking/lt-player 1.0.9-a → 1.0.9-b

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (9) hide show
  1. package/dist/css/lt-player-main.css +1 -1
  2. package/dist/css/lt-player-main.css.map +1 -1
  3. package/dist/js/lt-player-main.js +1 -1
  4. package/dist/js/lt-player-main.js.map +1 -1
  5. package/package.json +1 -1
  6. package/src/assets/sass/sections/controllers/_botom.scss +16 -0
  7. package/src/components/controls/settings/LTPlayerDesktopSettingsControllers.ts +15 -7
  8. package/src/components/controls/settings/LTPlayerMobileSettingsControllers.ts +15 -5
  9. package/src/views/controls.handlebars +2 -6
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@latest-thinking/lt-player",
3
- "version": "1.0.9-a",
3
+ "version": "1.0.9-b",
4
4
  "description": "LT player.",
5
5
  "main": "dist/js/lt-player-main.js",
6
6
  "module": "dist/js/lt-player-main.js",
package/src/assets/sass/sections/controllers/_botom.scss CHANGED
@@ -66,6 +66,14 @@
66
66
  &:active {
67
67
  background-color: $default-lt-player-blue;
68
68
  }
69
+
70
+ span {
71
+ font-size: 10px;
72
+ }
73
+
74
+ [class="playback-speed--1.25X"] {
75
+ font-size: 8px;
76
+ }
69
77
  }
70
78
  }
71
79
 
@@ -334,6 +342,14 @@
334
342
  .plyr__controls_speed-button {
335
343
  width: 40px;
336
344
  height: 40px;
345
+
346
+ span {
347
+ font-size: 14px;
348
+ }
349
+
350
+ [class="playback-speed--1.25X"] {
351
+ font-size: 9px;
352
+ }
337
353
  }
338
354
  }
339
355
  }
package/src/components/controls/settings/LTPlayerDesktopSettingsControllers.ts CHANGED
@@ -89,34 +89,42 @@ export class LTPlayerDesktopSettingsControllers implements SettingsControlsInter
89
89
  setButtonSpeed() {
90
90
  let playerControlsContainer = this.settingsInstance.playerInstance.plyr.elements.controls;
91
91
  let playerSpeedButton = playerControlsContainer.querySelector('.plyr__controls_speed-button');
92
- if (playerSpeedButton) {
93
- playerSpeedButton.innerHTML = `${this.settingsInstance.playerInstance.plyr.speed}`;
94
- }
95
92
  let plyr = this.settingsInstance.playerInstance.plyr;
96
93
  let instance = this.settingsInstance.playerInstance;
97
94
 
98
95
  if (playerSpeedButton) {
96
+ let speedSpan = document.createElement('span');
97
+ playerSpeedButton.appendChild(speedSpan);
98
+ speedSpan.innerHTML = `1X`;
99
+ speedSpan.className = '';
100
+ speedSpan.classList.add('playback-speed--1X');
101
+
99
102
  playerSpeedButton.addEventListener('click', function(event) {
100
103
  let playSpeed = plyr.speed + 0.25;
101
104
 
102
105
  if (playSpeed > 2) {
103
- playerSpeedButton.innerHTML = `1`;
106
+ speedSpan.innerHTML = `1X`;
104
107
  plyr.speed = 1;
108
+ speedSpan.className = '';
109
+ speedSpan.classList.add('playback-speed--1X');
105
110
  return;
106
111
  }
107
112
 
108
113
  if (playSpeed === 1.75) {
109
114
  plyr.speed = playSpeed + 0.25
110
- playerSpeedButton.innerHTML = `${playSpeed + 0.25}`;
115
+ speedSpan.innerHTML = `2X`;
116
+ speedSpan.className = '';
117
+ speedSpan.classList.add('playback-speed--2X');
111
118
  return;
112
119
  }
113
120
 
114
121
  plyr.speed = playSpeed;
115
- playerSpeedButton.innerHTML = `${playSpeed}`;
122
+ speedSpan.innerHTML = playSpeed + "X";
123
+ speedSpan.className = '';
124
+ speedSpan.classList.add('playback-speed--' + playSpeed + 'X');
116
125
 
117
126
  instance.playerControl.mobileEvents.showControls(instance);
118
127
  })
119
128
  }
120
129
  }
121
-
122
130
  }
package/src/components/controls/settings/LTPlayerMobileSettingsControllers.ts CHANGED
@@ -163,27 +163,37 @@ export class LTPlayerMobileSettingsControllers implements SettingsControlsInterf
163
163
  let instance = this.settingsInstance.playerInstance;
164
164
 
165
165
  if (playerSpeedButton) {
166
- playerSpeedButton.innerHTML = `${this.settingsInstance.playerInstance.plyr.speed}`;
166
+ let speedSpan = document.createElement('span');
167
+ playerSpeedButton.appendChild(speedSpan);
168
+ speedSpan.innerHTML = `1X`;
169
+ speedSpan.className = '';
170
+ speedSpan.classList.add('playback-speed--1X');
171
+
167
172
  let mobileEvent: HammerManager = this.settingsInstance.playerInstance.eventInstance.mobileEvents.setMobileEvent(playerSpeedButton);
168
173
  if (mobileEvent) {
169
174
  mobileEvent.on('singletap', function LTPlayerMobileSpeedButton() {
170
-
171
175
  let playSpeed = plyr.speed + 0.25;
172
176
 
173
177
  if (playSpeed > 2) {
174
- playerSpeedButton.innerHTML = `1`;
178
+ speedSpan.innerHTML = `1X`;
175
179
  plyr.speed = 1;
180
+ speedSpan.className = '';
181
+ speedSpan.classList.add('playback-speed--1X');
176
182
  return;
177
183
  }
178
184
 
179
185
  if (playSpeed === 1.75) {
180
186
  plyr.speed = playSpeed + 0.25
181
- playerSpeedButton.innerHTML = `${playSpeed + 0.25}`;
187
+ speedSpan.innerHTML = `2X`;
188
+ speedSpan.className = '';
189
+ speedSpan.classList.add('playback-speed--2X');
182
190
  return;
183
191
  }
184
192
 
185
193
  plyr.speed = playSpeed;
186
- playerSpeedButton.innerHTML = `${playSpeed}`;
194
+ speedSpan.innerHTML = playSpeed + "X";
195
+ speedSpan.className = '';
196
+ speedSpan.classList.add('playback-speed--' + playSpeed + 'X');
187
197
 
188
198
  instance.playerControl.mobileEvents.showControls(instance);
189
199
  })
package/src/views/controls.handlebars CHANGED
@@ -333,9 +333,7 @@
333
333
  </div>
334
334
  {{#mobile}}
335
335
  <div class="bottom-controller__right-buttons">
336
- <button type="button" class="plyr__control plyr__controls_speed-button">
337
- <span class="playback-speed"></span>
338
- </button>
336
+ <button type="button" class="plyr__control plyr__controls_speed-button"></button>
339
337
  </div>
340
338
  {{/mobile}}
341
339
  {{#mobile}}
@@ -344,9 +342,7 @@
344
342
 
345
343
  {{#desktop}}
346
344
  <div class="bottom-controller__right-buttons">
347
- <button type="button" class="plyr__control plyr__controls_speed-button">
348
- <span class="playback-speed></span>
349
- </button>
345
+ <button type="button" class="plyr__control plyr__controls_speed-button"></button>
350
346
  </div>
351
347
  {{/desktop}}
352
348
  </div>