Jump to content

Search In
  • More options...
Find results that contain...
Find results in...

retropunk last won the day on April 16 2015

retropunk had the most liked content!


  • Content Count

  • Joined

  • Last visited

  • Days Won


Everything posted by retropunk

  1. Hey guys, happy to find this thread. WebStorm rocks...Sublime is still my buddy too Live Templates are great but I want MORE! I created this test templates and its a fine start. I can tab through and then use the up/down arrows, hit enter etc but I would love to get it to where I can tab through like I can in AS3...who wouldn't want that?! Anyway, I am curious if anyone is playing with this and wants to share more GSAP Live Templates. Is there a WebStorm Live Template community elsewhere that I should know about? Anyone? Thanks guys! - Patrick
  2. So I figured out the mistake The culprit seems to be 2 things. The first one I should know better, I forgot to add the CSS position Something with the z property and possibly the z-index...hmm not sure but -100 seemed unnecessary and removing the z property didn't do anything else but seem to fix the issue. Also, is it best practice to keep the values in quotes? Seems like it is. This causes an issue on iOS TweenMax.set(container, { backgroundColor: "#002663", width: '300', height: '250', zIndex: -100, z: -400 }); This works great everywhere TweenMax.set(conta
  3. Hey guys, I refactored a version of Chris Gannon's Cube Dial demo here http://codepen.io/SnapToPixels/pen/jEgvKR/?editors=001 So far its working fantastic...Desktop (Chrome, Safari, FF) and Android (Chrome) The problem is when I start to test on iOS only... When the cubes start to rotate the get cutoff I'm sure there is something I missed...hopefully a fresh pair of eyes can help me find the missing piece. Thanks! - Patrick
  4. You can use GSAP no problem. My team has been using GSAP with DoubleClick for over a year now with no significant issues. The trick is to keep everything as small as possible and minimal calls to the server. Most DC ads we build on average look like this when they are uploaded to Studio and Previewed index.html (Enabler and Polite Load) script.min.js 25k gzipped (TweenLite, CSSPlugin, EasePack, Custom Utilities and then the code for ad) styles.min.css 1k gzipped (Use Texture Packer to create your css and sprite, then crush your PNG with your favorite PNG crusher) sprite.png 25k cr
  5. oh duh, I didn't think to do that I was too busy scanning the code...your solution was way more simple! Thanks Carl
  6. I appreciate your response and yes I understand why people uglify...however I was simply curious if he was using GSAP for the dragging portion.
  7. HI there, I was looking at the source for this site http://ddanga.com/#/projects created by Jongmin Kim who did FFF http://fff.cmiscm.com/#!/main This still inspires me today! Anyways, the drag code on http://ddanga.com/#/projects I can't figure out if it's GSAP or if he created his own version. The code is minified/uglified so I can't decipher the parts I am interested in. I'd love to peek at the actual source. Do you have any techniques that allow you to see if ThrowProps/Draggable are being used? Thanks everyone - Patrick
  8. I figured it out! Here is the code import com.greensock.*; var bufferDistance:Number = 10; var startX:Number = imgContainer.x; var distanceToScroll:Number = imgContainer.mc1.width + bufferDistance; var lastItemX : Number = imgContainer.width + bufferDistance; var directionIs : String; function resetContainer():void { for each (var mc in imgContainer) { if (directionIs == "right") { mc.x += distanceToScroll; if (mc.x >= lastItemX) mc.x -= lastItemX; } else { mc.x -= distanceToScroll; if (mc.x < 0) mc.x += lastItemX; } } imgContainer.x = directionIs ==
  9. Hey guys, I am building a quick carousel demo and I got stuck. I am attaching the FLA imageCarousel.zip When you click the right button the container scrolls infinitely. However when you start with the left button first you can see how the infinite loop takes a couple of button clicks for the container to reset properly. Carl I used the infinite scroll loop you created a while back. Same idea but I am adding a direction flag. Thanks for the help everyone - Patrick
  10. holy #$%!@ batman! looks like it's time for bed. Can't trust my eyes. not sure how that delay made it in there...too much copy and pasting today ...my bad Thanks Carl. Catch u later
  11. One more thing Is there a scoping thing I need to check for? The stop function here doesn't work. var stf : SplitTextField = new SplitTextField(myText, "characters", 5, 5); btnStart.addEventListener(MouseEvent.CLICK, startHandler); btnStop.addEventListener(MouseEvent.CLICK, stopHandler); function startHandler(e:MouseEvent):void { TweenMax.staggerTo(stf.textFields, 0.8, {y:20, scaleX:0.98, z:-60, rotationY:-10, rotation:-4, repeat:-1, yoyo:true, ease:Cubic.easeOut}, 0.03); } function stopHandler(e:MouseEvent):void { TweenMax.staggerTo(stf.textFields, 0.3, {y:20, scaleX:1, z:0, ro
  12. AH! Yes I see what you are doing. I've never quite wrapped my head around yoyo for looping stuff. This is totally workable for the effect I am going for. Thanks so much Carl...you guys are the best. I wish other forums had your response time. They could learn a lesson from GSAPs methodology btw I bought the GSAP Book from Noble Desktop. The book is chock full of code goodies! I am hoping to make the class in December. Still trying to work out the days off. Thanks again - Patrick
  13. Hey guys, I have been tasked with doing a simple animation of some text and I've hit a wall. I think I need a break. I am attaching the current example but it's not quite right as you'll see. It doesn't loop properly for one. I've also attached a screenshot so you can see the ideal effect in context. I have a few ideas of how I can do it but I was hoping to hear from someone here. It's not a groundbreaking effect and I suspect someone here has already done it before. My Flash chops have slipped a little lately. Basically I want to be able to animate the text so it appears to be w
  14. aha...no wonder it's so smooth I am running a banner ad at 24 fps and its not as smooth. Damn those vendors who love old specs! Thanks Jack! - P
  15. hey guys, silly question what is the FPS for the demo on this page? http://greensock.com/roughease Thanks - Patrick
  16. Hey everyone, I wanted to share the method we landed on concerning the DoubleClick Polite Load. At the time of writing this, this method works great. DC API's update often so... Once you minify all of your CSS and JS files down to 1 for each you can set up your Polite Load like this if (Enabler.isInitialized()) { init(); } else { Enabler.addEventListener(studio.events.StudioEvent.INIT, init); } function init() { if(Enabler.isPageLoaded()) { politeInit(); }else{ Enabler.addEventListener(studio.events.StudioEvent.PAGE_LO
  17. I'm happy I posted this. Having a few different solutions is awesome. Definitely learned a few things. Thanks to the GSAP family! - Patrick
  18. Hi guys, I am wondering how to do this. I want to animate the width of 2 divs. Here is my start pen http://codepen.io/SnapToPixels/pen/uHsGz/ I want the line on the left to be a mirror animation of the line on the right. So the left line would animate from right to left and vice versa. At the moment they both animate in the same direction left to right. I can't get away from the Flash mentality with MovieClips and how easy it would be. I'm sure it's simple I just can't wrap my head around it atm Can I get some help on this? I appreciate it much in advance! - P
  19. yeah I tried that too. No go. Something is weird about the Enabler. The DoubleClick HTML5SDK Docs are very outdated so I am forced to email them when I need something. DoubleClick forums are a ghost town too. I appreciate the effort. I'm gonna take a break and hopefully hear back from DoubleClick sometime soon. I'll report back with my findings. For now I can avoid loading GSAP with the Enabler. I just stick it at the top and it's fine during development. Thanks again - Patrick
  20. thanks but it's not that. The script is loading. It's not getting defined in a way that i can get to it normally. I notice that if I avoid the Enabler and use a simple injection script, then GSAP is defined. But it seems to not be defined if I use the Enabler. var loader = document.createElement('script'); loader.src = 'TweenMax.min.js'; document.getElementsByTagName('head')[0].appendChild(loader); I'll see what Google tech has to say. I don't see too many DoubleClick/Greensock posts here. I'll post back my solution when I figure it out. Thanks anyways - Patrick
  21. sorry for the messy code, but I wanted to give some context. Just to be clear: If I comment out lines 24-27 and add GSAP using a normal script tag at the top of the header like the Enabler on Line 2, then any TweenMax calls I make in any JS on the page work great. I don't have much experience with the DoubleClick apis yet, I'm going to email their tech also. But I was hoping someone here has been using GSAP with their ads too. Thanks for any help - Patrick
  22. Hey guys, so I am trying to understand how to politely load the TweenMax library If I load the library in the top of the header, TweenMax works. If I try to polite load, it breaks. Here is what I am trying but it's failing: <head> <script src="http://s0.2mdn.net/ads/studio/Enabler.js" type="text/javascript"></script> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <style type="text/css">#container_dc{visibility:hidden;z-index:20}</style> <script language="javascript"> if (Enabler.isInitialized()) { init(); } else { E
  23. Thx guys. It was good to learn how to use the CSSRule Plugin. Turns out its easier to refactor the code and add the image through a div and not CSS. This was helpful. Thx again.
  24. I have a CSS class CSS: .case-section{background:url(image.jpg) no-repeat;} HTML: <div class="case-section"> <div class="logoHolder"> <a href="#"><img src="image.png"/></a> <span class="logoPunch"></span> </div> <div class="headingHolder"> <h2>The Client</h2> <p>lorem ipsum</p> <h2 class="marginTop25">Header</h2> <p>more text here</p> </div> </div> JS: var bgImage : $('.case-sec
  25. hey sounds pretty good. I might be able to come Saturday If I can I will certainly sign up! Thanks!