diff options
Diffstat (limited to 'javascript/jquery/plugins/cm_pageflip/pageflip.js')
| -rw-r--r-- | javascript/jquery/plugins/cm_pageflip/pageflip.js | 380 |
1 files changed, 0 insertions, 380 deletions
diff --git a/javascript/jquery/plugins/cm_pageflip/pageflip.js b/javascript/jquery/plugins/cm_pageflip/pageflip.js deleted file mode 100644 index 5087d87..0000000 --- a/javascript/jquery/plugins/cm_pageflip/pageflip.js +++ /dev/null @@ -1,380 +0,0 @@ -/* -Javascript Pageflip v0.2 by Charles Mangin (http://option8.com) - - -Creative Commons License: - -Javascript Pageflip v0.2 by Charles Mangin is licensed under a Creative Commons Attribution-Share Alike 3.0 United States License. - -You are free: - -to Share — to copy, distribute, display, and perform the work -to Remix — to make derivative works - -Under the following conditions: - -Attribution. You must attribute this work to Charles Mangin ( with link: http://option8.com ). - - -Share Alike. If you alter, transform, or build upon this work, you may distribute the resulting work only under the same, -similar or a compatible license. - -For any reuse or distribution, you must make clear to others the license terms of this work. The best way to do this is -with a link to this web page: http://creativecommons.org/licenses/by-sa/3.0/us/ - -Any of the above conditions can be waived if you get permission from the copyright holder. - -Apart from the remix rights granted under this license, nothing in this license impairs or restricts the author's moral rights. - -*/ - -/** - * Modifications performed 06.11.10: - * - In pageLayout(), pageWidth and pageHeight are now set to the current values of .pageimage class - * to enable dynamic resizing of pages - * - Sixth page added to allow visibility thorough 2 consecutive pages with transparent elements. - * - Initialize function changed to be called manually as opposed to window.onload() - * - Add optional parameter to flipForward and flipBack to pass in callback function for when flipping is complete. - * - Add variables to store callback functions for flipForward and flipBack - * @author Brian Stegmann - */ - -//Variables to hold callback functions for flipForward and FlipBack -var onFlipForwardFinish; -var onFlipBackFinish; - -/* set up variables */ - -var imageArray = new Array(); - - -// display page l/r. next spread l/r. previous spread l/r. -var pageN1, page0, page1, page2, page3, page4, page6; - - -// img tags within each page hold the contents -var pageN1img, page0img, page1img, page2img, page3img, page4img, page6img;; - -// originally worked with bg images, but now the bg is shadow -var pageIndex = 0; // initial starting page - -var page1image = new Image(); // Create new Image object -var page2image = new Image(); // Create new Image object - -// next LEFT page -var page3image = new Image(); // Create new Image object -var page3OriginX; // page 3 starting position -var page3x; // page 3 current position -var page3DeltaX; // frame-to-frame diff in page 3 x value -// next RIGHT page -var page4image = new Image(); // Create new Image object - -// previous RIGHT page -var page0image = new Image(); // Create new Image object -var page0OriginX; // page 0 starting position -var page0x; -var page0DeltaX; // frame-to-frame diff in page 3 x value -// previous LEFT page -var pageN1image = new Image(); // Create new Image object - -//second next RIGHT page -var page6image = new Image(); - -// timer -var currentStep, totalSteps; - - -var pageWidth, page2Width, page3Width, page4Width, page6Width, page1Width, page0Width; -var pageHeight; - - -var page3TargetX; // page 3 aims for 0px -var page0TargetX; // page 0 aims for pagewidth px - -// the div that holds it all -var pagesContainer; - -// animating on/off -var flipping; - - -function pageLayout() { - -// console.log("doing layout"); - - - page1image.src = imageArray[pageIndex].src; // Set source path - page1img = document.getElementById('page1img'); - page1img.src = page1image.src ; - - if(typeof(imageArray[pageIndex+1]) != "undefined") { - page2image.src = imageArray[pageIndex+1].src; // Set source path - page2img = document.getElementById('page2img'); - page2img.src = page2image.src ; - } - - if(typeof(imageArray[pageIndex+2]) != "undefined") { - page3image.src = imageArray[pageIndex+2].src; // Set source path - page3img = document.getElementById('page3img'); - page3img.src = page3image.src ; - } - if(typeof(imageArray[pageIndex+3]) != "undefined") { - page4image.src = imageArray[pageIndex+3].src; // Set source path - page4img = document.getElementById('page4img'); - page4img.src = page4image.src ; - } - if(typeof(imageArray[pageIndex+5]) != "undefined") { - page6image.src = imageArray[pageIndex+5].src; // Set source path - page6img = document.getElementById('page6img'); - page6img.src = page6image.src ; - } - if(typeof(imageArray[pageIndex-1]) != "undefined") { - page0image.src = imageArray[pageIndex-1].src; // Set source path - page0img = document.getElementById('page0img'); - page0img.src = page0image.src ; - } - if(typeof(imageArray[pageIndex-2]) != "undefined") { - pageN1image.src = imageArray[pageIndex-2].src; // Set source path - pageN1img = document.getElementById('pageN1img'); - pageN1img.src = pageN1image.src ; - } - -// set the page width all the pages key off. if image1 is an odd size, choose a different one to key - //pageWidth = page1image.width; - //pageHeight = page1image.height; - - pageWidth = $('.pageimage').width(); - pageHeight = $('.pageimage').height(); - -// console.log("page width = " + page1img.width); - - -// set up pages - page1 = document.getElementById('page1'); - - - page2 = document.getElementById('page2'); - page3 = document.getElementById('page3'); - page4 = document.getElementById('page4'); - - page6 = document.getElementById('page6'); - - page0 = document.getElementById('page0'); - pageN1 = document.getElementById('pageN1'); - -// uniform height/width for the page DIVs - page0.style.height = pageN1.style.height = page1.style.height = page2.style.height = - page3.style.height = page4.style.height = page6.style.height = (pageHeight+2) + "px"; - - - page0.style.width = pageN1.style.width = page1.style.width = page2.style.width = - page3.style.width = page4.style.width = page6.style.width = (pageWidth+2) + "px"; - - - page0Width = pageWidth; - page2Width = pageWidth; - -// set the next/previous pages up for their animations - page2.style.left = page4.style.left = page6.style.left = pageWidth + "px"; - page0.style.left = 0 + "px"; - page1.style.left = 0 + "px"; - - page3TargetX = 0; - page0TargetX = pageWidth; - - - -// initial position for page 3 - flip forward - page3OriginX = pageWidth * 2; - page3.style.left = pageWidth * 2 + "px"; - page3Width = 0; - page3.style.width = page3Width + "px"; - -// initial position for page 0 - flip back - page0OriginX = 0; - page0.style.left = 0 + "px"; - page0Width = 0; - page0.style.width = page0Width + "px"; - - -// set up next page flip - currentStep = 1; - totalSteps = flipTime/smoothness; - - // start out the page3 canvas at start position - page3x = 2 * pageWidth; - page0x = 0; - -// hide the previous pages - page0.style.display = "none"; - pageN1.style.display = "none"; - -// clicky cursor - if(typeof(imageArray[pageIndex]) != "undefined") { - page1.style.cursor="hand"; - } else { - page1.style.cursor="default"; - } - - if(typeof(imageArray[pageIndex+1]) != "undefined") { - page2.style.cursor="hand"; - } else { - page2.style.cursor="default"; - } - - // ready to go... - flipping = false; - -} - - -function flipForward() { - -// linear - //page3DeltaX = (page3TargetX-page3OriginX)/totalSteps; // distance per step - //page3x += page3DeltaX; - - page3OldX = page3x; - -// ease out -// page3x = page3OriginX + (Math.sin( (currentStep/totalSteps) * (Math.PI/2) ) * (page3TargetX-page3OriginX) ); - -// ease in/out - page3x = ((1 + Math.cos( (currentStep/totalSteps) * (Math.PI) ))/2) * (page3OriginX - page3TargetX); - - page3DeltaX = page3x - page3OldX; - - // shadow - page3ShadowWidth = -4 * page3DeltaX; - page3.style.paddingLeft = page3ShadowWidth + "px" - - page3.style.left = page3x - page3ShadowWidth + "px"; - - page2Width += page3DeltaX; - - if(page2Width > 0) { // surprise, IE doesn't like negative width - page2.style.width = Math.floor(page2Width) + "px"; - } else { - page2Width = 0; - page2.style.width = Math.floor(page2Width) + "px"; - } - page3Width -= page3DeltaX/2; - page3.style.width = Math.floor(page3Width) + "px"; - - if(currentStep == totalSteps){ - clearInterval(nextPageFlip); - pageIndex += 2; - pageLayout(); - if(onFlipForwardFinish != null) { - onFlipForwardFinish(); - } - } - - currentStep ++; - -} - -/** - * Function to initiate forward flip. - * - * @param flipForwardOnComplete function - */ -function nextPage( flipForwardOnComplete ) { - - onFlipForwardFinish = flipForwardOnComplete; - - if((typeof(imageArray[pageIndex+2]) != "undefined") && (flipping == false) ){ - nextPageFlip = setInterval(flipForward,smoothness); - flipping = true; - } -} - - -function flipBack() { - - page0.style.display = "block"; - pageN1.style.display = "block"; - - - page0OldX = page0x; - - -// ease in/out - page0x = page0OriginX + ((1 - Math.cos( (currentStep/totalSteps) * (Math.PI) ))/2) * (page0TargetX - page0OriginX); - - page0DeltaX = page0x - page0OldX; - - - page0.style.left = page0x + "px"; - page1.style.left = page0x + "px"; - - // move contents over to pretend we're cropping from the left - page0.style.textIndent = -1 * pageWidth + page0x + "px"; - -// grow the -1 page to match the movement of page 0 - pageN1.style.width = page0x + "px"; - -//shrink page 1 to match movement of page 0 - page1Width = page1.style.width.replace('px', ''); - - - page1Width -= page0DeltaX; - if(page1Width < 0) { - page1Width = 0; - } - - page1.style.width = page1Width + 'px'; - page1img.style.width = page1Width + 'px'; - - page0Width += page0DeltaX; - - // shadow - page0ShadowWidth = 4 * page0DeltaX; - page0.style.paddingRight = page0ShadowWidth + "px" - - page0.style.width = Math.floor(page0Width) + page0ShadowWidth + "px"; - - - if(currentStep == totalSteps){ - clearInterval(nextPageFlip); - pageIndex -= 2; - page1img.style.width = pageWidth + 'px'; - pageLayout(); - if(onFlipBackFinish != null) { - onFlipBackFinish(); - } - } - - currentStep ++; - -} - -/** - * Function to initiate back flip. - * - * @param flipForwardOnComplete function - */ -function previousPage( flipBackOnComplete ) { - - onFlipBackFinish = flipBackOnComplete; - - if( (typeof(imageArray[pageIndex-1]) != "undefined") && (flipping == false)){ - nextPageFlip = setInterval(flipBack,smoothness); - flipping = true; - } -} - - -function pageFlipInitialize() { - -// console.log("ready"); - -// build the image array from jquery -imageArray = $(".pageimage"); - -//console.log(imageArray[0].src); - - pageLayout(); - -}; -// window ready |