Please help me with Local Connection & TweenLite
SeanPercy42 Jul 29, 2013 7:47 AMI'll quickly explain what I'm trying to do because I just wrote this out once and accidently hit the back button on my browser and it cleared everything that I just typed..... ever done that?! One of the most frustrating things I've experienced on a PC, ever! (On a side note any good developers reading this, please include an auto-save every 5 minutes on thes input boxes...).
Anyway, back to my original problem. I'm trying to setup a floating (flash) navigation bar on top of my main (flash) page and have the .swf files communicate variables over using the Local Connection method. After much reading it's the only way I've heard of doing this. If you have a better method to make this work, I'm all ears. The goal of this is to have various pages (tween) open and closed according to the button the user clicks (eg. click on the services page button, tween open the services page, click on the portfolio page button , tween out the services page and in the portfolio page, and so on). I found an excellent tutorial that shows how to accomplish this BUT the buttons and pages are all in the same .swf file so it's much easier that what I'm trying to do. I'm pretty new to AS as a whole but use to code in Basic (fluently) and currently code a little in HTML & CSS so I understand most of the AS3 code already.
A lot of the code is probably done correctly, as I modified it from the excellent tutorial I watched (here) on using TweenLite to fade between pages regardless of the page I'm currently on (although I know there are probably several issues). What's different between that tutorial and my website are that my navigation bar is in a seperate file; I need any page that's currently open to fade out when you click on a hide button (located on the main pages); and the pages do need to hide if you click on the button for the page you're currently on. In the tutorial the guy uses the AS to make sure the pages doesn't fade in again. I also believe because the pages and the buttons are in in different files that I'm going to need to send the variables (through the local connection) to the other file and visa-versa because some of the code references variables on the other page.
If you happen to have 15-30 minutes to skim through the tutorial and help me I would appreciate it more than you could ever know, as I'm planning to use this same method on most websites I create in the future.
NavBar Code:
// Establish incoming local connection
var receiving_lc:LocalConnection;
receiving_lc = new LocalConnection();
receiving_lc.connect("my_lc2_as3");
receiving_lc.client = this;
// Establish an outgoing local connection
var sending_lc:LocalConnection;
sending_lc = new LocalConnection();
// Gives NavBar Buttons IDs
navBar.servicesBtn.ID = 0;
navBar.portfolioBtn.ID = 1;
navBar.aboutBtn.ID = 2;
navBar.contactBtn.ID = 3;
navBar.addEventListener(MouseEvent.CLICK, crossFade);
// Stors a reference to the currently visible clip
var currentClip:MovieClip = pages_arr[0]
// Function to send the fade command or hide command to the main .swf
function crossFade(e:MouseEvent):void{
// Creates a reference to the movieclip related to the button you just clicked
var thisBtnsMovie:MovieClip = pages_arr[e.target.ID]
if(currentClip != thisBtnsMovie){
sending_lc.send("my_lc_as3","crossFadeFunc");
currentClip = thisBtnsMovie;
}
if(currentClip == thisBtnsMovie){
sending_lc.send("my_lc_as3","hidePages");
}
addChild(currentClip);
}
// Function to reset the pages_arr number if someone clicks the hide button
function resetCounter(e:MouseEvent):void{
import flash.display.MovieClip;
var currentClip:MovieClip = pages_arr[5]
}
Main Page Code:
// Establish incoming local connection
var receiving_lc:LocalConnection;
receiving_lc = new LocalConnection();
receiving_lc.connect("my_lc_as3");
receiving_lc.client = this;
// Establish an outgoing local connection
var sending_lc:LocalConnection;
sending_lc = new LocalConnection();
// Import GreenSock
import com.greensock.*;
import com.greensock.easing.*;
import com.greensock.plugins.*;
import flash.events.MouseEvent;
TweenPlugin.activate([ScalePlugin]);
// Creates an array for all the pages
var pages_arr:Array = [servicesPage, portfolioPage, aboutPage, contactPage];
// Sets all pages to invisible
TweenMax.allTo(pages_arr, 0, {autoAlpha:0});
// Sends the currentClip variable to the NavBar??? (Not sure if this is the right method)
sending_lc.send("my_lc2_as3", "", currentClip);
// Sends the pages_array to the NavBar??? (Not sure if this is right either)
sending_lc.send("my_lc2_as3", "", pages_arr);
// Function to fade in and out pages
function crossFadeFunc(e:MouseEvent):void{
// Fades out the current clip
TweenLite.to(currentClip, 1, {autoAlpha:0, scale:1.2, ease:Quad.easeIn});
// Fades in the new clip
TweenMax.fromTo(thisBtnsMovie, 1.2, {scale:0}, {autoAlpha:1, scale:1, delay: .2});
}
// Function to hide pages if the user clicks on one of the hide buttons on the pages
function hideAllPages(e:MouseEvent):void{
// Fades out the current clip
TweenLite.to(currentClip, 1, {autoAlpha:0, scale:1.2, ease:Quad.easeIn});
// Tells the navbar code to reset the pages_arr counter
sending_lc.send("my_lc2_as3","resetCounter");
}
// Adds event listeners to hide buttons located on each page
servicesPage.hideBtn.addEventListener(MouseEvent.CLICK, hidePages);
portfolioPage.hideBtn.addEventListener(MouseEvent.CLICK, hidePages);
aboutPage.hideBtn.addEventListener(MouseEvent.CLICK, hidePages);
contactPage.hideBtn.addEventListener(MouseEvent.CLICK, hidePages);
P.S. If you have a program like FlashDevelop (that you can just copy/paste this code), the syntax and comments will be much easier to differentiate between.



