scrollbar done

TODO.md

@@ -14,6 +14,8 @@
 	- [ ] Events (including Camera Movement)
 	- [ ] Custom Notes
 	- [ ] Metadata Editing
+- [ ] Multiple state scripts & Multiple global scripts
+- [ ] Make update.bat use libs.xml instead of hmm.json
 - [ ] New Switch Mod menu
 - [ ] Add note offset
 - [ ] Dialogue
@@ -25,4 +27,5 @@
 ## `v1.1.0`
 
 - [ ] Custom classes
-- [ ] Full 3D support via stages files
+- [ ] Full 3D support via stages files
+- [ ] Multithread sprites loading (for faster load times) ?

source/funkin/backend/scripting/Script.hx

@@ -80,6 +80,8 @@ class Script extends FlxBasic implements IFlxDestroyable {
 			"FunkinShader"	  => funkin.backend.shaders.FunkinShader,
 			"CustomShader"	  => funkin.backend.shaders.CustomShader,
 			"FunkinText"		=> funkin.backend.FunkinText,
+			"FlxAnimate"		=> funkin.backend.FlxAnimate,
+			"FunkinSprite"		=> funkin.backend.FunkinSprite,
 			"Alphabet"		  => funkin.menus.ui.Alphabet,
 
 			"CoolUtil"		  => funkin.backend.utils.CoolUtil,

source/funkin/backend/utils/CoolUtil.hx

@@ -123,6 +123,16 @@ class CoolUtil
 		return str;
 	}
 
+	/**
+	 * Add several zeros at the end of a string, so that `2` becomes `20`, useful for ms.
+	 * @param str String to add zeros
+	 * @param num The length required
+	 */
+	public static inline function addEndZeros(str:String, num:Int) {
+		while(str.length < num) str = '${str}0';
+		return str;
+	}
+
 	/**
 	 * Returns a string representation of a size, following this format: `1.02 GB`, `134.00 MB`
 	 * @param size Size to convert ot string
@@ -517,6 +527,12 @@ class CoolUtil
 		#end
 	}
 
+	/**
+	 * Converts a timestamp to a readable format such as `01:22` (`mm:ss`)
+	 */
+	public static inline function timeToStr(time:Float)
+		return '${Std.string(Std.int(time / 60000)).addZeros(2)}:${Std.string(Std.int(time / 1000) % 60).addZeros(2)}.${Std.string(Std.int(time % 1000)).addZeros(3)}';
+
 	/**
 	 * Stops a sound, set its time to 0 then play it again.
 	 * @param sound Sound to replay.

source/funkin/editors/charter/Charter.hx

@@ -41,6 +41,7 @@ class Charter extends UIState {
 	public var topMenu:Array<UIContextMenuOption>;
 
 	public var scrollBar:UIScrollBar;
+	public var songPosInfo:UIText;
 
 	public var topMenuSpr:UITopMenu;
 	public var gridBackdrop:CharterBackdrop;
@@ -338,8 +339,16 @@ class Charter extends UIState {
 		topMenuSpr.cameras = uiGroup.cameras = [uiCamera];
 
 		scrollBar = new UIScrollBar(FlxG.width - 20, topMenuSpr.bHeight, 1000, 0, 100);
+		scrollBar.cameras = [uiCamera];
+		scrollBar.onChange = function(v) {
+			Conductor.songPosition = Conductor.getTimeForStep(v);
+		};
 		uiGroup.add(scrollBar);
 
+		songPosInfo = new UIText(FlxG.width - 30 - 400, scrollBar.y + 10, 400, "00:00\nBeat: 0\nStep: 0\nMeasure: 0");
+		songPosInfo.alignment = RIGHT;
+		uiGroup.add(songPosInfo);
+
 		topLimit = new FlxSprite();
 		topLimit.makeGraphic(1, 1, -1);
 		topLimit.color = 0xFF888888;
@@ -364,10 +373,10 @@ class Charter extends UIState {
 		add(selectionBox);
 		add(strumlineInfoBG);
 		add(strumLines);
-		// add the ui group
-		add(uiGroup);
 		// add the top menu last OUT of the ui group so that it stays on top
 		add(topMenuSpr);
+		// add the ui group
+		add(uiGroup);
 
 		loadSong();
 	}
@@ -633,6 +642,11 @@ class Charter extends UIState {
 
 		Conductor.songPosition = FlxMath.bound(Conductor.songPosition, 0, FlxG.sound.music.length);
 
+		songPosInfo.text = '${CoolUtil.timeToStr(Conductor.songPosition)} / ${CoolUtil.timeToStr(FlxG.sound.music.length)}'
+		+ '\nStep: ${curStep}'
+		+ '\nBeat: ${curBeat}'
+		+ '\nMeasure: ${curMeasure}';
+
 		if (FlxG.sound.music.playing) {
 			conductorFollowerSpr.y = curStepFloat * 40;
 		} else {

source/funkin/editors/ui/UIScrollBar.hx

@@ -1,11 +1,14 @@
 package funkin.editors.ui;
 
+import flixel.math.FlxPoint;
+
 class UIScrollBar extends UISprite {
 	public var length:Float;
 	public var start:Float;
 	public var size:Float;
 
 	public var thumb:UISliceSprite;
+	public var thumbIcon:FlxSprite;
 
 	public var value:Float;
 
@@ -21,23 +24,33 @@ class UIScrollBar extends UISprite {
 
 		thumb = new UISliceSprite(0, 0, w, h, 'editors/ui/scrollbar');
 		members.push(thumb);
+
+		thumbIcon = new FlxSprite(0, 0, Paths.image('editors/ui/scrollbar-icon'));
+		members.push(thumbIcon);
 	}
 
+
 	public override function update(elapsed:Float) {
+		var lastHovered = hovered;
+		var lastHoveredThumb = thumb.hovered;
 		super.update(elapsed);
 		thumb.follow(this, 0, FlxMath.remapToRange(start, -(size/2), length + size, 0, height));
 		thumb.bHeight = Std.int(FlxMath.remapToRange(size, -(size/2), length + size, 0, height));
 
-		if (hovered) {
-			if (FlxG.mouse.justReleased) {
-				var mousePos = FlxG.mouse.getScreenPosition(camera);
-				var yPos = FlxMath.remapToRange(mousePos.y, y, y+height, -(size/2), length + size);
-				if (yPos >= 0 && yPos < length) {
-					onChange(value = yPos);
-				}
+		thumbIcon.follow(thumb, 0, Std.int((thumb.bHeight - thumbIcon.height) / 2));
+		thumbIcon.alpha = thumb.bHeight > 30 ? 1 : 0;
+
+		if ((lastHovered || lastHoveredThumb) && FlxG.mouse.pressed) {
+			thumb.framesOffset = 18;
+			var mousePos = FlxG.mouse.getScreenPosition(__lastDrawCameras[0], FlxPoint.get());
+			var yPos = FlxMath.bound(FlxMath.remapToRange(mousePos.y, y, y+height, -(size/2), length + size), 0, length);
+			if (yPos >= 0 && yPos < length) {
+				value = yPos;
+				if (onChange != null)
+					onChange(value);
 			}
-		} else if (thumb.hovered) {
-			// todo: scrolling
-		}
+			mousePos.put();
+		} else
+			thumb.framesOffset = lastHoveredThumb ? 9 : 0;
 	}
 }

source/funkin/editors/ui/UIState.hx

@@ -71,7 +71,7 @@ class UIState extends MusicBeatState {
 			__rect.x -= camera.scroll.x * spr.scrollFactor.x;
 			__rect.y -= camera.scroll.y * spr.scrollFactor.y;
 
-			if (((pos.x > __rect.x) && (pos.x < __rect.x + rect.width)) && ((pos.y > __rect.y) && (pos.y < __rect.y + __rect.height))) {
+			if (((pos.x > __rect.x) && (pos.x < __rect.x + __rect.width)) && ((pos.y > __rect.y) && (pos.y < __rect.y + __rect.height))) {
 				spr.hoveredByChild = true;
 				this.hoveredSprite = spr;
 				this.buttonHandler = buttonHandler;