Comunidad de diseño web y desarrollo en internet online

FlipBook, girar pagina con las teclas

Citar            
MensajeEscrito el 21 Feb 2014 05:22 pm
Saludos cordiales a todos

me han pasado este archivo de un flipbook en as2 para que les ayude colocando controles con teclas derecha , izquierda para pasar las hojas y mantener el drag que ya vienen en el funcionamiento, bueno, les coloque los controles para las teclas y funciona, lo que sucede es que al final si sigues aplastando las teclas se cren nuevas paginas vacias y no se que deberia hacer para evitar que suceda esto
Espero me puedan echar una luz para ver por donde tendria que cambiar el codigo

aca el codigo actual

Código ActionScript :

stop();
// 
// 
// _________________________V A R I A B L E S
// 
// Store a constant reference to this clip on the main timeline so
// clip can be referenced from any other timeline as _level0.pagesAbs
_level0.pagesAbs = this;
// Set page dimensions
var pageWi = 512;
var pageHi = 768;
var pageWiHi = pageWi+pageHi;
var pivotY = pageHi/2+pageWi;
var pageColor = 0xFFFFE5;
// "dir" equals either 1 or -1 and determines if you
// are flipping forward or backward through the book
var dir = 1;
// "flipPage" is the # "between" the two flipping page #'s
var flipPage = 1.5;
// "curPage" is the # between the two currently viewed page #'s
var curPage = .5;
// "maxPages" should be an even number
var maxPages = 10;
// "autoStep" percentage of page width determining step size when auto-closing
var autoStep = .05;
// "dragging" is true if you are dragging the page
var dragging = false;
var usoTecla=false;
// 
// 
// 
// 
// 
// ________________________________R U N   O N C E
// 
// Place Left and Right page flip Buttons
//this.attachMovie("cornerButton", "RButton", 1);
this.attachMovie("cornerButton", "RButton", 11);
with (RButton) {
   _x = pageWi;
   _y = -pageWi;
}
this.attachMovie("cornerButton", "LButton", 12);
with (LButton) {
   _x = -pageWi;
   _y = -pageWi;
   _xscale = -100;
}
// 
// 
// Build pages for first time
pageInit(flipPage, dir);
// Drop down to appear centered
_y += pivotY;
// 
// 
// 
// 
// 
// _____________________B U I L D   F U N C T I O N S
// 
// Create a left-aligned page-sized solid fill raised one pagewidth
// If quadrant = 1 page is on the right, if -1 page is on the left
// targ is the clip which hold the page drawing
function makePage(targ, xQuadrant) {
   with (targ) {
      beginFill(pageColor, 100);
      moveTo(0, -pageWi);
      lineTo(0, -pageWiHi);
      lineTo(xQuadrant*pageWi, -pageWiHi);
      lineTo(xQuadrant*pageWi, -pageWi);
      endFill();
   }
}
// 
// 
// Create a left-aligned page-sized shadow gradient raised one pagewidth
// Shade is used to add depth to stationary pages
function makeShade(targ, xQuadrant) {
   with (targ) {
      // Defines gradient used as shadow overlay
      var colors = [0x000000, 0x000000, 0x000000, 0x000000, 0x000000, 0x000000, 0x000000];
      var alphas = [40, 25, 15, 5, 0, 1, 6];
      var ratios = [0, 1, 17, 51, 89, 132, 255];
      var matrix = {matrixType:"box", x:0, y:pageWi, w:xQuadrant*pageWi, h:pageHi, r:0};
      beginGradientFill("linear", colors, alphas, ratios, matrix);
      moveTo(0, -pageWi);
      lineTo(0, -pageWiHi);
      lineTo(xQuadrant*pageWi, -pageWiHi);
      lineTo(xQuadrant*pageWi, -pageWi);
      endFill();
   }
}
// 
// 
// create a bottom-left aligned shadow gradient
// for animated shadows
function makeShadow(targ, xQuadrant) {
   with (targ) {
      // Defines gradient used as shadow overlay
      var colors = [0x000000, 0x000000, 0x000000, 0x000000, 0x000000, 0x000000, 0x000000];
      var alphas = [40, 25, 15, 5, 0, 1, 6];
      var ratios = [0, 1, 17, 51, 89, 132, 255];
      var maxLength = Math.sqrt((pageWi*pageWi)+(pageWiHi*pageWiHi));
      var matrix = {matrixType:"box", x:0, y:-maxLength, w:xQuadrant*pageWi, h:maxLength-pageWi, r:0};
      beginGradientFill("linear", colors, alphas, ratios, matrix);
      moveTo(0, -pageWi);
      lineTo(0, -maxLength);
      lineTo(xQuadrant*pageWi, -maxLength);
      lineTo(xQuadrant*pageWi, -pageWi);
      endFill();
   }
}
// 
// 
// Place Stationary Pages
function setStationary() {
   // Place the "S"tationary "L"eft "P"age
   createEmptyMovieClip("SLPage", 1);
   if (flipPage != 1.5) {
      makePage(SLPage, -1);
      SLPage.attachMovie("print"+(flipPage-1.5), "Print", 1);
      with (SLPage.Print) {
         _x = -pageWi/2;
         _y = -pivotY;
      }
   }
   // Place the "S"tationary "R"ight "P"age
   createEmptyMovieClip("SRPage", 2);
   if (flipPage != maxPages-.5) {
      makePage(SRPage, 1);
      SRPage.attachMovie("print"+(flipPage+1.5), "Print", 1);
      with (SRPage.Print) {
         _x = pageWi/2;
         _y = -pivotY;
      }
   }
   // Place shade on page not being revealed
   var targ = dir>0 ? SLPage : SRPage;
   targ.createEmptyMovieClip("Shade", 2);
   makeShade(targ.Shade, -dir);
}
// 
// 
// Place the Flipping Pages
function setFlipping() {
   var targ;
   // Place the "F"lipping "T"op "P"age
   createEmptyMovieClip("FTPage", 3);
   makePage(FTPage, dir);
   with (FTPage) {
      attachMovie("print"+(flipPage-dir*.5), "Print", 1);
      with (Print) {
         _x = dir*pageWi/2;
         _y = -pivotY;
      }
   }
   FTPage.createEmptyMovieClip("Shade", 2);
   makeShade(FTPage.Shade, dir);
   // Place the "F"lipping "B"ottom "P"age
   createEmptyMovieClip("FBPage", 4);
   makePage(FBPage, -dir);
   FBPage.attachMovie("print"+(flipPage+dir*.5), "Print", 1);
   with (FBPage.Print) {
      _x = -dir*pageWi/2;
      _y = -pivotY;
   }
   FBPage._rotation = dir*90;
}
// 
// 
// Creates Shadows which follow edge of transition
function setShadows() {
   var targ;
   // Place shadow on the "F"lipping page
   this.createEmptyMovieClip("FShadow", 5);
   makeShadow(FShadow, -dir);
   FShadow._rotation = dir*45;
   // Place shadow on the "S"tationary page
   this.createEmptyMovieClip("SShadow", 6);
   makeShadow(SShadow, dir);
   SShadow._rotation = dir*45;
}
// 
// 
// Create Masks to hide everything
function makeMasks() {
   // Create mask for Flipping Bottom Page Mask
   this.createEmptyMovieClip("FBPageMask", 7);
   with (FBPageMask) {
      beginFill(0x005500, 100);
      lineTo(pageWiHi, -pageWiHi);
      curveTo(0, -2*pageWiHi, -pageWiHi, -pageWiHi);
      endFill();
   }
   // Create mask for Flipping Top Page
   FBPageMask.duplicateMovieClip("FTPageMask", 8);
   // Create mask for Shadow on the Flipping Page
   this.createEmptyMovieClip("FShadowMask", 9);
   makePage(FShadowMask, -dir);
   FShadowMask._rotation = dir*90;
   // Create mask for Shadow on Stationary Page
   this.createEmptyMovieClip("SShadowMask", 10);
   makePage(SShadowMask, dir);
   FBPage.setMask(FBPageMask);
   FTPage.setMask(FTPageMask);
   FShadow.setMask(FShadowMask);
   SShadow.setMask(SShadowMask);
}
// 
// 
// Hide pages before page1 and after Last Page
function limitBook() {
   if (flipPage == 1.5) {
      SLPage._visible = 0;
      LButton._visible = 0;
      SShadow._visible = 0;
      if (dir == 1) {
         FTPage.Shade._alpha = 67;
         SShadow._visible = 1;
       
      } else {
         FShadow._alpha = 67;
      }
   } else if (flipPage == maxPages-.5) {
      SRPage._visible = 0;
      RButton._visible = 0;
      SShadow._visible = 0;
      if (dir == -1) {
         FTPage.Shade._alpha = 67;
         SShadow._visible = 1;
      } else {
         FShadow._alpha = 67;
      }
   }
}
// 
// 
// How to position all pages needed for a page flip
// calls all functions listed above
function pageInit(cp, d) {
   flipPage = cp;
   dir = d;
   //if (flipPage <= maxPages-.5) {
      
   trace ("flip page = "+flipPage+" dir = "+dir);
   setStationary();
   setFlipping();
   setShadows();
   makeMasks();
   limitBook();
//}else {
//trace("alcanzamos el final");
//flipPage = 9.5;
//}

}
// 
// 
// 
// 
// 
// __________________F L I P P I N G   F U N C T I O N S
// 
// How to adjust position of flipping page
// based on a value between 0 and 1
function flip(curVal) {
   var rot = dir*45*curVal;
   FBPageMask._rotation = FTPageMask._rotation=-rot;
   FBPage._rotation = FShadowMask._rotation=(dir*90)-rot*2;
   FShadow._rotation = SShadow._rotation=(dir*45)-rot;
}
// 
// 
// how to determine position of flipping page
// returns a value between 0 and 1
// zero being no-flip and one being full-flip
function getPageRatio() {
   if (dragging) {
      // if dragging page position is determined by mouse position
      // the 20 helps advance the turning page when the button is pressed
      if (usoTecla==true) {
         pageRatio = -dir*(ancla_izq._x-startX-dir*20)/(1.5*pageWi);
         } 
         else {
pageRatio = -dir*(_xmouse-startX-dir*20)/(2*pageWi);
}
      
      
   } else {
      // if not dragging; auto increment page towards final position
      pageRatio>2/3 ? pageRatio += autoStep : pageRatio -= autoStep;
   }
   // if out of bounds
   if (pageRatio<=0) {
      pageRatio = 0;
      if (!dragging) {
         flipDone();
      }
   } else if (pageRatio>=1) {
      pageRatio = 1;
      if (!dragging) {
         flipDone();
      }
   }
   return (pageRatio);
}
// 
// 
// 
// 
// 
// _____________C O N T R O L I N G   F U N C T I O N S
// 
// What to do when you press a page flipping button
var movimiento:Number;
function startFlip(dir) {
   pageInit(curPage+dir, dir);
   startX = dir*pageWi;
   dragging = true;
   RButton._alpha = 0;
   Lbutton._alpha = 0;
   this.onEnterFrame = function() {
      flip(getPageRatio());
   };
   //this.onEnterFrame = function() {
//         //var movimiento:Number;
//            movimiento--;
//            trace(movimiento);
//}
}
// 
// 
// what to do when page is released
function flipRelease() {
   dragging = false;
   if (pageRatio>2/3) {
      curPage += 2*dir;
   }
}
// 
// 
// What to do when pages are done flipping
function flipDone() {
   this.onEnterFrame = null;
   RButton._alpha = 100;
   LButton._alpha = 100;
   if (curPage != 1.5) {
      LButton._visible = 1;
      trace("inicio");
   }
   if (curPage != maxPages+.5) {
      RButton._visible = 1;
   }
   // Delete hidden pages to save resources
   if (pageRatio == 0) {
      FShadow.removeMovieClip();
      FShadowMask.removeMovieClip();
      SShadow.removeMovieClip();
      SShadowMask.removeMovieClip();
      FBPage.removeMovieClip();
      FBPageMask.removeMovieClip();
      if (dir == 1) {
         SRPage.removeMovieClip();
      } else {
         SLPage.removeMovieClip();
      }
   } else {
      FTPage.removeMovieClip();
      if (dir == -1) {
         SRPage.removeMovieClip();
      } else {
         SLPage.removeMovieClip();
      }
   }
   FTPageMask.removeMovieClip();
}
// 
// 
// assign functions to button events
LButton.onPress = function() {
   startFlip(-1);
   
};
LButton.onReleaseOutside = function() {
   flipRelease();
};
LButton.onRelease = function() {
   flipRelease();
};
RButton.onPress = function() {
   startFlip(1);
};
RButton.onReleaseOutside = function() {
   flipRelease();
};
RButton.onRelease = function() {
   flipRelease();
};


var listKey:Object = new Object();

listKey.onKeyDown = function () {
        if (Key.getCode() == Key.LEFT) {
      usoTecla=true;
          trace("aplastamos tecla");
        if (flipPage < maxPages-.5) {
            startFlip(1);
            trace("movemos pagina izquierda");
        } else {
            trace("se terminaron las paginas");
            flipPage = curPage
            trace("forzado a:" + flipPage);
            //Key.removeListener(listKey);
            limitBook()
         }
      limitBook()
      }
}

listKey.onKeyUp = function () {
        if (Key.getCode() == Key.LEFT) {
          trace("detenemos tecla");
        usoTecla=false;
   flipRelease();
        }
    }
    Key.addListener(listKey);

var listKey2:Object = new Object();
listKey2.onKeyDown = function () {
        if (Key.getCode() == Key.RIGHT) {
         usoTecla=true;
          trace("aplastamos tecla");
        if (flipPage > 0) {
            startFlip(-1);
            trace("movemos pagina derecha");
        } else {
            trace("se terminaron las paginas");
            //Key.removeListener(listKey2);
            usoTecla=false;
            limitBook()
         }
      limitBook()
      }
}

listKey2.onKeyUp = function () {
        if (Key.getCode() == Key.RIGHT) {
          trace("detenemos tecla");
   flipRelease();
        }
    }
    Key.addListener(listKey2);


y esto es como funciona actualmente el archivo

[flash width=1024 height=768]http://www.mediummultimedia.com/flash/PageFlip.swf[/flash]

gracias por la ayuda de antemano

Por voraz2

21 de clabLevel



 

firefox
Citar            
MensajeEscrito el 21 Feb 2014 09:06 pm
Saludos a todos he avanzado un poco, tratando de remover los listeners de las teclas, aqui lo avanzado el dia de hoy

talvea alguien pueda darle alguna pista de por donde continuar

Archivo Fla FlipBook as2

gracias denuevo

Por voraz2

21 de clabLevel



 

firefox
Citar            
MensajeEscrito el 24 Feb 2014 05:54 pm
SOLUCIONADO
Saludos cordiales a todos

Bueno en cuanto al presente tema , definitivamente no he podido solucionar este .As que el cliente me dio para la activacion de flechas derecha izquierda, pero a su vez encontre otro Flipbook en as2 que pude manejarlo sin problemas y activar ahi si las flechas para cambiar de paginas y solucionar este tema

aca les dejo el archivo para quien lo necesite
ARCHIVO FLA

Suerte a todos

Por voraz2

21 de clabLevel



 

firefox

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.