taleem-player 1.0.16 → 1.0.18

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 (6) hide show
  1. package/README.md +0 -1
  2. package/dist/css/app/app.css +43 -0
  3. package/dist/css/taleem.css +1 -1
  4. package/dist/taleem-player.esm.js +29 -9
  5. package/dist/taleem-player.umd.js +29 -9
  6. package/package.json +6 -4
package/README.md CHANGED
@@ -1,4 +1,3 @@
1
-
2
1
  # Taleem Player
3
2
 
4
3
  **Taleem Player** converts **Taleem JSON slide data** into **web-based presentations**.
package/dist/css/app/app.css ADDED
@@ -0,0 +1,43 @@
1
+
2
+ body {
3
+ margin: 0;
4
+ font-family: system-ui, sans-serif;
5
+ }
6
+
7
+ /* slide area */
8
+ #app {
9
+ height: 100vh;
10
+ /* padding-bottom: 90px; reserve space for fixed nav */
11
+ box-sizing: border-box;
12
+ }
13
+
14
+ .nav-test {
15
+ position: fixed;
16
+ left: 0;
17
+ right: 0;
18
+ bottom: 0;
19
+ height: 90px;
20
+ transition: opacity 0.5s ease;
21
+ backdrop-filter: blur(0px); /* optional, modern browsers */
22
+ -webkit-backdrop-filter: blur(0px);
23
+ background: rgba(187, 187, 188, 0.85);
24
+
25
+ border-top: 1px solid rgba(0, 0, 0, 0.1);
26
+
27
+ display: flex;
28
+ align-items: center;
29
+ gap: 1rem;
30
+ padding: 0 1rem;
31
+
32
+ z-index: 999999;
33
+ }
34
+
35
+
36
+ .nav-test span {
37
+ font-weight: 700;
38
+ min-width: 80px;
39
+ }
40
+
41
+ input[type="range"] {
42
+ flex: 1;
43
+ }
package/dist/css/taleem.css CHANGED
@@ -1 +1 @@
1
- .slide{width:100%;height:100vh;box-sizing:border-box;padding:4rem 6rem;display:flex;flex-direction:column;justify-content:center;font-family:system-ui,-apple-system,sans-serif;align-items:center;background:var(--backgroundColor, #ffffff);color:var(--primaryColor, #111111)}.slide img{max-width:100%;max-height:100%;height:auto;width:auto;display:block}.slide h1,.slide h2,.slide h3,.slide p{margin:0}.slide ul{margin:0;padding-left:1.2em}.slide li{margin:0}.katex{font-size:1.4em}body{margin:0;font-family:system-ui,sans-serif}#app{height:100vh;box-sizing:border-box}.nav-test{position:fixed;left:0;right:0;bottom:0;height:90px;transition:opacity .5s ease;backdrop-filter:blur(0px);-webkit-backdrop-filter:blur(0px);background:#bbbbbcd9;border-top:1px solid rgba(0,0,0,.1);display:flex;align-items:center;gap:1rem;padding:0 1rem;z-index:999999}.nav-test span{font-weight:700;min-width:80px}input[type=range]{flex:1}.slide.titleAndSubtitle{align-items:center;text-align:center;gap:32px}.slide.titleAndSubtitle h1{font-size:5.8rem;font-weight:700;line-height:1.2;letter-spacing:-.015em;margin:0}.slide.titleAndSubtitle h2{font-size:2.3rem;font-weight:400;opacity:.8;margin:0}.slide.titleAndPara{display:flex;flex-direction:column;justify-content:flex-start;align-items:center;padding-top:3rem;gap:1rem;text-align:center}.slide.titleAndPara h1{font-size:3rem;font-weight:700;line-height:1.2;max-width:1100px;margin:0 auto}.slide.titleAndPara p{font-size:2.2rem;line-height:1.7;max-width:1000px;margin:0 auto}@media(min-width:1024px){.slide.titleAndPara{padding-top:5rem;gap:2rem}.slide.titleAndPara h1{font-size:2.8rem;max-width:900px}.slide.titleAndPara p{font-size:1.6rem;max-width:750px;line-height:1.6}}@media(orientation:landscape){.slide.titleAndPara p{font-size:1.5rem;max-width:1100px;line-height:1.5}}@media(orientation:portrait){.slide.titleAndPara p{font-size:2.75rem;max-width:1100px;line-height:2.2;text-align:justify}}@media(min-width:1600px){.slide.titleAndPara{padding-top:6rem;gap:3rem}.slide.titleAndPara h1{font-size:4rem;max-width:1200px}.slide.titleAndPara p{font-size:2.4rem;max-width:1100px;line-height:1.8}}.slide.bulletList{align-items:center;text-align:left}.slide.bulletList ul{list-style:disc;padding-left:2rem;margin:0;max-width:900px}.slide.bulletList li{font-size:2.2rem;font-weight:500;line-height:2;margin-bottom:1rem}@media(orientation:portrait){.slide.bulletList li{line-height:3}}@media(min-width:1024px)and (max-width:1440px){.slide.bulletList ul{max-width:750px}.slide.bulletList li{font-size:3rem;line-height:1.8;margin-bottom:.8rem}}@media(min-width:1600px){.slide.bulletList ul{max-width:1100px}.slide.bulletList li{font-size:3rem;line-height:2.2}}.slide.twoColumnText{display:flex;flex-direction:row;font-size:2rem;line-height:1.7;justify-content:center;align-items:stretch;gap:4rem;text-align:center}.slide.twoColumnText>div{flex:1;max-width:600px;padding:2.5rem;border:1px solid white;border-radius:12px;box-shadow:0 12px 30px #00000014}@media(orientation:portrait){.slide.twoColumnText{flex-direction:column;font-size:3rem;line-height:2;gap:2rem}.slide.twoColumnText>div{max-width:100%}}@media(orientation:landscape){.slide.twoColumnText{font-size:1.5rem}.slide.twoColumnText>div{max-width:100%}}@media(min-width:1600px){.slide.twoColumnText{font-size:3rem;line-height:1.9;gap:3rem}.slide.twoColumnText>div{max-width:800px;padding:3rem}}.slide.imageSlide{padding:0;align-items:center;justify-content:center}.slide.imageSlide img{max-width:90%;max-height:90%;object-fit:contain}.slide.imageWithTitle{align-items:center;text-align:center;gap:2.5rem}.slide.imageWithTitle h1{font-size:2.5rem;font-weight:600;line-height:1.2;margin:0}.slide.imageWithTitle img{max-width:85%;max-height:70%;object-fit:contain}@media(orientation:portrait){.slide.imageWithTitle h1{font-size:3.2rem}.slide.imageWithTitle img{max-width:95%;max-height:65%}}.slide.imageWithCaption{margin:0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:2.5rem}.slide.imageWithCaption img{max-width:85%;max-height:65%;object-fit:contain;display:block}.slide.imageWithCaption figcaption{font-size:2.4rem;line-height:1.6;max-width:800px;margin:0;opacity:.85}@media(orientation:portrait){.slide.imageWithCaption img{max-width:95%;max-height:60%}.slide.imageWithCaption figcaption{font-size:2.8rem}}.slide.imageLeftBulletsRight{flex-direction:row;align-items:center;justify-content:center;gap:4rem;text-align:left}.slide.imageLeftBulletsRight img{max-width:45%;max-height:75%;object-fit:contain}.slide.imageLeftBulletsRight ul{max-width:45%;margin:0;padding-left:2rem}.slide.imageLeftBulletsRight li{font-size:2rem;line-height:1.5;margin-bottom:1rem}@media(orientation:portrait){.slide.imageLeftBulletsRight{flex-direction:column;text-align:left}.slide.imageLeftBulletsRight img{max-width:85%}.slide.imageLeftBulletsRight ul{max-width:100%;padding-left:0;list-style-position:inside}}.slide.imageRightBulletsLeft{flex-direction:row;align-items:center;justify-content:center;gap:4rem;text-align:left}.slide.imageRightBulletsLeft img{order:2;max-width:45%;max-height:75%;object-fit:contain}.slide.imageRightBulletsLeft ul{order:1;max-width:45%;margin:0;padding-left:2rem}.slide.imageRightBulletsLeft li{font-size:2rem;line-height:1.5;margin-bottom:1rem}@media(orientation:portrait){.slide.imageRightBulletsLeft{flex-direction:column;text-align:left}.slide.imageRightBulletsLeft ul{order:1;max-width:100%;padding-left:0;list-style-position:inside}.slide.imageRightBulletsLeft img{order:2;max-width:85%}}.slide.table{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:4rem 2rem}.slide.table table{border-collapse:collapse;width:100%;max-width:1100px;table-layout:fixed}.slide.table td{padding:1rem;font-size:2.4rem;border:2px solid var(--primaryColor);word-break:break-word;text-align:center}@media(orientation:portrait){.slide.table td{font-size:1.8rem;padding:1rem 1.2rem}}.slide.barChart{align-items:center;justify-content:center;text-align:left}.slide.barChart .bar-chart{width:100%;max-width:900px;display:flex;flex-direction:column;gap:2.4rem}.slide.barChart .bar-row{display:flex;align-items:center;gap:2rem}.slide.barChart .bar-label{width:220px;flex-shrink:0;font-size:2.4rem;opacity:.9}.slide.barChart .bar-track{flex:1;height:28px;background:#00000014;border-radius:14px;overflow:hidden}.slide.barChart .bar-fill{height:100%;width:0;background:#f5c542;border-radius:14px;transition:width .6s ease}.slide.barChart .bar-value{width:60px;text-align:right;font-size:2.2rem;opacity:.85}@media(orientation:portrait){.slide.barChart .bar-label{width:140px;font-size:2rem}.slide.barChart .bar-value{width:48px;font-size:1.8rem}.slide.barChart .bar-track{height:22px}}.slide.progressbar{align-items:center;justify-content:center;text-align:center;gap:3rem}.slide.progressbar .progressbar-item{width:90%;max-width:900px}.slide.progressbar .progressbar-label{font-size:2.6rem;font-weight:500;margin-bottom:1.4rem}.slide.progressbar .progressbar-track{position:relative;height:46px;border-radius:999px;background:#00000040;box-shadow:inset 0 4px 8px #00000026}.slide.progressbar .progressbar-fill{height:100%;width:0;border-radius:999px;background:#f5c542;transition:width .6s ease;display:flex;align-items:center;padding-left:1.8rem;font-size:2.2rem;font-weight:600;color:#222}.slide.progressbar .progressbar-fill:before{content:attr(data-value) "%"}.slide.progressbar .progressbar-track:after{content:"100%";position:absolute;right:-75px;top:50%;transform:translateY(-50%);font-size:2.2rem;font-weight:500;opacity:.75}.slide.quoteSlide{margin:0;width:100%;align-items:center;justify-content:center;text-align:center;padding:6rem 10rem}.slide.quoteSlide p{font-size:4.2rem;line-height:1.4;font-weight:400;max-width:1100px;margin:0 auto;position:relative}.slide.quoteSlide p:before,.slide.quoteSlide p:after{font-size:6rem;opacity:.15;position:absolute}.slide.quoteSlide p:before{content:"\201c";left:-4rem;top:-2rem}.slide.quoteSlide p:after{content:"\201d";right:-4rem;bottom:-2rem}.slide.quoteSlide footer{margin-top:3rem;font-size:2.4rem;font-weight:500;opacity:.75}.slide.keyIdeasSlide{padding:2rem 6rem;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto;align-content:center;justify-items:center;gap:4rem;text-align:center}.slide.keyIdeasSlide .key-idea{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2.5rem}.slide.keyIdeasSlide .icon{font-size:8rem;line-height:1}.slide.keyIdeasSlide .label{font-size:3.6rem;font-weight:700;letter-spacing:.05em}@media(orientation:landscape)and (max-height:500px){.slide.keyIdeasSlide{padding:1.5rem 4rem;gap:3rem}.slide.keyIdeasSlide .icon{font-size:5rem}.slide.keyIdeasSlide .label{font-size:2.2rem}.slide.keyIdeasSlide .key-idea{gap:1.5rem}}.slide.fillImage{padding:0;display:flex}.slide.fillImage img{width:100%;height:100%;object-fit:cover}.slide.eq{display:flex;color:gray;flex-direction:row;align-items:flex-start;justify-content:space-between;gap:1rem;padding-left:3rem;padding-right:3rem;overflow:hidden}.slide.eq .eq-lines{flex:0 0 45%;min-width:0;overflow:hidden;list-style:none;padding:0;margin:0;display:flex;flex-direction:column}.slide.eq .eq-lines li{padding:4px 6px;font-size:1.25rem;line-height:1.3;border-bottom:1px solid rgba(255,255,255,.18);background:#ffffff08;overflow-x:auto;overflow-y:hidden;max-width:100%}.highlighted{background:#967c342e;color:#fff;font-weight:600;border:2px solid gold;border-radius:10px}.slide.eq .eq-side-panel{flex:0 0 55%;min-width:0;overflow:hidden;padding:6px;background:#00000059;border:1px solid rgba(255,255,255,.18);border-radius:16px;display:flex;flex-direction:column;gap:4px}.slide.eq .eq-explain-item{font-size:1.25rem;line-height:1.5;text-align:justify;background:#ffffff0f;padding:14px 18px;border-radius:12px;overflow-wrap:break-word}.slide.eq .eq-explain-image img{width:70%;margin:0 auto;display:block;border-radius:12px}@media(min-width:1024px){.slide.eq{gap:1.5rem}.slide.eq .eq-lines li{font-size:1.5rem}.slide.eq .eq-explain-item{font-size:1.2rem}}@media(min-width:1600px){.slide.eq{gap:2rem;padding-left:4rem;padding-right:4rem}.slide.eq .eq-lines,.slide.eq .eq-side-panel{flex:0 0 50%}.slide.eq .eq-lines li{font-size:2.25rem}.slide.eq .eq-explain-item{font-size:2.25rem;line-height:1.5em}}
1
+ .slide{width:100%;height:100vh;box-sizing:border-box;padding:4rem 6rem;display:flex;flex-direction:column;justify-content:center;font-family:system-ui,-apple-system,sans-serif;align-items:center;background:var(--backgroundColor, #ffffff);color:var(--primaryColor, #111111)}.slide img{max-width:100%;max-height:100%;height:auto;width:auto;display:block}.slide h1,.slide h2,.slide h3,.slide p{margin:0}.slide ul{margin:0;padding-left:1.2em}.slide li{margin:0}.katex{font-size:1.4em}.slide.titleAndSubtitle{align-items:center;text-align:center;gap:32px}.slide.titleAndSubtitle h1{font-size:5.8rem;font-weight:700;line-height:1.2;letter-spacing:-.015em;margin:0}.slide.titleAndSubtitle h2{font-size:2.3rem;font-weight:400;opacity:.8;margin:0}.slide.titleAndPara{display:flex;flex-direction:column;justify-content:flex-start;align-items:center;padding-top:3rem;gap:1rem;text-align:center}.slide.titleAndPara h1{font-size:3rem;font-weight:700;line-height:1.2;max-width:1100px;margin:0 auto}.slide.titleAndPara p{font-size:2.2rem;line-height:1.7;max-width:1000px;margin:0 auto}@media(min-width:1024px){.slide.titleAndPara{padding-top:5rem;gap:2rem}.slide.titleAndPara h1{font-size:2.8rem;max-width:900px}.slide.titleAndPara p{font-size:1.6rem;max-width:750px;line-height:1.6}}@media(orientation:landscape){.slide.titleAndPara p{font-size:1.5rem;max-width:1100px;line-height:1.5}}@media(orientation:portrait){.slide.titleAndPara p{font-size:2.75rem;max-width:1100px;line-height:2.2;text-align:justify}}@media(min-width:1600px){.slide.titleAndPara{padding-top:6rem;gap:3rem}.slide.titleAndPara h1{font-size:4rem;max-width:1200px}.slide.titleAndPara p{font-size:2.4rem;max-width:1100px;line-height:1.8}}.slide.bulletList{align-items:center;text-align:left}.slide.bulletList ul{list-style:disc;padding-left:2rem;margin:0;max-width:900px}.slide.bulletList li{font-size:2.2rem;font-weight:500;line-height:2;margin-bottom:1rem}@media(orientation:portrait){.slide.bulletList li{line-height:3}}@media(min-width:1024px)and (max-width:1440px){.slide.bulletList ul{max-width:750px}.slide.bulletList li{font-size:3rem;line-height:1.8;margin-bottom:.8rem}}@media(min-width:1600px){.slide.bulletList ul{max-width:1100px}.slide.bulletList li{font-size:3rem;line-height:2.2}}.slide.twoColumnText{display:flex;flex-direction:row;font-size:2rem;line-height:1.7;justify-content:center;align-items:stretch;gap:4rem;text-align:center}.slide.twoColumnText>div{flex:1;max-width:600px;padding:2.5rem;border:1px solid white;border-radius:12px;box-shadow:0 12px 30px #00000014}@media(orientation:portrait){.slide.twoColumnText{flex-direction:column;font-size:3rem;line-height:2;gap:2rem}.slide.twoColumnText>div{max-width:100%}}@media(orientation:landscape){.slide.twoColumnText{font-size:1.5rem}.slide.twoColumnText>div{max-width:100%}}@media(min-width:1600px){.slide.twoColumnText{font-size:3rem;line-height:1.9;gap:3rem}.slide.twoColumnText>div{max-width:800px;padding:3rem}}.slide.imageSlide{padding:0;align-items:center;justify-content:center}.slide.imageSlide img{max-width:90%;max-height:90%;object-fit:contain}.slide.imageWithTitle{align-items:center;text-align:center;gap:2.5rem}.slide.imageWithTitle h1{font-size:2.5rem;font-weight:600;line-height:1.2;margin:0}.slide.imageWithTitle img{max-width:85%;max-height:70%;object-fit:contain}@media(orientation:portrait){.slide.imageWithTitle h1{font-size:3.2rem}.slide.imageWithTitle img{max-width:95%;max-height:65%}}.slide.imageWithCaption{margin:0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:2.5rem}.slide.imageWithCaption img{max-width:85%;max-height:65%;object-fit:contain;display:block}.slide.imageWithCaption figcaption{font-size:2.4rem;line-height:1.6;max-width:800px;margin:0;opacity:.85}@media(orientation:portrait){.slide.imageWithCaption img{max-width:95%;max-height:60%}.slide.imageWithCaption figcaption{font-size:2.8rem}}.slide.imageLeftBulletsRight{flex-direction:row;align-items:center;justify-content:center;gap:4rem;text-align:left}.slide.imageLeftBulletsRight img{max-width:45%;max-height:75%;object-fit:contain}.slide.imageLeftBulletsRight ul{max-width:45%;margin:0;padding-left:2rem}.slide.imageLeftBulletsRight li{font-size:2rem;line-height:1.5;margin-bottom:1rem}@media(orientation:portrait){.slide.imageLeftBulletsRight{flex-direction:column;text-align:left}.slide.imageLeftBulletsRight img{max-width:85%}.slide.imageLeftBulletsRight ul{max-width:100%;padding-left:0;list-style-position:inside}}.slide.imageRightBulletsLeft{flex-direction:row;align-items:center;justify-content:center;gap:4rem;text-align:left}.slide.imageRightBulletsLeft img{order:2;max-width:45%;max-height:75%;object-fit:contain}.slide.imageRightBulletsLeft ul{order:1;max-width:45%;margin:0;padding-left:2rem}.slide.imageRightBulletsLeft li{font-size:2rem;line-height:1.5;margin-bottom:1rem}@media(orientation:portrait){.slide.imageRightBulletsLeft{flex-direction:column;text-align:left}.slide.imageRightBulletsLeft ul{order:1;max-width:100%;padding-left:0;list-style-position:inside}.slide.imageRightBulletsLeft img{order:2;max-width:85%}}.slide.table{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:4rem 2rem}.slide.table table{border-collapse:collapse;width:100%;max-width:1100px;table-layout:fixed}.slide.table td{padding:1rem;font-size:2.4rem;border:2px solid var(--primaryColor);word-break:break-word;text-align:center}@media(orientation:portrait){.slide.table td{font-size:1.8rem;padding:1rem 1.2rem}}.slide.barChart{align-items:center;justify-content:center;text-align:left}.slide.barChart .bar-chart{width:100%;max-width:900px;display:flex;flex-direction:column;gap:2.4rem}.slide.barChart .bar-row{display:flex;align-items:center;gap:2rem}.slide.barChart .bar-label{width:220px;flex-shrink:0;font-size:2.4rem;opacity:.9}.slide.barChart .bar-track{flex:1;height:28px;background:#00000014;border-radius:14px;overflow:hidden}.slide.barChart .bar-fill{height:100%;width:0;background:#f5c542;border-radius:14px;transition:width .6s ease}.slide.barChart .bar-value{width:60px;text-align:right;font-size:2.2rem;opacity:.85}@media(orientation:portrait){.slide.barChart .bar-label{width:140px;font-size:2rem}.slide.barChart .bar-value{width:48px;font-size:1.8rem}.slide.barChart .bar-track{height:22px}}.slide.progressbar{align-items:center;justify-content:center;text-align:center;gap:3rem}.slide.progressbar .progressbar-item{width:90%;max-width:900px}.slide.progressbar .progressbar-label{font-size:2.6rem;font-weight:500;margin-bottom:1.4rem}.slide.progressbar .progressbar-track{position:relative;height:46px;border-radius:999px;background:#00000040;box-shadow:inset 0 4px 8px #00000026}.slide.progressbar .progressbar-fill{height:100%;width:0;border-radius:999px;background:#f5c542;transition:width .6s ease;display:flex;align-items:center;padding-left:1.8rem;font-size:2.2rem;font-weight:600;color:#222}.slide.progressbar .progressbar-fill:before{content:attr(data-value) "%"}.slide.progressbar .progressbar-track:after{content:"100%";position:absolute;right:-75px;top:50%;transform:translateY(-50%);font-size:2.2rem;font-weight:500;opacity:.75}.slide.quoteSlide{margin:0;width:100%;align-items:center;justify-content:center;text-align:center;padding:6rem 10rem}.slide.quoteSlide p{font-size:4.2rem;line-height:1.4;font-weight:400;max-width:1100px;margin:0 auto;position:relative}.slide.quoteSlide p:before,.slide.quoteSlide p:after{font-size:6rem;opacity:.15;position:absolute}.slide.quoteSlide p:before{content:"\201c";left:-4rem;top:-2rem}.slide.quoteSlide p:after{content:"\201d";right:-4rem;bottom:-2rem}.slide.quoteSlide footer{margin-top:3rem;font-size:2.4rem;font-weight:500;opacity:.75}.slide.keyIdeasSlide{padding:2rem 6rem;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto;align-content:center;justify-items:center;gap:4rem;text-align:center}.slide.keyIdeasSlide .key-idea{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2.5rem}.slide.keyIdeasSlide .icon{font-size:8rem;line-height:1}.slide.keyIdeasSlide .label{font-size:3.6rem;font-weight:700;letter-spacing:.05em}@media(orientation:landscape)and (max-height:500px){.slide.keyIdeasSlide{padding:1.5rem 4rem;gap:3rem}.slide.keyIdeasSlide .icon{font-size:5rem}.slide.keyIdeasSlide .label{font-size:2.2rem}.slide.keyIdeasSlide .key-idea{gap:1.5rem}}.slide.fillImage{padding:0;display:flex}.slide.fillImage img{width:100%;height:100%;object-fit:cover}.slide.eq{display:flex;color:gray;flex-direction:row;align-items:flex-start;justify-content:space-between;gap:1rem;padding-left:3rem;padding-right:3rem;overflow:hidden}.slide.eq .eq-lines{flex:0 0 45%;min-width:0;overflow:hidden;list-style:none;padding:0;margin:0;display:flex;flex-direction:column}.slide.eq .eq-lines li{padding:4px 6px;font-size:1.25rem;line-height:1.3;border-bottom:1px solid rgba(255,255,255,.18);background:#ffffff08;overflow-x:auto;overflow-y:hidden;max-width:100%}.highlighted{background:#967c342e;color:#fff;font-weight:600;border:2px solid gold;border-radius:10px}.slide.eq .eq-side-panel{flex:0 0 55%;min-width:0;overflow:hidden;padding:6px;background:#00000059;border:1px solid rgba(255,255,255,.18);border-radius:16px;display:flex;flex-direction:column;gap:4px}.slide.eq .eq-explain-item{font-size:1.25rem;line-height:1.5;text-align:justify;background:#ffffff0f;padding:14px 18px;border-radius:12px;overflow-wrap:break-word}.slide.eq .eq-explain-image img{width:70%;margin:0 auto;display:block;border-radius:12px}@media(min-width:1024px){.slide.eq{gap:1.5rem}.slide.eq .eq-lines li{font-size:1.5rem}.slide.eq .eq-explain-item{font-size:1.2rem}}@media(min-width:1600px){.slide.eq{gap:2rem;padding-left:4rem;padding-right:4rem}.slide.eq .eq-lines,.slide.eq .eq-side-panel{flex:0 0 50%}.slide.eq .eq-lines li{font-size:2.25rem}.slide.eq .eq-explain-item{font-size:2.25rem;line-height:1.5em}}
package/dist/taleem-player.esm.js CHANGED
@@ -418,26 +418,21 @@ var EqSlide = {
418
418
  type: "eq",
419
419
  fromJSON(raw) {
420
420
  const lines = raw.data ?? [];
421
- const maxVisible = 3;
422
421
  return Object.freeze({
423
422
  type: "eq",
424
423
  lines,
425
424
  render({ activeIndex = -1 } = {}) {
426
- let start = 0;
427
- if (activeIndex >= maxVisible) {
428
- start = activeIndex - (maxVisible - 1);
429
- }
430
- const visibleLines = lines.slice(start);
431
- const activeLine = activeIndex >= 0 && activeIndex < lines.length ? lines[activeIndex] : null;
425
+ const safeIndex = activeIndex < 0 ? 0 : activeIndex;
426
+ const visibleLines = lines.slice(0, safeIndex + 1);
427
+ const activeLine = safeIndex >= 0 && safeIndex < lines.length ? lines[safeIndex] : null;
432
428
  const spItems = activeLine?.spItems ?? [];
433
429
  return `
434
430
  <section class="slide eq">
435
431
 
436
432
  <ul class="eq-lines">
437
433
  ${visibleLines.map((line, index) => {
438
- const realIndex = start + index;
439
434
  return `
440
- <li class="eq-line ${realIndex === activeIndex ? "highlighted" : ""}">
435
+ <li class="eq-line ${index === safeIndex ? "highlighted" : ""}">
441
436
  ${line.content}
442
437
  </li>
443
438
  `;
@@ -741,11 +736,36 @@ function getDeckEndTime(deck) {
741
736
  }
742
737
  return deck.deck[deck.deck.length - 1].end;
743
738
  }
739
+
740
+ // src/utils/getDeckImages.js
741
+ function getDeckImages(deck) {
742
+ const images = /* @__PURE__ */ new Set();
743
+ if (deck.background?.backgroundImage && typeof deck.background.backgroundImage === "string") {
744
+ images.add(deck.background.backgroundImage.split("/").pop());
745
+ }
746
+ if (!Array.isArray(deck.deck)) return [];
747
+ deck.deck.forEach((slide) => {
748
+ slide.data?.forEach((item) => {
749
+ if (item.name === "image" && typeof item.content === "string") {
750
+ images.add(item.content.split("/").pop());
751
+ }
752
+ if (Array.isArray(item.spItems)) {
753
+ item.spItems.forEach((sp) => {
754
+ if (sp.type === "spImage" && typeof sp.content === "string") {
755
+ images.add(sp.content.split("/").pop());
756
+ }
757
+ });
758
+ }
759
+ });
760
+ });
761
+ return Array.from(images);
762
+ }
744
763
  export {
745
764
  assignMockTimings,
746
765
  createTaleemBrowser,
747
766
  createTaleemPlayer,
748
767
  getDeckEndTime,
768
+ getDeckImages,
749
769
  registerSlide,
750
770
  resolveAssetPaths,
751
771
  resolveBackground
package/dist/taleem-player.umd.js CHANGED
@@ -24,6 +24,7 @@ var TaleemPlayer = (() => {
24
24
  createTaleemBrowser: () => createTaleemBrowser,
25
25
  createTaleemPlayer: () => createTaleemPlayer,
26
26
  getDeckEndTime: () => getDeckEndTime,
27
+ getDeckImages: () => getDeckImages,
27
28
  registerSlide: () => registerSlide,
28
29
  resolveAssetPaths: () => resolveAssetPaths,
29
30
  resolveBackground: () => resolveBackground
@@ -449,26 +450,21 @@ var TaleemPlayer = (() => {
449
450
  type: "eq",
450
451
  fromJSON(raw) {
451
452
  const lines = raw.data ?? [];
452
- const maxVisible = 3;
453
453
  return Object.freeze({
454
454
  type: "eq",
455
455
  lines,
456
456
  render({ activeIndex = -1 } = {}) {
457
- let start = 0;
458
- if (activeIndex >= maxVisible) {
459
- start = activeIndex - (maxVisible - 1);
460
- }
461
- const visibleLines = lines.slice(start);
462
- const activeLine = activeIndex >= 0 && activeIndex < lines.length ? lines[activeIndex] : null;
457
+ const safeIndex = activeIndex < 0 ? 0 : activeIndex;
458
+ const visibleLines = lines.slice(0, safeIndex + 1);
459
+ const activeLine = safeIndex >= 0 && safeIndex < lines.length ? lines[safeIndex] : null;
463
460
  const spItems = activeLine?.spItems ?? [];
464
461
  return `
465
462
  <section class="slide eq">
466
463
 
467
464
  <ul class="eq-lines">
468
465
  ${visibleLines.map((line, index) => {
469
- const realIndex = start + index;
470
466
  return `
471
- <li class="eq-line ${realIndex === activeIndex ? "highlighted" : ""}">
467
+ <li class="eq-line ${index === safeIndex ? "highlighted" : ""}">
472
468
  ${line.content}
473
469
  </li>
474
470
  `;
@@ -772,5 +768,29 @@ var TaleemPlayer = (() => {
772
768
  }
773
769
  return deck.deck[deck.deck.length - 1].end;
774
770
  }
771
+
772
+ // src/utils/getDeckImages.js
773
+ function getDeckImages(deck) {
774
+ const images = /* @__PURE__ */ new Set();
775
+ if (deck.background?.backgroundImage && typeof deck.background.backgroundImage === "string") {
776
+ images.add(deck.background.backgroundImage.split("/").pop());
777
+ }
778
+ if (!Array.isArray(deck.deck)) return [];
779
+ deck.deck.forEach((slide) => {
780
+ slide.data?.forEach((item) => {
781
+ if (item.name === "image" && typeof item.content === "string") {
782
+ images.add(item.content.split("/").pop());
783
+ }
784
+ if (Array.isArray(item.spItems)) {
785
+ item.spItems.forEach((sp) => {
786
+ if (sp.type === "spImage" && typeof sp.content === "string") {
787
+ images.add(sp.content.split("/").pop());
788
+ }
789
+ });
790
+ }
791
+ });
792
+ });
793
+ return Array.from(images);
794
+ }
775
795
  return __toCommonJS(index_exports);
776
796
  })();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "taleem-player",
3
- "version": "1.0.16",
3
+ "version": "1.0.18",
4
4
  "type": "module",
5
5
  "main": "./dist/taleem-player.umd.js",
6
6
  "module": "./dist/taleem-player.esm.js",
@@ -21,15 +21,17 @@
21
21
  "./css": "./dist/css/taleem.css",
22
22
  "./css/dark": "./dist/css/themes/dark.css",
23
23
  "./css/light": "./dist/css/themes/light.css",
24
- "./css/paper": "./dist/css/themes/paper.css"
24
+ "./css/paper": "./dist/css/themes/paper.css",
25
+ "./css/default": "./dist/css/themes/default.css",
26
+ "./css/app": "./dist/css/app/app.css"
25
27
  },
26
28
  "files": [
27
29
  "dist"
28
30
  ],
29
31
  "scripts": {
30
32
  "build": "node ./scripts/build.js",
31
- "dev": "vite",
32
- "test": "vitest run"
33
+ "dev" : "vite",
34
+ "test" : "vitest run"
33
35
  },
34
36
  "dependencies": {
35
37
  "katex": "^0.16.28"