From 8341b50668ddaea01e6a2590c6d3f3b4365d1185 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Wed, 8 Mar 2023 23:34:42 -0500
Subject: made startIndex for progressivize an option.  change progressivize
 slide# display

---
 src/client/views/nodes/trails/PresBox.tsx | 66 ++++++++++++++++++-------------
 1 file changed, 38 insertions(+), 28 deletions(-)

(limited to 'src')

diff --git a/src/client/views/nodes/trails/PresBox.tsx b/src/client/views/nodes/trails/PresBox.tsx
index b5a24a380..2975e49ab 100644
--- a/src/client/views/nodes/trails/PresBox.tsx
+++ b/src/client/views/nodes/trails/PresBox.tsx
@@ -882,10 +882,12 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
             if (doc.presHideBefore && index > startIndex) tagDoc.opacity = 0;
             if (doc.presHideAfter && index < startIndex) tagDoc.opacity = 0;
             if (doc.presIndexed !== undefined && index >= startIndex) {
+                const type = DocCast(tagDoc.annotationOn)?.type ?? tagDoc.type;
+                const startInd = NumCast(doc.presIndexedStart);
                 this.progressivizedItems(doc)
-                    ?.slice(doc.type === DocumentType.COL ? 1 : 0)
+                    ?.slice(startInd)
                     .forEach(indexedDoc => (indexedDoc.opacity = 0));
-                doc.presIndexed = Math.min(this.progressivizedItems(doc)?.length ?? 0, doc.type === DocumentType.COL ? 1 : 0);
+                doc.presIndexed = Math.min(this.progressivizedItems(doc)?.length ?? 0, startInd);
             }
             // if (doc.presHide && this.childDocs.indexOf(doc) === startIndex)  tagDoc.opacity = 0;
         });
@@ -1529,7 +1531,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
     }
     @computed get progressivizeDropdown() {
         const activeItem = this.activeItem;
-        if (activeItem && this.targetDoc && activeItem.presIndexed !== undefined) {
+        if (activeItem && this.targetDoc) {
             const effect = activeItem.presBulletEffect ? activeItem.presBulletEffect : PresMovement.None;
             const bulletEffect = (effect: PresEffect) => (
                 <div className={`presBox-dropdownOption ${activeItem.presEffect === effect || (effect === PresEffect.None && !activeItem.presEffect) ? 'active' : ''}`} onPointerDown={StopEvent} onClick={() => this.updateEffect(effect, true)}>
@@ -1547,33 +1549,41 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
                             onChange={() => {
                                 activeItem.presIndexed = activeItem.presIndexed === undefined ? 0 : undefined;
                                 activeItem.presHideBefore = activeItem.presIndexed !== undefined;
+                                const tagDoc = PresBox.targetRenderedDoc(this.activeItem);
+                                const type = DocCast(tagDoc?.annotationOn)?.type ?? tagDoc.type;
+                                activeItem.presIndexedStart = type === DocumentType.COL ? 1 : 0;
                             }}
                             checked={Cast(activeItem.presIndexed, 'number', null) !== undefined ? true : false}
                         />
                     </div>
-                    {activeItem.presIndexed === undefined ? null : (
-                        <div className="ribbon-doubleButton" style={{ display: 'inline-flex' }}>
-                            <div className="presBox-subheading">Expand Current Bullet</div>
-                            <input className="presBox-checkbox" style={{ margin: 10 }} type="checkbox" onChange={() => (activeItem.presBulletExpand = !activeItem.presBulletExpand)} checked={BoolCast(activeItem.presBulletExpand)} />
-                        </div>
-                    )}
-                    <div className="presBox-subheading">Progressive effect</div>
-                    <div
-                        className="presBox-dropdown"
-                        onClick={action(e => {
-                            e.stopPropagation();
-                            this._openBulletEffectDropdown = !this._openBulletEffectDropdown;
-                        })}
-                        style={{ borderBottomLeftRadius: this._openBulletEffectDropdown ? 0 : 5, border: this._openBulletEffectDropdown ? `solid 2px ${Colors.MEDIUM_BLUE}` : 'solid 1px black' }}>
-                        {effect?.toString()}
-                        <FontAwesomeIcon className="presBox-dropdownIcon" style={{ gridColumn: 2, color: this._openBulletEffectDropdown ? Colors.MEDIUM_BLUE : 'black' }} icon={'angle-down'} />
-                        <div className={'presBox-dropdownOptions'} id={'presBoxMovementDropdown'} style={{ display: this._openBulletEffectDropdown ? 'grid' : 'none' }} onPointerDown={e => e.stopPropagation()}>
-                            {bulletEffect(PresEffect.None)}
-                            {bulletEffect(PresEffect.Fade)}
-                            {bulletEffect(PresEffect.Flip)}
-                            {bulletEffect(PresEffect.Rotate)}
-                            {bulletEffect(PresEffect.Bounce)}
-                            {bulletEffect(PresEffect.Roll)}
+                    <div className="ribbon-doubleButton" style={{ display: 'inline-flex' }}>
+                        <div className="presBox-subheading">Progressivize First Bullet</div>
+                        <input className="presBox-checkbox" style={{ margin: 10 }} type="checkbox" onChange={() => (activeItem.presIndexedStart = activeItem.presIndexedStart ? 0 : 1)} checked={!NumCast(activeItem.presIndexedStart)} />
+                    </div>
+                    <div className="ribbon-doubleButton" style={{ display: 'inline-flex' }}>
+                        <div className="presBox-subheading">Expand Current Bullet</div>
+                        <input className="presBox-checkbox" style={{ margin: 10 }} type="checkbox" onChange={() => (activeItem.presBulletExpand = !activeItem.presBulletExpand)} checked={BoolCast(activeItem.presBulletExpand)} />
+                    </div>
+
+                    <div className="ribbon-box">
+                        Bullet Effect
+                        <div
+                            className="presBox-dropdown"
+                            onClick={action(e => {
+                                e.stopPropagation();
+                                this._openBulletEffectDropdown = !this._openBulletEffectDropdown;
+                            })}
+                            style={{ borderBottomLeftRadius: this._openBulletEffectDropdown ? 0 : 5, border: this._openBulletEffectDropdown ? `solid 2px ${Colors.MEDIUM_BLUE}` : 'solid 1px black' }}>
+                            {effect?.toString()}
+                            <FontAwesomeIcon className="presBox-dropdownIcon" style={{ gridColumn: 2, color: this._openBulletEffectDropdown ? Colors.MEDIUM_BLUE : 'black' }} icon={'angle-down'} />
+                            <div className={'presBox-dropdownOptions'} style={{ display: this._openBulletEffectDropdown ? 'grid' : 'none' }} onPointerDown={e => e.stopPropagation()}>
+                                {bulletEffect(PresEffect.None)}
+                                {bulletEffect(PresEffect.Fade)}
+                                {bulletEffect(PresEffect.Flip)}
+                                {bulletEffect(PresEffect.Rotate)}
+                                {bulletEffect(PresEffect.Bounce)}
+                                {bulletEffect(PresEffect.Roll)}
+                            </div>
                         </div>
                     </div>
                 </div>
@@ -2299,7 +2309,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
                 </Tooltip>
                 <div className="presPanel-button-text" onClick={() => this.gotoDocument(0, this.activeItem)} style={{ display: inOverlay || this.props.PanelWidth() > 250 ? 'inline-flex' : 'none' }}>
                     {inOverlay ? '' : 'Slide'} {this.itemIndex + 1}
-                    {this.activeItem?.presIndexed !== undefined ? `.${this.activeItem.presIndexed}/${this.progressivizedItems(this.activeItem)?.length}` : ''} / {this.childDocs.length}
+                    {this.activeItem?.presIndexed !== undefined ? `(${this.activeItem.presIndexed}/${this.progressivizedItems(this.activeItem)?.length})` : ''} / {this.childDocs.length}
                 </div>
                 <div className="presPanel-divider"></div>
                 {this.props.PanelWidth() > 250 ? (
@@ -2420,7 +2430,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
                     </Tooltip>
                     <div className="presPanel-button-text">
                         Slide {this.itemIndex + 1}
-                        {this.activeItem.presIndexed !== undefined ? `.${this.activeItem.presIndexed}/${this.progressivizedItems(this.activeItem)?.length}` : ''} / {this.childDocs.length}
+                        {this.activeItem.presIndexed !== undefined ? `(${this.activeItem.presIndexed}/${this.progressivizedItems(this.activeItem)?.length})` : ''} / {this.childDocs.length}
                     </div>
                     <div className="presPanel-divider" />
                     <div className="presPanel-button-text" onPointerDown={e => setupMoveUpEvents(this, e, returnFalse, returnFalse, this.exitClicked, false, false)}>
-- 
cgit v1.2.3-70-g09d2