diff options
| author | Sophie Zhang <sophie_zhang@brown.edu> | 2024-05-01 15:57:07 -0400 |
|---|---|---|
| committer | Sophie Zhang <sophie_zhang@brown.edu> | 2024-05-01 15:57:07 -0400 |
| commit | 926a079c7745d2aac1f9a3ff31ef8cbdefdf732e (patch) | |
| tree | edad658f39638f359fc29bcab303d140b0357623 /src/client/views/nodes/trails/PresBox.tsx | |
| parent | 90016b133395c93f897c614ffee761b6da587e0f (diff) | |
bug fiixng
Diffstat (limited to 'src/client/views/nodes/trails/PresBox.tsx')
| -rw-r--r-- | src/client/views/nodes/trails/PresBox.tsx | 106 |
1 files changed, 6 insertions, 100 deletions
diff --git a/src/client/views/nodes/trails/PresBox.tsx b/src/client/views/nodes/trails/PresBox.tsx index cf97dee1a..d03e2c41e 100644 --- a/src/client/views/nodes/trails/PresBox.tsx +++ b/src/client/views/nodes/trails/PresBox.tsx @@ -1994,16 +1994,13 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() { if (!timingConfig) { timingConfig = { type: SpringType.GENTLE, - // stiffness: 300, - // damping: 12, - // mass: 2, - stiffness: 600, + stiffness: 100, damping: 15, mass: 1, }; } - const preseEffect = (effect: PresEffect) => ( + const presEffect = (effect: PresEffect) => ( <div className={`presBox-dropdownOption ${activeItem.presentation_effect === effect || (effect === PresEffect.None && !activeItem.presentation_effect) ? 'active' : ''}`} onPointerDown={StopEvent} @@ -2095,36 +2092,6 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() { })}> <div className="presBox-option-block" style={{ padding: '16px' }}> Movement - {/* <div - className="presBox-dropdown" - onClick={action(e => { - e.stopPropagation(); - this._openMovementDropdown = !this._openMovementDropdown; - })} - style={{ - color: SettingsManager.userColor, - background: SettingsManager.userVariantColor, - borderBottomLeftRadius: this._openMovementDropdown ? 0 : 5, - border: this._openMovementDropdown ? `solid 2px ${SettingsManager.userVariantColor}` : `solid 1px ${SettingsManager.userColor}`, - }}> - {this.movementName(activeItem)} - <FontAwesomeIcon className="presBox-dropdownIcon" style={{ gridColumn: 2, color: this._openMovementDropdown ? Colors.MEDIUM_BLUE : 'black' }} icon={'angle-down'} /> - <div - className="presBox-dropdownOptions" - id={'presBoxMovementDropdown'} - onPointerDown={StopEvent} - style={{ - color: SettingsManager.userColor, - background: SettingsManager.userBackgroundColor, - display: this._openMovementDropdown ? 'grid' : 'none', - }}> - {presMovement(PresMovement.None)} - {presMovement(PresMovement.Center)} - {presMovement(PresMovement.Zoom)} - {presMovement(PresMovement.Pan)} - {presMovement(PresMovement.Jump)} - </div> - </div> */} <Dropdown color={StrCast(Doc.UserDoc().userColor)} formLabel={'Movement'} @@ -2253,11 +2220,11 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() { <div className="pres-chat"> <div className="pres-chatbox-container" - onClick={e => { - e.stopPropagation(); + onPointerDown={e => { + StopEvent(e); }}> <ReactTextareaAutosize - ref={r => (this._inputref = r)} + ref={r => (this._inputref2 = r)} minRows={1} placeholder="Get animation suggestions..." className="pres-chatbox" @@ -2300,72 +2267,11 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() { mass: elem.mass, }); }}> - <SlideEffect dir={PresEffectDirection.Left as PresEffectDirection} presEffect={elem.effect as PresEffect} tension={elem.stiffness} friction={elem.damping} mass={elem.mass} infinite> + <SlideEffect dir={PresEffectDirection.Left as PresEffectDirection} presEffect={elem.effect as PresEffect} stiffness={elem.stiffness} damping={elem.damping} mass={elem.mass} infinite> <div className="presBox-effect-demo-box"></div> </SlideEffect> </div> ))} - - {/* <div className="presBox-effect-row"> - <div className="presBox-effect-container"> - <SlideEffect - key={JSON.stringify(this.generatedAnimations[0])} - dir={PresEffectDirection.Left as PresEffectDirection} - presEffect={this.generatedAnimations[0].effect as PresEffect} - tension={this.generatedAnimations[0].stiffness} - friction={this.generatedAnimations[0].damping} - mass={this.generatedAnimations[0].mass} - infinite> - <div - className="presBox-effect-demo-box" - style={{ top: this.generatedAnimations[0].effect === PresEffect.Flip ? 0 : '20px', left: this.generatedAnimations[0].effect === PresEffect.Flip ? 0 : '20px' }}></div> - </SlideEffect> - </div> - <div className="presBox-effect-container"> - <SlideEffect - key={JSON.stringify(this.generatedAnimations[1])} - dir={PresEffectDirection.Left as PresEffectDirection} - presEffect={this.generatedAnimations[1].effect as PresEffect} - tension={this.generatedAnimations[1].stiffness} - friction={this.generatedAnimations[1].damping} - mass={this.generatedAnimations[1].mass} - infinite> - <div - className="presBox-effect-demo-box" - style={{ top: this.generatedAnimations[1].effect === PresEffect.Flip ? 0 : '20px', left: this.generatedAnimations[1].effect === PresEffect.Flip ? 0 : '20px', backgroundColor: '#4925ff' }}></div> - </SlideEffect> - </div> - </div> - <div className="presBox-effect-row"> - <div className="presBox-effect-container"> - <SlideEffect - key={JSON.stringify(this.generatedAnimations[2])} - dir={PresEffectDirection.Left as PresEffectDirection} - presEffect={this.generatedAnimations[2].effect as PresEffect} - tension={this.generatedAnimations[2].stiffness} - friction={this.generatedAnimations[2].damping} - mass={this.generatedAnimations[2].mass} - infinite> - <div - className="presBox-effect-demo-box" - style={{ top: this.generatedAnimations[2].effect === PresEffect.Flip ? 0 : '20px', left: this.generatedAnimations[2].effect === PresEffect.Flip ? 0 : '20px', backgroundColor: '#a825ff' }}></div> - </SlideEffect> - </div> - <div className="presBox-effect-container"> - <SlideEffect - key={JSON.stringify(this.generatedAnimations[3])} - dir={PresEffectDirection.Left as PresEffectDirection} - presEffect={this.generatedAnimations[3].effect as PresEffect} - tension={this.generatedAnimations[3].stiffness} - friction={this.generatedAnimations[3].damping} - mass={this.generatedAnimations[3].mass} - infinite> - <div - className="presBox-effect-demo-box" - style={{ top: this.generatedAnimations[3].effect === PresEffect.Flip ? 0 : '20px', left: this.generatedAnimations[3].effect === PresEffect.Flip ? 0 : '20px', backgroundColor: '#ff2599' }}></div> - </SlideEffect> - </div> - </div> */} </div> </div> {/* Effect direction */} |
