浏览代码

Formatting

Alejandro Toledo 5 年之前
父节点
当前提交
ef8bf13fd2

+ 1 - 20
inspector/src/components/actionTabs/tabs/propertyGrids/animations/animationCurveEditorComponent.tsx

@@ -61,7 +61,6 @@ export class AnimationCurveEditorComponent extends React.Component<IAnimationCur
     private _heightScale: number = 100;
     private _heightScale: number = 100;
     // Canvas Length *Review this functionality
     // Canvas Length *Review this functionality
     readonly _canvasLength: number = 20;
     readonly _canvasLength: number = 20;
-
     private _newAnimations: Animation[] = [];
     private _newAnimations: Animation[] = [];
     private _svgKeyframes: IKeyframeSvgPoint[] = [];
     private _svgKeyframes: IKeyframeSvgPoint[] = [];
     private _frames: Vector2[] = [];
     private _frames: Vector2[] = [];
@@ -69,17 +68,14 @@ export class AnimationCurveEditorComponent extends React.Component<IAnimationCur
     private _graphCanvas: React.RefObject<HTMLDivElement>;
     private _graphCanvas: React.RefObject<HTMLDivElement>;
     private _selectedCurve: React.RefObject<SVGPathElement>;
     private _selectedCurve: React.RefObject<SVGPathElement>;
     private _svgCanvas: React.RefObject<SvgDraggableArea>;
     private _svgCanvas: React.RefObject<SvgDraggableArea>;
-
     constructor(props: IAnimationCurveEditorComponentProps) {
     constructor(props: IAnimationCurveEditorComponentProps) {
         super(props);
         super(props);
         // Review is we really need this refs
         // Review is we really need this refs
         this._graphCanvas = React.createRef();
         this._graphCanvas = React.createRef();
         this._selectedCurve = React.createRef();
         this._selectedCurve = React.createRef();
         this._svgCanvas = React.createRef();
         this._svgCanvas = React.createRef();
-
         // will update this until we have a top scroll/zoom feature
         // will update this until we have a top scroll/zoom feature
         let valueInd = [2, 1.8, 1.6, 1.4, 1.2, 1, 0.8, 0.6, 0.4, 0.2, 0];
         let valueInd = [2, 1.8, 1.6, 1.4, 1.2, 1, 0.8, 0.6, 0.4, 0.2, 0];
-
         this.state = {
         this.state = {
             animations: this._newAnimations,
             animations: this._newAnimations,
             selected: this.props.animations[0],
             selected: this.props.animations[0],
@@ -106,7 +102,6 @@ export class AnimationCurveEditorComponent extends React.Component<IAnimationCur
     }
     }
 
 
     componentDidMount() {
     componentDidMount() {
-        // Improve this behavior
         setTimeout(() => this.resetPlayheadOffset(), 500);
         setTimeout(() => this.resetPlayheadOffset(), 500);
     }
     }
 
 
@@ -123,7 +118,6 @@ export class AnimationCurveEditorComponent extends React.Component<IAnimationCur
     * This section handles zoom and scroll
     * This section handles zoom and scroll
     * of the graph area.
     * of the graph area.
     */
     */
-
     zoom(e: React.WheelEvent<HTMLDivElement>) {
     zoom(e: React.WheelEvent<HTMLDivElement>) {
         e.nativeEvent.stopImmediatePropagation();
         e.nativeEvent.stopImmediatePropagation();
         console.log(e.deltaY);
         console.log(e.deltaY);
@@ -180,7 +174,6 @@ export class AnimationCurveEditorComponent extends React.Component<IAnimationCur
     * Add New Animation
     * Add New Animation
     * This section handles events from AnimationCreation.
     * This section handles events from AnimationCreation.
     */
     */
-
     handleNameChange(event: React.ChangeEvent<HTMLInputElement>) {
     handleNameChange(event: React.ChangeEvent<HTMLInputElement>) {
         event.preventDefault();
         event.preventDefault();
         this.setState({ animationName: event.target.value.trim() });
         this.setState({ animationName: event.target.value.trim() });
@@ -355,7 +348,6 @@ export class AnimationCurveEditorComponent extends React.Component<IAnimationCur
     * Keyframe Manipulation
     * Keyframe Manipulation
     * This section handles events from SvgDraggableArea.
     * This section handles events from SvgDraggableArea.
     */
     */
-
     selectKeyframe(id: string) {
     selectKeyframe(id: string) {
         let updatedKeyframes = this.state.svgKeyframes?.map(kf => {
         let updatedKeyframes = this.state.svgKeyframes?.map(kf => {
             if (kf.id === id) {
             if (kf.id === id) {
@@ -451,7 +443,6 @@ export class AnimationCurveEditorComponent extends React.Component<IAnimationCur
     * Actions
     * Actions
     * This section handles events from GraphActionsBar.
     * This section handles events from GraphActionsBar.
     */
     */
-
     handleFrameChange(event: React.ChangeEvent<HTMLInputElement>) {
     handleFrameChange(event: React.ChangeEvent<HTMLInputElement>) {
         event.preventDefault();
         event.preventDefault();
         this.changeCurrentFrame(parseInt(event.target.value))
         this.changeCurrentFrame(parseInt(event.target.value))
@@ -602,7 +593,6 @@ export class AnimationCurveEditorComponent extends React.Component<IAnimationCur
     * Curve Rendering Functions
     * Curve Rendering Functions
     * This section handles how to render curves.
     * This section handles how to render curves.
     */
     */
-
     getAnimationProperties(animation: Animation) {
     getAnimationProperties(animation: Animation) {
         let easingType, easingMode;
         let easingType, easingMode;
         let easingFunction: EasingFunction = animation.getEasingFunction() as EasingFunction;
         let easingFunction: EasingFunction = animation.getEasingFunction() as EasingFunction;
@@ -638,11 +628,7 @@ export class AnimationCurveEditorComponent extends React.Component<IAnimationCur
 
 
     getPathData(animation: Animation) {
     getPathData(animation: Animation) {
 
 
-        // Check if Unweighted mode is active (Drag in circle max 90deg - Reflect in opposite point) (selected and opposite tangents move)
-        // Check if Unweighted mode is active and broken mode is active. (Only one tangent moves)
-        // Check if Bezier Mode is active and reflection in opposite point // This assumes somekind of weights... maybe for vNext
-        // Check if Bezier Mode is active and broken active (Full bezier) // This assumes somekind of weights... maybe for vNext
-
+        // Check if Tangent mode is active and broken mode is active. (Only one tangent moves)
         let keyframes = animation.getKeys();
         let keyframes = animation.getKeys();
 
 
         if (keyframes === undefined) {
         if (keyframes === undefined) {
@@ -701,10 +687,7 @@ export class AnimationCurveEditorComponent extends React.Component<IAnimationCur
         let targetPropertyPath = animation.targetPropertyPath;
         let targetPropertyPath = animation.targetPropertyPath;
         let framesPerSecond = animation.framePerSecond;
         let framesPerSecond = animation.framePerSecond;
         let highestFrame = animation.getHighestFrame();
         let highestFrame = animation.getHighestFrame();
-
-        // Should we use this for export?
         let serialized = animation.serialize();
         let serialized = animation.serialize();
-
         let usesTangents = animation.getKeys().find(kf => kf.hasOwnProperty('inTangent') || kf.hasOwnProperty('outTangent')) !== undefined ? true : false;
         let usesTangents = animation.getKeys().find(kf => kf.hasOwnProperty('inTangent') || kf.hasOwnProperty('outTangent')) !== undefined ? true : false;
 
 
         return { loopMode, name, blendingSpeed, targetPropertyPath, targetProperty, framesPerSecond, highestFrame, serialized, usesTangents }
         return { loopMode, name, blendingSpeed, targetPropertyPath, targetProperty, framesPerSecond, highestFrame, serialized, usesTangents }
@@ -971,7 +954,6 @@ export class AnimationCurveEditorComponent extends React.Component<IAnimationCur
     * Core functions
     * Core functions
     * This section handles main Curve Editor Functions.
     * This section handles main Curve Editor Functions.
     */
     */
-
     selectAnimation(animation: Animation) {
     selectAnimation(animation: Animation) {
 
 
         this.isAnimationPlaying();
         this.isAnimationPlaying();
@@ -1003,7 +985,6 @@ export class AnimationCurveEditorComponent extends React.Component<IAnimationCur
     * Timeline
     * Timeline
     * This section controls the timeline.
     * This section controls the timeline.
     */
     */
-
     changeCurrentFrame(frame: number) {
     changeCurrentFrame(frame: number) {
 
 
         let currentValue;
         let currentValue;

+ 0 - 1
inspector/src/components/actionTabs/tabs/propertyGrids/animations/svgDraggableArea.tsx

@@ -37,7 +37,6 @@ export class SvgDraggableArea extends React.Component<ISvgDraggableAreaProps>{
             this._width = this._draggableArea.current?.clientWidth !== undefined ? this._draggableArea.current?.clientWidth : 0;
             this._width = this._draggableArea.current?.clientWidth !== undefined ? this._draggableArea.current?.clientWidth : 0;
             console.log(this._width);
             console.log(this._width);
         }, 500);
         }, 500);
-
     }
     }
 
 
     dragStart(e: React.TouchEvent<SVGSVGElement>): void;
     dragStart(e: React.TouchEvent<SVGSVGElement>): void;