Chrysto

Hi; If somebody is interested in creating text effects/animations with GSAP I wrote a little tip about it: http://blog.bassta.bg/2013/05/text-animation-with-tweenmax/ . I hope somebody will find it useful

Hi; I would suggest you using the jQuery promise() method; http://jquerypromises.com/reference/ jQuery.promises.image("your image url").then( function(img){ jQuery(img).appendTo($(yourelement)); TweenLite.to( $(yourelement), 1, {autoAlpha:1} ); }, function(){ //some fallback on image fail });

Hi; I think that animation of letter-spacing and text-shadow may come in handy; http://jsfiddle.net/bassta/69TNn/2/ Also, you can animate -webkit-text-stroke http://jsfiddle.net/bassta/dREHV/

Hi; I was creating iPhone like slider some time ago. Here is the source code: http://bassta.bg/experiments/ActiveSwipe.zip It is ready to use slider. The demo is self-explanary, also the code in com.bassta folder. If you need some help with it, just write me. Btw here is some code to achive the same effect: http://snipplr.com/view/64629/actionscript3-touch-event/ And this is demo http://blog.bassta.bg/wp-content/uploads/2013/05/SimpleDemo.swf it works great on iOS devices and can configure it with BlitMask. It is not exactly what you need, but I hope it can help you some way. blog.bassta.bg/wp-content/uploads/2013/05/SimpleDemo.swf

Did you tried $("body").append("<div id=\"scroull-isosfix\"></div>").css({height : "101%", overflow : "hidden"}); setTimeout(function() { $("#scroull-isosfix").remove(); }, 500); on the end of the scroll? Btw I'm writing a smooth-scroll plugin with TweenLite, autoSelect navigation, scroll to element, global and custom offset for each element... I can share the source code with wou if you like

Hi Guys, Just wrote a very basic script that uses TweenMax and ScrollTo plugin to animate window on scrolling with mouse wheel Demo: http://bassta.bg/demos/smooth-page-scroll/ Code: <script type="text/javascript"> /* Author : Chrysto Panayotov Date : 2/28/13 */ $(function(){ var $window = $(window); var isTweening = false; document.onmousewheel = function(){ customScroll(); } if(document.addEventListener){ document.addEventListener('DOMMouseScroll', customScroll, false); } function customScroll(event){ var delta = 0; if (!event){ event = window.event; } if (event.wheelDelta) { delta = event.wheelDelta/120; } else if(event.detail) { delta = -event.detail/3; } if (delta){ //console.log(isTweening); //if(!isTweening){ //isTweening = true; var scrollTop = $window.scrollTop(); var finScroll = scrollTop - parseInt(delta*100) * 3; //console.log(finScroll); TweenMax.to($window, 0.5, { scrollTo : { y: finScroll, autoKill:true }, ease: Power4.easeOut, autoKill: true, overwrite: 5, onComplete: function(){ //console.log(isTweening); //isTweening = false; } }); //} } if (event.preventDefault){ event.preventDefault(); } event.returnValue = false; } }); </script> This is just an concept, but it is helpfull for somebody tweenlitemousewheel.zip

HI; I need to make the following animation using JS GS v12 . I have a rectangular banner with sliding background and I want to make 1) two images fade in 2) the simsimultaneously slide up 3) background slide up 4) two pics slide simultaneously from down to up 5) background slide up 5) these two pics simultaneously slide up ...etc The problem is that the two pics I want to slide don't share same parent ( my HTML markup is like ) <div id="banner"> <!-- First slide --> <h1 id="bf_intro_text">First slide text</h1> <div id="bf_ball"></div> <!-- Second slide --> <h1 id="bf_message_text">Message</h1> <div id="bf_bookie_shirt"> <p>text1</p> </div> <div id="bf_betfair_shirt"> <p>text2</p> </div> <!-- Third slide --> <h1 id="bf_final_text">Final text</h1> <div id="bf_button"><p>Button</p></div> <div id="bf_logo"></div> </div> I made it till one time: var bannerAnim = new TimelineMax({repeat:anim_repeat, repeatDelay:3}); bannerAnim .from($introText, 0.7, {css:{autoAlpha:0}, delay:0.1}) .from($ball, 0.7, {css:{autoAlpha:0}, delay:0.2} ) .insert(new TweenMax.to($banner, 0.6, {css:{backgroundPosition : "0px -90px"}, delay:3}), 0) .insert(new TweenMax.to($introText, 0.8, {css:{marginTop : "-90px"}, delay:2}), 0) .insert(new TweenMax.to($ball, 0.8, {css:{marginTop : "-90px"}, delay:2}), 0) but I have problem appending the TimeLineMax do two tweens simultaneously. Can somebody help me how to simultaneously tween two objects in TimeLineMax? Thank in advance, Ico

Hi; How I load video with VideoLoader. I want some thing to happen on different cuepoints, how I ca get more information about the cuepoint that is accesed? private function loadVideo():void{ var vidLoader:VideoLoader = new VideoLoader("out_1.flv", {container:vc}); vidLoader.addEventListener( VideoLoader.VIDEO_CUE_POINT, function(event:Event):void{ trace("cuepoint"); }); vidLoader.load(); } The trace gives me output when the video loads the cuepoint, but I have no idea which is the cuepoint. I can't import fl.video package (every single bite is vital for this project) and I need to load over 100 videos , sharing all over different cuepoints. Any suggestions?

Hi; I added attachment. It have "load single" and "load multiple" behaviour. See how it works http://hotfile.com/dl/141758087/3496977 ... x.zip.html

P.S. There's some other code I use... Sometimes I need to load XML, than some assets from it. I know LoaderMax have this capability, but I have no control over the XML node nas, so I had to do my own class.. So here it is; The ide is to load xml, than execute function (what assets to add). it report 0-100 % progress and much more Use it like var a:SiteLoader = SiteLoader.getInstance(); a.addEventListener( ) //here listeners a.loadInitialXML('path to xm', function():void{ a.addInternalImageLoader( some URL from the a.xmlData --> the loaded XML ) }) Sorry that it is not documented, but this is VERY handly util for more advanced users.

Hi; Preloading every time was not an option, it was for project where the SWF Banner was loaded about 5,000 times per second and some of the content is cached. The behaviour was that I have to load 10 t-shirts, if one is missing, it loads default t-shirt. If I load this default t-shirt more than one time, it appears only on the last time I add it. It is the same with LoaderMax and with the default flash loader. The filesize of tha banner couldn't be more than 24k , so I solved this by this way: ( when load the XML: ) var assetsToLoad:Array = []; var cacheBuster:Number = 0; for each(var node:XML in model.getNodeList("r")){ if(String(node.@url) != ""){ if(assetsToLoad.indexOf(String(node.@url)) == -1){ assetsToLoad.push(String(node.@url)); } else { cacheBuster++; node.@url = node.@url + "?cb=" + cacheBuster; assetsToLoad.push(String(node.@url)); } } } I also created my own loader (due to the filesize of the great LoaderMax) package bassta { import flash.display.MovieClip; import flash.display.DisplayObject; import flash.display.Loader; import flash.display.LoaderInfo; import flash.events.EventDispatcher; import flash.events.Event; import flash.events.ProgressEvent; import flash.events.IOErrorEvent; import flash.net.URLRequest; import flash.utils.Dictionary; import flash.system.System; import bassta.model.Model; import bassta.model.ModelSettings; public class ChromeLoader extends EventDispatcher { //commit private static var _content:Array = []; private static var _contentNames:Dictionary = new Dictionary(true); private var _loadersCompleted:Number = 0; private var _loaders:Array = []; private var _loaderNames:Array = []; private var _maxTries:Number = 0; private var _site:String = ""; private var _backupUrl:String = ""; private var _finished:Boolean = false; public function ChromeLoader(site:String = null, backupURL:String = null):void { if(site){ _site = site } if(backupURL){ _backupUrl = backupURL } } public function loadContents(_items:Array):void{ for(var i:Number = 0; i< _items.length; i++){ _loaderNames.push( _items[i] ); } loadContent(_loaderNames[_loadersCompleted]); } public function getLoader(_contentID:Number):Loader{ if(_loaders[_contentID]){ return _loaders[_contentID]; } else { trace("[ChromeLoader] loader by this ID not found!"); return null; } } public function getMovieClip(_clipID:Number):MovieClip{ if(_loaders[_clipID]){ return _loaders[_clipID].content as MovieClip } else { trace("[ChromeLoader] MovieClip by this ID not found!"); return null; } } public function clear():void{ try{ _content.splice(0, _content.length); for(var i:Number = 0; i< _loaderNames.length; i++){ delete( _contentNames[_loaderNames[i]] ) } for each(var loader:Loader in _loaders){ loader.contentLoaderInfo.removeEventListener(Event.COMPLETE, onComplete); loader.contentLoaderInfo.removeEventListener(IOErrorEvent.IO_ERROR, onError); loader.contentLoaderInfo.removeEventListener(IOErrorEvent.NETWORK_ERROR, onError); if (loader.parent) { loader.parent.removeChild(loader); } if (loader.hasOwnProperty("unloadAndStop")) { //fp10 loader.unloadAndStop(true); } else { loader.unload(); } loader = null; } System.gc(); } catch(error:Error){ trace("[ChromeLoader error on destroy: ] " + error.message); } } private function loadContent(_cleanUrl:String):void{ _maxTries = 0; var contentLoader:Loader = new Loader(); contentLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, onComplete, false, 0, true); contentLoader.contentLoaderInfo.addEventListener(IOErrorEvent.IO_ERROR, onError, false, 0, true); contentLoader.contentLoaderInfo.addEventListener(IOErrorEvent.NETWORK_ERROR, onError, false, 0, true); contentLoader.load( new URLRequest( _site + _cleanUrl )); trace("loading: " + String(_loadersCompleted+1) + " out of " + _loaderNames.length + " | " + _site + _cleanUrl); } private function onComplete(event:Event):void { _loaders.push(event.target.content.parent as Loader); _content.push( event.target.content.parent ); _contentNames[string(_loaderNames[_loadersCompleted])] = event.target.content.parent as Loader; _loadersCompleted++; if(_loadersCompleted < _loaderNames.length){ loadContent(_loaderNames[_loadersCompleted]); } else { _finished = true; dispatchEvent(new Event(Event.COMPLETE)); } } private function onError(event:Event):void{ //trace("Alternative teee URL: " + ModelSettings.ALTERNATIVE_TEE_URL); _maxTries++; if(_maxTries < 3){ var contentLoader:Loader = new Loader(); contentLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, onComplete, false, 0, true); contentLoader.contentLoaderInfo.addEventListener(IOErrorEvent.IO_ERROR, onError, false, 0, true); contentLoader.contentLoaderInfo.addEventListener(IOErrorEvent.NETWORK_ERROR, onError, false, 0, true); contentLoader.load( new URLRequest(ModelSettings.SITE_URL + ModelSettings.ALTERNATIVE_TEE_URL + "?cb=" + Math.ceil(Math.random()*100) )); trace("[ERROR] on loading " + _loaderNames[_loadersCompleted] + " .Loading backup file: " + ModelSettings.SITE_URL + ModelSettings.ALTERNATIVE_TEE_URL + "?cb=" + Math.ceil(Math.random()*100)); } else { trace("[ChromeLoader] on Error error - max tries reached! Load never completed!"); } (event.target as LoaderInfo).removeEventListener(Event.COMPLETE, onComplete); (event.target as LoaderInfo).removeEventListener(IOErrorEvent.IO_ERROR, onError); (event.target as LoaderInfo).removeEventListener(IOErrorEvent.NETWORK_ERROR, onError); } public static function getContent(_contentID:Number):DisplayObject{ if(_content[_contentID]){ return _content[_contentID]; } else { trace("[ChromeLoader] Content with this ID( " + _contentID + " )not found!"); return null; } } public static function getContentByName(_contentName:String):DisplayObject{ if(_contentNames[_contentName]){ return _contentNames[_contentName]; } else { trace("[ChromeLoader] Content with this NAME( " + _contentName + " )not found!"); return null; } } public function get finished():Boolean{ return _finished; } }//end } Feel free to use anyway you like. P.S. --> try to load one image 3 times (w/without LoaderMax) and add it to 3 empty different sprites, see what's gonna happen

hi; I did a project where I need to load SWF files of tees and display them. The problem is if you load an asset multiple (for example 3 times) it will occure only to the last (third in our case) when you add it. The solution is very simple - just add cachebuster ( load " assets/main.swf?cb= ' + some random num ' ). This way the flash thinks it load a new object and creates in the memory new pointer for the swf. This works only on web servers

Hi; I'm loading an app with LoaderMax. I got different fonts in different languages in different SWF's. For example font_en.swf, font_it.swf, font_de.swf How I register this fonts one they're loaded? And how to get applicationDomain out of a SWFLoader?

Hi Carl; I can't control the SWF's I'm loadig (due to some backward compibility) and this is a problem. I tried all methods of copying MovieClips, none of all (even the Senocular's one) works for this. I understand why this is happening (the C pointers in memory reference only to one object). The event-flow is that I load XML, than from each node I load SWF file, than load the SWFs. I tried to make unique loaded for each SWF, but this isn't working either. The SWF files contains vectorized Item and I guess may be the best way is drawing it into new BitmapData, than unload the original SWF...

var tempClass1:Class = ((LoaderMax.getLoader(tee1XML.@url) as SWFLoader).rawContent as Object).constructor; var tee1:MovieClip = new tempClass1() as MovieClip; this is not working... Btw the loaded MovieClips are AS2 and AS3 (not only in AS3)

Hi; I load MovieClip with LoaderMax and the add it somewhere on the stage. The problem is that if I add second item, the first dissaper. How can I duplicate the loaded movieClip, so it appears anywhere on my screen multiple times?

I'm doing this purely with code,actually with: this.gridFitType = GridFitType.SUBPIXEL; this.antiAliasType = AntiAliasType.NORMAL; things started to look better, but they're still away from good

Hi; I'm trying to tween a textfield width and height. For this purpose I create empty Sprite, add the TextField to it, than tween the sprite itself. It is working, except the fact that the tween itself doesn't run very smoothly. here is demo: http://burnandbass.com/text_anim.swf . I tried to set cacheAsBitmap to true to the textfield and the sprite, to the sprite only, to the TextField only... no improvement. I even tried to create BitmapData snapshot of the text, the tween doesn't looked very good. Do you have some ideas?

Hi; I'm building an infinite image scroller and I'm using BlitMask to scroll the images. On the start the animation is smooth, but after 2-3 cycles of the slider the animation starts to tween jerky. I test it on both mac/pc and this problem seems to occure. Here is some demo http://burnandbass.com/basstaslider/ . For blitting I used this settings: var imagemask:BlitMask = new BlitMask(tempBitmap,tempBitmap.x,tempBitmap.y,tempBitmap.width,_height,false,true,0x000000,true); And then tween the tempBitmap's y property with the default easing ( no easing passed ). On the beginning it is smooth, but after 1 or 2 cycles it start's to be not so smooth. Some ideas?

Hi; I am using Mac OSX 10.5 and Adobe Flash CS5 I have to build a resizable horizontal slider with a lot of images. The idea is to have a slider that makes all images proportionaly resized and the height is stage.stageHeight-200, so every time the stage is resized, the slider resizes. I done it with normal mask and it occupied a lot of memory and CPU, so I decied to speed the things a little with BlitMask. The problem is, every time I try to use it instead of regular mask my Flash crashes. Any ideas?

http://magigeorgieva.com/#/en/

http://lorathemovie.com/ --> small website for bulgarian movie, bulgarian language only

This is one-class util, avaliable http://burnandbass.com/debug/#intro , on the page you can see demos, howto and more This util have several purposes - when is created on the stage is added stats bar, showing the current memory in use and the frames per second. The bar always stays on the top of display list, so it is always visible. The other (very useful in my opinion) function creates bubble with text and adds it to the stage, fade it out after a couple of second. If you use it instead of trace() you can get output in browser. Drop me line if this helped you Demos: http://burnandbass.com/debug/demo-basic/ http://burnandbass.com/debug/demo-log-error/ http://burnandbass.com/debug/demo-addbutton/ P.S. the log() have really helped me a lot of times when I need to see output from the SWF, but the swf is runnning in browser. I know it is possible to view the (trace) with FireFox plugin, but i prefer this class P.S. forry for the grammar mistakes, I promise to fix them as soon as possible, and also to release my other utils

Check out this snippet: Check this: http://snipplr.com/view/51576/loadermax ... a-seekbar/

Hi, I use one class, called content manager. Let me show it to you: This is the class that handles all the transitions, here is the app class: package { import flash.display.*; import flash.events.*; import Content_Manager2; // Import Content_Manager2 public class Add_Page2 extends MovieClip { private var my_cm:Content_Manager2; // Declare a variable to hold an instance of Content_Manager2 public function Add_Page2() { // Define some objects that will be used with Tweener to animate things var close_tween = { y:440, time: 1, transition:"easeoutelastic" }; // This will set how objects move off the stage var open_tween = { y:40, time:1, transition:"easeoutelastic" }; // This will set how objects move onto the stage var start_values = { x:100, y:-400 }; // This object sets the intial starting properties of an object when it is added to the stage // Create a new instance of Content_Manager2. The first parameter sets the host clip. This is the clip that // will clips that are added to the stage through Content_Manager2 my_cm = new Content_Manager2( open_tween, close_tween, start_values ); addChild( my_cm ); // Add an instance to the stage b_0.addEventListener( MouseEvent.CLICK, b_0_click ); b_1.addEventListener( MouseEvent.CLICK, b_1_click ); b_2.addEventListener( MouseEvent.CLICK, b_2_click ); x_mc.addEventListener(MouseEvent.CLICK, xClick); } private function b_0_click( evt:Event ):void { my_cm.add_content( OrangeBox ); // Add a linked symbol from the library } private function xClick(evt:Event):void{ my_cm.add_content(text2); } private function b_1_click( evt:Event ):void { my_cm.add_content( RedBox ); } private function b_2_click( evt:Event ):void { my_cm.add_content( GreenBox ); } } } just use my_cm.add_content() and then pass as parameter new DisplayObject class ! here is my modfication of this class: package bassta.extentions { import flash.display.DisplayObject; import bassta.display.BSprite; import com.greensock.TweenLite; import bassta.utils.Hash; import bassta.utils.Colors; import bassta.utils.ArrayTools; public class ContentManager extends BSprite{ public var current_content:DisplayObject; private var old_content:Array; private var openTween:Hash; private var closeTween:Hash; private var startingValues:Hash; public function ContentManager(starting_values:Object, open_tween:Object, close_tween:Object) { old_content = new Array(); openTween = Colors.convertColors(new Hash({time:0.5}).merge(open_tween)); closeTween = Colors.convertColors(new Hash({time:0.5}).merge(close_tween)); closeTween.onComplete = remove_content; startingValues = Colors.convertColors(new Hash( starting_values )); } public function addContent(_newContent:DisplayObject):DisplayObject{ if ( current_content != null ) { TweenLite.killDelayedCallsTo(current_content); TweenLite.killTweensOf(current_content); TweenLite.to(current_content, closeTween.time, closeTween.withoutKeys("time")); old_content.push( current_content ); } current_content = _newContent; addChild( current_content ); TweenLite.to(current_content, 0, startingValues.withoutKeys("time")); TweenLite.to(current_content, openTween.time, openTween.withoutKeys("time")); return current_content; } /* Removes the content, if it have public function 'destroy' it is called - can displose BitmapData, remove Listenrs, etc */ private function remove_content():void { if ("destroy" in old_content[0] && old_content[0]["destroy"] is Function){ old_content[0].destroy(); } removeChild( old_content[0] ); old_content[0] = null; old_content.splice( 0, 1 ); } public function destroy():void{ TweenLite.killTweensOf(this); TweenLite.killDelayedCallsTo(this); if(!ArrayTools.is_empty(old_content)){ remove_content(); ArrayTools.clear(old_content); } if(current_content){ TweenLite.killTweensOf(current_content); this.removeChild(current_content); current_content = null; } } }//end } And to Snorkl ---> I'm developing small util , similar to GrantSkinner's MemoryGauge, but have some other usefull functions - Grawl like notification (you can get output , like trace() in browser) here is demo : http://burnandbass.com/stats-bab/ check this, click on the text or on the circle, are you interested?