How to create a goto function in the flexbook component?

Hey experts!

First of all, I gotta say that I'm working on a personal project which is based on the flexbook component (developed by Ely Greenfield). I'm taking a chance by asking this question because I know it is a pretty popular component and many people already experienced it.

Basically, I'm trying to customize the component and add a goto function which would allow the user to enter a page number in a textbox and directly jump to this page when clicking a button.

However, my problem is that I *think* I found a bug in the flexbook: when the application launch and inserts the page objects, the first page created (which is the cover in my case) has the 'currentPageIndex' property set to -1.

This bugs me right now because I was using this property to determine where the book should go.So right now, when the user wants to go on the first cover page, he has to enter -1 in the textbox. This also cause a problem when I try to print the 'currentPageIndex' in the page to show what's the current page number.

Can anyone please check my function and help me out to correct this?
The source of the flexbook can be found here: http://demo.quietlyscheming.com/source/Book.zip
My customized flexbook is attached (just rename the extention of the file attached to .mxml)

Thanks a lot for your help. Have a nice day.
Frank

/* This is the function used to go to a specific page */
			private function goto():void
			{
				/* We check is the number entered is smaller than the number of page in the book.
				    If the number is smaller than 0, we will show the cover (first page) since it's currentPageIndex is -1
				if(int(lblPage.text) <= book.pageCount && int(lblPage.text) => 0)
				{
					book.turnToPage(int(lblPage.text));
				}
				
				/* Show the cover page */
				else { book.turnToPage(-1); }
			}
 
 
 
 
/* This is the button used to jump to a specific page of the flexbook */
		<Button label="Goto" click="goto()" fillColors="[#f47a00, #ff0000]" fillAlphas="[1.0, 1.0]" color="#ffffff" fontWeight="bold" fontSize="14" horizontalCenter="265" bottom="10" />
 
		/* This is the textbox in which the user enters a page number */
		<mx:TextInput id="lblPage" text="1" x="335" y="435" width="25"/>

Open in new window

The_Kingpin08Asked:
Who is Participating?

[Webinar] Streamline your web hosting managementRegister Today

x
 
julianopolitoConnect With a Mentor Commented:
Is it what you are looking for?
private function goToPage():void{
 
    //If user asks for page 1, he gets the cover
    //if user asks for page 2 or 3, gets the same also 4 or 5 and so on
    var userPage:int = int(pageNum.text);//this should be from 1 to pageCount
    
    if(userPage == 1){
    	userPage = -1;
    }else if(userPage%2 == 1){
   	///requested page is odd
   	userPage = (userPage - 1)/2;
    }else{
    	//requested page is even
    	userPage = userPage/2;
    }
 
    book.turnToPage(userPage);
    if(userPage == -1){
    	pageOf.text = "Page " + (userPage+2);
    }else{
    	pageOf.text = "Page " + (userPage+1) + " - " + (userPage+2);	
    }			
}

Open in new window

0
 
julianopolitoCommented:
can't you just calculate the offset? for example:

private function goto():void{
      /* We check is the number entered is smaller than the number of page in the book.
      If the number is smaller than 0, we will show the cover (first page) since it's currentPageIndex is -1
      */
      var userPage:int = int(lblPage.text);//this should be from 1 to pageCount
      var realPage:int = userPage-2;//the real page with offset, so if user asks for the 1st page, he writes 1, but gets -1, cover page
      if(userPage <= book.pageCount && userPage > 0){
            book.turnToPage(realPage);
      }
}
0
 
julianopolitoCommented:
And your attach did not came. Send it again please so I can take a look and help you better if still needed.
0
Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

 
The_Kingpin08Author Commented:
Hey there!

Thanks a lot for the help. I try your function but I have the same issues:

- The even pages (2,4,6,8) will always be on the left (because the cover on page 1 is on the right)
- book.turnToPage(realPage); doesn't work because the function doesn't take the number of a single page, but the index of both pages. I had to modify it to make it work:

book.turnToPage(Math.round(realPage/2));

- Still, if I enter the number 7 in the textbox, it shows me the pages 8-9. I try hardcoding the value +1 but it still doesn't work correctly. Also, with the modification I made to your call, I can't see the cover (page 1, currentPageIndex -1) anymore...
- I'm also trying to print the current page number but it's really far from working!!! It doesn't print the current page number. I try using a function and call it everytime the user click a button, but the variables were all messed up.

I would really appreciate if you had a second to check my code to see if you could find my mistake.

I'll reattach my file, so just rename it to .mxml.

Thanks a lot again, trully appreciate.
Framl
flexbook.txt
0
 
julianopolitoCommented:
I'm looking at the code. Soon I send you an answer
0
 
The_Kingpin08Author Commented:
Works perfectly! Thanks a lot.
Frank
0
All Courses

From novice to tech pro — start learning today.