от flash к html5. александр бацуев. зал 4
DESCRIPTION
TRANSCRIPT
![Page 1: от Flash к html5. александр бацуев. зал 4](https://reader033.vdocuments.pub/reader033/viewer/2022061206/548256195806b5ed048b4671/html5/thumbnails/1.jpg)
Flash -> html5
Александр Бацуев.AnyChart.Com
![Page 2: от Flash к html5. александр бацуев. зал 4](https://reader033.vdocuments.pub/reader033/viewer/2022061206/548256195806b5ed048b4671/html5/thumbnails/2.jpg)
AnyChart
http://anychart.com
![Page 3: от Flash к html5. александр бацуев. зал 4](https://reader033.vdocuments.pub/reader033/viewer/2022061206/548256195806b5ed048b4671/html5/thumbnails/3.jpg)
AnyChart
![Page 4: от Flash к html5. александр бацуев. зал 4](https://reader033.vdocuments.pub/reader033/viewer/2022061206/548256195806b5ed048b4671/html5/thumbnails/4.jpg)
EcmaScript5 SVG Canvas
Firefox 4 mobile
iOS Safari
Android
Opera Mini
Windows Phone
![Page 5: от Flash к html5. александр бацуев. зал 4](https://reader033.vdocuments.pub/reader033/viewer/2022061206/548256195806b5ed048b4671/html5/thumbnails/5.jpg)
EcmaScript5 SVG Canvas
Firefox 4 mobile + + +iOS Safari +/- + +
Android +/- - +Opera Mini - + +
Windows Phone - - -
![Page 6: от Flash к html5. александр бацуев. зал 4](https://reader033.vdocuments.pub/reader033/viewer/2022061206/548256195806b5ed048b4671/html5/thumbnails/6.jpg)
CanvasSVGVector Bitmap
![Page 7: от Flash к html5. александр бацуев. зал 4](https://reader033.vdocuments.pub/reader033/viewer/2022061206/548256195806b5ed048b4671/html5/thumbnails/7.jpg)
textField.height?
Antialiasing?
![Page 8: от Flash к html5. александр бацуев. зал 4](https://reader033.vdocuments.pub/reader033/viewer/2022061206/548256195806b5ed048b4671/html5/thumbnails/8.jpg)
Interactivity
DOM Single Element
Redraw all for changesDOM manipulations
Mouse events on any DOM element Mouse events on html element + Math
CanvasSVG
![Page 9: от Flash к html5. александр бацуев. зал 4](https://reader033.vdocuments.pub/reader033/viewer/2022061206/548256195806b5ed048b4671/html5/thumbnails/9.jpg)
<svg></svg>
![Page 10: от Flash к html5. александр бацуев. зал 4](https://reader033.vdocuments.pub/reader033/viewer/2022061206/548256195806b5ed048b4671/html5/thumbnails/10.jpg)
Flash
SpriteShape
Graphics
![Page 11: от Flash к html5. александр бацуев. зал 4](https://reader033.vdocuments.pub/reader033/viewer/2022061206/548256195806b5ed048b4671/html5/thumbnails/11.jpg)
SVG
<g></g><path /><rect />
![Page 12: от Flash к html5. александр бацуев. зал 4](https://reader033.vdocuments.pub/reader033/viewer/2022061206/548256195806b5ed048b4671/html5/thumbnails/12.jpg)
SVG
document.createElementNS();element.setAttribute();element.appendChild();
![Page 13: от Flash к html5. александр бацуев. зал 4](https://reader033.vdocuments.pub/reader033/viewer/2022061206/548256195806b5ed048b4671/html5/thumbnails/13.jpg)
Flash. Events
obj.addEventListener();
![Page 14: от Flash к html5. александр бацуев. зал 4](https://reader033.vdocuments.pub/reader033/viewer/2022061206/548256195806b5ed048b4671/html5/thumbnails/14.jpg)
SVG. Events
group.addEventListener('mouseover', mouseOverHandler);
![Page 15: от Flash к html5. александр бацуев. зал 4](https://reader033.vdocuments.pub/reader033/viewer/2022061206/548256195806b5ed048b4671/html5/thumbnails/15.jpg)
Redraw?
Clear + Redraw Update DOM
<svg></svg>
![Page 16: от Flash к html5. александр бацуев. зал 4](https://reader033.vdocuments.pub/reader033/viewer/2022061206/548256195806b5ed048b4671/html5/thumbnails/16.jpg)
JavaScript
AnyChart~800 классов~80 000 LOC
![Page 17: от Flash к html5. александр бацуев. зал 4](https://reader033.vdocuments.pub/reader033/viewer/2022061206/548256195806b5ed048b4671/html5/thumbnails/17.jpg)
JavaScript
public class ClassName extends ClassB implements ICustom1, ICustom2 {}
![Page 18: от Flash к html5. александр бацуев. зал 4](https://reader033.vdocuments.pub/reader033/viewer/2022061206/548256195806b5ed048b4671/html5/thumbnails/18.jpg)
Google Closure
Closure LibraryClosure LinterClosure Compiler
![Page 19: от Flash к html5. александр бацуев. зал 4](https://reader033.vdocuments.pub/reader033/viewer/2022061206/548256195806b5ed048b4671/html5/thumbnails/19.jpg)
Closure sample project
https://github.com/batsuev/closure-sample
![Page 20: от Flash к html5. александр бацуев. зал 4](https://reader033.vdocuments.pub/reader033/viewer/2022061206/548256195806b5ed048b4671/html5/thumbnails/20.jpg)
Problems?
![Page 21: от Flash к html5. александр бацуев. зал 4](https://reader033.vdocuments.pub/reader033/viewer/2022061206/548256195806b5ed048b4671/html5/thumbnails/21.jpg)
TESTTTES
Google Chrome + svg
![Page 22: от Flash к html5. александр бацуев. зал 4](https://reader033.vdocuments.pub/reader033/viewer/2022061206/548256195806b5ed048b4671/html5/thumbnails/22.jpg)
SVG + JavaScriptVS
Flash
![Page 23: от Flash к html5. александр бацуев. зал 4](https://reader033.vdocuments.pub/reader033/viewer/2022061206/548256195806b5ed048b4671/html5/thumbnails/23.jpg)
1. No binary data API.2. Can’t get screenshot from content.3. textField.editable4. textField.htmlText5. Printing?6. Fullscreen
![Page 24: от Flash к html5. александр бацуев. зал 4](https://reader033.vdocuments.pub/reader033/viewer/2022061206/548256195806b5ed048b4671/html5/thumbnails/24.jpg)
Simple testtest("a basic test example", function() { ok( true, "this test is fine" ); var value = "hello"; equals( "hello", value, "We expect value to be hello" );});
![Page 25: от Flash к html5. александр бацуев. зал 4](https://reader033.vdocuments.pub/reader033/viewer/2022061206/548256195806b5ed048b4671/html5/thumbnails/25.jpg)
CI?
PhantomJS