@npo/player 1.15.2 → 1.17.0

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 (65) hide show
  1. package/README.md +1 -1
  2. package/lib/js/ads/ster.js +3 -3
  3. package/lib/js/ads/ster.js.map +1 -1
  4. package/lib/js/fragments/removefragments.js.map +1 -1
  5. package/lib/js/fragments/setfragments.js +3 -2
  6. package/lib/js/fragments/setfragments.js.map +1 -1
  7. package/lib/js/playeractions/handlers/handleoffsets.js +3 -0
  8. package/lib/js/playeractions/handlers/handleoffsets.js.map +1 -1
  9. package/lib/js/playeractions/handlers/processplayerconfig.js +1 -0
  10. package/lib/js/playeractions/handlers/processplayerconfig.js.map +1 -1
  11. package/lib/js/ui/components/ctabar.d.ts +2 -1
  12. package/lib/js/ui/components/ctabar.js +9 -7
  13. package/lib/js/ui/components/ctabar.js.map +1 -1
  14. package/lib/js/ui/components/nativemobile/buttons.d.ts +2 -1
  15. package/lib/js/ui/components/nativemobile/buttons.js +43 -39
  16. package/lib/js/ui/components/nativemobile/buttons.js.map +1 -1
  17. package/lib/js/ui/components/settingspanel.js +5 -1
  18. package/lib/js/ui/components/settingspanel.js.map +1 -1
  19. package/lib/js/ui/handlers/streamhandler.d.ts +4 -0
  20. package/lib/js/ui/handlers/streamhandler.js +41 -0
  21. package/lib/js/ui/handlers/streamhandler.js.map +1 -0
  22. package/lib/js/ui/nativemobileuicontainer.js +2 -2
  23. package/lib/js/ui/nativemobileuicontainer.js.map +1 -1
  24. package/lib/js/ui/nativemobileuifactory.js +11 -3
  25. package/lib/js/ui/nativemobileuifactory.js.map +1 -1
  26. package/lib/js/ui/uicontainer.js +3 -2
  27. package/lib/js/ui/uicontainer.js.map +1 -1
  28. package/lib/js/utilities/utilities.d.ts +1 -0
  29. package/lib/js/utilities/utilities.js +6 -1
  30. package/lib/js/utilities/utilities.js.map +1 -1
  31. package/lib/js/utilities/utilities.test.js +33 -1
  32. package/lib/js/utilities/utilities.test.js.map +1 -1
  33. package/lib/npoplayer.d.ts +2 -2
  34. package/lib/npoplayer.js +24 -58
  35. package/lib/npoplayer.js.map +1 -1
  36. package/lib/package.json +1 -1
  37. package/lib/src/js/ui/components/ctabar.d.ts +2 -1
  38. package/lib/src/js/ui/components/nativemobile/buttons.d.ts +2 -1
  39. package/lib/src/js/ui/handlers/streamhandler.d.ts +4 -0
  40. package/lib/src/js/utilities/utilities.d.ts +1 -0
  41. package/lib/src/npoplayer.d.ts +2 -2
  42. package/package.json +1 -1
  43. package/src/scss/components/_advert.scss +87 -11
  44. package/src/scss/components/_buffering.scss +2 -3
  45. package/src/scss/components/_hugeplaybacktogglebutton.scss +2 -0
  46. package/src/scss/components/_replay.scss +2 -2
  47. package/src/scss/components/_seekbar.scss +8 -0
  48. package/src/scss/components/audio/_bottombar.scss +10 -3
  49. package/src/scss/components/audio/_metadata.scss +1 -1
  50. package/src/scss/components/audio/_playbutton.scss +30 -49
  51. package/src/scss/components/audio/_seekbar.scss +2 -0
  52. package/src/scss/components/audio/_topbar.scss +0 -15
  53. package/src/scss/components/audio/_vars.scss +1 -1
  54. package/src/scss/components/audio/_volumeslider.scss +2 -1
  55. package/src/scss/npoplayer.css +39 -28
  56. package/src/scss/variants/_player-large.scss +10 -0
  57. package/src/scss/vars/_icons.scss +1 -0
  58. package/lib/js/api/getstreamobject.test.d.ts +0 -1
  59. package/lib/js/api/getstreamobject.test.js +0 -46
  60. package/lib/js/api/getstreamobject.test.js.map +0 -1
  61. package/lib/npoplayer.test.d.ts +0 -1
  62. package/lib/npoplayer.test.js +0 -12
  63. package/lib/npoplayer.test.js.map +0 -1
  64. package/lib/src/js/api/getstreamobject.test.d.ts +0 -1
  65. package/lib/src/npoplayer.test.d.ts +0 -1
@@ -3,8 +3,7 @@
3
3
 
4
4
  &.bmpui-ui-controlbar-bottom {
5
5
  height: auto;
6
- padding-left: $player-spacing-left;
7
- padding-bottom: $player-spacing;
6
+ padding: 0 $player-spacing $player-spacing $player-spacing-left !important;
8
7
 
9
8
  >.bmpui-container-wrapper {
10
9
  display: flex;
@@ -34,10 +33,18 @@
34
33
  &.bmpui-layout-max-width-400 {
35
34
  .bmpui-ui-controlbar.bmpui-ui-controlbar-bottom {
36
35
  display: block;
37
- padding: 0 20px 10px;
36
+ padding: 0 20px 10px !important;
38
37
  }
39
38
 
40
39
  .bmpui-ui-container.bmpui-controlbar-bottom {
41
40
  display: block;
42
41
  }
42
+ }
43
+
44
+ &.bmpui-layout-max-width-600 {
45
+ .bmpui-ui-controlbar.bmpui-ui-controlbar-bottom {
46
+ .bmpui-ui-container.bmpui-controlbar-bottom {
47
+ display: block;
48
+ }
49
+ }
43
50
  }
@@ -1,5 +1,5 @@
1
1
  .bmpui-metadata {
2
- padding: 0;
2
+ padding: 0 !important;
3
3
  display: block !important;
4
4
 
5
5
  .bmpui-label-metadata-title {
@@ -1,66 +1,47 @@
1
- .bmpui-ui-playbacktoggle-overlay {
2
- display: none;
3
- animation: none;
4
- }
5
-
6
- &.bmpui-player-state-playing,
7
- &.bmpui-player-state-paused,
8
- &.bmpui-player-state-idle,
9
- &.bmpui-player-state-prepared,
10
- &.bmpui-player-state-finished {
11
- .bmpui-ui-playbacktoggle-overlay {
12
- display: block;
13
- animation: none;
14
- }
15
- }
16
-
17
- .bmpui-ui-playbacktoggle-overlay {
18
- opacity: 1;
1
+ .bmpui-ui-playbacktogglebutton {
19
2
  width: 64px;
20
3
  height: 64px;
4
+ position: absolute;
21
5
  top: $player-spacing;
22
6
  margin-top: $player-spacing-inner;
23
7
  left: $player-spacing-left;
24
-
25
- .bmpui-ui-hugeplaybacktogglebutton {
26
- padding: 0;
27
-
28
- .bmpui-image {
29
- &::before {
30
- top: 0;
31
- left: 0;
32
- width: 100%;
33
- height: 100%;
34
- background-color: var(--npo-player-primarycolor);
35
- }
36
-
37
- &::after {
38
- background-color: var(--npo-audio-player-background-color);
39
- }
40
- }
41
-
42
- &.bmpui-on .bmpui-image {
43
- animation: none;
44
- transition: none;
45
- visibility: visible;
46
-
47
- &:after {
48
- mask-image: var(--npo-player-icon-pause);
49
- }
50
- }
8
+ mask-image: none;
9
+ border-radius: 50%;
10
+
11
+ &::before {
12
+ content: '';
13
+ position: absolute;
14
+ background-color: var(--npo-audio-player-background-color);
15
+ width: 100%;
16
+ height: 100%;
17
+ top: 0;
18
+ left: 0;
19
+ mask-image: var(--npo-player-icon-play);
20
+ mask-size: 36px;
21
+ mask-position: 50% 50%;
22
+ mask-repeat: no-repeat;
51
23
  }
24
+
25
+ &.bmpui-on::before {
26
+ mask-image: var(--npo-player-icon-pause);
27
+ }
52
28
  }
53
29
 
54
30
  &.bmpui-layout-max-width-400 {
55
- .bmpui-ui-playbacktoggle-overlay {
31
+ .bmpui-ui-playbacktogglebutton {
56
32
  width: 36px;
57
33
  height: 36px;
58
34
  left: 90px;
59
35
  margin-top: 7px;
60
36
 
61
- .bmpui-image::after {
62
- width: 60px;
63
- height: 60px;
37
+ &::before {
38
+ mask-size: 24px;
64
39
  }
65
40
  }
41
+ }
42
+
43
+ &.bmpui-player-state-finished {
44
+ .bmpui-ui-playbacktogglebutton::before {
45
+ mask-image: var(--npo-player-icon-replay);
46
+ }
66
47
  }
@@ -8,6 +8,8 @@
8
8
  }
9
9
 
10
10
  .bmpui-ui-seekbar {
11
+ display: block;
12
+
11
13
  .bmpui-seekbar {
12
14
  .bmpui-seekbar-playbackposition-marker {
13
15
  background-color: var(--npo-player-primarycolor);
@@ -1,18 +1,3 @@
1
- // hide when not ready yet
2
- .bmpui-controlbar-top {
3
- display: none;
4
- }
5
-
6
- &.bmpui-player-state-playing,
7
- &.bmpui-player-state-paused,
8
- &.bmpui-player-state-idle,
9
- &.bmpui-player-state-prepared,
10
- &.bmpui-player-state-finished {
11
- .bmpui-controlbar-top {
12
- display: block;
13
- }
14
- }
15
-
16
1
  .bmpui-ui-controlbar-top,
17
2
  .bmpui-ui-titlebar {
18
3
  background: none;
@@ -1,5 +1,5 @@
1
1
  $player-height: 160px;
2
- $player-height-small: 135px;
2
+ $player-height-small: 120px;
3
3
  $player-spacing: 20px;
4
4
  $player-spacing-inner: 15px;
5
5
  $player-spacing-left: 160px;
@@ -28,7 +28,8 @@
28
28
  }
29
29
  }
30
30
 
31
- &.bmpui-layout-max-width-400 {
31
+ &.bmpui-layout-max-width-400,
32
+ &.bmpui-layout-max-width-600 {
32
33
  .bmpui-ui-volumetogglebutton {
33
34
  margin: 0;
34
35
  }