Jump to content
Search Community

Lasercode last won the day on November 21 2012

Lasercode had the most liked content!

Lasercode

Members

  • Posts

    46

  • Joined

  • Last visited

  • Days Won

    1

 Content Type 

Everything posted by Lasercode

1
2
Page 2 of 2  
  1. Lasercode
    Nope. Doesnt work.
  2. Lasercode
    Hey Jamie, damn...thanks for your answer. I'll mark this 'solved' even if it isnt really Cheers.
  3. Lasercode
    Hi, I read some topics where people WANT the smoothing applied by modern browsers, if you rotate or zoom images for instance. That is NOT what I search for. In my example there are three spans with border. Two of them are being rotated and get new top/left positions, and even if their final rotation is 90 degrees, they become smoothed. How can i DISABLE this somehow? I was really searching a long time, and all I assume is that this is browser rendering dependent, but maybe I can get a hint here. Btw: When I reverse that animation back from picture 2 to picture 1, they are crisp again. Thanks!
  4. Lasercode
    function twoEases( time, tweenObject, easingIn, easingOut ){ TweenMax.to( $('element'), time/2, {rotation: tweenObject/2, ease:easingIn, onComplete:function(){ TweenMax.to( $('element'), time/2, {rotation: tweenObject, ease:easingOut }); } }); } twoEases ( 2, 90, Cubic.easeIn, Elastic.easeOut); I had the same issue and this worked for me.
  5. Lasercode
    Hi again, I tried it out, I even got close, but I cant quite find the right way. (JS is mostly for string conversion). I tried "quadratic", as this seemed to be the right one for the export values from drawscript, but with "soft" I came closest. Any help? <DOCTYPE html> <html> <head> <script src="http://cdnjs.cloudflare.com/ajax/libs/gsap/latest/TweenMax.min.js"></script> <script src="pathAni.js"></script> <!--<script src="bezierStringProcessor.js"></script>--> </head> <body style="margin:0px"> <svg version="1.1" id="Ebene_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="841.89px" height="595.28px" viewBox="0 0 841.89 595.28" enable-background="new 0 0 841.89 595.28" xml:space="preserve"> <path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M10,10c30.968,30.323,59.354,120,121.29,73.548 s105.807-20,117.419,18.064s124.516-5.162,151.613-8.387s147.743,49.033,70.323,103.226S216.451,330,197.742,261.613 c-18.709-68.387,1.936-114.838-69.677-84.516S80.323,392.023,23.548,288.109"/> </svg> <div id="main" style="float:left; position:relative; width:20px; height:20px; background-color:red;"></div> </body> </html> var e; var animate; var bezierString = "bezierCurveTo(60,30,89,120,151,73);bezierCurveTo(213,27,257,53,268,91);bezierCurveTo(280,129,393,86,420,83);bezierCurveTo(447,80,568,132,490,186);bezierCurveTo(413,240,236,320,217,251);bezierCurveTo(199,183,219,136,148,167);bezierCurveTo(76,197,100,382,43,278);"; var mainSubstring = bezierString.split("bezierCurveTo"); var pointAmount = mainSubstring.length-1; var valueSubstring = []; var valueSetArray = []; var finalTweenMaxObject = []; for(var i = 0; i < mainSubstring.length; i++){ valueSubstring[i] = ( mainSubstring[i].split( "(" ))[1]; }; for(var j = 1; j < valueSubstring.length; j++){ valueSetArray[j-1] = valueSubstring[j].substring( 0, valueSubstring[j].indexOf( ")" )); }; for(var k = 0; k < pointAmount; k++){ finalTweenMaxObject.push({ x: parseInt( valueSetArray[k].split(",")[0] ), y: parseInt( valueSetArray[k].split(",")[1] ) }); finalTweenMaxObject.push({ x: parseInt( valueSetArray[k].split(",")[2] ), y: parseInt( valueSetArray[k].split(",")[3] ) }); finalTweenMaxObject.push({ x: parseInt( valueSetArray[k].split(",")[4] ), y: parseInt( valueSetArray[k].split(",")[5] ) }); }; //console.log(finalTweenMaxObject); window.onload = function(){ TweenMax.ticker.fps(60); e = document.getElementById("main"); window.animate = function(){ TweenMax.to(window.e, 10, {bezier:{type:"soft", values:finalTweenMaxObject, autoRotate:true}, repeat:-1, ease:Power1.easeInOut}); }; window.animate(); };
  6. Lasercode
    Hi, is there any way to animate along SVG paths already? If not, can you recommend any tool that helps me get the bezier data from SVG, illustrator (or other) paths, so I can use them with GSAP? Thanks in advance
  7. Lasercode
    Well, I seem to be at the point of no further possible progression. My feeling still survives after the brainmelting holidays, but I think the problem lies too deep in memory processing and bitshifting/copying the pixels. So whatever, my knowledge isnt sufficient at this point of time, which you probably agree with But to achieve any progression at all, I used your blitmask and afterwards set the mask property of it to a circle shape. In my first example I used a 3000x3000px png and had a wonderful performance, BUT my PC is equipped quite well, so I'll check it on a lame machine soon. ...I still believe.
  8. Lasercode
    I really got problems understanding the last part of the first post...maybe you look for yoyo?
  9. Lasercode
    Okay, but that doesn't mean "slow" already, does it? If an irregular shape can be used for a lot faster masking operation than the flash internal masking does, there still was achieved a little optimization. I will try something out today. I want to play a bit with the shape masking of a blitmasked MovieClip/Bitmap. As we discussed before, this could already be a lot faster than only using flash's masking. Even if this is not exactly what I initially wanted, I need to move on with my game and this could be very helpful already. But I will stick to this over the holidays.
  10. Lasercode
    Okay. Cool. You use 3 parameters in the copyPixels() function: _bd.copyPixels(bd, _sliceRect, _destPoint); I really only glanced through some info quickly, but the optional fourth param "alphaBitmapData" seems to be very interesting. Can you eliminate my thought, or could that be a progress? I need to sleep, it's 2 am. I'll post you some conclusions tomorrow, hopefully. Good night.
  11. Lasercode
    Yeah...maybe I got my head above the parapet. But all this new stuff (I'm also on arduino combined with flash atm) really keeps me awake at night and I am so damn interested, that I feel like a child on coke that just met God. I'll keep my energy back a little from now on. No one needs posts without solutions. That makes this forum so good. Btw: I think you post really good questions, as I read some of them before. Keep it up. I learn much from it.
  12. Lasercode
    Hello dude. Your first explanation is right. But I am not sure, if you should use GSAP for just putting an Object to another place. A zero time tween is quite...short So if this is a real world example I would probably just set the values like slideShow.start.y = slideShow.second.x; But yes. All in all your are right.
  13. Lasercode
    Hi again, I see. TweenMax.to(playerStone, 1, {x: [stone.x + fieldWidth] }); or TweenMax.to(playerStone, 1, {x: ["+=" + fieldWidth] }); The first line would say: - move "playerStone" to where "stone"s X var is plus fieldWidth The second line says: - move "playerStone" to where it already is (X) and then add fieldWidth. Nevertheless, I think you wanted "stone.x" to be "playerStone.x" and then it'd probably be the same. Maybe it's a tiny bit faster writing "+=" because you dont need to call the var itself. The "+=" operator does that for you. On the other hand, maybe it takes some time to break up the ["+=" + XYZ] string and calculate/return the final values, instead of doing it directly. But actually I dont think that there are much more differences, so it would not be that different in performing. Hmm... I'd appreciate to get some greensock explanation now, too. I start feeling a bit unsecure while thinking about your (good) question. Well...did I get your question at all?
  14. Lasercode
    Hey, I was moving too fast without proper knowledge (esp. about matrices). I'm now getting closer to your point. My brain formed another question, though. I need to know, if I get the way you are doing things here. Let's take blitmask without the updating option for this example. Creating the BitmapData would only be needed once, correct? You then cache the pixel data and give the possibility to move/scale it by using the matrix transformation rules/data, still correct? If I am right until here, what if you just "die-cut" the former final BitmapData with a circular algorithm once, too? Right after. Then you cache THAT object, and leave everything else as is. Would that be a good approach for a well performing way? EDIT: Maybe one could create another reference BitmapObject with pixels shaping a circle in it and only 2 kinds of pixels. Like I said before, some transparent, some not. (Or black/white, or whatever is fastest to query). Then one could create a temporary array of all rows of pixels, check out in a loop which ones are interesting, and then plot the new BitmapData object. That change in my idea is only important, if the cicular algorithm takes longer than this operation. The most important thing to keep up performace is to kill the repetition of this process in every frame, right? My feeling that this could work somehow still doesnt die. Gimme hope, Joanna.
  15. Lasercode

    Can I understand all this ****? :)

  16. Lasercode
    Hi Jeremy, I just DID use it. And I did before. Let's say for example you got a game, where you move a stone with the 4 arrow keys. You want the stone to move in a grid kind of area. Every field is X pixels from another. Now you could go and use hardcoded values, because you KNOW the pixel size of each field. But we want to keep things dyncamic for further use or easy design corrections later, so we use the relative movement. We could then say: TweenMax.to(playerStone, 1, {x: ["+=" + fieldWidth] }); // square brackets for creating a String, don't know if necessary. instead of TweenMax.to(playerStone, 1, {x:"+= 20"}); and then we never need to touch it again. Did that clear things up?
  17. Lasercode
    Yes. I understand you. But my feeling told me that there is a way to just require the circular matrix calculation once. Like I said, I am not that deep into your classes or even as3, as I am more of a designer. I just think of creating kind of an object that gets "prepared" to only get the necessary data. Like an array, that doesnt have the possibility to receive data to certain indices, not because they were blocked, rather because they just dont exist, and thus dont need to be checked in every frame. I checked out arduino and processing lately and maybe thats why I think that way. You got a setup and then a loop where stuff is being executed. Even IF I get the point that bitmapData needs to be drawn every frame, I nevertheless dont understand why my thought is maybe wrong. Thats why I will try to look deeper into BitmapData when I got time. I am no TOTAL noob, so... Its just a feeling that it must work somehow.
  18. Lasercode
    Hello ... again. I read about the blitmask now, and it is (mostly) clear to me, that and why it's a rectangular sprite. Now...I am pretty sure, that it is possible to create a Bitmap Data object, that is built a little bit differently. I am not good enough to do it in AS though, and so I just like to discuss my idea with you guys. So, my theory is that the bitmap data object is a bit like a matrix filled with pixeldata. If there was a circular algorithm built in, one could - row after row - check out the needed pixels (opaque), and the ones we dont need (transparent) and thus build a circular blitmask. The same would then even work with elliptical shapes - divisionwise...on one of the x or y axis. Yeah...you know what I mean, eh? Well..yeah. That's it for now. Are you on that already? Is there some error in my idea? Is it already achievable with some of your great stuff? Is it silly implementing what AS3 can do (well...you do that all the time dont you? ) Let me know..I'm pretty darn curious. Peace! EDIT: I rethought and...is it a good thing to mask the blit-masked MC with a cirular shape. It doesnt seem that clean actually, hmm.....but the "normal" mask only masks a single and shrunk Bitmap then, and it could be performant. But I still think, that this is a rather dirty workaround, right?
  19. Lasercode
    Completely understood. The onstart Event was the main hint that I just didnt think about. Thanks! Just wanted to say, that this is probably the best quality forum I ve seen in a looong while. Plus GSAP just rules. Thank you - again!
  20. Lasercode
    Hey folks, maybe it's that I am blind, or just an idiot, but how can I get the moment when the last element of the (staggerTo) array starts tweening? I tried getTweensOf and all kinds of workarounds, but I failed My example: TweenMax.staggerTo(stepArray, tweenSpeed, {alpha:1, scaleX:1.5, scaleY:1.5, dropShadowFilter:{blurX:15, blurY:15, distance:5, alpha:0.33}, ease:Cubic.easeInOut, onComplete:tweenScaleDown, onCompleteParams:["{self}"]}, stepStaggerAmount); Sorry if that's a dumb question, but I tried stuff for hours now and cant get it. TIA, Lasercode
  21. Lasercode
    Hi! Simply because I didnt find it in the list: https://www.greensock.com/as/docs/tween/com/greensock/TweenMax.html But as I searched the term, I found it in the object params. THANK YOU
  22. Lasercode
    Hi folks, I am not really new to this, but I get a hard time trying to do the following: I got an array of MCs named "stepArray". I want to animate through it after a dice function which gives me a number between 1 and 6 (if 5, the stepArray will have 5 elements and so on). Whatever, I need to know when the last element of the array has finished tweening, because that is the time the dice can be used again and is set free. If you need more input, please reply. function animatePlayerMove ():void { tweenScaleUp(); } function tweenScaleUp():void { TweenMax.allTo(stepArray, tweenSpeed, {alpha:1, scaleX:1.5, scaleY:1.5, dropShadowFilter:{blurX:15, blurY:15, distance:5, alpha:0.33}, ease:Cubic.easeInOut, onComplete:tweenScaleDown}, stepStaggerAmount); } function tweenScaleDown():void { tma = TweenMax.allTo(stepArray, 0.2, {alpha:1, scaleX:1, scaleY:1, dropShadowFilter:{blurX:5, blurY:5, distance:5, alpha:0.33}, ease:Cubic.easeInOut}, stepStaggerAmount); addEventListener(Event.ENTER_FRAME, checkStepAnimationprogress); } function checkStepAnimationprogress (e:Event):void { if(tma[tma.length-1].currentProgress == 1){ //This doesnt work properly even with totalProgress trace("STEP ANIMATION ENDS HERE"); removeEventListener(Event.ENTER_FRAME, checkStepAnimationprogress); activateDice(); } } Obviously there is some mistake in my logics and I hope someone here will help. TIA, Lasercode
1
2
Page 2 of 2  
×
×
  • Create New...