PageSourceSearch

https://iappsbeats.com/animations/index.html

html iappsbeats.com collected 2026-10-02 00:50:33 UTC 26,287 bytes, 512 lines download raw bytes

1<!DOCTYPE html>
2<html lang="en">
3<head>
4    <meta charset="UTF-8">
5    <title>iAppsBeats Animation Editor</title>
6    <link rel="shortcut icon" href="favicon.ico"/>
7    
7<script src="memorystorage.min.js"></script>
7
8    
8<script src="pace.min.js"></script>
8
9    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/pace/1.0.2/themes/black/pace-theme-flash.min.css" />
10    <link href="https://fonts.googleapis.com/css?family=Raleway:100,300,400,600" rel="stylesheet" />
11    <link type="text/css" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" />
12    <link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css" rel="stylesheet" />
13    <link id="new_css" type="text/css" href="css/style.css" rel="stylesheet" />
14</head>
15<body oncontextmenu="return false;" style="display:none;">
16    <div id="app">
17        <div id="mainArea"></div>
18        <div id="info"></div>
19        <div id="leftBar">
20
21            <a href="javascript:app.panels.leftBar.openMenu();void(0);" class="tit"> Av </a>
22
23            <a href="javascript:$('#libraryPanel').show();void(0);" class="myLibrary"> <i class="fa fa-paperclip" aria-hidden="true"></i> My Library </a>
24
25            <a href="javascript:$('.submenu_myTemplates,.submenu_myTemplates_shadow').toggle();void(0);" class="myTemplates"> <i class="fa fa-cogs" aria-hidden="true"></i></a>
26
27            <a href="javascript:app.panels.leftBar.aboutus();void(0);" class="myInfo"> <i class="fa fa-info-circle" aria-hidden="true"></i></a>
28
29            <div class="submenu_myTemplates_shadow"></div>
30            <div class="submenu_myTemplates">
31                <ul>
32                    <li>
33                        Theme color: <br/>
34                        <a href="#" class="__color1"></a>
35                        <a href="#" class="__color2"></a>
36                        <a href="#" class="__color3"></a>
37                    </li>
38                </ul>
39                <br/>
40                <ul style="list-style: none; padding: 0; margin: 0;">
41                    <li>
42                        Settings: <br/>
43                        <div style="display: inline-flex; align-items: center; justify-content: center;">
44                            <input type="checkbox" style="margin-right: 8px;">
45                            <label>Autosave interval</label>
46                        </div>
47                    </li>
48                </ul>                            
49            </div>
50
51            <a id="pan" href="javascript:app.panels.leftBar.leftbarButtons.pan();void(0);" class="active">
52                <i class="fa fa-hand-paper-o" aria-hidden="true"></i>
53                <comment>pan</comment>
54            </a>
55            <a id="move1" href="javascript:app.panels.leftBar.leftbarButtons.move(1);void(0);">
56                <i class="fa fa-arrows" aria-hidden="true"></i>
57                <comment>sprite</comment>
58            </a>
59            <a id="move2" href="javascript:app.panels.leftBar.leftbarButtons.move(2);void(0);">
60                <i class="fa fa-arrows" aria-hidden="true"></i>
61                <comment>frame</comment>
62            </a>
63            <a id="move3" href="javascript:app.panels.leftBar.leftbarButtons.move(3);void(0);">
64                <i class="fa fa-arrows" aria-hidden="true"></i>
65                <comment>timeline</comment>
66            </a>
67            <a id="zoom" href="javascript:app.panels.leftBar.leftbarButtons.zoom();void(0);">
68                <i class="fa fa-search" aria-hidden="true"></i>
69                <comment>100%</comment>
70            </a>
71            <input class="zoomInput" type="number" min="1" max="2000" title="Set zoom %" placeholder="%" onchange="app.panels.mainArea.setZoom(this.value);" />
72            <a id="grid" href="javascript:app.panels.leftBar.leftbarButtons.grid();void(0);">
73                <i class="fa fa-th" aria-hidden="true"></i>
74                <comment>Grid</comment>
75            </a>
76            <!--
77            <a id="test" href="javascript:app.panels.leftBar.leftbarButtons.test();void(0);">
78                <i class="fa fa-gamepad" aria-hidden="true"></i>
79                <comment>Test</comment>
80            </a>
81            -->
82            <div id="coord">
83                <span class="x">0</span> <br/>
84                <span class="y">0</span>
85            </div>
86
87
88            <div class="startPanel">
89
90                <div class="currentFileOptions">
91
92                    <div class="topLine"> <i class="fa fa-tags" aria-hidden="true"></i> Current opened file: <u>Filename</u> </div>
93                    <a href="javascript:app.run.saveCurrentFile();void(0);">
94                        <span>
95                            <i class="fa fa-floppy-o" aria-hidden="true"></i>
96                        </span>
97                        <i> Save file </i>
98                    </a>
99                    <a href="javascript:void(0);">
100                        <span>
101                            <i class="fa fa-play-circle-o" aria-hidden="true"></i>
102                        </span>
103                        <i> Export .bani </i>
104                    </a>
105                    <!--
106                    <a href="javascript:void(0);">
107                        <span>
108                            <i class="fa fa-play-circle-o" aria-hidden="true"></i>
109                        </span>
110                        <i> Export .bani minified </i>
111                    </a>
112                    -->
113                    <a href="javascript:app.run.exportAnimatedGif();void(0);" class="exportGifButton">
114                        <span>
115                            <i class="fa fa-file-video-o" aria-hidden="true"></i>
116                        </span>
117                        <i> Export Animated gif </i>
118                    </a>
119                    <a href="javascript:app.run.duplicateCurrentFile();void(0);">
120                        <span>
121                            <i class="fa fa-files-o" aria-hidden="true"></i>
122                        </span>
123                        <i> Duplicate file </i>
124                    </a>
125                    <a href="javascript:app.run.openJsonEditor();void(0);">
126                        <span>
127                            <i class="fa fa-code" aria-hidden="true"></i>
128                        </span>
129                        <i> Edit JSON </i>
130                    </a>
131                    <a href="javascript:app.run.validateAnimation();void(0);">
132                        <span>
133                            <i class="fa fa-check-square-o" aria-hidden="true"></i>
134                        </span>
135                        <i> Validate animation </i>
136                    </a>
137                </div>
138
139                <div class="titu" style="margin-top:30px;"> <i class="fa fa-tags" aria-hidden="true"></i> New animation</div>
140                <div class="itens">
141                    <a href="javascript:app.run.newAnimation();void(0);">
142                        <u>
143                            <i class="fa fa-plus-square-o" aria-hidden="true"></i>
144                        </u>
145                        <span>
146                            <i> New empty animation </i>
147                            <s> Current date </s>
148                        </span>
149                    </a>
150                    <a href="javascript:app.run.loadFromFile(['.bani']);void(0);">
151                        <u>
152                            <i class="fa fa-cloud-upload" aria-hidden="true"></i>
153                        </u>
154                        <span>
155                            <i> Load *.bani file </i><s> Current date </s>
156                        </span>
157                    </a>
158                </div>
159
160                <div class="titu"> <i class="fa fa-tags" aria-hidden="true"></i>
160 Last opened <a href="javascript:app.run.clearAllRecentFiles();void(0);" style="font-family: sans-serif;" class="opt">clear all</a> </div>
161                <div class="searchBar">
162                    <input type="type" onkeyup="app.panels.leftBar.searchLibraryFiles(this.value,'last');" placeholder="Search term..." />
163                    <i class="fa fa-search" aria-hidden="true"></i>
164                </div>
165                <div class="itens lastOpened"></div>
166
167                <div class="titu onlin">
168                    <!-- tabs -->
169                </div>
170
171                <div class="searchBar">
172                    <input type="type" onkeyup="app.panels.leftBar.searchLibraryFiles(this.value,'online');" placeholder="Search term..." />
173                    <i class="fa fa-search" aria-hidden="true"></i>
174                </div>
175                <div class="itens onlineItens"></div>
176
177            </div>
178        </div>
179
180        <div id="rightBar">
181            <div class="tabs">
182                <a href="javascript:$('#rightBar .active').removeClass('active');$('#rightBar .tabs a:eq(0)').addClass('active');$('#rightBar .content').hide();$('#rightBar .content:first').show();void(0);" class="active">
183                    <i class="fa fa-puzzle-piece" aria-hidden="true"></i>
184                </a>
185                <a href="javascript:$('#rightBar .active').removeClass('active');$('#rightBar .tabs a:eq(1)').addClass('active');$('#rightBar .content').hide();$('#rightBar .content:eq(1)').show();void(0);">
186                    <i class="fa fa-sort" aria-hidden="true"></i>
187                </a>
188                <a href="javascript:$('#rightBar .active').removeClass('active');$('#rightBar .tabs a:eq(2)').addClass('active');$('#rightBar .content').hide();$('#rightBar .content:eq(2)').show();void(0);">
189                    <i class="fa fa-history" aria-hidden="true"></i>
190                </a>
191
192                <a href="javascript:$('#rightBar .active').removeClass('active');$('#rightBar .tabs a:eq(3)').addClass('active');$('#rightBar .content').hide();$('#rightBar .content:eq(3)').show();void(0);">
193                    <i class="fa fa-volume-up" aria-hidden="true"></i>
194                </a>
195
196
197                <a href="javascript:app.run.toggleFullScreen();void(0);" class="fullscreenButton">
198                    <i class="fa fa-expand" aria-hidden="true"></i>
199                </a>
200            </div>
201            <div class="content"></div>
202            <div class="content order" style="display:none;"></div>
203            <div class="content history" style="display:none;"></div>
204            <div class="content sounds" style="display:none;">
205                <div class="tit"> Current frame </div>
206                <div class="list"></div>
207                <div class="tit"> Available </div>
208                <div class="list"></div>
209            </div>
210        </div>
211
212        <div id="rightBar2">
213            <div class="line">
214                <a href="javascript:app.panels.rightBar.config();" class="_bt1">
215                    <i class="fa fa-cogs" aria-hidden="true"></i>
216                </a>
217                <a href="javascript:app.panels.rightBar.default();void(0);" class="_bt2" style="right:110px;">default</a>
218                <a href="javascript:app.panels.rightBar.newSprite();void(0);" class="_bt2">+ new sprite</a>
219            </div>
220            <div class="content">
221
222            </div>
223        </div>
224
225        <div class="RightDragbar"></div>
226
227        <div id="timeLine">
228            <div class="dragbar"></div>
229            <div class="time">
230                <div class="directionsTabs"></div>
231                <div class="ruler">
232                    <div class="title">
233                        <a href="javascript:app.panels.timelineBar.changePlaySpeed();void(0);" class="play_speed">1x</a>
234                        <a href="javascript:void(0);" class="play_pause">
235                            <i class="fa fa-play" aria-hidden="true"></i>
236                        </a>
237                        <div class="showFramesPlaying"></div>
238                        <i class="fa fa-eye" aria-hidden="true"></i>
239                        <a href="javascript:app.panels.timelineBar.changeGhostMode();void(0);" class="ghost">
240                            <i class="fa fa-snapchat-ghost" aria-hidden="true"></i>
241                        </a>
242                    </div>
243                    <div class="frames">
244                    </div>
245                    <div class="controlMaxFramesList">
246                        <a href="javascript:;void(0);">
247                            <i class="fa fa-minus-circle" aria-hidden="true"></i>
248                        </a>
249                        <a href="javascript:;void(0);">
250                            <i class="fa fa-plus-circle" aria-hidden="true"></i>
251                        </a>
252                    </div>
253                </div>
254            </div>
255            <div class="layers"></div>
256            <div class="playingTimeLine">
257            </div>
258
259            <div class="spriteInterations">
260                <a href="javascript:app.panels.timelineBar.selectedFrameTabChange(1);void(0);" class="tabSel tab1 tabActive">
261                    <i class="fa fa-stop" aria-hidden="true"></i>
262                </a>
263                <a href="javascript:app.panels.timelineBar.selectedFrameTabChange(2);void(0);" class="tabSel tab2">
264                    <i class="fa fa-ellipsis-v" aria-hidden="true"></i>
265                </a>
266                <a href="javascript:app.panels.timelineBar.selectedFrameTabChange(3);void(0);" class="tabSel tab3">
267                    <i class="fa fa-ellipsis-h" aria-hidden="true"></i>
268                </a>
269                <a href="javascript:app.panels.timelineBar.selectedFrameTabChange(5);void(0);" class="tabSel tab5">
270                    <i class="fa fa-th" aria-hidden="true"></i>
271                </a>
272                <a href="javascript:app.panels.timelineBar.selectedFrameTabChange(4);void(0);" class="tabSel close">
273                    <i class="fa fa-times-circle" aria-hidden="true"></i>
274                </a>
275                <span class="warn"> <i class="fa fa-exclamation-triangle" aria-hidden="true"></i> you are viewing other frame </span>
276
277                <div class="tab tabContent1">
278                    <div class="tit"> Cell selected </div>
279                    <div class="but">
280                        <a href="javascript:app.panels.timelineBar.interact.cell.duplicateLastContent();void(0);">Duplicate last</a>
281                        <a href="javascript:app.panels.timelineBar.interact.cell.duplicateNextContent();void(0);">Duplicate next</a>
282                        <a href="javascript:app.panels.timelineBar.interact.cell.createTweenHere();void(0);">Create Tween</a>
283                        <a href="javascript:app.panels.timelineBar.interact.cell.DeleteContent();void(0);">Del</a>
284                        <a href="javascript:app.panels.timelineBar.interact.cell.InsertSpriteInCenter();void(0);">Insert in center</a>
285                        <a href="javascript:app.panels.timelineBar.interact.cell.flipH();void(0);">FlipH</a>
286                        <a href="javascript:app.panels.timelineBar.interact.cell.flipV();void(0);">FlipV</a>
287                        <a href="javascript:app.panels.timelineBar.interact.cell.copy();void(0);">Copy</a>
288                        <a href="javascript:app.panels.timelineBar.interact.cell.paste();void(0);">Paste</a>
289                    </div>
290                </div>
291                <div class="tab tabContent2">
292                    <div class="tit"> Column selected </div>
293                    <div class="but">
294                        <a href="javascript:app.panels.timelineBar.interact.column.setTime();void(0);">50ms</a>
295                        <a href="javascript:app.panels.timelineBar.interact.column.blankBefore();void(0);">Blank before</a>
296                        <a href="javascript:app.panels.timelineBar.interact.column.blankAfter();void(0);">Blank after</a>
297                        <a href="javascript:app.panels.timelineBar.interact.column.duplicateBefore();void(0);">Duplicate before</a>
298                        <a href="javascript:app.panels.timelineBar.interact.column.duplicateAfter();void(0);">Duplicate after</a>
299                        <a href="javascript:app.panels.timelineBar.interact.column.removeColumn();void(0);">Remove column</a>
300                        <a href="javascript:app.panels.timelineBar.interact.column.copy();void(0);">Copy</a>
301                        <a href="javascript:app.panels.timelineBar.interact.column.paste();void(0);">Paste</a>
302                    </div>
303                </div>
304                <div class="tab tabContent3">
305                    <div class="tit"> Row selected </div>
306                    <div class="but">
307                        <a href="javascript:app.panels.timelineBar.interact.row.createTweenHere();void(0);">Create Tween here</a>
308                        <a href="javascript:app.panels.timelineBar.interact.row.duplicateLineContent();void(0);">
308Duplicate line content</a>
309                        <a href="javascript:app.panels.timelineBar.interact.row.removeCurrentLine();void(0);">Remove current line</a>
310                    </div>
311                </div>
312                <div class="tab tabContent5">
313                    <div class="tit"> Whole direction (up, left, bottom or right) selected </div>
314                    <div class="but">
315                        <a href="javascript:app.panels.timelineBar.interact.direction.flipH();void(0);">FlipH</a>
316                        <a href="javascript:app.panels.timelineBar.interact.direction.flipV();void(0);">FlipV</a>
317
318                    </div>
319                </div>
320            </div>
321        </div>
322    </div>
323
324    <div class="models" style="display:none;">
325
326        <div id="prototypeSelectItemFromMenu">
327            <a href="javascript:void(0);">
328                <u>
329                    <i class="fa" aria-hidden="true"></i>
330                </u>
331                <span>
332                    <i></i>
333                    <s> Current date </s>
334                </span>
335            </a>
336        </div>
337
338        <div id="prototypeOrderList">
339            <div class="line">
340                <span></span>
341                <p></p>
342                <div>
343                    <a href="javascript:void(0);">
344                        <i class="fa fa-arrow-circle-o-up" aria-hidden="true"></i>
345                    </a>
346                    <a href="javascript:void(0);">
347                        <i class="fa fa-arrow-circle-o-down" aria-hidden="true"></i>
348                    </a>
349                </div>
350            </div>
351        </div>
352
353        <div id="prototypeSoundListed">
354            <div class="line">
355                <span>
356                    <a href="#">
357                        <i class="fa fa-play" aria-hidden="true"></i>
358                    </a>
359                </span>
360                <p></p>
361                <div>
362                    <a href="javascript:void(0);">
363                        <i class="fa fa-plus-circle" aria-hidden="true"></i>
364                    </a>
365                </div>
366            </div>
367        </div>
368
369        <div id="prototypeLibraryImage">
370            <span class="s">
371                <span class="i"></span>
372                <span class="l"></span>
373                <a href="javascript:void(0);">
374                    <i class="fa fa-trash-o" aria-hidden="true"></i>
375                </a>
376            </span>
377        </div>
378
379    </div>
380
381    <div id="libraryPanel">
382        <a href="javascript:$('#libraryPanel').hide(); if($('.switchServerBtn').length>0) $('.switchServerBtn').trigger('click'); void(0);" class="close"> close </a>
383        <div class="content">
384
385            <div class="tit"> <i class="fa fa-paperclip" aria-hidden="true"></i> Your image library </div>
386            You can drag and drop images files here from your computer to create your library. <br/>
387            When loading animation files it will first check this library.
388            if the image doesn't exists here, it will load the image from Avalonia server. <br/><br/>
389            <div class="drag">
390                <div id="drop_zone">Drop files here</div>
391            </div>
392
393            <div id="list">
394            </div>
395        </div>
396    </div>
397
398
399    <a href="javascript: app.panels.mainArea.centerView();void(0);" class="centerView"> center view </a>
400    <div class="frameWithSound"></div>
401
402    <!-- JSON Editor Panel -->
403    <div id="jsonEditorPanel" style="display: none;">
404        <div class="jsonEditorHeader">
405            <h3>JSON Editor</h3>
406            <div class="jsonEditorControls">
407                <button onclick="app.run.formatJsonEditor()" title="Format JSON (Ctrl+Shift+F)">
408                    <i class="fa fa-code"></i> Format
409                </button>
410                <button onclick="app.run.resetJsonEditor()" title="Reset to original">
411                    <i class="fa fa-refresh"></i> Reset
412                </button>
413                <button onclick="app.run.applyJsonChanges()" title="Ap
413ply changes (Ctrl+Enter)">
414                    <i class="fa fa-check"></i> Apply
415                </button>
416                <button onclick="app.run.closeJsonEditor()" title="Close editor (Esc)">
417                    <i class="fa fa-times"></i> Close
418                </button>
419            </div>
420        </div>
421        <div class="jsonEditorContent">
422            <textarea id="jsonEditorTextarea" placeholder="JSON content will appear here..."></textarea>
423        </div>
424        <div id="jsonEditorStatus" class="jsonEditorStatus"></div>
425        <div class="jsonEditorFooter">
426            <div class="jsonEditorShortcuts">
427                <small>
428                    <strong>Shortcuts:</strong> 
429                    Esc = Close | Ctrl+Enter = Apply | Ctrl+Shift+F = Format
430                </small>
431            </div>
432        </div>
433    </div>
434    
435    <div id="spriteContextMenu" style="display: none;">
436        <div class="contextMenuHeader">
437            <span id="contextMenuTitle">Sprite Actions</span>
438            <button data-action="closeSpriteContextMenu" class="contextMenuClose">×</button>
439        </div>
440        <div class="contextMenuContent compact">
441            <div class="contextMenuGroup compact">
442                <div class="contextMenuGroupTitle" onclick="$(this).next().toggle(); $(this).find('.toggle-icon').toggleClass('fa-chevron-down fa-chevron-up');">
443                    <i class="fa fa-cog"></i> Settings <i class="fa fa-chevron-down toggle-icon"></i>
444                </div>
445                <div class="contextMenuSettings" style="display: none;">
446                    <div class="rotationSettings">
447                        <label for="rotationStep">Step:</label>
448                        <select id="rotationStep" class="rotationStepSelect compact">
449                            <option value="15">15°</option>
450                            <option value="30">30°</option>
451                            <option value="45">45°</option>
452                            <option value="90" selected>90°</option>
453                            <option value="180">180°</option>
454                        </select>
455                    </div>
456                </div>
457            </div>
458            
459            <div class="contextMenuGroup iconGrid">
460                <!-- Rotation -->
461                <button data-action="rotateSpriteLeftContext" title="Rotate Counter-Clockwise" class="iconBtn">
462                    <i class="fa fa-rotate-left"></i>
463                </button>
464                <button data-action="rotateSpriteResetContext" data-degrees="0" title="Reset Rotation" class="iconBtn">
465                    <i class="fa fa-undo"></i>
466                </button>
467                <button data-action="rotateSpriteRightContext" title="Rotate Clockwise" class="iconBtn">
468                    <i class="fa fa-rotate-right"></i>
469                </button>
470                
471                <!-- Transform -->
472                <button data-action="flipSpriteHorizontal" title="Flip Horizontally" class="iconBtn">
473                    <i class="fa fa-arrows-h"></i>
474                </button>
475                <button data-action="flipSpriteVertical" title="Flip Vertically" class="iconBtn">
476                    <i class="fa fa-arrows-v"></i>
477                </button>
478                
479                <!-- Scale -->
480                <button data-action="scaleSpriteUpContext" title="Scale Up" class="iconBtn">
481                    <i class="fa fa-search-plus"></i>
482                </button>
483                <button data-action="scaleSpriteDownContext" title="Scale Down" class="iconBtn">
484                    <i class="fa fa-search-minus"></i>
485                </button>
486                <button data-action="resetSpriteScale" title="Reset Scale" class="iconBtn">
487                    <i class="fa fa-refresh"></i>
488                </button>
489                
490                <!-- Actions -->
491                <button data-action="duplicateSprite" title="Duplicate Sprite" class="iconBtn">
492                    <i class="fa fa-copy"></i>
493                </button>
494                <button data-action="deleteSprite" title="Delete Sprite" class="iconBtn danger">
495                    <i class="fa fa-trash"></i>
496                </button>
497            </div>
498            
499            <div class="customRotationPanel" id="customRotationPanel" style="display: block;">
500                <input type="number" id="customRotationInput" placeholder="Custom degrees" min="1" max="360" step="1" />
501                <button id="applyCustomRotation" class="contextMenuSmall">Apply</button>
502            </div>
503        </div>
504    </div>
505    
506    <!-- Prettier 2.8.8 vendored locally (was loaded from the unpkg CDN). Must load before
507         require.js so it registers the global `prettier`/`prettierPlugins` instead of as AMD. -->
508    
508<script src="prettier-standalone.js"></script>
508
509    
509<script src="prettier-parser-babel.js"></script>
509
510    
510<script data-main="main" src="require.js"></script>
510
511</body>
512</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.