littlejsengine 1.11.6 → 1.11.8

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.
Files changed (56) hide show
  1. package/README.md +11 -16
  2. package/dist/littlejs.d.ts +14 -1
  3. package/dist/littlejs.esm.js +35 -21
  4. package/dist/littlejs.esm.min.js +1 -1
  5. package/dist/littlejs.js +32 -20
  6. package/dist/littlejs.min.js +1 -1
  7. package/dist/littlejs.release.js +28 -19
  8. package/examples/box2d/game.js +2 -2
  9. package/examples/box2d/index.html +5 -5
  10. package/examples/breakout/game.js +6 -5
  11. package/examples/breakout/index.html +4 -4
  12. package/examples/breakoutTutorial/index.html +2 -2
  13. package/examples/htmlMenu/index.html +2 -2
  14. package/examples/index.html +300 -32
  15. package/examples/module/index.html +1 -1
  16. package/examples/particles/index.html +1 -1
  17. package/examples/platformer/gamePlayer.js +2 -7
  18. package/examples/platformer/index.html +8 -8
  19. package/examples/puzzle/index.html +2 -2
  20. package/examples/shorts/base.html +26 -0
  21. package/{shortExamples/code → examples/shorts}/blending.js +1 -1
  22. package/examples/shorts/platformer.js +42 -0
  23. package/{shortExamples/code → examples/shorts}/playSound.js +3 -0
  24. package/{shortExamples/code → examples/shorts}/pong.js +3 -3
  25. package/{shortExamples/code → examples/shorts}/shapes.js +2 -2
  26. package/examples/shorts/tiltedView.js +44 -0
  27. package/{shortExamples/code → examples/shorts}/timers.js +7 -3
  28. package/examples/shorts/topDown.js +44 -0
  29. package/examples/starter/index.html +13 -13
  30. package/examples/stress/index.html +2 -2
  31. package/examples/uiSystem/game.js +6 -1
  32. package/examples/uiSystem/index.html +3 -3
  33. package/package.json +1 -1
  34. package/plugins/Box2D_License.txt +17 -0
  35. package/plugins/uiSystem.js +2 -1
  36. package/reference.md +2 -1
  37. package/src/engine.js +1 -1
  38. package/src/engineDebug.js +5 -1
  39. package/src/engineDraw.js +5 -1
  40. package/src/engineExport.js +3 -1
  41. package/src/engineInput.js +19 -15
  42. package/src/engineRelease.js +1 -0
  43. package/src/engineTileLayer.js +2 -2
  44. package/.vscode/launch.json +0 -14
  45. package/shortExamples/base.html +0 -39
  46. package/shortExamples/index.html +0 -246
  47. /package/{shortExamples/code → examples/shorts}/animation.js +0 -0
  48. /package/{shortExamples/code → examples/shorts}/clock.js +0 -0
  49. /package/{shortExamples/code → examples/shorts}/colors.js +0 -0
  50. /package/{shortExamples/code → examples/shorts}/helloWorld.js +0 -0
  51. /package/{shortExamples/code → examples/shorts}/particles.js +0 -0
  52. /package/{shortExamples/code → examples/shorts}/spriteAtlas.js +0 -0
  53. /package/{shortExamples/code → examples/shorts}/systemFont.js +0 -0
  54. /package/{shortExamples/code → examples/shorts}/texture.js +0 -0
  55. /package/{shortExamples/code → examples/shorts}/tileLayer.js +0 -0
  56. /package/{shortExamples → examples/shorts}/tiles.png +0 -0
package/shortExamples/index.html DELETED
@@ -1,246 +0,0 @@
1
- <!DOCTYPE html><head>
2
- <title>LittleJS Short Examples</title>
3
- <link rel=icon href=../examples/favicon.png>
4
- <meta charset=utf-8>
5
- <style>
6
- html, body
7
- {
8
- height: 100%;
9
- display: flex;
10
- flex-direction: column;
11
- }
12
- #container1
13
- {
14
- height: 100%;
15
- display: flex;
16
- }
17
- #container2
18
- {
19
- display: flex;
20
- flex-direction: column;
21
- }
22
- #iframeContainer
23
- {
24
- border: 2px solid;
25
- background: #000;
26
- }
27
- iframe
28
- {
29
- width: 100%;
30
- height: 100%;
31
- border: none;
32
- }
33
- #selectExample
34
- {
35
- flex-grow: 1;
36
- }
37
- #textareaCode
38
- {
39
- flex-grow: 1;
40
- padding: 5px;
41
- resize: none;
42
- color: #fff;
43
- background: #000;
44
- }
45
- #textareaError
46
- {
47
- flex-grow: .3;
48
- padding: 5px;
49
- resize: none;
50
- display: none;
51
- color:#f22;
52
- background: #111;
53
- }
54
- #container3
55
- {
56
- width: 100%;
57
- height: 100%;
58
- display: flex;
59
- flex-direction: column;
60
- }
61
- #titleInfo
62
- {
63
- margin: 5px;
64
- text-align: center;
65
- font-size: 50px;
66
- }
67
- #exampleName
68
- {
69
- margin: 0px;
70
- text-align: center;
71
- font-size: 30px;
72
- }
73
- select
74
- {
75
- color:#fff;
76
- background-color: #111;
77
- width:100%;
78
- }
79
- </style>
80
- </head><body>
81
- <div id=container1>
82
- <div id=container3>
83
- <p id=titleInfo>LittleJS Short Examples</p>
84
- <p id=exampleName></p>
85
- <textarea id=textareaCode oninput=codeInput() spellcheck=false></textarea>
86
- <textarea id=textareaError readonly spellcheck=false></textarea>
87
- <div><input type=checkbox id=checkboxLiveEdit checked>Live Edit</div>
88
- </div>
89
- <div id=container2>
90
- <div id=iframeContainer></div>
91
- <select id=selectExample autofocus onchange=setExample() size=2></select>
92
- </div>
93
- </div>
94
- <script>
95
- 'use strict';
96
-
97
- class ExampleInfo
98
- {
99
- constructor(name, filename, description)
100
- {
101
- this.name = name;
102
- this.filename = filename;
103
- this.description = description;
104
- }
105
- }
106
-
107
- const exampleList =
108
- [
109
- new ExampleInfo('Hello World', 'helloWorld.js', 'Simplest example'),
110
- new ExampleInfo('Shapes', 'shapes.js', 'How to draw geometric shapes'),
111
- new ExampleInfo('Colors', 'colors.js', 'How to use the color object'),
112
- new ExampleInfo('Blending', 'blending.js', 'Shows different blending modes'),
113
- new ExampleInfo('Timers', 'timers.js', 'How to use the timer object'),
114
- new ExampleInfo('Texture', 'texture.js', 'How to display a full texture'),
115
- new ExampleInfo('Particles', 'particles.js', 'How to use the particle system'),
116
- new ExampleInfo('Play Sound', 'playSound.js', 'How to play sounds with zzfx'),
117
- new ExampleInfo('System Font', 'systemFont.js', 'Demo of the included system font'),
118
- new ExampleInfo('Sprite Atlas', 'spriteAtlas.js', 'How to set up a simple sprite atlas'),
119
- new ExampleInfo('Animation', 'animation.js', 'How to animate sprites'),
120
- new ExampleInfo('Clock', 'clock.js', 'A simple clock showing the time'),
121
- new ExampleInfo('Tile Layer', 'tileLayer.js', 'How to use a tile layer for collision and rendering'),
122
- new ExampleInfo('Pong Game', 'pong.js', 'A simple pong game using LittleJS physics'),
123
-
124
- // add more examples here!
125
- ];
126
-
127
- ///////////////////////////////////////////////////////////////////////////////
128
-
129
- let iframeExample, inputTimeout;
130
-
131
- // load the examples into the list
132
- for (const example of exampleList)
133
- {
134
- const text = example.name + (example.description?' - ' + example.description : '');
135
- selectExample.add(new Option(text));
136
- }
137
-
138
- // select first option
139
- selectExample.selectedIndex = 0;
140
- setExample();
141
-
142
- onresize = () =>
143
- {
144
- // resize iframe to fit half the window
145
- const aspect = 1920 / 1080;
146
- let w = innerWidth / 2 | 0;
147
- let h = w / aspect | 0;
148
- iframeContainer.style.width = w + 'px';
149
- iframeContainer.style.height = h + 'px';
150
- }
151
- onresize();
152
-
153
- ///////////////////////////////////////////////////////////////////////////////
154
-
155
- function setExample()
156
- {
157
- const example = exampleList[selectExample.selectedIndex];
158
- exampleName.innerText = example.name + ' - ' + example.filename +
159
- (example.description ? '\n' + example.description : '');
160
- loadFile(example.filename);
161
- }
162
-
163
- function codeInput()
164
- {
165
- if (!checkboxLiveEdit.checked)
166
- return;
167
-
168
- // debounce input
169
- clearTimeout(inputTimeout);
170
- inputTimeout = setTimeout(() => setCode(textareaCode.value), 500);
171
- }
172
-
173
- function loadFile(filename)
174
- {
175
- fetch('code/' + filename)
176
- .then(response => {
177
- if (!response.ok)
178
- throw new Error('Could not load file: '+filename);
179
- return response.text();
180
- })
181
- .then(text => setCode(textareaCode.value = text))
182
- .catch(error => setErrorMessage(error.message));
183
- }
184
-
185
- function setCode(code)
186
- {
187
- clearTimeout(inputTimeout);
188
- if (iframeExample)
189
- iframeContainer.removeChild(iframeExample);
190
-
191
- setErrorMessage('');
192
- iframeExample = document.createElement('iframe');
193
- iframeContainer.appendChild(iframeExample);
194
- iframeExample.onload = () =>
195
- {
196
- const iframeContent = iframeExample.contentWindow;
197
- const iframeDocument = iframeContent.document;
198
-
199
- // create error event listeners
200
- iframeContent.onerror = (message, source, lineno, colno, error) =>
201
- {
202
- let text = message;
203
- if (lineno)
204
- text += ` (Line:${lineno}, Column:${colno})`
205
- if (error && error.stack)
206
- text += `\n\n` + error.stack;
207
- setErrorMessage(text);
208
- }
209
- iframeContent.onunhandledrejection = (event) =>
210
- {
211
- let text = event.reason;
212
- if (event.reason.stack)
213
- text += `\n\n` + event.reason.stack;
214
- setErrorMessage(text);
215
- };
216
- const originalAssert = iframeContent.console.assert;
217
- iframeContent.console.assert = function (condition, output)
218
- {
219
- if (!condition)
220
- setErrorMessage('Assertion failed: ' + (output || ''));
221
- originalAssert.apply(this, arguments);
222
- };
223
-
224
- // create a script element that overrides the default functions
225
- const overrideScript = iframeDocument.createElement('script');
226
- iframeDocument.body.appendChild(overrideScript);
227
- overrideScript.text = code;
228
-
229
- if (textareaError.style.display == 'block')
230
- return; // stop if script error
231
-
232
- // start LittleJS engine
233
- iframeContent.engineInit(iframeContent.gameInit, iframeContent.gameUpdate, iframeContent.gameUpdatePost, iframeContent.gameRender, iframeContent.gameRenderPost, ['tiles.png?1']);
234
- }
235
- iframeExample.src = 'base.html';
236
- }
237
-
238
- function setErrorMessage(message)
239
- {
240
- textareaError.value = message
241
- textareaError.style.display = message ? 'block' : 'none';
242
- }
243
-
244
- </script>
245
- </body>
246
- </html>
/package/{shortExamples → examples/shorts}/tiles.png RENAMED
File without changes