HTML5 canvas player.

You mean the one that we had in our previous discussion?
The problem was that you had linked files. I haven’t done anything about that yet.
I will try to implement it.

Edit : Just checked the our previous discussion. The problem must been from the linked files. The solution is to fit all the files in a single file. I will try to make a python plugin for this. Something like ‘merge all linked files’ I think it is easy to be created.

Yes!
That would be a great help not only regarding your html5-player but for using Synfig imports in general.
There are actually no way in Synfig to do independent imports from other files. They all becomes linked to the original. See this thread regarding this issue. An merge linked script could solve some of this issue.

Hi!
I don’t recall importing any files from another sif into the banner animation, but I did copy the character layer. You have one character layer with a repeated walkcycle using a time loop layer and one character layer without a time loop layer that falls into the pit. Maybe the character layer and its copy are linked giving the formentioned error.
Greetz!

Oh …that news who invalidate the supa sifplayer demo page … :wink: Mr sifplayer is dead welcome aboard and long life to Mr easelSif !

Sorry about that! But I think It’s better to have separated projects.
So if someone want’ s to experiment or to write a synfig renderer in plain html5 canvas drawing, sifPlayer can be a good starting point or reference.

The truth is that I don’t know how the file changes with imports. Thanks for the link.

Looks like that synfig takes care even the copy paste function.

Updated the mention on the official website - synfig.org/cms/en/download/tools/

I would like to mention that packing all linked files into (zip) container is planned as a feature of upcoming new file format of Synfig - Konstantin's weekly report #4

Why not make it a plugin for media goblin mediagoblin.org/

hi.

Zelgadis the problem is not the collection of the files but the extension. sif we need xml for some server restrictions.

John the real need is a super fast vector rendering engine so we can override the need of cache.

The new packed format is just a zip file. It will be possible to save it back to .sif (xml) and all contained resources will be saved into folder. In fact, it’s already works in current development version, but for images only. :slight_smile:

Although John’s style of writing is off-putting as usual, I have to agree that MediaGoblin plugin would be really nice. Media Goblin is not a cache. It’s a media-hosting platform. Like openclipart or blendswap. But they pretend to be universal system for various kind of mediaformat. The main problem is to offer preview for medias. IIRC, they already have preview for blender files and the similar plugin for .sif files would be a extremely cool. That could open possibility to launch a some kind of synfig clipart service.

Hi. Sorry for the delayed response.
I had a look at the GoblinMedia and I think that the plug in is possible. I have to find some free time to setup a working test.
I don’t really support the idea but I will try to make something out of it.

P.S. Also GTA5 is out and my hobbies turned to gaming, if you know what I mean…

Hi!
Wanted to make a banner using the html5 canvas player. I downloaded the latest EaselSif_Master but when I ran the easelsif.html or the easelsif_test.html files nothing happens. Can’t I view the test locally? The provided testfile can be opened in synfig and it’s not compressed.
Greetz!

edit: I had to reinstall Firefox. Now the testfile works. :smiley:

Hi.
You downloaded the new version that I uploaded a few days ago.
This new version fix some bugs of the old version but in general it moves to the 64.1 dev synfig.
There is support for the skeleton layer but only for linked group layers.

  • does not use cache so you will have hight cpu activity. I will make a new update for cache in the following days, if not a rought one today.
  • group layer’s skew_angle it’s not supported yet. (I have no idea how to add skew angle in a affine matrix. I have to do some reading cause I was unable to find a quick answer on that.) Keep this in mind cause If you link a group layer to a bone sometimes the base value uses the skew_angle. So you will have to get it to 0 by hand for the linked group to work as expected.
    -gradients are not supported yet.

Also don’t forget to use createjs’s CDN. (this will be good for your bandwidth)

en.wikipedia.org/wiki/Shear_mapping
-G

Hi!
I did not encounter any major problems yet with the new html5 player other than that group opacity does not seem to be supported. Also there does not seem to be any pastecanvas.js anymore in the src folder but I don’t know if that is still needed. Most of the ofline local tests I did in FF and chrome worked like a charm, but when I uploaded the files to a server to be viewed online, I got a blanc page and some javascript related errors. I did not change the code and the index file showed the right and proper sif file locally in FF, but online I always get a blanc page. The screenshot I took came from my pancake io test website but I get the same errors on other normal servers as well. I am not a javascript wizard so any ideas are welcome. :blush:
Greetz!

Hi!
I managed to solve the problem. :smiley: Problem was the xml document not loading because I named it .sif and not xml. Doh… :unamused: The other error was jus a warning and did not influence the outcome. Now it’s time to do some animated tests.
Greetz!

Hi.
I just uploaded the new version with cache. You will see huge increase in frame rate and a decrease of cpu usage.
Added the opacity of group layer too.

Darkspace is the warning you got this :

Use of getPreventDefault() is deprecated.  Use defaultPrevented instead.

Also PasteCanvas is removed there is no use of it anymore.
Import Image layer does not work too. I have to add this switch image layer too.

Community please test this program and report bugs and missing futures.
Synfig is a beast and lately it’s becoming an angry beast so adding all the futures will be a big task.

Hi!
The added opacity to the group layer is a big time saver! Good job on that.
The warning I got was this: “Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user’s experience.” but I don’t think it caused any problems.
Greetz!

edit: also the first little animation test I did on my pancake site that is hosted thru dropbox account was successful which is quite cool, cos that way I don’t have to upload anything.

Hi!
I did some tests using the latest version of the html5 sif player.
You can watch the results here: http://studiodiba.pancakeapps.com/
Here is what I found so far:
Feathering on the single image of the little dwarf did not work (I used it on the ground shadow and the shadow of the body) Shadow of the body was correct so the onto blend mode I used to place it works. Advanced outlines don’t work and the thickness of the normal outlines always stays the same. That can give problems in smaller images. The dwarf image is a rather complex file with lots of groups and subgroups but it was rendered correct, so that works too. Vertex animation I used on the waves works. Moving objects around like the sun works too. Opacity of singles objects works and group opacity works too (fade in of the dwarf image is group opacity). Interpolation is out of sync: the two clouds in the fourth and fifth banner don’t have the same interpolation but still they move at the same speed. I can make several canvases with single images and diferent animation next to or on top of each other so that is cool, although probably slows down the rest of the site. This demo site was hosted thru my dropbox so I don’t know if that has any influence on the speed.
Anyway, you can do cool stuff with the player: one thing that comes to my mind is an animated comic.
More tests will come if time is on my side.
Greetz!

Hi.
Feathering it’s a blur. No blur yet. (Easeljs may open this possibility but I haven’t tried it).
For the basic line you have to change the “Outline Width”.
Interpolations right now are only (linear, constant) . I haven’t found a equivalent of Clamped or TCB in tweenjs. So I have to find a way to create them.

I belive there must be no slow down from dropbox or pancakeapps.

Pancakeapps by the way looks interesting.

Right now I am working on loading the external files. So we will have linked sif objects.