1/utilisation d'image svg

je vais utiliser image svg pour l image de fond et le traineau du pere noel et aussi peut etre pour le texte

http://msdn.microsoft.com/fr-fr/library/ie/gg589526%28v=vs.85%29.aspx

http://lipn.univ-paris13.fr/~cerin/maitrise/svg

http://jeremie.patonnier.net/post/2010/06/29/Introduction-a-SVG

http://www.gchagnon.fr/cours/xml/svg.html

http://svground.fr/paths.php

http://www.svgbasics.com/paths.html

http://ux.saggezza.com/articles/creating-a-svg-sprite/

http://www.w3schools.com/cssref/pr_class_display.asp

2/convertir traineau en svg ok fait

avec flash decompiler j extrait le sprite traineau

dans flash je fais disocier et degrouper les graphique puis copier

je colle dans illustrator et sauvegarder en svg

petit probleme rencontre lors conversion image ai en svg:dans l image ai il y avaient calques mode superposition dans svg ca n existe pas il faut donc rajouter un filtre svg sur le calque pour que le filtre apparaisse lors de la conversion

3/faire suivre au traineau une trajectoire ( dans mon cas une courbe sinusoidale) ok fait

http://stackoverflow.com/questions/13932704/how-to-draw-sine-waves-with-svg-js

https://developer.mozilla.org/en-US/docs/Web/SVG/SVG_animation_with_SMIL

4/connaitre position et angle traineau sur la trajectoire ( en ai besoin pour etincelle)

la  c'est dur

http://msdn.microsoft.com/fr-fr/library/ie/gg193979%28v=vs.85%29.aspx#example5

http://svground.fr/svgdom.php

https://developer.mozilla.org/en-US/docs/Web/SVG

how-to-manipulate-translate-transforms-on-a-svg-element-with-javascript-in-chrom

https://developer.mozilla.org/en-US/docs/Web/API/SVGTransform

http://www.w3.org/TR/SVG/animate.html#ValueAttributes

http://stackoverflow.com/questions/12784821/svg-getattribute-setattribute-simply-adding-to-coordinates-instead-of-setting

http://msdn.microsoft.com/en-us/library/ie/ff972117%28v=vs.85%29.aspx#properties

5/parenthese j ai trouve ca

http://dropthebit.com/592/pathanimator-moving-along-an-svg-path/

6/deplacement traineau:utilisation requestanimationframerate

http://creativejs.com/resources/requestanimationframe/

7/petit détour sur le dom ( display object manager) des navigateurs

http://www.phpied.com/rendering-repaint-reflowrelayout-restyle/

8/javascript prototype

http://blog.xebia.fr/2013/06/10/javascript-retour-aux-bases-constructeur-prototype-et-heritage/

9/je vais essayer mettre image svg dans script pour avoir seulement un script a inserer

http://code.google.com/p/x2js/

http://goessner.net/download/prj/jsonxml/

http://www.utilities-online.info/xmltojson/#.UotxMeImiwV

http://www.alsacreations.com/article/lire/1161-json-ajax-jquery-jsonp-getjson.html

http://stackoverflow.com/questions/9723422/is-there-some-innerhtml-replacement-in-svg-xml

 

10/pour verifier syntaxe et tester

http://www.w3schools.com/default.asp

http://www.w3schools.com/cssref/tryit.asp?filename=trycss3_transform-origin

http://jsfiddle.net/73g7t/395/

11/utilisation font svg

je peux realiser le texte avec canvas le default c est qu il faut incorporer la fonte ou alors utiliser une fonte commune

http://schepers.cc/svg-webfonts

https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/SVG_fonts

19/filtre

http://stackoverflow.com/questions/14307079/make-blend-modes-in-svg-actually-work

http://msdn.microsoft.com/fr-FR/library/jj206437.aspx

http://svground.fr/filtres.php

les filtres pour le blendmode  qu on trouve parfois dans image ai ne fonctionnent pas dans tous les navigateurs malheureusement

20/animation rapide dans navigateur

http://www.html5rocks.com/en/tutorials/speed/high-performance-animations/

21/inserer image svg dans canvas

http://getcontext.net/read/svg-images-on-a-html5-canvas

https://developer.mozilla.org/en-US/docs/HTML/Canvas/Drawing_DOM_objects_into_a_canvas

http://stackoverflow.com/questions/12673527/html5-canvas-use-image-as-mask