Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Jan 2012
    Location
    Alabama
    Posts
    8
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Bypassing Google API for pageflip project

    Looking for some directional help, or to even see if this is possible. My client is reworking her site and hired me for my graphic design background, I'm handy with HTML and CSS, I can make sense of JavaScript but I wouldn't say I have strong skills there. She wants a book with realistic page flip effects (plenty of readily avail script for the page flip but also wants the book cover flip effect as well). I found exactly what she wants at http://20thingsilearned.com if you want to get the idea. It's open source, I've done custom artwork and can get the book and credits pages to load, but the sub chapters use Java to store them to the Google datastore, her server does not support Java and she's paid a year in advance so no chance asking her to move to another company!
    The important part is the source for the project involves taking the pages stored as stubs in .html format, then overlaying them on the pages instead of the typical <div> method. This is vital because the <div> method can't be indexed in search engines, and does not support clickable links. Ignoring the multi-language support on the 20 things site (only doing English), is there a way to have a js script move the .html to an SQL database instead of using Java to store them in the datastore? The other reason this is important, because I can easily do the old fashioned .html file for each page instead of using the PHP engine, but every time you would try to go to another chapter, it would have to reload the book cover animations. Smooth transition from one section to the next is paramount. The 20 things version avoids this by loading all the .html files in cache, and from what I understand just changes the z-index to bring the desired page to the front, so it appears you are only accessing one big html page when you are just seamlessly shifting one html page to the top and another to the bottom, invisible from the observers perspective.

    The PHP calls the following Java .class files, the first 3 collect the data from the .html files, and objectify serializes the data, stores to the datastore, and readies it for callback from the PHP
    import com.fi.twentythings.Article;
    import com.fi.twentythings.Locale;
    import com.fi.twentythings.Page;
    import com.googlecode.objectify.Objectify;
    import com.googlecode.objectify.ObjectifyService;

    Here's how the page parsing is setup:
    PHP Code:
    function parse_article_pages()
    {
        global 
    $pages$parsedPages$ofy$pageclass$articleclass$langcode;
        
    $querypages $ofy->query($pageclass)->filter('locale',$langcode)->list();  //->filter('stub', $currentArticle);    
        
        
    $i=1;
        
        foreach (
    $querypages as $page) {  //as $key => $value    
                    
            
    if($page->getPageNumber()=='1') {
                
    $i 1;
                
    $pagearticleparent $ofy->query($articleclass)->filter('locale'$langcode)->filter('stub'$page->getStub())->list()->get(0);
            }
            
            
    $pagetitle $pagearticleparent->getTitle();            
            
    $stub $page->getStub();
            
    $title $pagearticleparent->getTitle();
            
    $subtitle $pagearticleparent->getSubtitle();
            
    $template $page->getTemplate();
            
            
    $outputpage "<section class=\"".$template." title-".$stub." page-".$i."\">";
            
    $outputpage .= "<div class=\"page\">";
            
    $contents trim($page->getContent());
                
            
    $filename 'locale/'.$page->getLocale().'/pages/'.$stub.'-'.$i.'.html';
            
            
    // Get the page template name for the page
            
    $pageTemplate $templates[$i-1];
            
            
    $contents trimfile_get_contents($filename) );
            
            
    // Replace all dynamic variables in the page contents
            
    $contents preg_replace'/{TITLE}/is'$title$contents );
            
    $contents preg_replace'/{SUBTITLE}/is'$subtitle$contents );
            
            
    $outputpage .= $contents;
            
            
    // Close the wrapper element for the page
            
    $outputpage .= "</div>";
            
    $outputpage .= "</section>";
            
            
    $parsedPages'pages/'.$stub.'-'.$i.'.html' ] = $outputpage;

            
    $i++;    
        }

    Please tell me I can script this, and bypass Java! My plan B is horrid by comparison (still good, but a poor substitution).
    Edit: to avoid confusion, the query is run by JQuery v1.4.2.
    Last edited by Mishka; 01-12-2012 at 08:52 AM.

  • #2
    New to the CF scene
    Join Date
    Jan 2012
    Location
    Alabama
    Posts
    8
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Okay, no replies and a number of views. Not resolved yet, but perhaps what I've discovered since can help:
    I've worked out how to encode an array with json_encode() and json_decode() to let me upload it to SQL, but I only see this working for simple arrays and the ones I'm using have arrays inside of arrays. It's aching my brain on this one. It should work, the comments leftover in the source code imply that json was originally used before switching to the Google api. The only reason I can see for Google api was the added complexity of multi-language support. I've already rewritten the code to replace the instances where it detects the language to create the SEF friendly URL en-US/, and just changed it to create a URL directory called chapters/... so detecting a language is completely unnecessary now, so we only have to worry about one set of .html files written in English. The issue is how the array is setup:
    PHP Code:
    $ALL_CHAPTERS = array(
            array(
                
    'stub' => 'welcome',
                
    'numberOfPages' => 1,
                
    'title' => 'Welcome to blah blah blah!',
                
    'templates' => array(
                    
    'template-start-7'
                
    ),
                
    'active' => '1',    
                
    'hidden' => '1',                        
                
    'order' => 0
            
    ),
            array(
                
    'stub' => 'about',
                
    'numberOfPages' => 2,
                
    'title' => 'More about yadda yadda yadda',
                
    'subtitle' => 'she came, she saw, she went home.',
                
    'active' => '1',
                
    'templates' => array(
                    
    'template-start-7',
                    
    'template-inner-5'
                
    ),
                
    'order' => 1
            
    ), 
    And the last remaining issue after that is with the jQuery line:
    Code:
    if(x){e.username?x.open(n,e.url,e.async,e.username,e.password):x.open(n,e.url,e.async);
    When I remove reference to the Objectify.class this line breaks, obviously because it's not pointing to a valid URL. But the class call was made using a PHP/Java bridge, there's nothing in the actual PHP code or the jQuery code that indicates what URL it is pointing to. IE9 is the only browser that shows the break, the others ignore it and just load the book without the pages. How do I point jQuery to look at (myexample.sql.com, username, password)?

    UPDATE:
    PHP Code:
    $obj_service = new Java('com.googlecode.objectify.ObjectifyService');

    $ofy $obj_service->begin(); 
    Is part of the objectify.php which I completely removed all trace of since it only seemed concerned with detecting and storing the language preference. The $obj_service = new Java() has to be the db it's pointing to, because I get a "Call to a member function query() on a non-object" because $ofy is no longer defined after removing this page. The $obj_service is what I need help with, how do I point it to SQL instead of Java? And will this fix the jQuery break, or is there something else I need to add?
    Last edited by Mishka; 01-14-2012 at 11:32 PM. Reason: updated information for clarity


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •