star-canvas 0.1.10 → 0.1.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +2 -2
- package/dist/index.d.cts +1 -65
- package/dist/index.d.ts +1 -65
- package/dist/index.mjs +2 -2
- package/dist/legacy.cjs +2 -2
- package/dist/legacy.d.cts +1 -1
- package/dist/legacy.d.ts +1 -1
- package/dist/legacy.mjs +2 -2
- package/package.json +2 -2
package/dist/index.cjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var S=Object.defineProperty;var B=Object.getOwnPropertyDescriptor;var j=Object.getOwnPropertyNames;var V=Object.prototype.hasOwnProperty;var J=(o,r)=>{for(var a in r)S(o,a,{get:r[a],enumerable:!0})},K=(o,r,a,n)=>{if(r&&typeof r=="object"||typeof r=="function")for(let l of j(r))!V.call(o,l)&&l!==a&&S(o,l,{get:()=>r[l],enumerable:!(n=B(r,l))||n.enumerable});return o};var Q=o=>K(S({},"__esModule",{value:!0}),o);var re={};J(re,{createDragState:()=>ee,game:()=>ne,version:()=>Z});module.exports=Q(re);var Z="0.8.0",N={landscape:{width:640,height:360},portrait:{width:360,height:640},responsive:{}};function ee(o){}function $(){return typeof window<"u"&&typeof document<"u"}function te(){if(!$()||document.getElementById("star-canvas-base"))return;let o=document.createElement("style");o.id="star-canvas-base",o.textContent=`
|
|
2
2
|
html, body { height: 100%; }
|
|
3
3
|
body {
|
|
4
4
|
margin: 0; min-height: 100dvh; overflow: hidden; background: #000;
|
|
@@ -29,4 +29,4 @@
|
|
|
29
29
|
.star-ui textarea, .star-ui [data-interactive] {
|
|
30
30
|
pointer-events: auto;
|
|
31
31
|
}
|
|
32
|
-
`,document.head.appendChild(
|
|
32
|
+
`,document.head.appendChild(o)}function ne(o,r={}){$()&&(document.readyState==="loading"?document.addEventListener("DOMContentLoaded",()=>Y(o,r),{once:!0}):queueMicrotask(()=>Y(o,r)))}function Y(o,r){if(te(),window.__STAR_DOM__?.destroy)try{window.__STAR_DOM__.destroy()}catch{}document.querySelectorAll(".star-ui, .star-canvas, .star-input").forEach(e=>e.remove());let a=document.createElement("div");a.className="star-ui",document.body.appendChild(a);let n=document.createElement("canvas");n.className="star-canvas",document.body.appendChild(n);let l=n.getContext("2d",r.contextAttributes??{alpha:!0});if(!l)throw new Error("[star-canvas] Failed to get 2D context");if(r.preventContextMenu!==!1){let e=t=>t.preventDefault();n.addEventListener("contextmenu",e)}let c=document.createElement("div");c.className="star-input",document.body.appendChild(c);let M=[],k=[],ie=[],C=null,x={x:0,y:0,down:!1},A=null,I=[],E=new Map;function q(e){let t=e;if(t.clientX==null||t.clientY==null)return!1;let i=document.elementFromPoint(t.clientX,t.clientY);return i!==null&&i!==a&&a.contains(i)}let U=r.preset??"landscape",P=N[U]??N.landscape,w=r.width??P.width,L=r.height??P.height,D=r.maxPixelRatio??2,G=r.pixelRatio??"device",O=r.fit??"contain",g=1,u=w??1,m=L??1,F=new Set,T=null,f=[];function W(){return Math.min(typeof G=="number"?Math.max(1,G):Math.max(1,window.devicePixelRatio||1),D)}function b(){g=W();let e=document.body.getBoundingClientRect(),t=Math.max(1,Math.floor(e.width||window.innerWidth||800)),i=Math.max(1,Math.floor(e.height||window.innerHeight||600));if(w&&L){u=w,m=L;let d=u/m,p=t/i,v=1;if(O==="contain"?v=p>d?i/m:t/u:O==="cover"&&(v=p>d?t/u:i/m),O==="stretch")n.style.width="100%",n.style.height="100%";else{let y=Math.floor(u*v),_=Math.floor(m*v);n.style.width=`${y}px`,n.style.height=`${_}px`,n.style.position="absolute",n.style.left=`${Math.floor((t-y)/2)}px`,n.style.top=`${Math.floor((i-_)/2)}px`}}else if(L){m=L;let d=t/i;u=Math.floor(m*d),n.style.width="100%",n.style.height="100%",n.style.position="absolute",n.style.left="0",n.style.top="0"}else if(w){u=w;let d=t/i;m=Math.floor(u/d),n.style.width="100%",n.style.height="100%",n.style.position="absolute",n.style.left="0",n.style.top="0"}else u=t,m=i,n.style.width=`${u}px`,n.style.height=`${m}px`,n.style.position="absolute",n.style.left="0",n.style.top="0";let s=Math.max(1,Math.floor(u*g)),h=Math.max(1,Math.floor(m*g));n.width!==s&&(n.width=s),n.height!==h&&(n.height=h),l.setTransform(g,0,0,g,0,0),F.forEach(d=>d())}let z=new ResizeObserver(b);z.observe(document.body),f.push(()=>z.disconnect()),window.addEventListener("resize",b),f.push(()=>window.removeEventListener("resize",b));let H=window.visualViewport;H&&(H.addEventListener("resize",b),f.push(()=>H.removeEventListener("resize",b)));function R(e){let t=n.getBoundingClientRect(),i=(e.clientX-t.left)*(u/t.width),s=(e.clientY-t.top)*(m/t.height);return i=Math.max(0,Math.min(u,i)),s=Math.max(0,Math.min(m,s)),{x:i,y:s}}let X={stage:document.body,canvas:n,ctx:l,get width(){return u},get height(){return m},get dpr(){return g},resize:b,get tap(){return C},get pointer(){return x},get released(){return A},get taps(){return I},get pointers(){return Array.from(E.values())},on:(e,t,i,s)=>{if(/^(click|pointer|mouse|touch)/.test(e))try{let p=t.split(",").map(y=>`.star-ui ${y.trim()}`).join(", "),v=document.createElement("style");v.textContent=`${p} { pointer-events: auto; }`,document.head.appendChild(v),f.push(()=>v.remove())}catch{}let h=p=>{let y=p.target?.closest?.(t);y&&i.call(y,p)};document.addEventListener(e,h,s);let d=()=>document.removeEventListener(e,h,s);return f.push(d),d},loop:e=>{let i=0,s=!1,h=0,d=p=>{if(!s)return;let v=h?Math.min((p-h)/1e3,.1):0;h=p;try{e(v,p)}catch(y){console.error("[star-canvas] Game loop error:",y)}C=null,A=null,I=[],i=requestAnimationFrame(d)};return T={get running(){return s},start(){s||(s=!0,h=performance.now(),i=requestAnimationFrame(d))},stop(){s&&(s=!1,cancelAnimationFrame(i))}},T.start(),T},ui:{root:a,render:e=>{a.innerHTML!==e&&(a.innerHTML=e)},el:e=>a.querySelector(e),all:e=>a.querySelectorAll(e)},destroy:()=>{T?.stop(),f.forEach(e=>e()),f=[],F.clear(),n.parentElement&&n.parentElement.removeChild(n),a.parentElement&&a.parentElement.removeChild(a),c.parentElement&&c.parentElement.removeChild(c)},scoped:e=>{l.save();try{e()}finally{l.restore()}}};c.addEventListener("pointerdown",e=>{let t=R(e);x={x:t.x,y:t.y,down:!0},E.set(e.pointerId,{x:t.x,y:t.y,id:e.pointerId,down:!0}),!q(e)&&(C={x:t.x,y:t.y,time:e.timeStamp},I.push({x:t.x,y:t.y,id:e.pointerId,time:e.timeStamp}))}),c.addEventListener("pointermove",e=>{let t=R(e);x={x:t.x,y:t.y,down:x.down};let i=E.get(e.pointerId);i&&E.set(e.pointerId,{...i,x:t.x,y:t.y})}),c.addEventListener("pointerup",e=>{let t=R(e);x={x:t.x,y:t.y,down:!1},A={x:t.x,y:t.y,time:e.timeStamp},E.delete(e.pointerId)}),window.__STAR_DOM__={destroy:X.destroy},requestAnimationFrame(()=>requestAnimationFrame(()=>{b();try{o(X)}catch(e){console.error("[star-canvas] Game initialization failed:",e)}}))}0&&(module.exports={createDragState,game,version});
|
package/dist/index.d.cts
CHANGED
|
@@ -37,14 +37,6 @@ interface GameUI {
|
|
|
37
37
|
/** Scoped querySelectorAll for the UI root. */
|
|
38
38
|
all: <T extends Element = HTMLElement>(selector: string) => NodeListOf<T>;
|
|
39
39
|
}
|
|
40
|
-
/** Point with coordinates and the original event */
|
|
41
|
-
interface InputPoint {
|
|
42
|
-
x: number;
|
|
43
|
-
y: number;
|
|
44
|
-
event: PointerEvent;
|
|
45
|
-
}
|
|
46
|
-
/** Input handler type */
|
|
47
|
-
type InputHandler = (point: InputPoint) => void;
|
|
48
40
|
interface GameContext {
|
|
49
41
|
/** The root <div> element for the canvas. */
|
|
50
42
|
readonly stage: HTMLElement;
|
|
@@ -65,24 +57,6 @@ interface GameContext {
|
|
|
65
57
|
/** The dedicated UI overlay manager. */
|
|
66
58
|
readonly ui: GameUI;
|
|
67
59
|
/** @deprecated Use g.tap/g.pointer coordinates directly — they're already in canvas-space. */
|
|
68
|
-
toStagePoint: (e: {
|
|
69
|
-
clientX: number;
|
|
70
|
-
clientY: number;
|
|
71
|
-
}) => {
|
|
72
|
-
x: number;
|
|
73
|
-
y: number;
|
|
74
|
-
};
|
|
75
|
-
/** @deprecated Use g.tap/g.pointer/g.released polling instead. */
|
|
76
|
-
createDrag: <T extends {
|
|
77
|
-
x: number;
|
|
78
|
-
y: number;
|
|
79
|
-
}>() => DragState<T>;
|
|
80
|
-
/** @deprecated Use g.tap polling in the game loop instead. */
|
|
81
|
-
onTap: (handler: InputHandler) => void;
|
|
82
|
-
/** @deprecated Use g.pointer polling in the game loop instead. */
|
|
83
|
-
onMove: (handler: InputHandler) => void;
|
|
84
|
-
/** @deprecated Use g.released polling in the game loop instead. */
|
|
85
|
-
onRelease: (handler: InputHandler) => void;
|
|
86
60
|
/** Tap this frame (pointerdown). Null if none. Canvas-space coords. Read in your game loop. */
|
|
87
61
|
readonly tap: {
|
|
88
62
|
x: number;
|
|
@@ -164,49 +138,11 @@ interface GameOptions {
|
|
|
164
138
|
*/
|
|
165
139
|
preventContextMenu?: boolean;
|
|
166
140
|
}
|
|
167
|
-
/** Drag state helper - handles coordinate conversion and offset tracking */
|
|
168
|
-
interface DragState<T extends {
|
|
169
|
-
x: number;
|
|
170
|
-
y: number;
|
|
171
|
-
}> {
|
|
172
|
-
/** Convert event to stage coordinates (pure function, no side effects) */
|
|
173
|
-
point: (e: {
|
|
174
|
-
clientX: number;
|
|
175
|
-
clientY: number;
|
|
176
|
-
}) => {
|
|
177
|
-
x: number;
|
|
178
|
-
y: number;
|
|
179
|
-
};
|
|
180
|
-
/** Start dragging an object - computes offset from cursor to object origin */
|
|
181
|
-
grab: (e: {
|
|
182
|
-
clientX: number;
|
|
183
|
-
clientY: number;
|
|
184
|
-
}, obj: T) => void;
|
|
185
|
-
/** Update the grabbed object's position based on pointer movement */
|
|
186
|
-
move: (e: {
|
|
187
|
-
clientX: number;
|
|
188
|
-
clientY: number;
|
|
189
|
-
}) => void;
|
|
190
|
-
/** Release the grabbed object and return it (or null if nothing was grabbed) */
|
|
191
|
-
release: () => T | null;
|
|
192
|
-
/** The currently grabbed object (or null) */
|
|
193
|
-
readonly dragging: T | null;
|
|
194
|
-
}
|
|
195
141
|
/** @deprecated Use g.tap/g.pointer/g.released polling for drag-and-drop instead. */
|
|
196
|
-
declare function createDragState<T extends {
|
|
197
|
-
x: number;
|
|
198
|
-
y: number;
|
|
199
|
-
}>(toStagePoint: (e: {
|
|
200
|
-
clientX: number;
|
|
201
|
-
clientY: number;
|
|
202
|
-
}) => {
|
|
203
|
-
x: number;
|
|
204
|
-
y: number;
|
|
205
|
-
}): DragState<T>;
|
|
206
142
|
/**
|
|
207
143
|
* The main entry point. Runs setup when the DOM is ready,
|
|
208
144
|
* providing a safe context for building a game.
|
|
209
145
|
*/
|
|
210
146
|
declare function game(setup: (g: GameContext) => void, options?: GameOptions): void;
|
|
211
147
|
|
|
212
|
-
export { type
|
|
148
|
+
export { type GameContext, type GameLoop, type GameOptions, type GameTick, type GameUI, game, version };
|
package/dist/index.d.ts
CHANGED
|
@@ -37,14 +37,6 @@ interface GameUI {
|
|
|
37
37
|
/** Scoped querySelectorAll for the UI root. */
|
|
38
38
|
all: <T extends Element = HTMLElement>(selector: string) => NodeListOf<T>;
|
|
39
39
|
}
|
|
40
|
-
/** Point with coordinates and the original event */
|
|
41
|
-
interface InputPoint {
|
|
42
|
-
x: number;
|
|
43
|
-
y: number;
|
|
44
|
-
event: PointerEvent;
|
|
45
|
-
}
|
|
46
|
-
/** Input handler type */
|
|
47
|
-
type InputHandler = (point: InputPoint) => void;
|
|
48
40
|
interface GameContext {
|
|
49
41
|
/** The root <div> element for the canvas. */
|
|
50
42
|
readonly stage: HTMLElement;
|
|
@@ -65,24 +57,6 @@ interface GameContext {
|
|
|
65
57
|
/** The dedicated UI overlay manager. */
|
|
66
58
|
readonly ui: GameUI;
|
|
67
59
|
/** @deprecated Use g.tap/g.pointer coordinates directly — they're already in canvas-space. */
|
|
68
|
-
toStagePoint: (e: {
|
|
69
|
-
clientX: number;
|
|
70
|
-
clientY: number;
|
|
71
|
-
}) => {
|
|
72
|
-
x: number;
|
|
73
|
-
y: number;
|
|
74
|
-
};
|
|
75
|
-
/** @deprecated Use g.tap/g.pointer/g.released polling instead. */
|
|
76
|
-
createDrag: <T extends {
|
|
77
|
-
x: number;
|
|
78
|
-
y: number;
|
|
79
|
-
}>() => DragState<T>;
|
|
80
|
-
/** @deprecated Use g.tap polling in the game loop instead. */
|
|
81
|
-
onTap: (handler: InputHandler) => void;
|
|
82
|
-
/** @deprecated Use g.pointer polling in the game loop instead. */
|
|
83
|
-
onMove: (handler: InputHandler) => void;
|
|
84
|
-
/** @deprecated Use g.released polling in the game loop instead. */
|
|
85
|
-
onRelease: (handler: InputHandler) => void;
|
|
86
60
|
/** Tap this frame (pointerdown). Null if none. Canvas-space coords. Read in your game loop. */
|
|
87
61
|
readonly tap: {
|
|
88
62
|
x: number;
|
|
@@ -164,49 +138,11 @@ interface GameOptions {
|
|
|
164
138
|
*/
|
|
165
139
|
preventContextMenu?: boolean;
|
|
166
140
|
}
|
|
167
|
-
/** Drag state helper - handles coordinate conversion and offset tracking */
|
|
168
|
-
interface DragState<T extends {
|
|
169
|
-
x: number;
|
|
170
|
-
y: number;
|
|
171
|
-
}> {
|
|
172
|
-
/** Convert event to stage coordinates (pure function, no side effects) */
|
|
173
|
-
point: (e: {
|
|
174
|
-
clientX: number;
|
|
175
|
-
clientY: number;
|
|
176
|
-
}) => {
|
|
177
|
-
x: number;
|
|
178
|
-
y: number;
|
|
179
|
-
};
|
|
180
|
-
/** Start dragging an object - computes offset from cursor to object origin */
|
|
181
|
-
grab: (e: {
|
|
182
|
-
clientX: number;
|
|
183
|
-
clientY: number;
|
|
184
|
-
}, obj: T) => void;
|
|
185
|
-
/** Update the grabbed object's position based on pointer movement */
|
|
186
|
-
move: (e: {
|
|
187
|
-
clientX: number;
|
|
188
|
-
clientY: number;
|
|
189
|
-
}) => void;
|
|
190
|
-
/** Release the grabbed object and return it (or null if nothing was grabbed) */
|
|
191
|
-
release: () => T | null;
|
|
192
|
-
/** The currently grabbed object (or null) */
|
|
193
|
-
readonly dragging: T | null;
|
|
194
|
-
}
|
|
195
141
|
/** @deprecated Use g.tap/g.pointer/g.released polling for drag-and-drop instead. */
|
|
196
|
-
declare function createDragState<T extends {
|
|
197
|
-
x: number;
|
|
198
|
-
y: number;
|
|
199
|
-
}>(toStagePoint: (e: {
|
|
200
|
-
clientX: number;
|
|
201
|
-
clientY: number;
|
|
202
|
-
}) => {
|
|
203
|
-
x: number;
|
|
204
|
-
y: number;
|
|
205
|
-
}): DragState<T>;
|
|
206
142
|
/**
|
|
207
143
|
* The main entry point. Runs setup when the DOM is ready,
|
|
208
144
|
* providing a safe context for building a game.
|
|
209
145
|
*/
|
|
210
146
|
declare function game(setup: (g: GameContext) => void, options?: GameOptions): void;
|
|
211
147
|
|
|
212
|
-
export { type
|
|
148
|
+
export { type GameContext, type GameLoop, type GameOptions, type GameTick, type GameUI, game, version };
|
package/dist/index.mjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var
|
|
1
|
+
var J="0.8.0",X={landscape:{width:640,height:360},portrait:{width:360,height:640},responsive:{}};function K(v){}function Y(){return typeof window<"u"&&typeof document<"u"}function W(){if(!Y()||document.getElementById("star-canvas-base"))return;let v=document.createElement("style");v.id="star-canvas-base",v.textContent=`
|
|
2
2
|
html, body { height: 100%; }
|
|
3
3
|
body {
|
|
4
4
|
margin: 0; min-height: 100dvh; overflow: hidden; background: #000;
|
|
@@ -29,4 +29,4 @@ var ee="0.8.0",N={landscape:{width:640,height:360},portrait:{width:360,height:64
|
|
|
29
29
|
.star-ui textarea, .star-ui [data-interactive] {
|
|
30
30
|
pointer-events: auto;
|
|
31
31
|
}
|
|
32
|
-
`,document.head.appendChild(
|
|
32
|
+
`,document.head.appendChild(v)}function Q(v,o={}){Y()&&(document.readyState==="loading"?document.addEventListener("DOMContentLoaded",()=>N(v,o),{once:!0}):queueMicrotask(()=>N(v,o)))}function N(v,o){if(W(),window.__STAR_DOM__?.destroy)try{window.__STAR_DOM__.destroy()}catch{}document.querySelectorAll(".star-ui, .star-canvas, .star-input").forEach(e=>e.remove());let a=document.createElement("div");a.className="star-ui",document.body.appendChild(a);let n=document.createElement("canvas");n.className="star-canvas",document.body.appendChild(n);let p=n.getContext("2d",o.contextAttributes??{alpha:!0});if(!p)throw new Error("[star-canvas] Failed to get 2D context");if(o.preventContextMenu!==!1){let e=t=>t.preventDefault();n.addEventListener("contextmenu",e)}let l=document.createElement("div");l.className="star-input",document.body.appendChild(l);let M=[],S=[],B=[],C=null,x={x:0,y:0,down:!1},A=null,I=[],E=new Map;function $(e){let t=e;if(t.clientX==null||t.clientY==null)return!1;let r=document.elementFromPoint(t.clientX,t.clientY);return r!==null&&r!==a&&a.contains(r)}let q=o.preset??"landscape",k=X[q]??X.landscape,w=o.width??k.width,L=o.height??k.height,P=o.maxPixelRatio??2,D=o.pixelRatio??"device",O=o.fit??"contain",g=1,d=w??1,c=L??1,G=new Set,T=null,f=[];function U(){return Math.min(typeof D=="number"?Math.max(1,D):Math.max(1,window.devicePixelRatio||1),P)}function b(){g=U();let e=document.body.getBoundingClientRect(),t=Math.max(1,Math.floor(e.width||window.innerWidth||800)),r=Math.max(1,Math.floor(e.height||window.innerHeight||600));if(w&&L){d=w,c=L;let s=d/c,u=t/r,m=1;if(O==="contain"?m=u>s?r/c:t/d:O==="cover"&&(m=u>s?t/d:r/c),O==="stretch")n.style.width="100%",n.style.height="100%";else{let y=Math.floor(d*m),_=Math.floor(c*m);n.style.width=`${y}px`,n.style.height=`${_}px`,n.style.position="absolute",n.style.left=`${Math.floor((t-y)/2)}px`,n.style.top=`${Math.floor((r-_)/2)}px`}}else if(L){c=L;let s=t/r;d=Math.floor(c*s),n.style.width="100%",n.style.height="100%",n.style.position="absolute",n.style.left="0",n.style.top="0"}else if(w){d=w;let s=t/r;c=Math.floor(d/s),n.style.width="100%",n.style.height="100%",n.style.position="absolute",n.style.left="0",n.style.top="0"}else d=t,c=r,n.style.width=`${d}px`,n.style.height=`${c}px`,n.style.position="absolute",n.style.left="0",n.style.top="0";let i=Math.max(1,Math.floor(d*g)),h=Math.max(1,Math.floor(c*g));n.width!==i&&(n.width=i),n.height!==h&&(n.height=h),p.setTransform(g,0,0,g,0,0),G.forEach(s=>s())}let F=new ResizeObserver(b);F.observe(document.body),f.push(()=>F.disconnect()),window.addEventListener("resize",b),f.push(()=>window.removeEventListener("resize",b));let H=window.visualViewport;H&&(H.addEventListener("resize",b),f.push(()=>H.removeEventListener("resize",b)));function R(e){let t=n.getBoundingClientRect(),r=(e.clientX-t.left)*(d/t.width),i=(e.clientY-t.top)*(c/t.height);return r=Math.max(0,Math.min(d,r)),i=Math.max(0,Math.min(c,i)),{x:r,y:i}}let z={stage:document.body,canvas:n,ctx:p,get width(){return d},get height(){return c},get dpr(){return g},resize:b,get tap(){return C},get pointer(){return x},get released(){return A},get taps(){return I},get pointers(){return Array.from(E.values())},on:(e,t,r,i)=>{if(/^(click|pointer|mouse|touch)/.test(e))try{let u=t.split(",").map(y=>`.star-ui ${y.trim()}`).join(", "),m=document.createElement("style");m.textContent=`${u} { pointer-events: auto; }`,document.head.appendChild(m),f.push(()=>m.remove())}catch{}let h=u=>{let y=u.target?.closest?.(t);y&&r.call(y,u)};document.addEventListener(e,h,i);let s=()=>document.removeEventListener(e,h,i);return f.push(s),s},loop:e=>{let r=0,i=!1,h=0,s=u=>{if(!i)return;let m=h?Math.min((u-h)/1e3,.1):0;h=u;try{e(m,u)}catch(y){console.error("[star-canvas] Game loop error:",y)}C=null,A=null,I=[],r=requestAnimationFrame(s)};return T={get running(){return i},start(){i||(i=!0,h=performance.now(),r=requestAnimationFrame(s))},stop(){i&&(i=!1,cancelAnimationFrame(r))}},T.start(),T},ui:{root:a,render:e=>{a.innerHTML!==e&&(a.innerHTML=e)},el:e=>a.querySelector(e),all:e=>a.querySelectorAll(e)},destroy:()=>{T?.stop(),f.forEach(e=>e()),f=[],G.clear(),n.parentElement&&n.parentElement.removeChild(n),a.parentElement&&a.parentElement.removeChild(a),l.parentElement&&l.parentElement.removeChild(l)},scoped:e=>{p.save();try{e()}finally{p.restore()}}};l.addEventListener("pointerdown",e=>{let t=R(e);x={x:t.x,y:t.y,down:!0},E.set(e.pointerId,{x:t.x,y:t.y,id:e.pointerId,down:!0}),!$(e)&&(C={x:t.x,y:t.y,time:e.timeStamp},I.push({x:t.x,y:t.y,id:e.pointerId,time:e.timeStamp}))}),l.addEventListener("pointermove",e=>{let t=R(e);x={x:t.x,y:t.y,down:x.down};let r=E.get(e.pointerId);r&&E.set(e.pointerId,{...r,x:t.x,y:t.y})}),l.addEventListener("pointerup",e=>{let t=R(e);x={x:t.x,y:t.y,down:!1},A={x:t.x,y:t.y,time:e.timeStamp},E.delete(e.pointerId)}),window.__STAR_DOM__={destroy:z.destroy},requestAnimationFrame(()=>requestAnimationFrame(()=>{b();try{v(z)}catch(e){console.error("[star-canvas] Game initialization failed:",e)}}))}export{K as createDragState,Q as game,J as version};
|
package/dist/legacy.cjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var S=Object.defineProperty;var J=Object.getOwnPropertyDescriptor;var K=Object.getOwnPropertyNames;var Q=Object.prototype.hasOwnProperty;var Z=(i,r)=>{for(var a in r)S(i,a,{get:r[a],enumerable:!0})},ee=(i,r,a,n)=>{if(r&&typeof r=="object"||typeof r=="function")for(let l of K(r))!Q.call(i,l)&&l!==a&&S(i,l,{get:()=>r[l],enumerable:!(n=J(r,l))||n.enumerable});return i};var te=i=>ee(S({},"__esModule",{value:!0}),i);var oe={};Z(oe,{createDragState:()=>q,game:()=>re,version:()=>$});module.exports=te(oe);var $="0.8.0",N={landscape:{width:640,height:360},portrait:{width:360,height:640},responsive:{}};function q(i){}function U(){return typeof window<"u"&&typeof document<"u"}function ne(){if(!U()||document.getElementById("star-canvas-base"))return;let i=document.createElement("style");i.id="star-canvas-base",i.textContent=`
|
|
2
2
|
html, body { height: 100%; }
|
|
3
3
|
body {
|
|
4
4
|
margin: 0; min-height: 100dvh; overflow: hidden; background: #000;
|
|
@@ -29,4 +29,4 @@
|
|
|
29
29
|
.star-ui textarea, .star-ui [data-interactive] {
|
|
30
30
|
pointer-events: auto;
|
|
31
31
|
}
|
|
32
|
-
`,document.head.appendChild(
|
|
32
|
+
`,document.head.appendChild(i)}function W(i,r={}){U()&&(document.readyState==="loading"?document.addEventListener("DOMContentLoaded",()=>Y(i,r),{once:!0}):queueMicrotask(()=>Y(i,r)))}function Y(i,r){if(ne(),window.__STAR_DOM__?.destroy)try{window.__STAR_DOM__.destroy()}catch{}document.querySelectorAll(".star-ui, .star-canvas, .star-input").forEach(e=>e.remove());let a=document.createElement("div");a.className="star-ui",document.body.appendChild(a);let n=document.createElement("canvas");n.className="star-canvas",document.body.appendChild(n);let l=n.getContext("2d",r.contextAttributes??{alpha:!0});if(!l)throw new Error("[star-canvas] Failed to get 2D context");if(r.preventContextMenu!==!1){let e=t=>t.preventDefault();n.addEventListener("contextmenu",e)}let c=document.createElement("div");c.className="star-input",document.body.appendChild(c);let M=[],k=[],ie=[],C=null,x={x:0,y:0,down:!1},O=null,I=[],E=new Map;function B(e){let t=e;if(t.clientX==null||t.clientY==null)return!1;let o=document.elementFromPoint(t.clientX,t.clientY);return o!==null&&o!==a&&a.contains(o)}let j=r.preset??"landscape",G=N[j]??N.landscape,w=r.width??G.width,L=r.height??G.height,D=r.maxPixelRatio??2,P=r.pixelRatio??"device",A=r.fit??"contain",g=1,u=w??1,p=L??1,F=new Set,T=null,f=[];function V(){return Math.min(typeof P=="number"?Math.max(1,P):Math.max(1,window.devicePixelRatio||1),D)}function b(){g=V();let e=document.body.getBoundingClientRect(),t=Math.max(1,Math.floor(e.width||window.innerWidth||800)),o=Math.max(1,Math.floor(e.height||window.innerHeight||600));if(w&&L){u=w,p=L;let d=u/p,m=t/o,v=1;if(A==="contain"?v=m>d?o/p:t/u:A==="cover"&&(v=m>d?t/u:o/p),A==="stretch")n.style.width="100%",n.style.height="100%";else{let h=Math.floor(u*v),_=Math.floor(p*v);n.style.width=`${h}px`,n.style.height=`${_}px`,n.style.position="absolute",n.style.left=`${Math.floor((t-h)/2)}px`,n.style.top=`${Math.floor((o-_)/2)}px`}}else if(L){p=L;let d=t/o;u=Math.floor(p*d),n.style.width="100%",n.style.height="100%",n.style.position="absolute",n.style.left="0",n.style.top="0"}else if(w){u=w;let d=t/o;p=Math.floor(u/d),n.style.width="100%",n.style.height="100%",n.style.position="absolute",n.style.left="0",n.style.top="0"}else u=t,p=o,n.style.width=`${u}px`,n.style.height=`${p}px`,n.style.position="absolute",n.style.left="0",n.style.top="0";let s=Math.max(1,Math.floor(u*g)),y=Math.max(1,Math.floor(p*g));n.width!==s&&(n.width=s),n.height!==y&&(n.height=y),l.setTransform(g,0,0,g,0,0),F.forEach(d=>d())}let z=new ResizeObserver(b);z.observe(document.body),f.push(()=>z.disconnect()),window.addEventListener("resize",b),f.push(()=>window.removeEventListener("resize",b));let H=window.visualViewport;H&&(H.addEventListener("resize",b),f.push(()=>H.removeEventListener("resize",b)));function R(e){let t=n.getBoundingClientRect(),o=(e.clientX-t.left)*(u/t.width),s=(e.clientY-t.top)*(p/t.height);return o=Math.max(0,Math.min(u,o)),s=Math.max(0,Math.min(p,s)),{x:o,y:s}}let X={stage:document.body,canvas:n,ctx:l,get width(){return u},get height(){return p},get dpr(){return g},resize:b,get tap(){return C},get pointer(){return x},get released(){return O},get taps(){return I},get pointers(){return Array.from(E.values())},on:(e,t,o,s)=>{if(/^(click|pointer|mouse|touch)/.test(e))try{let m=t.split(",").map(h=>`.star-ui ${h.trim()}`).join(", "),v=document.createElement("style");v.textContent=`${m} { pointer-events: auto; }`,document.head.appendChild(v),f.push(()=>v.remove())}catch{}let y=m=>{let h=m.target?.closest?.(t);h&&o.call(h,m)};document.addEventListener(e,y,s);let d=()=>document.removeEventListener(e,y,s);return f.push(d),d},loop:e=>{let o=0,s=!1,y=0,d=m=>{if(!s)return;let v=y?Math.min((m-y)/1e3,.1):0;y=m;try{e(v,m)}catch(h){console.error("[star-canvas] Game loop error:",h)}C=null,O=null,I=[],o=requestAnimationFrame(d)};return T={get running(){return s},start(){s||(s=!0,y=performance.now(),o=requestAnimationFrame(d))},stop(){s&&(s=!1,cancelAnimationFrame(o))}},T.start(),T},ui:{root:a,render:e=>{a.innerHTML!==e&&(a.innerHTML=e)},el:e=>a.querySelector(e),all:e=>a.querySelectorAll(e)},destroy:()=>{T?.stop(),f.forEach(e=>e()),f=[],F.clear(),n.parentElement&&n.parentElement.removeChild(n),a.parentElement&&a.parentElement.removeChild(a),c.parentElement&&c.parentElement.removeChild(c)},scoped:e=>{l.save();try{e()}finally{l.restore()}}};c.addEventListener("pointerdown",e=>{let t=R(e);x={x:t.x,y:t.y,down:!0},E.set(e.pointerId,{x:t.x,y:t.y,id:e.pointerId,down:!0}),!B(e)&&(C={x:t.x,y:t.y,time:e.timeStamp},I.push({x:t.x,y:t.y,id:e.pointerId,time:e.timeStamp}))}),c.addEventListener("pointermove",e=>{let t=R(e);x={x:t.x,y:t.y,down:x.down};let o=E.get(e.pointerId);o&&E.set(e.pointerId,{...o,x:t.x,y:t.y})}),c.addEventListener("pointerup",e=>{let t=R(e);x={x:t.x,y:t.y,down:!1},O={x:t.x,y:t.y,time:e.timeStamp},E.delete(e.pointerId)}),window.__STAR_DOM__={destroy:X.destroy},requestAnimationFrame(()=>requestAnimationFrame(()=>{b();try{i(X)}catch(e){console.error("[star-canvas] Game initialization failed:",e)}}))}function re(i,r={}){let a={preset:"responsive",...r};return W(i,a)}0&&(module.exports={createDragState,game,version});
|
package/dist/legacy.d.cts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { GameContext, GameOptions } from './index.cjs';
|
|
2
|
-
export { DragState, GameLoop, GameTick, GameUI,
|
|
2
|
+
export { DragState, GameLoop, GameTick, GameUI, version } from './index.cjs';
|
|
3
3
|
|
|
4
4
|
/**
|
|
5
5
|
* Star DOM SDK - Legacy Entry Point
|
package/dist/legacy.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { GameContext, GameOptions } from './index.js';
|
|
2
|
-
export { DragState, GameLoop, GameTick, GameUI,
|
|
2
|
+
export { DragState, GameLoop, GameTick, GameUI, version } from './index.js';
|
|
3
3
|
|
|
4
4
|
/**
|
|
5
5
|
* Star DOM SDK - Legacy Entry Point
|
package/dist/legacy.mjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var
|
|
1
|
+
var B="0.8.0",X={landscape:{width:640,height:360},portrait:{width:360,height:640},responsive:{}};function j(l){}function Y(){return typeof window<"u"&&typeof document<"u"}function V(){if(!Y()||document.getElementById("star-canvas-base"))return;let l=document.createElement("style");l.id="star-canvas-base",l.textContent=`
|
|
2
2
|
html, body { height: 100%; }
|
|
3
3
|
body {
|
|
4
4
|
margin: 0; min-height: 100dvh; overflow: hidden; background: #000;
|
|
@@ -29,4 +29,4 @@ var ee="0.8.0",N={landscape:{width:640,height:360},portrait:{width:360,height:64
|
|
|
29
29
|
.star-ui textarea, .star-ui [data-interactive] {
|
|
30
30
|
pointer-events: auto;
|
|
31
31
|
}
|
|
32
|
-
`,document.head.appendChild(
|
|
32
|
+
`,document.head.appendChild(l)}function $(l,o={}){Y()&&(document.readyState==="loading"?document.addEventListener("DOMContentLoaded",()=>N(l,o),{once:!0}):queueMicrotask(()=>N(l,o)))}function N(l,o){if(V(),window.__STAR_DOM__?.destroy)try{window.__STAR_DOM__.destroy()}catch{}document.querySelectorAll(".star-ui, .star-canvas, .star-input").forEach(e=>e.remove());let a=document.createElement("div");a.className="star-ui",document.body.appendChild(a);let n=document.createElement("canvas");n.className="star-canvas",document.body.appendChild(n);let v=n.getContext("2d",o.contextAttributes??{alpha:!0});if(!v)throw new Error("[star-canvas] Failed to get 2D context");if(o.preventContextMenu!==!1){let e=t=>t.preventDefault();n.addEventListener("contextmenu",e)}let d=document.createElement("div");d.className="star-input",document.body.appendChild(d);let M=[],S=[],J=[],C=null,x={x:0,y:0,down:!1},O=null,I=[],E=new Map;function q(e){let t=e;if(t.clientX==null||t.clientY==null)return!1;let r=document.elementFromPoint(t.clientX,t.clientY);return r!==null&&r!==a&&a.contains(r)}let U=o.preset??"landscape",k=X[U]??X.landscape,w=o.width??k.width,L=o.height??k.height,G=o.maxPixelRatio??2,D=o.pixelRatio??"device",A=o.fit??"contain",g=1,c=w??1,u=L??1,P=new Set,T=null,f=[];function W(){return Math.min(typeof D=="number"?Math.max(1,D):Math.max(1,window.devicePixelRatio||1),G)}function b(){g=W();let e=document.body.getBoundingClientRect(),t=Math.max(1,Math.floor(e.width||window.innerWidth||800)),r=Math.max(1,Math.floor(e.height||window.innerHeight||600));if(w&&L){c=w,u=L;let s=c/u,p=t/r,m=1;if(A==="contain"?m=p>s?r/u:t/c:A==="cover"&&(m=p>s?t/c:r/u),A==="stretch")n.style.width="100%",n.style.height="100%";else{let h=Math.floor(c*m),_=Math.floor(u*m);n.style.width=`${h}px`,n.style.height=`${_}px`,n.style.position="absolute",n.style.left=`${Math.floor((t-h)/2)}px`,n.style.top=`${Math.floor((r-_)/2)}px`}}else if(L){u=L;let s=t/r;c=Math.floor(u*s),n.style.width="100%",n.style.height="100%",n.style.position="absolute",n.style.left="0",n.style.top="0"}else if(w){c=w;let s=t/r;u=Math.floor(c/s),n.style.width="100%",n.style.height="100%",n.style.position="absolute",n.style.left="0",n.style.top="0"}else c=t,u=r,n.style.width=`${c}px`,n.style.height=`${u}px`,n.style.position="absolute",n.style.left="0",n.style.top="0";let i=Math.max(1,Math.floor(c*g)),y=Math.max(1,Math.floor(u*g));n.width!==i&&(n.width=i),n.height!==y&&(n.height=y),v.setTransform(g,0,0,g,0,0),P.forEach(s=>s())}let F=new ResizeObserver(b);F.observe(document.body),f.push(()=>F.disconnect()),window.addEventListener("resize",b),f.push(()=>window.removeEventListener("resize",b));let H=window.visualViewport;H&&(H.addEventListener("resize",b),f.push(()=>H.removeEventListener("resize",b)));function R(e){let t=n.getBoundingClientRect(),r=(e.clientX-t.left)*(c/t.width),i=(e.clientY-t.top)*(u/t.height);return r=Math.max(0,Math.min(c,r)),i=Math.max(0,Math.min(u,i)),{x:r,y:i}}let z={stage:document.body,canvas:n,ctx:v,get width(){return c},get height(){return u},get dpr(){return g},resize:b,get tap(){return C},get pointer(){return x},get released(){return O},get taps(){return I},get pointers(){return Array.from(E.values())},on:(e,t,r,i)=>{if(/^(click|pointer|mouse|touch)/.test(e))try{let p=t.split(",").map(h=>`.star-ui ${h.trim()}`).join(", "),m=document.createElement("style");m.textContent=`${p} { pointer-events: auto; }`,document.head.appendChild(m),f.push(()=>m.remove())}catch{}let y=p=>{let h=p.target?.closest?.(t);h&&r.call(h,p)};document.addEventListener(e,y,i);let s=()=>document.removeEventListener(e,y,i);return f.push(s),s},loop:e=>{let r=0,i=!1,y=0,s=p=>{if(!i)return;let m=y?Math.min((p-y)/1e3,.1):0;y=p;try{e(m,p)}catch(h){console.error("[star-canvas] Game loop error:",h)}C=null,O=null,I=[],r=requestAnimationFrame(s)};return T={get running(){return i},start(){i||(i=!0,y=performance.now(),r=requestAnimationFrame(s))},stop(){i&&(i=!1,cancelAnimationFrame(r))}},T.start(),T},ui:{root:a,render:e=>{a.innerHTML!==e&&(a.innerHTML=e)},el:e=>a.querySelector(e),all:e=>a.querySelectorAll(e)},destroy:()=>{T?.stop(),f.forEach(e=>e()),f=[],P.clear(),n.parentElement&&n.parentElement.removeChild(n),a.parentElement&&a.parentElement.removeChild(a),d.parentElement&&d.parentElement.removeChild(d)},scoped:e=>{v.save();try{e()}finally{v.restore()}}};d.addEventListener("pointerdown",e=>{let t=R(e);x={x:t.x,y:t.y,down:!0},E.set(e.pointerId,{x:t.x,y:t.y,id:e.pointerId,down:!0}),!q(e)&&(C={x:t.x,y:t.y,time:e.timeStamp},I.push({x:t.x,y:t.y,id:e.pointerId,time:e.timeStamp}))}),d.addEventListener("pointermove",e=>{let t=R(e);x={x:t.x,y:t.y,down:x.down};let r=E.get(e.pointerId);r&&E.set(e.pointerId,{...r,x:t.x,y:t.y})}),d.addEventListener("pointerup",e=>{let t=R(e);x={x:t.x,y:t.y,down:!1},O={x:t.x,y:t.y,time:e.timeStamp},E.delete(e.pointerId)}),window.__STAR_DOM__={destroy:z.destroy},requestAnimationFrame(()=>requestAnimationFrame(()=>{b();try{l(z)}catch(e){console.error("[star-canvas] Game initialization failed:",e)}}))}function te(l,o={}){let a={preset:"responsive",...o};return $(l,a)}export{j as createDragState,te as game,B as version};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "star-canvas",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.12",
|
|
4
4
|
"private": false,
|
|
5
5
|
"description": "Canvas game utilities for reliable game initialization - part of Star SDK.",
|
|
6
6
|
"type": "module",
|
|
@@ -46,7 +46,7 @@
|
|
|
46
46
|
"scripts": {
|
|
47
47
|
"build": "tsup",
|
|
48
48
|
"clean": "rm -rf dist",
|
|
49
|
-
"prepublishOnly": "node ../../apps/web/scripts/process-sdks.js --package star-canvas --public-only && yarn build"
|
|
49
|
+
"prepublishOnly": "node ../../apps/web/scripts/process-sdks.js --package star-canvas --public-only && yarn build && node scripts/strip-platform-types.cjs && node scripts/verify-no-platform-code.cjs"
|
|
50
50
|
},
|
|
51
51
|
"license": "MIT",
|
|
52
52
|
"homepage": "https://buildwithstar.com/docs/sdk",
|