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.
- package/README.md +0 -1
- package/dist/css/app/app.css +43 -0
- package/dist/css/taleem.css +1 -1
- package/dist/taleem-player.esm.js +29 -9
- package/dist/taleem-player.umd.js +29 -9
- package/package.json +6 -4
package/README.md
CHANGED
|
@@ -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}}
|
|
@@ -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
|
-
|
|
427
|
-
|
|
428
|
-
|
|
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 ${
|
|
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
|
|
@@ -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
|
-
|
|
458
|
-
|
|
459
|
-
|
|
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 ${
|
|
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.
|
|
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"
|