// D:/CSharp/RhythmBase.View/RhythmBase.View/definition.ts var EventType = /* @__PURE__ */ ((EventType2) => { EventType2["AddClassicBeat"] = "AddClassicBeat"; EventType2["AddFreeTimeBeat"] = "AddFreeTimeBeat"; EventType2["AddOneshotBeat"] = "AddOneshotBeat"; EventType2["AdvanceText"] = "AdvanceText"; EventType2["AdvanceTextDecoration"] = "AdvanceTextDecoration"; EventType2["BassDrop"] = "BassDrop"; EventType2["Blend"] = "Blend"; EventType2["CallCustomMethod"] = "CallCustomMethod"; EventType2["ChangeCharacter"] = "ChangeCharacter"; EventType2["ChangePlayersRows"] = "ChangePlayersRows"; EventType2["Comment"] = "Comment"; EventType2["CustomFlash"] = "CustomFlash"; EventType2["DesktopColor"] = "DesktopColor"; EventType2["FadeRoom"] = "FadeRoom"; EventType2["FinishLevel"] = "FinishLevel"; EventType2["Flash"] = "Flash"; EventType2["FlipScreen"] = "FlipScreen"; EventType2["FloatingText"] = "FloatingText"; EventType2["ForwardDecorationEvent"] = "ForwardDecorationEvent"; EventType2["ForwardEvent"] = "ForwardEvent"; EventType2["ForwardRowEvent"] = "ForwardRowEvent"; EventType2["GoToLevel"] = "GoToLevel"; EventType2["HideRow"] = "HideRow"; EventType2["HideWindow"] = "HideWindow"; EventType2["InvertColors"] = "InvertColors"; EventType2["LinkRows"] = "LinkRows"; EventType2["MaskRoom"] = "MaskRoom"; EventType2["Move"] = "Move"; EventType2["MoveCamera"] = "MoveCamera"; EventType2["MoveRoom"] = "MoveRoom"; EventType2["MoveRow"] = "MoveRow"; EventType2["NarrateRowInfo"] = "NarrateRowInfo"; EventType2["NewWindowDance"] = "NewWindowDance"; EventType2["PaintHands"] = "PaintHands"; EventType2["PlayAnimation"] = "PlayAnimation"; EventType2["PlayExpression"] = "PlayExpression"; EventType2["PlaySong"] = "PlaySong"; EventType2["PlaySound"] = "PlaySound"; EventType2["PulseCamera"] = "PulseCamera"; EventType2["PulseFreeTimeBeat"] = "PulseFreeTimeBeat"; EventType2["ReadNarration"] = "ReadNarration"; EventType2["RenameWindow"] = "RenameWindow"; EventType2["ReorderDecoration"] = "ReorderDecoration"; EventType2["ReorderRooms"] = "ReorderRooms"; EventType2["ReorderRow"] = "ReorderRow"; EventType2["ReorderWindows"] = "ReorderWindows"; EventType2["SayReadyGetSetGo"] = "SayReadyGetSetGo"; EventType2["SetBackgroundColor"] = "SetBackgroundColor"; EventType2["SetBeatSound"] = "SetBeatSound"; EventType2["SetBeatsPerMinute"] = "SetBeatsPerMinute"; EventType2["SetClapSounds"] = "SetClapSounds"; EventType2["SetCountingSound"] = "SetCountingSound"; EventType2["SetCrotchetsPerBar"] = "SetCrotchetsPerBar"; EventType2["SetFont"] = "SetFont"; EventType2["SetForeground"] = "SetForeground"; EventType2["SetGameSound"] = "SetGameSound"; EventType2["SetHandOwner"] = "SetHandOwner"; EventType2["SetHeartExplodeInterval"] = "SetHeartExplodeInterval"; EventType2["SetHeartExplodeVolume"] = "SetHeartExplodeVolume"; EventType2["SetMainWindow"] = "SetMainWindow"; EventType2["SetOneshotWave"] = "SetOneshotWave"; EventType2["SetPlayStyle"] = "SetPlayStyle"; EventType2["SetRoomContentMode"] = "SetRoomContentMode"; EventType2["SetRoomPerspective"] = "SetRoomPerspective"; EventType2["SetRowXs"] = "SetRowXs"; EventType2["SetSpeed"] = "SetSpeed"; EventType2["SetText"] = "SetText"; EventType2["SetTheme"] = "SetTheme"; EventType2["SetVfxPreset"] = "SetVfxPreset"; EventType2["SetVisible"] = "SetVisible"; EventType2["SetWindowContent"] = "SetWindowContent"; EventType2["ShakeScreen"] = "ShakeScreen"; EventType2["ShakeScreenCustom"] = "ShakeScreenCustom"; EventType2["ShowDialogue"] = "ShowDialogue"; EventType2["ShowHands"] = "ShowHands"; EventType2["ShowRooms"] = "ShowRooms"; EventType2["ShowStatusSign"] = "ShowStatusSign"; EventType2["ShowSubdivisionsRows"] = "ShowSubdivisionsRows"; EventType2["SpinningRows"] = "SpinningRows"; EventType2["Stutter"] = "Stutter"; EventType2["TagAction"] = "TagAction"; EventType2["TextExplosion"] = "TextExplosion"; EventType2["Tile"] = "Tile"; EventType2["Tint"] = "Tint"; EventType2["TintRows"] = "TintRows"; EventType2["TintText"] = "TintText"; EventType2["Unknown"] = "Unknown"; EventType2["WindowResize"] = "WindowResize"; return EventType2; })(EventType || {}); var EventInfo = class { defaultTab; durationKey = "duration"; attr; get isDurationEvent() { return (this.attr & 1 /* DurationEvent */) !== 0; } get isRoomEvent() { return (this.attr & 2 /* RoomEvent */) !== 0; } constructor(tab, enumAttriblte, durationKey) { this.defaultTab = tab; this.attr = enumAttriblte ?? 0 /* None */; this.durationKey = durationKey ?? "duration"; } }; var WordInfo = class { phrase; length; constructor(phrase, length) { this.phrase = phrase; this.length = length; } }; var WordInfos = { SayReaDyGetSetGoNew: new WordInfo("Rea, Dy, Get, Set, Go!", 4), SayReaDyGetSetOne: new WordInfo("Rea, Dy, Get, Set, One!", 4), SayGetSetGo: new WordInfo("Get, Set, Go!", 2), SayGetSetOne: new WordInfo("Get, Set, One!", 2), JustSayRea: new WordInfo("Rea", 0), JustSayDy: new WordInfo("Dy", 0), JustSayGet: new WordInfo("Get", 0), JustSaySet: new WordInfo("Set", 0), JustSayAnd: new WordInfo("And", 0), JustSayGo: new WordInfo("Go!", 0), JustSayStop: new WordInfo("Stop", 0), JustSayAndStop: new WordInfo("And Stop!", 0), SaySwitch: new WordInfo("Switch", 0), SayWatch: new WordInfo("Watch", 0), SayListen: new WordInfo("Listen", 0), Count1: new WordInfo("1", 0), Count2: new WordInfo("2", 0), Count3: new WordInfo("3", 0), Count4: new WordInfo("4", 0), Count5: new WordInfo("5", 0), Count6: new WordInfo("6", 0), Count7: new WordInfo("7", 0), Count8: new WordInfo("8", 0), Count9: new WordInfo("9", 0), Count10: new WordInfo("10", 0), SayReadyGetSetGo: new WordInfo("Ready, Get, Set, Go!", 4), JustSayReady: new WordInfo("Ready", 0) }; var EventInfos = { AddClassicBeat: new EventInfo("Rows" /* Rows */), AddFreeTimeBeat: new EventInfo("Rows" /* Rows */), AddOneshotBeat: new EventInfo("Rows" /* Rows */), AdvanceText: new EventInfo( "Actions" /* Actions */, 1 /* DurationEvent */ | 2 /* RoomEvent */, "duration" ), AdvanceTextDecoration: new EventInfo( "Sprites" /* Decorations */, 1 /* DurationEvent */, "duration" ), BassDrop: new EventInfo("Actions" /* Actions */, 2 /* RoomEvent */), Blend: new EventInfo("Sprites" /* Decorations */), CallCustomMethod: new EventInfo("Actions" /* Actions */), ChangeCharacter: new EventInfo("Actions" /* Actions */), ChangePlayersRows: new EventInfo("Actions" /* Actions */), Comment: new EventInfo("Sounds" /* Sounds */), CustomFlash: new EventInfo( "Actions" /* Actions */, 1 /* DurationEvent */ | 2 /* RoomEvent */, "duration" ), DesktopColor: new EventInfo( "Windows" /* Windows */, 1 /* DurationEvent */, "duration" ), FadeRoom: new EventInfo( "Rooms" /* Rooms */, 1 /* DurationEvent */, "duration" ), FinishLevel: new EventInfo("Actions" /* Actions */), Flash: new EventInfo("Actions" /* Actions */, 2 /* RoomEvent */), FlipScreen: new EventInfo("Actions" /* Actions */, 2 /* RoomEvent */), FloatingText: new EventInfo( "Actions" /* Actions */, 1 /* DurationEvent */ | 2 /* RoomEvent */, "duration" ), ForwardDecorationEvent: new EventInfo("Sprites" /* Decorations */), ForwardEvent: new EventInfo("Unknown" /* Unknown */, 2 /* RoomEvent */), ForwardRowEvent: new EventInfo("Rows" /* Rows */), GoToLevel: new EventInfo("Actions" /* Actions */), HideRow: new EventInfo("Actions" /* Actions */), HideWindow: new EventInfo("Windows" /* Windows */), InvertColors: new EventInfo("Actions" /* Actions */, 2 /* RoomEvent */), LinkRows: new EventInfo("Actions" /* Actions */), MaskRoom: new EventInfo("Rooms" /* Rooms */), Move: new EventInfo( "Sprites" /* Decorations */, 1 /* DurationEvent */, "duration" ), MoveCamera: new EventInfo( "Actions" /* Actions */, 1 /* DurationEvent */ | 2 /* RoomEvent */, "duration" ), MoveRoom: new EventInfo( "Rooms" /* Rooms */, 1 /* DurationEvent */, "duration" ), MoveRow: new EventInfo( "Actions" /* Actions */, 1 /* DurationEvent */, "duration" ), NarrateRowInfo: new EventInfo("Sounds" /* Sounds */), NewWindowDance: new EventInfo( "Windows" /* Windows */, 1 /* DurationEvent */, "duration" ), PaintHands: new EventInfo( "Actions" /* Actions */, 1 /* DurationEvent */ | 2 /* RoomEvent */, "duration" ), PlayAnimation: new EventInfo("Sprites" /* Decorations */), PlayExpression: new EventInfo("Actions" /* Actions */), PlaySong: new EventInfo("Sounds" /* Sounds */), PlaySound: new EventInfo("Sounds" /* Sounds */), PulseCamera: new EventInfo("Actions" /* Actions */, 2 /* RoomEvent */), PulseFreeTimeBeat: new EventInfo("Rows" /* Rows */), ReadNarration: new EventInfo("Sounds" /* Sounds */), RenameWindow: new EventInfo("Windows" /* Windows */), ReorderDecoration: new EventInfo("Sprites" /* Decorations */), ReorderRooms: new EventInfo("Rooms" /* Rooms */), ReorderRow: new EventInfo("Actions" /* Actions */), ReorderWindows: new EventInfo("Windows" /* Windows */), SayReadyGetSetGo: new EventInfo("Sounds" /* Sounds */, 2 /* RoomEvent */), SetBackgroundColor: new EventInfo( "Actions" /* Actions */, 1 /* DurationEvent */ | 2 /* RoomEvent */, "duration" ), SetBeatSound: new EventInfo("Sounds" /* Sounds */), SetBeatsPerMinute: new EventInfo("Sounds" /* Sounds */), SetClapSounds: new EventInfo("Sounds" /* Sounds */), SetCountingSound: new EventInfo("Sounds" /* Sounds */), SetCrotchetsPerBar: new EventInfo("Sounds" /* Sounds */), SetFont: new EventInfo("Sprites" /* Decorations */), SetForeground: new EventInfo( "Actions" /* Actions */, 1 /* DurationEvent */ | 2 /* RoomEvent */, "duration" ), SetGameSound: new EventInfo("Sounds" /* Sounds */), SetHandOwner: new EventInfo("Actions" /* Actions */, 2 /* RoomEvent */), SetHeartExplodeInterval: new EventInfo("Sounds" /* Sounds */), SetHeartExplodeVolume: new EventInfo("Sounds" /* Sounds */), SetMainWindow: new EventInfo("Windows" /* Windows */), SetOneshotWave: new EventInfo("Rows" /* Rows */), SetPlayStyle: new EventInfo("Actions" /* Actions */), SetRoomContentMode: new EventInfo("Rooms" /* Rooms */), SetRoomPerspective: new EventInfo( "Rooms" /* Rooms */, 1 /* DurationEvent */, "duration" ), SetRowXs: new EventInfo("Rows" /* Rows */), SetSpeed: new EventInfo( "Actions" /* Actions */, 1 /* DurationEvent */, "duration" ), SetText: new EventInfo( "Actions" /* Actions */, 1 /* DurationEvent */ | 2 /* RoomEvent */, "duration" ), SetTheme: new EventInfo( "Actions" /* Actions */, 1 /* DurationEvent */ | 2 /* RoomEvent */, "duration" ), SetVfxPreset: new EventInfo( "Actions" /* Actions */, 1 /* DurationEvent */ | 2 /* RoomEvent */, "duration" ), SetVisible: new EventInfo("Sprites" /* Decorations */), SetWindowContent: new EventInfo( "Windows" /* Windows */, 1 /* DurationEvent */, "duration" ), ShakeScreen: new EventInfo("Actions" /* Actions */, 2 /* RoomEvent */), ShakeScreenCustom: new EventInfo( "Actions" /* Actions */, 1 /* DurationEvent */ | 2 /* RoomEvent */, "duration" ), ShowDialogue: new EventInfo("Actions" /* Actions */, 2 /* RoomEvent */), ShowHands: new EventInfo("Actions" /* Actions */, 2 /* RoomEvent */), ShowRooms: new EventInfo( "Rooms" /* Rooms */, 1 /* DurationEvent */ | 2 /* RoomEvent */, "duration" ), ShowStatusSign: new EventInfo( "Actions" /* Actions */, 1 /* DurationEvent */, "duration" ), ShowSubdivisionsRows: new EventInfo("Actions" /* Actions */), SpinningRows: new EventInfo( "Actions" /* Actions */, 1 /* DurationEvent */ | 2 /* RoomEvent */, "duration" ), Stutter: new EventInfo("Actions" /* Actions */, 2 /* RoomEvent */), TagAction: new EventInfo("Actions" /* Actions */), TextExplosion: new EventInfo("Actions" /* Actions */, 2 /* RoomEvent */), Tile: new EventInfo( "Sprites" /* Decorations */, 1 /* DurationEvent */, "duration" ), Tint: new EventInfo( "Sprites" /* Decorations */, 1 /* DurationEvent */, "duration" ), TintRows: new EventInfo( "Actions" /* Actions */, 1 /* DurationEvent */ | 2 /* RoomEvent */, "duration" ), TintText: new EventInfo( "Sprites" /* Decorations */, 1 /* DurationEvent */, "duration" ), Unknown: new EventInfo("Unknown" /* Unknown */), WindowResize: new EventInfo( "Windows" /* Windows */, 1 /* DurationEvent */ | 2 /* RoomEvent */, "duration" ) }; var Point = class _Point { x = 0; y = 0; constructor(x, y) { if (x !== void 0 && y !== void 0) { this.x = x; this.y = y; return; } } clone() { return new _Point(this.x, this.y); } }; var Size = class { width = 0; height = 0; constructor(width, height) { if (width !== void 0 && height !== void 0) { this.width = width; this.height = height; return; } } clone() { return new Point(this.width, this.height); } }; var Rect = class _Rect { left = 0; top = 0; right = 0; bottom = 0; get x() { return this.left; } set x(value) { const diff = value - this.left; this.left += diff; this.right += diff; } get y() { return this.top; } set y(value) { const diff = value - this.top; this.top += diff; this.bottom += diff; } get width() { return this.right - this.left; } set width(value) { this.right = this.left + value; } get height() { return this.bottom - this.top; } set height(value) { this.bottom = this.top + value; } get centerX() { return (this.left + this.right) / 2; } get centerY() { return (this.top + this.bottom) / 2; } get location() { let point = new Point(); point.x = this.centerX; point.y = this.centerY; return point; } set location(point) { let w = this.width; let h = this.height; this.left = point.x; this.right = this.left + w; this.top = point.y; this.bottom = this.top + h; } get size() { let size = new Size(); size.width = this.width; size.height = this.height; return size; } set size(size) { this.width = size.width; this.height = size.height; } get isEmpty() { return this.width <= 0 || this.height <= 0; } constructor(arg0, arg1, arg2, arg3) { if (typeof arg0 === "number" && typeof arg1 === "number") { if (typeof arg2 === "number" && typeof arg3 === "number") { this.left = arg0; this.top = arg1; this.right = arg0 + arg2; this.bottom = arg1 + arg3; return; } this.right = arg0; this.bottom = arg1; return; } else if (arg0 instanceof Point && arg1 instanceof Size) { this.left = arg0.x; this.top = arg0.y; this.right = arg0.x + arg1.width; this.bottom = arg0.y + arg1.height; return; } else if (arg0 instanceof Size) { this.right = arg0.width; this.bottom = arg0.height; return; } } inflate(dx, dy) { this.left -= dx; this.right += dx; this.top -= dy; this.bottom += dy; } clone() { return new _Rect(this.left, this.top, this.width, this.height); } union(rect) { const left = Math.min(this.left, rect.left); const top = Math.min(this.top, rect.top); const right = Math.max(this.right, rect.right); const bottom = Math.max(this.bottom, rect.bottom); return new _Rect(left, top, right - left, bottom - top); } }; var Color = class _Color { argb = 0; constructor(a, r, g, b) { if (typeof a === "string") { let s = a; if (s.startsWith("#")) { s = s.substring(1); } s = s.trim(); switch (s.length) { case 3: s = "ff" + s.split("").map((c) => c + c).join(""); break; case 4: s = s.split("").map((c) => c + c).join(""); break; case 6: s = "ff" + s; break; case 8: break; default: s = "ffffffff"; } const u = parseInt(s, 16); this.argb = u; return; } if (a !== void 0 && r === void 0 && g === void 0 && b === void 0) { this.argb = a; return; } if (a === void 0 && r !== void 0 && g !== void 0 && b !== void 0) { const u = 255 << 24 | (r & 255) << 16 | (g & 255) << 8 | b & 255; this.argb = u; return; } if (a !== void 0 && r !== void 0 && g !== void 0 && b !== void 0) { const u = a << 24 | (r & 255) << 16 | (g & 255) << 8 | b & 255; this.argb = u; return; } this.argb = 0; } get a() { return this.argb >>> 24 & 255; } set a(value) { const v = value & 255; this.argb = v << 24 | this.argb & 16777215; } get r() { return this.argb >>> 16 & 255; } set r(value) { const v = value & 255; this.argb = this.argb & 4278255615 | v << 16; } get g() { return this.argb >>> 8 & 255; } set g(value) { const v = value & 255; this.argb = this.argb & 4294902015 | v << 8; } get b() { return this.argb & 255; } set b(value) { const v = value & 255; this.argb = this.argb & 4294967040 | v; } toUint32() { return this.argb; } clone() { return new _Color(this.argb); } static FromRgba(r, g, b, a) { if (typeof r === "string" && g === void 0 && b === void 0 && a === void 0) { r = r.trim(); if (r[0] === "#") r = r.slice(1); if (r.length === 8) { return new _Color(r.slice(6, 8) + r.slice(0, 6)); } else if (r.length === 6) return new _Color(r); else if (r.length === 4) { return new _Color( r[3] + r[3] + r.slice(0, 3).split("").map((i) => i + i).join("") ); } else if (r.length === 3) { return new _Color("FF" + r.split("").map((i) => i + i).join("")); } else return new _Color(); } else if (typeof r === "number" && typeof g === "number" && typeof b === "number" && typeof a === "number") { return new _Color(a, r, g, b); } else { return new _Color(); } } toRgbaString() { return `rgba(${this.r}, ${this.g}, ${this.b}, ${this.a / 255})`; } toHexString(includeAlpha = true) { if (includeAlpha) { return `#${this.argb.toString(16).padStart(8, "0")}`; } else { const rgb = this.argb & 16777215; return `#${rgb.toString(16).padStart(6, "0")}`; } } equals(other) { return this.argb === other.argb; } static get Transparent() { return new _Color(0, 0, 0, 0); } static get Black() { return new _Color(255, 0, 0, 0); } static get White() { return new _Color(255, 255, 255, 255); } withAlpha(alpha) { return new _Color(alpha, this.r, this.g, this.b); } withRed(red) { return new _Color(this.a, red, this.g, this.b); } withGreen(green) { return new _Color(this.a, this.r, green, this.b); } withBlue(blue) { return new _Color(this.a, this.r, this.g, blue); } }; var SliceInfo = class { bounds = new Rect(); center = new Rect(); pivot = new Point(); scale = 1; get isNinePatch() { return !this.center.isEmpty; } }; // D:/CSharp/RhythmBase.View/RhythmBase.View/assetManager.ts var assetFilePath = "assets.png"; var slicesFilePath = "assets.bin"; var directoryPath = "./rdviewAssets"; var assetSize = new Size(210, 160); var assetUrl = directoryPath + "/" + assetFilePath; async function readFromStream(stream) { let offset = 0; const count = stream.getUint8(0); offset += 1; const sliceInfos = /* @__PURE__ */ new Map(); for (let i = 0; i < count; i++) { const sliceInfo = new SliceInfo(); const keyLength = stream.getUint8(offset); offset += 1; const key = new TextDecoder().decode( new Uint8Array( stream.buffer, offset, keyLength ) ); offset += keyLength; const left = stream.getUint8(offset); offset += 1; const top = stream.getUint8(offset); offset += 1; const wh = stream.getUint16(offset, true); offset += 2; const width = wh & 31; const height = wh >> 5 & 63; sliceInfo.bounds = new Rect(left, top, width, height); const hasCenter = (wh & 32768) !== 0; const hasPivot = (wh & 16384) !== 0; if (hasCenter) { const centerByte = stream.getUint8(offset); offset += 1; const centerLeft = centerByte & 3; const centerTop = centerByte >> 2 & 3; const centerWidth = centerByte >> 4 & 3; const centerHeight = centerByte >> 6 & 3; sliceInfo.center = new Rect( centerLeft, centerTop, centerWidth, centerHeight ); } if (hasPivot) { const pivotByte = stream.getUint8(offset); offset += 1; let pivotLeft = pivotByte & 7; let pivotTop = pivotByte >> 3 & 7; if ((pivotByte & 128) !== 0) { pivotLeft *= -1; } if ((pivotByte & 64) !== 0) { pivotTop *= -1; } sliceInfo.pivot = new Point(pivotLeft, pivotTop); } sliceInfos.set(key, sliceInfo); } return sliceInfos; } var assetLoaded = false; var slices = await readFromStream( new DataView( await (await fetch( directoryPath + "/" + slicesFilePath )).arrayBuffer() ) ).finally(() => { assetLoaded = true; }); // D:/CSharp/RhythmBase.View/RhythmBase.View/rdtkview.ts var lineHeight = 6; var charHeight = 8; var iconSize = 14; var IconStyle = class { enabled = true; active = false; hover = false; scale = 1; showDuration = false; }; var FilterData = class { color; hue = 0; saturation = 1; brightness = 1; getFilter() { let filter = ""; if (this.color) { filter += `url(#${getColorMatrixId(this.color)}) `; } if (this.hue !== 0) { filter += `hue-rotate(${this.hue * 360}deg) `; } if (this.saturation !== 1) { filter += `saturate(${this.saturation}) `; } if (this.brightness !== 1) { filter += `brightness(${this.brightness}) `; } return filter.trim() || "none"; } }; function withState(color, active, enabled) { return (enabled ? color : new Color(4286874756)).withAlpha(active ? 192 : 91); } function createLayerFromBackground(key, bound, color, style, backgroundRepeat = false) { const info = slices.get(key); if (!info) return []; if (info?.isNinePatch) { const rectBound = bound ?? new Rect(0, 0, info.bounds.width, info.bounds.height); const center = info.center; const left = rectBound.left; const top = rectBound.top; const width = rectBound.width; const height = rectBound.height; const infoLeft = info.bounds.left; const infoTop = info.bounds.top; const srcXs = [0, center.left, center.right, info.bounds.width]; const srcYs = [0, center.top, center.bottom, info.bounds.height]; const layers = []; for (let y = 0; y < 3; y++) { const srcTop = srcYs[y]; const srcHeight = srcYs[y + 1] - srcYs[y]; const dstTop = top + (y < 2 ? srcTop : height - (info.bounds.height - srcYs[y])); const dstHeight = y === 1 ? height - center.top - (info.bounds.height - center.bottom) : srcHeight; const heightScale = dstHeight / srcHeight; for (let x = 0; x < 3; x++) { const srcLeft = srcXs[x]; const srcWidth = srcXs[x + 1] - srcXs[x]; const dstLeft = left + (x < 2 ? srcLeft : width - (info.bounds.width - srcXs[x])); const dstWidth = x === 1 ? width - center.left - (info.bounds.width - center.right) : srcWidth; const widthScale = dstWidth / srcWidth; if (backgroundRepeat && x === 1 && y === 1) { for (let dstt = 0; dstt < dstHeight; dstt += srcHeight) { const dsth = Math.min(srcHeight, dstHeight - dstt); for (let dstl = 0; dstl < dstWidth; dstl += srcWidth) { const dstw = Math.min(srcWidth, dstWidth - dstl); const patchLayer = document.createElement( "div" ); patchLayer.filterData = new FilterData(); patchLayer.updateFilter = () => { patchLayer.style.filter = patchLayer.filterData.getFilter(); }; patchLayer.style.position = "absolute"; patchLayer.style.boxSizing = "content-box"; patchLayer.style.backgroundClip = "content-box"; patchLayer.style.backgroundImage = `url('${assetUrl}')`; patchLayer.style.left = `${(dstLeft + dstl) * style.scale}px`; patchLayer.style.top = `${(dstTop + dstt) * style.scale}px`; patchLayer.style.width = `${dstw * style.scale}px`; patchLayer.style.height = `${dsth * style.scale}px`; patchLayer.style.backgroundPosition = `-${(infoLeft + srcLeft) * style.scale}px -${(infoTop + srcTop) * style.scale}px`; patchLayer.style.backgroundSize = `${assetSize.width * style.scale}px ${assetSize.height * style.scale}px`; layers.push(patchLayer); } } } else { const patchLayer = document.createElement( "div" ); patchLayer.filterData = new FilterData(); patchLayer.updateFilter = () => { patchLayer.style.filter = patchLayer.filterData.getFilter(); }; patchLayer.style.position = "absolute"; patchLayer.style.boxSizing = "content-box"; patchLayer.style.backgroundClip = "content-box"; patchLayer.style.backgroundImage = `url('${assetUrl}')`; patchLayer.style.left = `${dstLeft * style.scale}px`; patchLayer.style.top = `${dstTop * style.scale}px`; patchLayer.style.width = `${dstWidth * style.scale}px`; patchLayer.style.height = `${dstHeight * style.scale}px`; patchLayer.style.backgroundPosition = `-${(infoLeft + srcLeft) * widthScale * style.scale}px -${(infoTop + srcTop) * heightScale * style.scale}px`; patchLayer.style.backgroundSize = `${assetSize.width * widthScale * style.scale}px ${assetSize.height * heightScale * style.scale}px`; layers.push(patchLayer); } } } if (color && Color.White.equals(color) === false) { layers.forEach((layer) => { layer.onColorChange = (color2) => { if (!color2) { return; } layer.filterData.color = color2; layer.updateFilter(); }; layer.onColorChange(color); }); } else { } return layers; } else { const pivotX = info.pivot.x ?? 0; const pivotY = info.pivot.y ?? 0; const layer = document.createElement("div"); layer.filterData = new FilterData(); layer.updateFilter = () => { layer.style.filter = layer.filterData.getFilter(); }; layer.style.position = "absolute"; layer.style.boxSizing = "content-box"; layer.style.backgroundClip = "content-box"; layer.style.backgroundImage = `url('${assetUrl}')`; if (bound instanceof Rect) { const left = bound.left; const top = bound.top; const width = bound.width; const height = bound.height; const infoLeft = info.bounds.left; const infoTop = info.bounds.top; const widthScale = width / info.bounds.width; const heightScale = height / info.bounds.height; layer.style.left = `${(left - pivotX) * style.scale}px`; layer.style.top = `${(top - pivotY) * style.scale}px`; layer.style.width = `${width * style.scale}px`; layer.style.height = `${height * style.scale}px`; layer.style.backgroundPosition = `-${infoLeft * widthScale * style.scale}px -${infoTop * heightScale * style.scale}px`; layer.style.backgroundSize = `${assetSize.width * widthScale * style.scale}px ${assetSize.height * heightScale * style.scale}px`; } else { bound = bound ?? new Point(0, 0); const left = bound.x; const top = bound.y; const width = info.bounds.width; const height = info.bounds.height; const infoLeft = info.bounds.left; const infoTop = info.bounds.top; layer.style.left = `${(left - pivotX) * style.scale}px`; layer.style.top = `${(top - pivotY) * style.scale}px`; layer.style.width = `${width * style.scale}px`; layer.style.height = `${height * style.scale}px`; layer.style.backgroundPosition = `-${infoLeft * style.scale}px -${infoTop * style.scale}px`; layer.style.backgroundSize = `${assetSize.width * style.scale}px ${assetSize.height * style.scale}px`; } if (color && Color.White.equals(color) === false) { layer.onColorChange = (color2) => { if (!color2) { return; } layer.filterData.color = color2; layer.updateFilter(); }; layer.onColorChange(color); } else { } return [layer]; } } var colorMatrixIds = /* @__PURE__ */ new Map(); var colorMatrixCache = document.createElement("div"); document.body.appendChild(colorMatrixCache); function getColorMatrixId(rgba) { if (colorMatrixIds.has(rgba.toUint32())) { return colorMatrixIds.get(rgba.toUint32()); } const feColorMatrix = document.createElementNS( "http://www.w3.org/2000/svg", "feColorMatrix" ); feColorMatrix.setAttribute("type", "matrix"); const r = rgba.r / 255; const g = rgba.g / 255; const b = rgba.b / 255; const a = rgba.a / 255; feColorMatrix.setAttribute( "values", [ r, 0, 0, 0, 0, 0, g, 0, 0, 0, 0, 0, b, 0, 0, 0, 0, 0, a, 0 ].join(" ") ); feColorMatrix.setAttribute("color-interpolation-filters", "sRGB"); const filter = document.createElementNS( "http://www.w3.org/2000/svg", "filter" ); filter.setAttribute("id", `filter_${rgba.toHexString()}`); filter.appendChild(feColorMatrix); const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg"); svg.setAttribute("width", "0"); svg.setAttribute("height", "0"); svg.appendChild(filter); colorMatrixCache.appendChild(svg); colorMatrixIds.set(rgba.toUint32(), filter.getAttribute("id")); return filter.getAttribute("id"); } function measureRDFontText(text) { let len = 0; for (let i = 0; i < text.length; i++) { const char = text.charAt(i); if (char === "\n") { len = 0; } else { const charCode = char.charCodeAt(0); const charKey = `char_${charCode.toString(16).padStart(4, "0")}`; const charInfo = slices.get(charKey); len += charInfo?.bounds.width ?? 0; } } return len; } function createRDFontLayer(text, destX, destY, style, color, textScale = 1, canvasScale = 1) { const layer = document.createElement("div"); const charLayers = []; layer.style.position = "absolute"; const start = new Point(destX, destY - lineHeight * textScale); const devScale = textScale * style.scale * canvasScale; if (devScale > 0) { for (let i = 0; i < text.length; i++) { const char = text.charAt(i); if (char === "\n") { start.x = destX; start.y += lineHeight * textScale; } else { const charCode = char.charCodeAt(0); const charKey = `char_${charCode.toString(16).padStart(4, "0")}`; const charInfo = slices.get(charKey); if (charInfo) { const charLayer = createLayerFromBackground( charKey, new Point(start.x / textScale, start.y / textScale), color, { ...style, scale: devScale } ); start.x += charInfo.bounds.width * textScale; charLayers.push(...charLayer); } } } } layer.updateFilter = () => { charLayers.forEach((cl) => { cl.updateFilter(); }); }; charLayers.forEach((cl) => { layer.appendChild(cl); }); return layer; } function createImageLayer(path, info, color, style) { const layer = document.createElement("div"); layer.filterData = new FilterData(); layer.updateFilter = () => { layer.style.filter = layer.filterData.getFilter(); }; layer.style.position = "absolute"; layer.style.left = `${-info.pivot.x * style.scale}px`; layer.style.top = `${-info.pivot.y * style.scale}px`; layer.style.width = `${info.bounds.width * style.scale}px`; layer.style.height = `${info.bounds.height * style.scale}px`; layer.style.backgroundSize = "100% 100%"; layer.style.backgroundRepeat = "no-repeat"; const overlay = color && !Color.White.equals(color) ? `linear-gradient(${color.toRgbaString()}, ${color.toRgbaString()}), ` : ""; layer.style.backgroundImage = `${overlay}url(${path})`; return layer; } function createBackLayer(size, color, style) { const outline = "event_outline"; const back = "event_back"; const backLayer = createLayerFromBackground( back, new Rect( 1, 1, (size?.width ?? iconSize) - 2, (size?.height ?? iconSize) - 2 ), withState( color, style.active, style.enabled ), style ); backLayer.forEach((layer) => { if (layer.onColorChange) { layer.onStateChange = (style2) => layer.onColorChange(withState( color, style2.active, style2.enabled )); } }); const outlineLayer = createLayerFromBackground( outline, size ? new Rect(size) : null, new Color(style.active ? 4294967295 : 4289243304), style ); outlineLayer.forEach((layer) => { if (layer.onColorChange) { layer.onStateChange = (style2) => layer.onColorChange( new Color(style2.active ? 4294967295 : 4289243304) ); } }); return [...backLayer, ...outlineLayer]; } function colorOf(tab) { switch (tab) { case "Sounds" /* Sounds */: return new Color("d92433"); case "Rows" /* Rows */: return new Color("2c4fdb"); case "Actions" /* Actions */: return new Color("c544b3"); case "Rooms" /* Rooms */: return new Color("d8b811"); case "Sprites" /* Decorations */: return new Color("00c459"); case "Windows" /* Windows */: return new Color("50b5d7"); default: return new Color("7d7d7d"); } } function layerHoverInit(layer) { layer.style.opacity = "0"; layer.onStateChange = (style) => { if (style.hover) { layer.style.opacity = "1.0"; } else { layer.style.opacity = "0"; } }; } function createHintLayer(hint, width, color) { const hintLayer = document.createElement("div"); hintLayer.style.position = "absolute"; hintLayer.style.left = `${width}px`; hintLayer.style.width = `max-content`; hintLayer.innerHTML = hint; hintLayer.style.fontSize = `${18}px`; hintLayer.style.fontFamily = "d9, Arial, sans-serif"; hintLayer.style.color = color.toRgbaString(); hintLayer.style.fontWeight = "bold"; hintLayer.style.textShadow = ` 2px 2px 0 black, 2px 0px 0 black, 2px -2px 0 black, 0px -2px 0 black, -2px -2px 0 black, -2px 0px 0 black, -2px 2px 0 black, 0px 2px 0 black `; hintLayer.style.pointerEvents = "none"; hintLayer.style.opacity = "0"; hintLayer.style.zIndex = "10"; hintLayer.onStateChange = (style) => { if (style.hover) { hintLayer.style.opacity = "1.0"; } else { hintLayer.style.opacity = "0"; } }; return hintLayer; } function createElementEvent(obj, style) { style = { ...new IconStyle(), ...style }; let key0 = `event_${obj.type}`; const hasType = EventType.hasOwnProperty(obj.type); if (!hasType) { console.warn( obj.type ? `Unknown event type: ${obj.type}` : `Event type missing` ); } if (!slices.has(key0)) { if (!slices.has("event_Unknown")) { return null; } key0 = "event_Unknown"; } const evttype = obj.type ?? "Unknown" /* Unknown */; const slcinfo = slices.get(key0) ?? slices.get("event_Unknown"); if (!slcinfo) { console.warn(`Slice info for event type ${evttype} not found.`); return null; } const evinfo = EventInfos[evttype] ?? EventInfos["Unknown" /* Unknown */]; const key = "event_" + evttype; const pulse = "event_beat_pulse"; const hit = "event_beat_hit"; const hitf = "event_beat_hit_freeze"; const hitb = "event_beat_hit_burn"; const beatcross = "event_beat_cross"; const beatx = "event_beat_x"; const beatsynco = "event_beat_synco"; const beatline = "event_beat_line"; const evtag = "event_tag"; const evbarea = "event_beat_area"; const evbskip = "event_beat_skip"; const beatColor = new Color(4284539717); let iconWidth = iconSize; const element = document.createElement("div"); element.eventStyle = { ...style }; const layersToAdd = []; element.style.imageRendering = "pixelated"; switch (evttype) { case "AddClassicBeat" /* AddClassicBeat */: { const tick = obj.tick ?? 1; const swing = (obj.swing ?? 0) || 1; const hold = obj.hold ?? 0; const prexs = obj.preXs ?? { syncoBeat: -1, syncoSwing: 0 }; const length = obj.length ?? 7; const iconWidth2 = iconSize * (tick * (length - 1 - prexs.syncoSwing)); const holdBar = hold > 0 ? createLayerFromBackground( evbarea, new Rect(iconWidth2, 0, iconSize * hold, iconSize), new Color(style.active ? 4291839731 : 4286462352), style, true ) : []; holdBar.forEach((layer) => { layer.style.pointerEvents = "none"; return layer; }); const backLayers2 = createBackLayer( new Size(iconWidth2, iconSize), colorOf(obj.tab ?? evinfo.defaultTab), style ); const pulses = []; for (let i = 0; i < length - 1; i++) { const pulseLayer = createLayerFromBackground( pulse, new Point( iconSize * (tick * (i + i % 2 * (1 - swing) - (i <= prexs.syncoBeat ? 0 : prexs.syncoSwing))), 0 ), null, style ); pulseLayer.forEach((layer) => { layerHoverInit(layer); return layer; }); pulses.push(...pulseLayer); } const hitLayer = createLayerFromBackground( hit, new Point( iconSize * (tick * (length - 1 - (prexs.syncoSwing ?? 0))) - 1, 0 ), null, style ); layersToAdd.push(...holdBar); layersToAdd.push(...backLayers2); layersToAdd.push(...pulses); layersToAdd.push(...hitLayer); } break; case "AddOneshotBeat" /* AddOneshotBeat */: { const tick = obj.tick ?? 1; const interval = obj.interval ?? 2; const loop = obj.loops ?? 0; const subdiv = obj.subdivisions ?? 1; const hold = obj.hold ?? false; const skip = obj.skipshot ?? false; const mode = obj.freezeBurnMode ?? null; const delay = obj.freezeBurnMode === "Freezeshot" ? obj.delay ?? 0 : 0; const subdivWidth = iconSize * (subdiv - 1) / subdiv * tick; const eventWidth = iconSize * (interval * loop + tick + delay); const off = interval - tick; const backLayers2 = createBackLayer( new Size( eventWidth, iconSize ), colorOf(obj.tab ?? evinfo.defaultTab), style ); const holdWidth = hold ? iconSize * (interval - tick - delay) : 0; const holdLayer = hold && holdWidth - subdivWidth > 0 ? createLayerFromBackground( evbarea, new Rect( eventWidth + subdivWidth, 0, holdWidth - subdivWidth, iconSize ), new Color(4291839731), style, true ) : []; holdLayer.forEach((layer) => { layer.style.pointerEvents = "none"; return layer; }); const subdivLayer = subdiv > 1 ? createLayerFromBackground( evbarea, new Rect(eventWidth, 0, subdivWidth, iconSize), new Color(4279480353), style, true ) : []; subdivLayer.forEach((layer) => { layer.style.pointerEvents = "none"; return layer; }); const skipshotLayer = skip ? createLayerFromBackground( evbarea, new Rect( eventWidth + Math.max(subdivWidth, holdWidth), 0, iconSize * (interval - delay) - Math.max(subdivWidth, holdWidth), iconSize ), new Color(4291115835), style, true ) : []; skipshotLayer.forEach((layer) => { layer.style.pointerEvents = "none"; return layer; }); const skipHitLayer = skip ? createLayerFromBackground( evbskip, new Point( eventWidth + iconSize * (interval - delay) - 1, 0 ), null, style ) : []; skipHitLayer.forEach((layer) => { layer.style.pointerEvents = "none"; return layer; }); const pulses = []; const crossLayers = []; const posx = -off * iconSize; const hittype = mode === "Freezeshot" ? hitf : mode === "Burnshot" ? hitb : null; for (let l = 0; l <= loop; l++) { for (let i = 0; i < subdiv; i++) { const pulseLayer = createLayerFromBackground( pulse, new Point( iconSize * (l * interval + i * tick / subdiv), 0 ), null, style ); pulseLayer.forEach((layer) => { layerHoverInit(layer); return layer; }); pulses.push(...pulseLayer); const hitLayer2 = createLayerFromBackground( hit, new Point( iconSize * (l * interval + delay + tick + i * tick / subdiv) - 1, 0 ), null, style ); pulses.push(...hitLayer2); } const crossLayer1 = mode || hold ? createLayerFromBackground( beatcross, new Point(iconSize * (l * interval - off) - 1, 0), null, style ) : []; crossLayer1.forEach((layer) => { layerHoverInit(layer); return layer; }); const crossLayer2 = mode ? createLayerFromBackground( beatcross, new Point( iconSize * (l * interval - off + (mode === "Freezeshot" ? delay : -tick)) + (mode === "Freezeshot" ? -1 : 0), 0 ), null, style ) : []; crossLayer2.forEach((layer) => { layerHoverInit(layer); return layer; }); const hitLayer = hittype ? createLayerFromBackground( hittype, new Point( iconSize * (l * interval + tick) - 1, 0 ), null, style ) : []; crossLayers.push(...crossLayer1); crossLayers.push(...crossLayer2); pulses.push(...hitLayer); } const loopLayer = createLayerFromBackground( "event_beat_loop", new Point( eventWidth, 0 ), null, style ); loopLayer.forEach((loopLayer2) => { loopLayer2.style.opacity = "0"; loopLayer2.style.zIndex = "5"; loopLayer2.onStateChange = (style2) => { if (style2.hover) { loopLayer2.style.opacity = "1.0"; } else { loopLayer2.style.opacity = "0"; } }; return loopLayer2; }); layersToAdd.push(...backLayers2); layersToAdd.push(...holdLayer); layersToAdd.push(...subdivLayer); layersToAdd.push(...skipshotLayer); layersToAdd.push(...skipHitLayer); layersToAdd.push(...pulses); layersToAdd.push(...loopLayer); layersToAdd.push(...crossLayers); } break; case "AddFreeTimeBeat" /* AddFreeTimeBeat */: { const hold = obj.hold ?? 0; const holdLayer = hold > 0 ? createLayerFromBackground( evbarea, new Rect( slcinfo.bounds.width, 0, iconSize * hold - slcinfo.bounds.width, iconSize ), new Color(style.active ? 4291839731 : 4286462352), style, true ) : []; holdLayer.forEach((layer) => { layer.style.pointerEvents = "none"; return layer; }); const backLayers2 = createBackLayer( new Size(slcinfo.bounds.width, iconSize), beatColor, style ); const hitLayer = obj.pulse === 6 ? createLayerFromBackground( hit, new Point(0, 0), null, style ) : []; const textLayer = createRDFontLayer( ((obj.pulse ?? 0) + 1).toString(), 1.5, 10, style, Color.White ); layersToAdd.push(...holdLayer); layersToAdd.push(...backLayers2); layersToAdd.push(...hitLayer); layersToAdd.push(textLayer); } break; case "Comment" /* Comment */: { const backLayers2 = createBackLayer( slcinfo.bounds.size, new Color(obj.color ?? "7d7d7d"), style ); const iconLayer = createLayerFromBackground( key, null, null, style ); layersToAdd.push(...backLayers2); layersToAdd.push(...iconLayer); } break; case "DesktopColor" /* DesktopColor */: { const backLayers2 = createBackLayer( slcinfo.bounds.size, colorOf(obj.tab ?? evinfo.defaultTab), style ); const iconColorLayer = createLayerFromBackground( `${key}_0`, new Point(0, iconSize), new Color(obj.endColor ?? "ffffff"), style ); const iconLayer = createLayerFromBackground( `${key}_1`, new Point(0, iconSize), null, style ); layersToAdd.push(...backLayers2); layersToAdd.push(...iconColorLayer); layersToAdd.push(...iconLayer); } break; case "PulseFreeTimeBeat" /* PulseFreeTimeBeat */: { const hold = obj.hold ?? 0; const holdLayer = hold > 0 ? createLayerFromBackground( evbarea, new Rect( slcinfo.bounds.width, 0, iconSize * hold - slcinfo.bounds.width, slcinfo.bounds.height ), new Color(style.active ? 4291839731 : 4286462352), style, true ) : []; holdLayer.forEach((layer) => { layer.style.pointerEvents = "none"; return layer; }); const backLayers2 = createBackLayer( new Size(slcinfo.bounds.width, slcinfo.bounds.height), beatColor, style ); const customPulse = Number(obj.customPulse ?? 0); const hitInfo = slices.get(hit); const hitHeight = slcinfo.bounds.height; const hitWidth = hitInfo ? hitInfo.bounds.width * (hitHeight / hitInfo.bounds.height) : hitHeight; const hitTop = (slcinfo.bounds.height - hitHeight) / 2; const hitLayer = obj.action === "Custom" && customPulse === 6 ? createLayerFromBackground( hit, new Rect( 0, hitTop, hitWidth, hitHeight ), null, style ) : []; let text = ""; switch (obj.action) { case "Custom": text = (customPulse + 1).toString(); break; case "Increment": text = ">"; break; case "Decrement": text = "<"; break; case "Remove": text = "x"; break; } const textLayer = createRDFontLayer( text, 1.5, 8, style, Color.White ); layersToAdd.push(...holdLayer); layersToAdd.push(...backLayers2); layersToAdd.push(...hitLayer); layersToAdd.push(textLayer); } break; case "ReorderRooms" /* ReorderRooms */: case "ReorderWindows" /* ReorderWindows */: { const backLayers2 = createBackLayer( slcinfo.bounds.size, colorOf(obj.tab ?? evinfo.defaultTab), style ); const orderLayers = []; const order = obj.order ?? [0, 1, 2, 3]; for (let i = 0; i < Math.min(order.length, 4); i++) { { const orderLayer = createLayerFromBackground( `${key}_${order[i]}`, new Point(0, i * iconSize), null, style ); orderLayers.push(...orderLayer); } } layersToAdd.push(...backLayers2); layersToAdd.push(...orderLayers); } break; case "SayReadyGetSetGo" /* SayReadyGetSetGo */: { const wordInfo = WordInfos[obj.phraseToSay ?? "JustSayGo" /* JustSayGo */]; const len = wordInfo.length * (obj.tick ?? 0) + 1; iconWidth = len * iconSize; const stringToJoin = wordInfo.phrase.split(" "); const stringToDraw = [stringToJoin[0]]; let lw = measureRDFontText(stringToJoin[0]); const sw = measureRDFontText(" "); const backLayers2 = createBackLayer( new Size(len * iconSize, iconSize), colorOf(obj.tab ?? evinfo.defaultTab), style ); const wordLayers = []; for (let i = 1; i < stringToJoin.length; i++) { const part = stringToJoin[i]; const w = measureRDFontText(part); if (lw + w + sw > (len * iconSize * 2 - 2) * style.scale) { lw = w; stringToDraw.push(part); } else { lw += w + sw; stringToDraw[stringToDraw.length - 1] += " " + part; } } const c = Math.min(stringToDraw.length, 3); const textScale = Math.trunc(style.scale / 2); const top = (iconSize - charHeight * c / 2) * style.scale / 2; for (let i = 0; i < c; i++) { const line = stringToDraw[i]; const px = (len * iconSize * 2 - measureRDFontText(line) * textScale) / 2; const py = top + (i * charHeight + lineHeight) * style.scale / 2; const wordLayer = createRDFontLayer( line, px, py, style, Color.White, textScale, 0.5 ); wordLayers.push(wordLayer); } layersToAdd.push(...backLayers2); layersToAdd.push(...wordLayers); } break; case "SetRowXs" /* SetRowXs */: { const syncoBeat = obj.syncoBeat ?? -1; const width = slcinfo.bounds.width / 6; const iconBounds = slices.get(beatx).bounds; const s = width / iconBounds.width; let left = 0; const top = iconSize / 2 - iconBounds.height * s / 2; const patternLayers = []; const backLayers2 = createBackLayer( new Size(slcinfo.bounds.width, slcinfo.bounds.height), colorOf(obj.tab ?? evinfo.defaultTab), style ); if (typeof obj.pattern !== "string" || obj.pattern.length !== 6) { obj.pattern = "------"; } for (let p of obj.pattern) { const beatxLayer = createLayerFromBackground( p === "x" ? beatx : beatline, new Rect(left, top, width, iconBounds.height * s), null, style ); patternLayers.push(...beatxLayer); left += width; } const syncoBeatLayer = syncoBeat >= 0 ? createLayerFromBackground( beatsynco, new Rect( width * syncoBeat, top, width, iconBounds.height * s ), null, style ) : []; layersToAdd.push(...backLayers2); layersToAdd.push(...patternLayers); layersToAdd.push(...syncoBeatLayer); } break; case "ShowRooms" /* ShowRooms */: { const backLayers2 = createBackLayer( new Size(iconSize, iconSize * 4), colorOf(obj.tab ?? evinfo.defaultTab), style ); const roomLayers = []; for (let i = 0; i < 4; i++) { const roomLayer = createLayerFromBackground( `${key}_${(obj.rooms ?? []).indexOf(i) >= 0 ? "1" : "0"}`, new Point(0, i * iconSize * style.scale), null, { ...style, scale: style.scale / 2 } ); roomLayers.push(...roomLayer); } layersToAdd.push(...backLayers2); layersToAdd.push(...roomLayers); } break; default: const backLayers = createBackLayer( slcinfo.bounds.size, colorOf(obj.tab ?? evinfo.defaultTab), style ); layersToAdd.push(...backLayers); switch (evttype) { case "CustomFlash" /* CustomFlash */: const iconLayer = createLayerFromBackground( key, null, null, style ); const startColorLayer = createLayerFromBackground( `${key}_0`, null, new Color(obj.startColor ?? "000000").withAlpha( (obj.startOpacity ?? 0) * 255 ), style ); const endColorLayer = createLayerFromBackground( `${key}_1`, null, new Color(obj.endColor ?? "000000").withAlpha( (obj.endOpacity ?? 0) * 255 ), style ); layersToAdd.push(...iconLayer); layersToAdd.push(...startColorLayer); layersToAdd.push(...endColorLayer); break; case "FlipScreen" /* FlipScreen */: { const flip = (obj.flipX ? 1 : 0) | (obj.flipY ? 2 : 0); const iconLayer2 = createLayerFromBackground( flip === 0 ? `${key}_0` : `${key}_${flip - 1}`, null, null, style ); layersToAdd.push(...iconLayer2); } break; case "FloatingText" /* FloatingText */: { const backColorLayer = createLayerFromBackground( `${key}_0`, null, Color.FromRgba(obj.color ?? "FFFFFFFF"), style ); const foreColorLayer = createLayerFromBackground( `${key}_1`, null, Color.FromRgba( obj.outlineColor ?? "FFFFFFFF" ), style ); layersToAdd.push(...backColorLayer); layersToAdd.push(...foreColorLayer); } break; case "MoveRoom" /* MoveRoom */: { obj.scale ??= [null, null]; const hasPivot = obj.pivot !== void 0; obj.pivot ??= [null, null]; const degree = obj.angle ?? 0; const radius = -degree * Math.PI / 180; let width = (obj.scale ? obj.scale[0] ?? 0 : 100) / 100; let height = (obj.scale ? obj.scale[1] ?? 0 : 100) / 100; const pleft = (obj.pivot ? obj.pivot[0] ?? 0 : 50) / 100; const ptop = (obj.pivot ? obj.pivot[1] ?? 0 : 50) / 100; if (width === 0 || height === 0) break; const uniform = Math.sqrt( width * width + height * height ); width /= uniform; height /= uniform; const roomLayer = createLayerFromBackground( key, new Rect( iconSize / 2, iconSize / 2, iconSize * width, iconSize * height ), null, style ); roomLayer.forEach((roomLayer2) => { roomLayer2.style.transform = `translate(-50%, -50%) rotate(${-degree}deg)`; return roomLayer2; }); layersToAdd.push(...roomLayer); if (hasPivot) { let pivotx = width * (1 - pleft * 2); let pivoty = height * (1 - ptop * 2); const widthrotated = pivotx * Math.cos(radius) + pivoty * Math.sin(radius); const heightrotated = -pivotx * Math.sin(radius) + pivoty * Math.cos(radius); const pointLayer = document.createElement( "div" ); pointLayer.style.position = "absolute"; pointLayer.style.width = `${style.scale}px`; pointLayer.style.height = `${style.scale}px`; pointLayer.style.left = `${iconSize * (1 - widthrotated) * style.scale / 2}px`; pointLayer.style.top = `${iconSize * (1 + heightrotated) * style.scale / 2}px`; pointLayer.style.backgroundColor = "#FF0000"; layersToAdd.push(pointLayer); } } break; case "SetText" /* SetText */: { const textColorLayer = createLayerFromBackground( `${key}_0`, null, Color.FromRgba(obj.color ?? "FFFFFFFF"), style ); const outlineColorLayer = createLayerFromBackground( `${key}_1`, null, Color.FromRgba( obj.outlineColor ?? "FFFFFFFF" ), style ); layersToAdd.push(...textColorLayer); layersToAdd.push(...outlineColorLayer); } break; case "PaintHands" /* PaintHands */: case "Tint" /* Tint */: case "TintRows" /* TintRows */: { const border = obj.border; const backColorLayer = createLayerFromBackground( key, null, Color.FromRgba( obj.tintColor ?? "FFFFFFFF" ), style ); const foreColorLayer = border ? createLayerFromBackground( border === "Outline" ? `${key}_0` : border === "Glow" ? `${key}_1` : "", null, Color.FromRgba( obj.borderColor ?? "FFFFFFFF" ), style ) : []; layersToAdd.push(...backColorLayer); layersToAdd.push(...foreColorLayer); } break; case "TintText" /* TintText */: { const tintColorLayer = createLayerFromBackground( `${key}_0`, null, obj.tintColor ? Color.FromRgba(obj.tintColor) : Color.White, style ); const borderColorLayer = obj.borderColor ? createLayerFromBackground( `${key}_1`, null, Color.FromRgba(obj.borderColor), style ) : []; layersToAdd.push(...tintColorLayer); layersToAdd.push(...borderColorLayer); } break; case "SetBackgroundColor" /* SetBackgroundColor */: { const backType = obj.backgroundType ?? "Color"; const iconLayer2 = createLayerFromBackground( key, null, null, style ); const images = obj.image ?? []; const imagePath = images.length > 0 ? images[0] : ""; const contentInfo = slices.get(`${key}_1`); const colorLayer = createLayerFromBackground( `${key}_0`, null, Color.FromRgba( (backType === "Color" ? obj.color : null) ?? "FFFFFF" ), style ); const contentLayer = backType === "Image" && imagePath && contentInfo ? [ createImageLayer( imagePath, contentInfo, Color.FromRgba( obj.color ?? "FFFFFFFF" ), style ) ] : []; layersToAdd.push(...iconLayer2); layersToAdd.push(...colorLayer); layersToAdd.push(...contentLayer); } break; case "SetCrotchetsPerBar" /* SetCrotchetsPerBar */: { const cpb = obj.crotchetsPerBar ?? 0; const iconLayer2 = createLayerFromBackground( key, null, null, style ); const cpbLayer = createRDFontLayer( cpb > 9 ? "-" : cpb.toString(), 2, 7, style, Color.Black ); const bLayer = createRDFontLayer( "4", 8, 12, style, Color.Black ); layersToAdd.push(...iconLayer2); layersToAdd.push(cpbLayer); layersToAdd.push(bLayer); } break; case "SetForeground" /* SetForeground */: { const iconLayer2 = createLayerFromBackground( key, null, null, style ); const images = obj.image ?? []; const imagePath = images.length > 0 ? images[0] : ""; const contentInfo = slices.get(`${key}_1`); const contentLayer = imagePath && contentInfo ? [ createImageLayer( imagePath, contentInfo, Color.FromRgba( obj.color ?? "FFFFFFFF" ), style ) ] : []; layersToAdd.push(...iconLayer2); layersToAdd.push(...contentLayer); } break; default: const layer = createLayerFromBackground( key0, null, null, style ); layersToAdd.push(...layer); break; } break; } if (evinfo.isDurationEvent && style.enabled) { const duration = obj[evinfo.durationKey] ?? 0; const durWidth = iconSize * duration; const durationLayer = (style.active || duration > 1) && durWidth > slcinfo.bounds.width ? createLayerFromBackground( evbarea, new Rect( slcinfo.bounds.width, 0, durWidth - slcinfo.bounds.width, slcinfo.bounds.height ), colorOf(obj.tab ?? evinfo.defaultTab).withAlpha( style.active ? 192 : 91 ), style, true ) : []; durationLayer.forEach((layer) => { layer.style.pointerEvents = "none"; layerHoverInit(layer); return layer; }); layersToAdd.push(...durationLayer); } const rooms = obj.rooms ?? []; const roomEnabled = new Color(4292392977); const roomDisabled = new Color(4284177243); if (evinfo.isRoomEvent) { const roomLayers = []; for (let i = 0; i < 4; i++) { const roomLayer = createLayerFromBackground( `room_${i}`, new Point(iconWidth, 0), rooms.indexOf(i) > -1 ? roomEnabled : roomDisabled, style ); roomLayers.push(...roomLayer); } const roomTopLayer = rooms.indexOf(4) > -1 ? createLayerFromBackground( `room_top`, new Point(iconWidth, 0), roomEnabled, style ) : []; roomLayers.push(...roomTopLayer); roomLayers.forEach((roomLayer) => { if (roomLayer) { layerHoverInit(roomLayer); } }); layersToAdd.push(...roomLayers); } const condition = obj.if ?? ""; if (condition.length > 0) { const positive = /(? 0 ? `Error: Unknown type: ${obj.type}` : "Error: Type missing", slcinfo.bounds.width * style.scale, colorOf(obj.tab ?? evinfo.defaultTab) ); } break; } if (hintLayer) { layersToAdd.push(hintLayer); } if (obj["$style"]) { const hsb = obj["$style"].hsb ?? [0, 1, 1]; if (hsb.length === 3 && (hsb[0] !== 0 || hsb[1] !== 0 || hsb[2] !== 0)) { layersToAdd.forEach((layer) => { if (!layer.filterData) { return; } layer.filterData.hue = hsb[0]; layer.filterData.saturation = hsb[1]; layer.filterData.brightness = hsb[2]; }); } layersToAdd.forEach((layer) => { layer.updateFilter?.(); }); } element.onStateChange = (style2) => { style2 = { ...style2 }; layersToAdd.forEach((layer) => { if (layer.onStateChange) { layer.onStateChange(style2); } }); }; element.moveTo = function(x, y) { this.style.left = `${x}px`; this.style.top = `${y}px`; }; for (const layer of layersToAdd) { if (layer) { element.appendChild(layer); } } element.eventData = obj; return element; } export { IconStyle, colorOf, createElementEvent };