1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.
  2. This forum has been archived. New threads and replies may not be made. All add-ons/resources that are active should be migrated to the Resource Manager. See this thread for more information.

PHP file that basically functions as folder image viewer

Discussion in 'Other Resources [Archive]' started by masterchief, Apr 6, 2011.

  1. masterchief

    masterchief Well-Known Member

    This piece of code contains method for creating an array of images from folder and allowing the viewer to navigate FIRST,LAST,PREV, NEXT... maintaining the contents of the image folder is the only tasking required after setting this up. I need your help figuring out how to set this up inside an XenForo page.. I was thinking that this would go well with something like [LN]-Blog ... peace

    Example: http://www.masterchief.com/community/comicgallery.php

    Code:
    
    <?php
    // ------------------------------------------------------------------------- //
    // Comic Gallery 1.2                                                        //
    // ------------------------------------------------------------------------- //
    // Copyright (C) 2005 Stuart Robertson                                      //
    // http://www.designmeme.com/                                                //
    // ------------------------------------------------------------------------- //
    // This program is free software; you can redistribute it and/or modify      //
    // it under the terms of the GNU General Public License as published by      //
    // the Free Software Foundation; either version 2 of the License, or        //
    // (at your option) any later version.                                      //
    //  A summary is available at http://creativecommons.org/licenses/GPL/2.0/  //
    // ------------------------------------------------------------------------- //
    // Edit the code below to configure your Comic Gallery                      //
    // ------------------------------------------------------------------------- //
    
    // Your images directory, relative to the page calling this script
    $imagedir="comics";
    
    // To start at the last image use "last"
    $startimage="first";
    
    // Copyright name to display, for none use " "
    $copyright=" ";
    
    // Creative Commons license, for none use " "
    // example: "http://creativecommons.org/licenses/by/2.0/"
    $creativecommons=" ";
    
    // type of divider, for none use " "
    $divider="&middot;";
    
    // show arrows, for none use 0
    $arrows=1;
    
    // show back and next, for none use 0
    $backnext=1;
    
    // show back and next, for none use 0
    $firstlast=1;
    
    // show numbers, for none use 0
    $numbers=1;
    
    // numbers per line
    $linelength=10;
    
    // navigation position, for aboe use "above"
    $navplacement="below";
    
    // ------------------------------------------------------------------------- //
    // Do not edit below this line
    // ------------------------------------------------------------------------- //
    
    //    initialize variables
    $pics=array();
    $count=0;
    
    // Open the directory
    $comicdir=opendir($imagedir);
    
    //    read directory into pics array
    while (($file = readdir($comicdir))!==false) {
        //    filter for jpg, gif or png files...
        if (substr($file,-4) == ".jpg" || substr($file,-4) == ".gif" || substr($file,-4) == ".png" || substr($file,-4) == ".JPG" || substr($file,-4) == ".GIF" || substr($file,-4) == ".PNG"){
            $pics[$count] = $file;
            $count++;
            }
    }
    closedir($comicdir);
    
    // check for the picture to view
    $pic=$_GET['p'];
    //    if no picture variable...
    if ($pic=="") {
        if ($startimage!="last"){ $pic=1; }
        else { $pic=$count; }
    }
    
    //    sort the filenames alphabetically
    sort($pics);
    reset($pics);
    
    //    determine which picture to get
    for ($f=0;$f<=sizeof($pics)-1;$f++){if ($pic==$pics[$f]){$selected = $f+1;}}
    
    //  check for javascript...
    if ($pic && !preg_match("/javascript/",$pic)){
    
        //  get current image file
        $current=$pics[$pic-1];
        $next=$pic+1;
        if ($next > sizeof($pics)){ $next=sizeof($pics); }
        $back=$pic-1;
        if ($back < 1){ $back=1; }
    
        //  display image above nav
        if ($navplacement!="above"){
            if (substr($current,-4) == ".jpg" || substr($current,-4) == ".gif" || substr($current,-4) == ".png" || substr($current,-4) == ".JPG" || substr($current,-4) == ".GIF" || substr($current,-4) == ".PNG"){
                    if ($pic < sizeof($pics)){
                        echo"\n<p id=\"cg_img\"><a href=\"?p=".$next."\"><img src=\"".$imagedir."/".$current."\" alt=\"Next\" /></a></p>\n";
                    } else {
                    echo"\n<p id=\"cg_img\"><img src=\"".$imagedir."/".$current."\" alt=\"End\" /></p>\n";
                    }
                }
        }
    
        // display back and next
        if ($backnext != 0 || $arrows != 0){
                if (sizeof($pics) > 1){
                    echo "<p id=\"cg_nav1\">";
                    if ($firstlast != 0){
                        if ($pic > 1){    echo "<a href=\"?p=1\" id=\"cg_first\"><span>First</span></a>"; }
                        else { echo "<span id=\"cg_first\"><span>First</span></span>"; }
                        echo "<span class=\"cg_divider\"> ".$divider." </span>";
                    }
                    if ($pic > 1){
                        echo "<a href=\"?p=".$back."\" id=\"cg_back\"><span>";
                        if ($arrows != 0) { echo "&laquo; "; }
                        if ($backnext != 0) { echo "Back"; }
                        echo "</span></a>";
                    } else {
                        echo "<span id=\"cg_back\"><span>";
                        if ($arrows != 0) { echo "&laquo; "; }
                        if ($backnext != 0) { echo "Back"; }
                        echo "</span></span>";
                    }
                    echo "<span class=\"cg_divider\"> ".$divider." </span>";
                    if ($pic < sizeof($pics)){
                        echo "<a href=\"?p=".$next."\" id=\"cg_next\"><span>";
                        if ($backnext != 0) { echo "Next"; }
                        if ($arrows != 0) { echo " &raquo;"; }
                        echo "</span></a>";
                    } else {
                        echo "<span id=\"cg_next\"><span>";
                        if ($backnext != 0) { echo "Next"; }
                        if ($arrows != 0) { echo " &raquo;"; }
                        echo "</span></span>";
                    }
                    if ($firstlast != 0){
                        echo "<span class=\"cg_divider\"> ".$divider." </span>";
                        if ($pic < sizeof($pics)){    echo "<a href=\"?p=". sizeof($pics) ."\" id=\"cg_last\"><span>Last</span></a>"; }
                        else { echo "<span id=\"cg_last\"><span>Last</span></span>"; }
                    }
                    echo "</p>\n";
                }
        }
    
        // display numbers
        if ($numbers != 0){
            if (sizeof($pics) > 1){
                //    display textlinks
                echo "<p id=\"cg_nav2\">";
                // loop over images
                for ($f=1;$f<=sizeof($pics);$f++){
                    // if the link to the pic is the selected one, display a bold number and no link
                    if ($pic==$f){echo "<b>".$f."</b>";}
                    // otherwise display the link
                    else{echo "<a href=\"?p=".$f."\">".$f."</a>";}
                    // add dividers and linebreaks
                    if (($f % $linelength) == 0) {
                        echo "<br />";
                    }
                    else {
                        if ($f!=sizeof($pics)){
                            echo "<span class=\"cg_divider\"> ".$divider." </span>";
                        }
                    }
                }
                echo "</p>\n";
            }
        }
    
        //  display image below nav
        if ($navplacement=="above"){
            if (substr($current,-4) == ".jpg" || substr($current,-4) == ".gif" || substr($current,-4) == ".png" || substr($current,-4) == ".JPG" || substr($current,-4) == ".GIF" || substr($current,-4) == ".PNG"){
                    if ($pic < sizeof($pics)){
                        echo"\n<p id=\"cg_img\"><a href=\"?p=".$next."\"><image src=\"".$imagedir."/".$current."\" alt=\"Next\" border=\"0\"></a></p>\n";
                    } else {
                    echo"\n<p id=\"cg_img\"><image src=\"".$imagedir."/".$current."\" alt=\"End\" /></p>\n";
                    }
                }
        }
    
        // display copyright
        echo "<p id=\"cg_credits\">";
        if ($creativecommons != " "){ echo "<a href=\"".$creativecommons."\" title=\"Creative Commons License\">Some Rights Reserved</a> ".$divider." "; }
        else {
            if ($copyright != " "){ echo "&copy; ".$copyright." ".$divider." "; }
        }
        // If you make use of this script, be nice and keep the link back to my site :-)
        echo "Powered by <a href=\"http://designmeme.blogspot.com/2005/05/comic-gallery-script.html/\">ComicGallery</a></p>\n";
    }
    ?>
    
    
     
  2. Brogan

    Brogan XenForo Moderator Staff Member

    Moved to other resources.
     
  3. EQnoble

    EQnoble Well-Known Member

    Like that?


    Anything more intricate would require serious editing of that script, luckily it is under GNU licensing so you can do what you want with it :).
     
  4. masterchief

    masterchief Well-Known Member

    thats the idea... looks great
     
    EQnoble likes this.
  5. EQnoble

    EQnoble Well-Known Member

    I am going to try and rewrite this thing and do some custom css (what you saw there was 6 changes to the code - css dropped - all wrapped in an iframe).
    The way I did it allows me to play around with it to see how I want to style it with out breaking my XF :). Once I have settled upon sizes, colors and placement I will edit the script to use different classes as I was having issues with the default way the script was written (maybe has to do that it was written for WP , I dunno)

    At any rate you only really need to upload the files to your server (I put them in their own dir.) and include literally one or two lines ( I don't remember, bare with me I am stupid sick right now) in whatever page your calling it to. I am going to start from scratch in a few minutes and try to include this in a page a totally different way then completely rewrite this whole thing. If I end up liking my results I will donate to the original author and re release the modified version under GNU as well and upload it here (somewhere @XF).

    In the mean time do you want a simple guide to include it in an iframe on a XF created page?
     
  6. masterchief

    masterchief Well-Known Member

    I dont think we need the page numbers, or at least have ability to set display of them ON/OFF, the image display should default to most recent image (last image in image directory???) and have ability to set to first or most recent image

    I think an iframe would be best.. I am also looking for ability to provide blog type comment from comic author that paginates under the image, with page navigation.

    Multiple comics can be hosted each having their own unique page with designated image directories is what I envision.

    This setup will allows website operator to host webcomics from anyone, in addition to personal projects, no limit.

    Ability to provide image prints and comic prints for sale is desirable.. signed / unsigned

    This addon has potential to bring in more XenForo customers. Marvel Comics has digital online comics as well as others, so there is a big audience for this stuff that exists already.

    My favorite webcomic is Runners Universe

    More than willing to compensate you for this.
     
  7. masterchief

    masterchief Well-Known Member

    more than anything else, I would want this to fit the XenForo system.
     
  8. EQnoble

    EQnoble Well-Known Member

    Well see that's the thing ...I do not yet have the skill to construct a proper addon yet...I am still learning. Pretty much anything you see me do up until that point will be done manually per mod. I am just learning php and mastery is quite a long way from where I stand I think. That is a massive undertaking for me as the best I could do would fall well short of what you desire and I really can't take your money even if I could...principle wise and that's just me.

    I can make a medium rare type of mock up of that idea but if you want one well done your probably better off coming up with a visual representation if you can of what you want be it on photoshop or hand-sketched and scanned or photographed and make a request for this in the "Requests" category.

    At any rate I will share what I have come up with as far as this comic script is concerned here or in another thread and link to it when I finish. I have also finished semi-incorporating chess into xf with kotomi and just need to figure out how to have it use my xenforo DB instead of it's own so it can use registered users of xf rather than having users need to register at the chess page. Either way like I said I will share pretty much almost anything worthy (at the time and considering my skill level) that I feel someone may or may not use. That's my 2cents and it will never be worth a paypal donation. :) I'll update here with whatever travesty I manage to render...cheers to yah pal.
     
  9. boban

    boban Well-Known Member

    Create New Add-on

    Add-on ID: Comic
    Title: Comic Gallery
    Version String: 1
    Version ID: 1

    Create New Route Prefix

    Route Prefix: comic
    Route Type: Public
    Route Class: Comic_Route_Prefix_Prcomic
    Use class to build link: Always
    Add-on: Comic Gallery

    Create New Template

    Template Name: EP_Comic

    Add-on: Comic Gallery

    Template code:

    PHP:
    <xen:title>Comic Gallery</xen:title>
    <
    xen:pagenav link="comic" page="{$page}perpage="{$itemsPerPage}total="{$totalItems}/>
    <
    br style="clear: both;" />
    <
    div class="sredina">
    {
    xen:raw $html}
    </
    div>
    <
    xen:pagenav link="comic" page="{$page}perpage="{$itemsPerPage}total="{$totalItems}/>
    Create New Code Event Listener

    Listen to Event: navigation_tabs
    Execute Callback: Comic_Listeners_Navigation ::navtabs
    Callback Execution Order: 10
    Enable callback execution
    Add-on: Comic Gallery

    Comicgallery.php
    Your images directory, relative to the page calling this script
    $imagedir="../comic";

    Demo: http://206.123.115.165/xforum/comic/
     

    Attached Files:

    gordy, XFacil.com and masterchief like this.
  10. EQnoble

    EQnoble Well-Known Member

    Well...that was fast...:) I think you found your modder masterchief or rather he/she found you. lol

    Awesome job boban..I am looking at the addon now and comparing it to the original script...hope I can understand how you did this with such ease.
     
  11. masterchief

    masterchief Well-Known Member

    @boban . I really like what you did to get this script working inside XenForo. There is much more to do. Thank you! One very important issue is to be able to create any number of comic titles using this addon, all of them independent, each own image directory. I want to give comic developer option of combining imagery and text, so a journal/blog whatever to call it would be paramount with page navigation. I would prefer to lose the page numbering concept and go to FIRST - PREVIOUS - NEXT - LAST navigation scheme, with ability to toggle display of FIRST/LAST comic page as default for the viewer .. FYI - we are looking at display of 750px width and 1152px height MAX comic images... panels and covers

    I am gonna play with this one for a while. Great work!

    QUESTION: what advantages are to be gained by using mySQL tables for this project? I was thinking that the images themselves could be accessed directly using filesystem, focusing on realistic filenaming convention in order to control display order. seems we are finally getting somewhere... peace.

    @EQnoble whatcha think, this helping you out at all?

    peace to all... and THANK YOU!
     
  12. masterchief

    masterchief Well-Known Member

    I am using External Pages addon and code from this thread, this more closely resembling where I want to go with this:

    http://www.masterchief.com/community/en/comicgallery

    UPDATE: I have added manual generated blog entry section under the comic image. How can we do that??
     
  13. boban

    boban Well-Known Member

    comicgallery.php

    add:
    $mycomment='My Comment <div><p> etc ';

    $viewParams = array(
    'mycomment' => $mycomment,
    .............
    .....

    In template add:

    <div class="">
    {xen:raw $mycomment}
    </div>
     
  14. masterchief

    masterchief Well-Known Member

    I want to be able to provide comments from the webpage... like you would normally expect to be able to do..
     

Share This Page