Skip to content

Commit

Permalink
Animatic
Browse files Browse the repository at this point in the history
  • Loading branch information
lvivski committed Nov 10, 2015
1 parent 20b5fd9 commit 3062a7b
Show file tree
Hide file tree
Showing 33 changed files with 79 additions and 73 deletions.
8 changes: 4 additions & 4 deletions CHANGELOG.md
@@ -1,20 +1,20 @@
### [0.4.0](http://github.com/lvivski/anima/tree/0.4.0) / 2015-04-13 [Diff](https://github.com/lvivski/anima/compare/0.3.0...0.4.0)
### [0.4.0](http://github.com/lvivski/animatic/tree/0.4.0) / 2015-04-13 [Diff](https://github.com/lvivski/animatic/compare/0.3.0...0.4.0)
- physics timeline
- edge bounce
- fix CSS runner
- better Editor
- initial editor bookmarklet
- over 60 bugfixes

### [0.3.0](http://github.com/lvivski/anima/tree/0.3.0) / 2013-05-15 [Diff](https://github.com/lvivski/anima/compare/0.2.0...0.3.0)
### [0.3.0](http://github.com/lvivski/animatic/tree/0.3.0) / 2013-05-15 [Diff](https://github.com/lvivski/animatic/compare/0.2.0...0.3.0)
- animations with physics
- new animations runner with parallel sequences
- ability to generate CSS without applying it
— initial editor implementation
- "use strict"
- over 70 bugfixes

### [0.2.0](http://github.com/lvivski/anima/tree/0.2.0) / 2013-03-07 [Diff](https://github.com/lvivski/anima/compare/0.1.0...0.2.0)
### [0.2.0](http://github.com/lvivski/animatic/tree/0.2.0) / 2013-03-07 [Diff](https://github.com/lvivski/animatic/compare/0.1.0...0.2.0)
- Timeline
- MS Internet Explorer 10 support
- `Item.center()` and `Item.lookAt(vector)`
Expand All @@ -26,5 +26,5 @@
- infinite animations
- over 50 bugfixes

### [0.1.0](http://github.com/lvivski/anima/tree/0.1.0) / 2013-02-09
### [0.1.0](http://github.com/lvivski/animatic/tree/0.1.0) / 2013-02-09
- initial public release
10 changes: 5 additions & 5 deletions Makefile
Expand Up @@ -23,10 +23,10 @@ FILES = \
src/physics/particle.js \

all: \
anima.js \
anima.min.js
animatic.js \
animatic.min.js

anima.js: ${FILES}
animatic.js: ${FILES}
@rm -f $@
@echo "(function(root){" > $@.tmp
@echo "'use strict'" >> $@.tmp
Expand All @@ -36,7 +36,7 @@ anima.js: ${FILES}
@rm $@.tmp
@chmod a-w $@

anima.min.js: anima.js
animatic.min.js: animatic.js
@rm -f $@
@$(JS_COMPILER) $< -c -m -o $@ \
--source-map $@.map \
Expand All @@ -47,4 +47,4 @@ deps:
npm install

clean:
rm -f anima*.js*
rm -f animatic*.js*
2 changes: 0 additions & 2 deletions anima.min.js

This file was deleted.

1 change: 0 additions & 1 deletion anima.min.js.map

This file was deleted.

15 changes: 9 additions & 6 deletions anima.js → animatic.js
Expand Up @@ -12,7 +12,7 @@
} else if (typeof define === "function" && define.amd) {
define(a);
} else {
root.anima = root.a = a;
root.animatic = root.a = a;
}
var requestAnimationFrame = root.requestAnimationFrame, cancelAnimationFrame = root.cancelAnimationFrame, vendors = [ "moz", "webkit", "ms" ];
for (var i = 0; i < vendors.length && !requestAnimationFrame; i++) {
Expand All @@ -31,11 +31,14 @@
var i = 1;
while (i < arguments.length) {
var source = arguments[i++];
for (var property in source) if (source.hasOwnProperty(property)) {
for (var property in source) {
if (Array.isArray(source[property])) {
obj[property] = source[property].map(function(value, index) {
return value || obj[property][index];
});
for (var j = 0; j < source[property].length; ++j) {
var value = source[property][j];
if (value) {
obj[property][j] = value;
}
}
} else {
obj[property] = source[property];
}
Expand Down Expand Up @@ -1057,7 +1060,7 @@
Item.prototype.set = function(type, value) {
if (Array.isArray(value)) {
this.state[type] || (this.state[type] = []);
for (var i in value) {
for (var i = 0; i < value.length; ++i) {
if (value[i] !== undefined) {
this.state[type][i] = value[i];
}
Expand Down
2 changes: 2 additions & 0 deletions animatic.min.js

Large diffs are not rendered by default.

1 change: 1 addition & 0 deletions animatic.min.js.map

Large diffs are not rendered by default.

6 changes: 3 additions & 3 deletions bower.json
@@ -1,6 +1,6 @@
{
"name": "anima",
"version": "0.4.0",
"main": "anima.js",
"name": "animatic",
"version": "1.0.0",
"main": "animatic.js",
"dependencies": {}
}
8 changes: 4 additions & 4 deletions editor/bookmarklet.js
@@ -1,7 +1,7 @@
(function (node, editor) {
node = document.createElement('link')
node.setAttribute('rel', 'stylesheet')
node.href = 'https://rawgithub.com/lvivski/anima/master/editor/css/editor.css'
node.href = 'https://rawgithub.com/lvivski/animatic/master/editor/css/editor.css'
document.head.appendChild(node)

node = document.createElement('script')
Expand All @@ -10,12 +10,12 @@
editor.onload = function () {
var selector = prompt('Anima Items Selector')
if (selector) {
anima.editor(selector)
animatic.editor(selector)
}
}
editor.src = 'https://rawgithub.com/lvivski/anima/master/editor/js/editor.js'
editor.src = 'https://rawgithub.com/lvivski/animatic/master/editor/js/editor.js'
document.head.appendChild(editor)
}
node.src = 'https://rawgithub.com/lvivski/anima/master/anima.js'
node.src = 'https://rawgithub.com/lvivski/animatic/master/animatic.js'
document.head.appendChild(node)
}())
2 changes: 1 addition & 1 deletion editor/index.html
Expand Up @@ -14,7 +14,7 @@
<div style="position:absolute;margin-left:-50px;margin-top:-50px;background:rgb(6,156,21);width:100px;height:100px"></div>
<div style="position:absolute;margin-left:-50px;margin-top:50px;background:rgb(16,54,160);width:100px;height:100px"></div>
</div>
<script src="../anima.js"></script>
<script src="../animatic.js"></script>
<script src="js/editor.js"></script>
<script>
anima.editor('.viewport > div')
Expand Down
4 changes: 2 additions & 2 deletions editor/js/editor.js
Expand Up @@ -309,8 +309,8 @@ UI.Editor.prototype.stringify = function (item) {
this.popup.show(item.css(true).keyframes('animation'))
}

anima.editor = function (nodes) {
var timeline = anima.timeline()
animatic.editor = function (nodes) {
var timeline = animatic.timeline()
$(nodes).forEach(function (node) {
if (node instanceof Element && node.tagName !== 'SCRIPT' && node.tagName !== 'STYLE')
timeline.add(node)
Expand Down
4 changes: 2 additions & 2 deletions example/bounce.html
Expand Up @@ -11,9 +11,9 @@
<body>
<div class="ball" style="left: 100px"></div>
</body>
<script src="../anima.js"></script>
<script src="../animatic.js"></script>
<script>
var world = anima.world(),
var world = animatic.world(),
item = world.add(document.querySelector('.ball'))

item
Expand Down
4 changes: 2 additions & 2 deletions example/bounce_css.html
Expand Up @@ -11,9 +11,9 @@
<body>
<div class="ball" style="left: 100px"></div>
</body>
<script src="../anima.js"></script>
<script src="../animatic.js"></script>
<script>
var world = anima.world(),
var world = animatic.world(),
item = world.add(document.querySelector('.ball'))

item
Expand Down
4 changes: 2 additions & 2 deletions example/cards.html
Expand Up @@ -95,9 +95,9 @@
</head>
<body>
</body>
<script src="../anima.js"></script>
<script src="../animatic.js"></script>
<script>
var world = anima.world(),
var world = animatic.world(),
suits = 'spades hearts diamonds clubs'.split(' ')
values = '2 3 4 5 6 7 8 9 10 J Q K A'.split(' ')

Expand Down
4 changes: 2 additions & 2 deletions example/css_animation.html
Expand Up @@ -34,9 +34,9 @@
}
</style>
</body>
<script src="../anima.js"></script>
<script src="../animatic.js"></script>
<script>
var world = anima.world(),
var world = animatic.world(),
item = world.add(document.querySelector('.ball'))

item.animate({
Expand Down
4 changes: 2 additions & 2 deletions example/custom.html
Expand Up @@ -12,9 +12,9 @@
<body>
<div class="block" style="border: 2px solid;background-clip: content-box;color:green">SOME TEXT</div>
</body>
<script src="../anima.js"></script>
<script src="../animatic.js"></script>
<script>
var world = anima.world(),
var world = animatic.world(),
item = world.add(document.querySelector('.block'))

item.
Expand Down
4 changes: 2 additions & 2 deletions example/delay.html
Expand Up @@ -11,9 +11,9 @@
<body>
<div class="block" style="opacity: .5"></div>
</body>
<script src="../anima.js"></script>
<script src="../animatic.js"></script>
<script>
var world = anima.world(),
var world = animatic.world(),
item = world.add(document.querySelector('.block'))

item
Expand Down
4 changes: 2 additions & 2 deletions example/delay_css.html
Expand Up @@ -11,9 +11,9 @@
<body>
<div class="block" style="opacity: .5"></div>
</body>
<script src="../anima.js"></script>
<script src="../animatic.js"></script>
<script>
var world = anima.world(),
var world = animatic.world(),
item = world.add(document.querySelector('.block'))

item
Expand Down
4 changes: 2 additions & 2 deletions example/infinite.html
Expand Up @@ -11,9 +11,9 @@
<body>
<div class="ball" style="left: 100px"></div>
</body>
<script src="../anima.js"></script>
<script src="../animatic.js"></script>
<script>
var world = anima.world(),
var world = animatic.world(),
item = world.add(document.querySelector('.ball'))

item
Expand Down
4 changes: 2 additions & 2 deletions example/infinite_css.html
Expand Up @@ -11,9 +11,9 @@
<body>
<div class="ball" style="left: 100px"></div>
</body>
<script src="../anima.js"></script>
<script src="../animatic.js"></script>
<script>
var world = anima.world(),
var world = animatic.world(),
item = world.add(document.querySelector('.ball'))

item
Expand Down
4 changes: 2 additions & 2 deletions example/keyboard.html
Expand Up @@ -24,9 +24,9 @@
</div>
</div>
</body>
<script src="../anima.js"></script>
<script src="../animatic.js"></script>
<script>
var world = anima.world(),
var world = animatic.world(),
container = world.add(document.querySelector('.world')),
keys = {
UP: 38,
Expand Down
4 changes: 2 additions & 2 deletions example/keyboard_mixed.html
Expand Up @@ -24,9 +24,9 @@
</div>
</div>
</body>
<script src="../anima.js"></script>
<script src="../animatic.js"></script>
<script>
var world = anima.world(),
var world = animatic.world(),
container = world.add(document.querySelector('.world')),
keys = {
UP: 38,
Expand Down
4 changes: 2 additions & 2 deletions example/parallel.html
Expand Up @@ -11,9 +11,9 @@
<body>
<div class="ball" style="-webkit-transform-origin: 0% 100%;-moz-transform-origin: 0% 100%;transform-origin: 0% 100%;"></div>
</body>
<script src="../anima.js"></script>
<script src="../animatic.js"></script>
<script>
var world = anima.world(),
var world = animatic.world(),
item = world.add(document.querySelector('.ball'))

item
Expand Down
4 changes: 2 additions & 2 deletions example/parallel_css.html
Expand Up @@ -11,9 +11,9 @@
<body>
<div class="ball"></div>
</body>
<script src="../anima.js"></script>
<script src="../animatic.js"></script>
<script>
var world = anima.world(),
var world = animatic.world(),
item = world.add(document.querySelector('.ball'))

item
Expand Down
4 changes: 2 additions & 2 deletions example/parallel_physics.html
Expand Up @@ -16,9 +16,9 @@
</style>
<div class="ball" style="-webkit-transform-origin: 0% 100%;-moz-transform-origin: 0% 100%;transform-origin: 0% 100%;"></div>
</body>
<script src="../anima.js"></script>
<script src="../animatic.js"></script>
<script>
var world = anima.world(),
var world = animatic.world(),
item = world.add(document.querySelector('.ball'), {
mass: 1,
viscosity: 0.1
Expand Down
4 changes: 2 additions & 2 deletions example/parallel_sequence.html
Expand Up @@ -11,9 +11,9 @@
<body>
<div class="ball"></div>
</body>
<script src="../anima.js"></script>
<script src="../animatic.js"></script>
<script>
var world = anima.world(),
var world = animatic.world(),
item = world.add(document.querySelector('.ball'))

item
Expand Down
4 changes: 2 additions & 2 deletions example/physics.html
Expand Up @@ -13,10 +13,10 @@
<div class="ball ball2" style="left: 100px;top: 250px"></div>
<div class="ball ball3" style="left: 100px;top: 475px"></div>
</body>
<script src="../anima.js"></script>
<script src="../animatic.js"></script>
<script>
setTimeout(function(){
var world = anima.world(),
var world = animatic.world(),
item1 = world.add(document.querySelector('.ball1'))
item2 = world.add(document.querySelector('.ball2'), {
mass: 1,
Expand Down
4 changes: 2 additions & 2 deletions example/timeline.html
Expand Up @@ -20,9 +20,9 @@
</div>
</div>
</body>
<script src="../anima.js"></script>
<script src="../animatic.js"></script>
<script>
var timeline = anima.timeline(),
var timeline = animatic.timeline(),
item = timeline.add(document.querySelector('.ball'))

item
Expand Down
File renamed without changes.
8 changes: 4 additions & 4 deletions package.json
@@ -1,8 +1,8 @@
{
"name": "anima",
"version": "0.4.0",
"name": "animatic",
"version": "1.0.0",
"description": "CSS/JS Animations Library with Physics support",
"main": "anima.js",
"main": "animatic.js",
"keywords": [
"animation",
"animations",
Expand All @@ -14,7 +14,7 @@
],
"repository": {
"type": "git",
"url": "https://github.com/lvivski/anima.git"
"url": "https://github.com/lvivski/animatic.git"
},
"devDependencies": {
"uglify-js": "^2.4.19"
Expand Down
4 changes: 2 additions & 2 deletions src/core.js
@@ -1,5 +1,5 @@
/**
* Anima
* Animatic
* @type {Object}
*/
var a = {}
Expand All @@ -25,5 +25,5 @@ if (typeof module === 'object' && typeof module.exports === 'object') {
} else if (typeof define === 'function' && define.amd) {
define(a)
} else {
root.anima = root.a = a
root.animatic = root.a = a
}

0 comments on commit 3062a7b

Please sign in to comment.