diff --git a/src/Elements/RandomBackground/StoryBoard.ts b/src/Elements/RandomBackground/StoryBoard.ts index 1faca8a..3a47d93 100644 --- a/src/Elements/RandomBackground/StoryBoard.ts +++ b/src/Elements/RandomBackground/StoryBoard.ts @@ -17,6 +17,7 @@ import {RotateCommand} from "../../Util/Beatmap/Data/Sections/Events/Storyboard/ import {ColorCommand} from "../../Util/Beatmap/Data/Sections/Events/Storyboard/Commands/impl/ColorCommand"; import {ParameterCommand} from "../../Util/Beatmap/Data/Sections/Events/Storyboard/Commands/impl/ParameterCommand"; import {LoopCommand} from "../../Util/Beatmap/Data/Sections/Events/Storyboard/Commands/impl/LoopCommand"; +import {StoryBoardUtil} from "../../Util/StoryBoardUtil"; export class StoryBoard extends BackgroundContainer { private beatmap: BeatmapData; @@ -78,16 +79,22 @@ export class StoryBoard extends BackgroundContainer { break; case CommandType.Move: let moveCommand = command as MoveCommand; - pixiObject.position.x = ((moveCommand.endPos.x - moveCommand.startPos.x) * command.easing(animProgress)) + moveCommand.startPos.x; - pixiObject.position.y = ((moveCommand.endPos.y - moveCommand.startPos.y) * command.easing(animProgress)) + moveCommand.startPos.y; + pixiObject.position = StoryBoardUtil.ConvertOsuPixels(new PIXI.Point( + ((moveCommand.endPos.x - moveCommand.startPos.x) * command.easing(animProgress)) + moveCommand.startPos.x, + ((moveCommand.endPos.y - moveCommand.startPos.y) * command.easing(animProgress)) + moveCommand.startPos.y), + moveCommand.parentStoryboardObject.origin, this.beatmap.General.WidescreenStoryboard); break; case CommandType.MoveX: let moveXCommand = command as MoveXCommand; - pixiObject.position.x = ((moveXCommand.endX - moveXCommand.startX) * command.easing(animProgress)) + moveXCommand.startX; + pixiObject.position.x = StoryBoardUtil.ConvertOsuPixels(new PIXI.Point( + ((moveXCommand.endX - moveXCommand.startX) * command.easing(animProgress)) + moveXCommand.startX, 0), + moveXCommand.parentStoryboardObject.origin, this.beatmap.General.WidescreenStoryboard).x; break; case CommandType.MoveY: let moveYCommand = command as MoveYCommand; - pixiObject.position.y = ((moveYCommand.endY - moveYCommand.startY) * command.easing(animProgress)) + moveYCommand.startY; + pixiObject.position.y = StoryBoardUtil.ConvertOsuPixels(new PIXI.Point( + ((moveYCommand.endY - moveYCommand.startY) * command.easing(animProgress)) + moveYCommand.startY, 0), + moveYCommand.parentStoryboardObject.origin, this.beatmap.General.WidescreenStoryboard).y; break; case CommandType.Rotate: let rotateCommand = command as RotateCommand; diff --git a/src/Screens/Screen.ts b/src/Screens/Screen.ts index 6c507b2..8e9817f 100644 --- a/src/Screens/Screen.ts +++ b/src/Screens/Screen.ts @@ -33,11 +33,11 @@ export abstract class Screen extends PIXI.Container { public abstract onResize(): void; - protected getScreenWidth(): number { + public static getScreenWidth(): number { return window.innerWidth; } - protected getScreenHeight(): number { + public static getScreenHeight(): number { return window.innerHeight; } } diff --git a/src/Util/StoryBoardUtil.ts b/src/Util/StoryBoardUtil.ts new file mode 100644 index 0000000..2187776 --- /dev/null +++ b/src/Util/StoryBoardUtil.ts @@ -0,0 +1,49 @@ +import * as PIXI from "pixi.js"; +import {Origin} from "./Beatmap/Data/Sections/Events/Storyboard/Origin"; +import {Screen} from "../Screens/Screen"; + +export class StoryBoardUtil { + public static ConvertOsuPixels(position: PIXI.PointData, origin: Origin, wideScreen: boolean) { + let screenWidth = Screen.getScreenWidth(); + let screenHeight = Screen.getScreenHeight(); + let osuWidth43 = 640; + let osuWidth = wideScreen ? 854 : osuWidth43; + let osuHeight = 480; + let widthScaleFactor = screenWidth/osuWidth; + let heightScaleFactor = screenHeight/osuHeight; + let absolutePosition = new PIXI.Point(0, 0); + switch (origin) { + case Origin.Custom: + case Origin.TopLeft: + absolutePosition.set(position.x, position.y); + break; + case Origin.TopCenter: + absolutePosition.set((osuWidth/2) + position.x, position.y); + break; + case Origin.TopRight: + absolutePosition.set(osuWidth + position.x, position.y); + break; + case Origin.CenterLeft: + absolutePosition.set(position.x, (osuHeight/2) + position.y); + break; + case Origin.Center: + absolutePosition.set((osuWidth/2) + position.x, (osuHeight/2) + position.y); + break; + case Origin.CenterRight: + absolutePosition.set(osuWidth + position.x, (osuHeight/2) + position.y); + break; + case Origin.BottomLeft: + absolutePosition.set(position.x, osuHeight + position.y); + break; + case Origin.BottomCenter: + absolutePosition.set((osuWidth/2) + position.x, osuHeight + position.y); + break; + case Origin.BottomRight: + absolutePosition.set(osuWidth + position.x, osuHeight + position.y); + break; + } + absolutePosition.x = (absolutePosition.x + (wideScreen? ((osuWidth - osuWidth43)/2) : 0)) * widthScaleFactor; + absolutePosition.y *= heightScaleFactor; + return absolutePosition; + } +} \ No newline at end of file