Extension:FileTree

From MediaWiki.org
Jump to: navigation, search
MediaWiki extensions manual - list
Crystal Clear action run.png
FileTree

Release status: beta

Implementation Data extraction, Special page
Description A configurable, AJAX file browser plugin for jQuery.
Author(s) Guido Palacios (InforMedictalk)
Last version 0.0.1 (16/05/2009)
MediaWiki 1.1.14
License GPL / MIT
Download [[1]]
wiki/extensions/FileTree/README.txt
wiki/extensions/FileTree/CHANGELOG.txt
Example [2]
Parameters

$wgFileTreePath = '\\\Server\Path'; #The folder which should get displayed / $wgFileTreeScript = "FileTree.js"; or "FileTree_jquery.js";

Added rights

$wgAvailableRights[] = 'filetreesystem';

Check usage and version matrix

Contents

What can this extension do? [edit]

This extension displays a configurable AJAX/xHTML/jQuery based file browser by a given path.

The extension is based on the "jQuery File Tree" plugin. The "jQuery File Tree" itself is a configurable, AJAX file browser plugin for jQuery. You can create a customized, fully-interactive file tree with as little as one line of JavaScript code.


Usage [edit]

This extension will be available as Specialpage and used under Special:Specialpages.


Download instructions [edit]

Please cut and paste the code found below and place it in $IP/extensions/FileTree/FileTree.php. Note: $IP stands for the root directory of your MediaWiki installation, the same directory that holds LocalSettings.php.


Installation [edit]

To install this extension, add the following to LocalSettings.php:

#add configuration parameters here
#Include php file tree extension */
$wgFileTreePath = "\\\Server\Path";
$wgFileTreeScript = FileTree_jquery.js;   /* or based on jQuery -> FileTree_jquery.js */
#setup user rights here
require_once ("{$IP}/extensions/FileTree/FileTree.php");

and put the following code below in your extensions dir, named 'FileTree'.


Configuration parameters [edit]

User rights [edit]

To view the special page i invent the permission 'filetreesystem' which per default only SYSOP has.

Note: not everybody should be allowed to view the local file system and open files.
/* Set user right  */
$wgAvailableRights[] = 'filetreesystem';
$wgGroupPermissions['*']['filetreesystem'] = false;
$wgGroupPermissions['sysop']['filetreesystem'] = true;

Code [edit]

PHP Code [edit]

FileTree.php [edit]


  <?php
/**
 * FileTree extension - shows a valid xhtml file tree by a given path.
 *
 * @package MediaWiki
 * @subpackage Extensions
 * @author Guido Palacios, informedic.eu
 * @copyright &copy; 2009 Guido Palacios
 * @licence GNU General Public Licence 2.0 or later
 * ####################################################
 * Original php_file_tree script deliverd by
 * @orig-author Cory S.N. LaViska, http://abeautifulsite.net/
 * @documentation For documentation and updates, visit http://abeautifulsite.net/notebook.php?article=21
*/
 
# Alert the user that this is not a valid entry point to MediaWiki if they try to access the special pages file directly.
if (!defined('MEDIAWIKI')) {
        echo <<<EOT
To install FileTree extension, put the following line in LocalSettings.php:
require_once( "\$IP/extensions/FileTree/FileTree.php" );
EOT;
        exit( 1 );
}
 
$wgExtensionCredits['other'][] = array( 
        'name' => 'jQuery File Tree', 
        'author' => 'Cory S.N. LaViska', 
        'url' => 'http://abeautifulsite.net/notebook.php?article=58',
        'svn-date' => '$LastChangedDate: March 25th, 2008 (Thu, 7 May 2009) $',
        'svn-revision' => '$LastChangedRevision:$',
        'description' => 'A configurable, AJAX file browser plugin for jQuery.',
        'descriptionmsg' => 'filetree-desc',
        'version' => '1.0.1',
);
 
$wgExtensionCredits['specialpage'][] = array(
        'name' => 'FileTree',
        'author' => 'Guido Palacios',
        'url' => 'http://www.mediawiki.org/wiki/Extension:FileTree',
        'svn-date' => '$LastChangedDate: 2009-03-25 14:44:44 +0000 (Thu, 25 March 2008) $',
        'description' => 'Shows a configurable AJAX/xHTML/jQuery based file browser by a given path.',
        'descriptionmsg' => 'filetree-desc',
        'version' => '0.0.1',
);
 
/* Set basic settings */
$dir = dirname(__FILE__) . '/';
$wgAutoloadClasses['FileTree'] = $dir . 'FileTree_body.php'; # Tell MediaWiki to load the extension body.
$wgExtensionMessagesFiles['FileTree'] = $dir . 'FileTree.i18n.php';
$wgExtensionAliasesFiles['FileTree'] = $dir . 'FileTree.alias.php';
$wgSpecialPages['FileTree'] = 'FileTree'; # Let MediaWiki know about your new special page.
#$wgSpecialPageGroups['FileTree'] = 'pages';   # if set, the link "FileTree" on Special:Specialpages section "Another specialpages" will be removed

/* Set user right  */
$wgAvailableRights[] = 'filetreesystem';
$wgGroupPermissions['*']['filetreesystem'] = false;
$wgGroupPermissions['sysop']['filetreesystem'] = true;
 
 
?>

FileTree_body.php [edit]


<?php
class FileTree extends SpecialPage {
        function __construct() {
                parent::__construct( 'FileTree', 'filetreesystem' );
                wfLoadExtensionMessages('FileTree');
        }
 
        function execute( ) {
                global $wgRequest, $wgOut, $wgUser, $wgFileTreePath, $wgFileTreeScript, $wgScriptPath;
                if ( !$this->userCanExecute($wgUser) ) {
                        $this->displayRestrictionError();
                        return;
                }
                # Initialize page
                $this->setHeaders();
                # Get possible request data ($_GET;)
                $param = $wgRequest->getText('param');
                # Get valid xhtml file tree
                $output = filetree::wfFileTreeExtension($wgFileTreePath, '[link]');
                # Do header stuff
                $wgOut->addScript("<link href=\"$wgScriptPath/extensions/FileTree/styles/default/default.css\" rel=\"stylesheet\" type=\"text/css\" media=\"screen\" />\n");
                $wgOut->addScript("<script type=\"text/javascript\" src=\"$wgScriptPath/extensions/FileTree/jquery.js\"></script>\n");
                $wgOut->addScript("<script type=\"text/javascript\" src=\"$wgScriptPath/extensions/FileTree/$wgFileTreeScript\"></script>\n");
                # Include page contents
                $wgOut->addWikiText( wfMsg( 'filetree-desc') );
                $wgOut->addWikiText( wfMsg( 'filetree-browse') );
                # No errors? Filepath exists?
                if (empty($output)) $wgOut->showErrorPage('error', 'filetree-error-path');
                # Output
                $wgOut->addHTML( $output );
        }
 
        function wfFileTreeExtension($wgFileTreePath, $return_link, $extensions = array()) {
                // Generates a valid XHTML list of all directories, sub-directories, and files in $wgFileTreePath
                // Remove trailing slash
                if( substr($wgFileTreePath, -1) == "/" ) $wgFileTreePath = substr($wgFileTreePath, 0, -1);
                $code .= filetree::wfFileTreeExtension_dir($wgFileTreePath, $return_link, $extensions);
                return $code;
        }
 
        function wfFileTreeExtension_dir($wgFileTreePath, $return_link, $extensions = array(), $first_call = true) {
                // Recursive function called by wfFileTreeExtension() to list directories/files
                // Get and sort directories/files
                if( function_exists("scandir") ) {
                        $file = scandir($wgFileTreePath);
                } else {
                        $php_file_tree = '<strong>Error: wrong file path given. Please verify the given file path!</strong>';
                        $file = php4_scandir($wgFileTreePath);
                }
                natcasesort($file);
                // Make directories first
                $files = $dirs = array();
                foreach($file as $this_file) {
                        if( is_dir("$wgFileTreePath/$this_file" ) ) $dirs[] = $this_file; else $files[] = $this_file;
                }
                $file = array_merge($dirs, $files);
 
                // Filter unwanted extensions
                if( !empty($extensions) ) {
                        foreach( $file as $key => $value ) {
                                if( !is_dir("$wgFileTreePath/$value") ) {
                                        $ext = substr($value, strrpos($value, ".") + 1); 
                                        if( !in_array($ext, $extensions) ) unset($file[$key]);
                                }
                        }
                }
                if( count($file) > 2 ) { // Use 2 instead of 0 to account for . and .. "directories"
                        $php_file_tree = "<ul";
                        if( $first_call ) { $php_file_tree .= " class=\"php-file-tree\""; $first_call = false; }
                        $php_file_tree .= ">";
                        foreach( $file as $this_file ) {
                                if( $this_file != "." && $this_file != ".." ) {
                                        if( is_dir("$wgFileTreePath/$this_file") ) {
                                                // Directory
                                                $php_file_tree .= "<li class=\"pft-directory\"><a href=\"file:////$wgFileTreePath\">" . htmlspecialchars($this_file) . "</a>";
                                                $php_file_tree .= fileTree::wfFileTreeExtension_dir("$wgFileTreePath/$this_file", $return_link ,$extensions, false);
                                                $php_file_tree .= "</li>";
                                        } else {
                                                // File
                                                // Get extension (prepend 'ext-' to prevent invalid classes from extensions that begin with numbers)
                                                $ext = "ext-" . substr($this_file, strrpos($this_file, ".") + 1); 
                                                $link = str_replace("[link]", "$wgFileTreePath/" . urlencode($this_file), $return_link);
                                                $php_file_tree .= "<li class=\"pft-file " . strtolower($ext) . "\"><a href=\"file:////$link\">" . htmlspecialchars($this_file) . "</a></li>";
                                        }
                                }
                        }
                        $php_file_tree .= "</ul>";
                }
                return $php_file_tree;
        }
 
        // For PHP4 compatibility
        function php4_scandir($dir) {
                $dh  = opendir($dir);
                while( false !== ($filename = readdir($dh)) ) {
                        $files[] = $filename;
                }
                sort($files);
                return($files);
        }
 
}
 
?>


FileTree.i18n.php [edit]


<?php
/** Internationalization message file for FileTree Extension.
  * @addtogroup extension
**/
 
$messages = array();
 
$messages['en'] = array(
        'filetree'                      => 'File tree',
        'filetree-desc' => 'Shows a configurable AJAX/xHTML/jQuery based file browser by a given path.',
        'filetree-browse'       => '<strong>Browse the file tree:</strong>',
        'filetree-error-path'   => '<span style="color:red">The given file path has not been found or doesn\'t exist. Please verify if the path exists or if it has been misspelled incorrectly!</span>',
);
 
 
/** German (Deutsch)
 * @author Palacios
 */
$messages['de'] = array(
        'filetree'                      => 'Datei Baum',
        'filetree-desc'         => 'Zeigt einen konfigurierbaren AJAX/xHTML/jQuery basierenden Datei Browser anhand eines angebenen Pfades an.',
        'filetree-browse'       => '<strong>Durchsuchen Sie den Verzeichnisbaum:</strong>',
        'filetree-error-path'   => '<span style="color:red">Der angegebene Dateipfad wurde nicht gefunden oder existiert nicht. Bitte überprüfen Sie ob der Pfad existiert oder falsch eingegeben wurde</span>!',
);
 
 
?>


FileTree.alias.php [edit]


<?php
/**
 * Aliases for Special:FileTree
 *
 * @addtogroup Extensions
 * @author Daniel Kinzler, brightbyte.de
 * @copyright © 2006-2008 Daniel Kinzler and others
 * @license GNU General Public Licence 2.0 or later
 */
 
$aliases = array();
 
/** English
 * @author Daniel Kinzler, brightbyte.de
 */
$aliases['en'] = array(
        'FileTree' => array( 'FileTree', 'File Tree' ),
);
 
/** German (Deutsch)
 * @author Guido Palacios, informedic.eu
 */
$aliases['de'] = array(
        'FileTree' => array( 'DateiBaum', 'Datei Baum' ),
);
 
 
?>


JS Code [edit]

FileTree.js [edit]


/*
 
        == PHP FILE TREE JAVASCRIPT EXTENSION ==
 
                Based on the Expandable Listmenu Script by Daniel Nolan
                http://www.bleedingego.co.uk/webdev.php
 
                Modified by Cory S.N. LaViska
                http://abeautifulsite.net/
 
        == WHAT IT DOES ==
 
                This script makes the nested lists created by PHP File Tree expand and 
                collapse dynamically.
 
        == USAGE ==
 
                Include the script into the <head></head> section of the appropriate 
                page(s) as shown below:
 
                        <script src="php_file_tree.js" type="text/javascript"></script>
 
                All file trees generated by PHP File Tree will automatically collapse to 
                the top level (as specified by $directory) and become dynamic.
 
        == FAQS ==
 
                Q Can I have more than one file tree on one page?
                A Yes.  You can have as many as you want and they will all function as expected.
 
*/
 
function init_php_file_tree() {
        if (!document.getElementsByTagName) return;
 
        var aMenus = document.getElementsByTagName("LI");
        for (var i = 0; i < aMenus.length; i++) {
                var mclass = aMenus[i].className;
                if (mclass.indexOf("pft-directory") > -1) {
                        var submenu = aMenus[i].childNodes;
                        for (var j = 0; j < submenu.length; j++) {
                                if (submenu[j].tagName == "A") {
 
                                        submenu[j].onclick = function() {
                                                var node = this.nextSibling;
 
                                                while (1) {
                                                        if (node != null) {
                                                                if (node.tagName == "UL") {
                                                                        var d = (node.style.display == "none")
                                                                        node.style.display = (d) ? "block" : "none";
                                                                        this.className = (d) ? "open" : "closed";
                                                                        return false;
                                                                }
                                                                node = node.nextSibling;
                                                        } else {
                                                                return false;
                                                        }
                                                }
                                                return false;
                                        }
 
                                        submenu[j].className = (mclass.indexOf("open") > -1) ? "open" : "closed";
                                }
 
                                if (submenu[j].tagName == "UL")
                                        submenu[j].style.display = (mclass.indexOf("open") > -1) ? "block" : "none";
                        }
                }
        }
        return false;
}
 
window.onload = init_php_file_tree;

Download the latest jQuery source under [3] and place it in the FileTree root directory, if you want to use the jquery version.

Notice: It's needed to rename the file from e.g jquery-1.3.2.min.js to jquery.js

FileTree_jquery.js [edit]


$(document).ready( function() {
 
        // Hide all subfolders at startup
        $(".php-file-tree").find("UL").hide();
 
        // Expand/collapse on click
        $(".pft-directory A").click( function() {
                $(this).parent().find("UL:first").slideToggle("medium");
                if( $(this).parent().attr('className') == "pft-directory" ) return false;
        });
 
});


CSS Code [edit]

Create the folders /styles/default/images/ inside the FileTree root directory (/wiki/extensions/FileTree/) and create the following css file inside the default directory.

Notice: You need to create/upload your own image set to the "images" directory, if you are doing all that stuff manually.
You can also take the images out of the originial php_file_tree source which you can find here.
Just extract the content of the images folder out of the php_file_tree.zip to the images directory of the mediawiki extension
(/wiki/extensions/FileTree/styles/default/images/).

default.css [edit]

/* PHP File Tree Default Theme
 
        By Cory LaViska (http://abeautifulsite.net/)
        Featuring the Silk Icon Set from famfamfam (http://www.famfamfam.com/lab/icons/silk/)
 
*/
 
.php-file-tree {
        font-family: Georgia;
        font-size: 12px;
        letter-spacing: 1px;    line-height: 1.5;
}
 
        .php-file-tree A {
                color: #000000;
                text-decoration: none;
        }
 
        .php-file-tree A:hover {
                color: #666666;
        }
 
        .php-file-tree .open {
                font-style: italic;
        }
 
        .php-file-tree .closed {
                font-style: normal;
        }
 
        .php-file-tree .pft-directory {
                list-style-image: url(images/directory.png);
        }
 
        /* Default file */
        .php-file-tree LI.pft-file { list-style-image: url(images/file.png); }
        /* Additional file types */
        .php-file-tree LI.ext-3gp { list-style-image: url(images/film.png); }
        .php-file-tree LI.ext-afp { list-style-image: url(images/code.png); }
        .php-file-tree LI.ext-afpa { list-style-image: url(images/code.png); }
        .php-file-tree LI.ext-asp { list-style-image: url(images/code.png); }
        .php-file-tree LI.ext-aspx { list-style-image: url(images/code.png); }
        .php-file-tree LI.ext-avi { list-style-image: url(images/film.png); }
        .php-file-tree LI.ext-bat { list-style-image: url(images/application.png); }
        .php-file-tree LI.ext-bmp { list-style-image: url(images/picture.png); }
        .php-file-tree LI.ext-c { list-style-image: url(images/code.png); }
        .php-file-tree LI.ext-cfm { list-style-image: url(images/code.png); }
        .php-file-tree LI.ext-cgi { list-style-image: url(images/code.png); }
        .php-file-tree LI.ext-com { list-style-image: url(images/application.png); }
        .php-file-tree LI.ext-cpp { list-style-image: url(images/code.png); }
        .php-file-tree LI.ext-css { list-style-image: url(images/css.png); }
        .php-file-tree LI.ext-doc { list-style-image: url(images/doc.png); }
        .php-file-tree LI.ext-exe { list-style-image: url(images/application.png); }
        .php-file-tree LI.ext-gif { list-style-image: url(images/picture.png); }
        .php-file-tree LI.ext-fla { list-style-image: url(images/flash.png); }
        .php-file-tree LI.ext-h { list-style-image: url(images/code.png); }
        .php-file-tree LI.ext-htm { list-style-image: url(images/html.png); }
        .php-file-tree LI.ext-html { list-style-image: url(images/html.png); }
        .php-file-tree LI.ext-jar { list-style-image: url(images/java.png); }
        .php-file-tree LI.ext-jpg { list-style-image: url(images/picture.png); }
        .php-file-tree LI.ext-jpeg { list-style-image: url(images/picture.png); }
        .php-file-tree LI.ext-js { list-style-image: url(images/script.png); }
        .php-file-tree LI.ext-lasso { list-style-image: url(images/code.png); }
        .php-file-tree LI.ext-log { list-style-image: url(images/txt.png); }
        .php-file-tree LI.ext-m4p { list-style-image: url(images/music.png); }
        .php-file-tree LI.ext-mov { list-style-image: url(images/film.png); }
        .php-file-tree LI.ext-mp3 { list-style-image: url(images/music.png); }
        .php-file-tree LI.ext-mp4 { list-style-image: url(images/film.png); }
        .php-file-tree LI.ext-mpg { list-style-image: url(images/film.png); }
        .php-file-tree LI.ext-mpeg { list-style-image: url(images/film.png); }
        .php-file-tree LI.ext-ogg { list-style-image: url(images/music.png); }
        .php-file-tree LI.ext-pcx { list-style-image: url(images/picture.png); }
        .php-file-tree LI.ext-pdf { list-style-image: url(images/pdf.png); }
        .php-file-tree LI.ext-php { list-style-image: url(images/php.png); }
        .php-file-tree LI.ext-png { list-style-image: url(images/picture.png); }
        .php-file-tree LI.ext-ppt { list-style-image: url(images/ppt.png); }
        .php-file-tree LI.ext-psd { list-style-image: url(images/psd.png); }
        .php-file-tree LI.ext-pl { list-style-image: url(images/script.png); }
        .php-file-tree LI.ext-py { list-style-image: url(images/script.png); }
        .php-file-tree LI.ext-rb { list-style-image: url(images/ruby.png); }
        .php-file-tree LI.ext-rbx { list-style-image: url(images/ruby.png); }
        .php-file-tree LI.ext-rhtml { list-style-image: url(images/ruby.png); }
        .php-file-tree LI.ext-rpm { list-style-image: url(images/linux.png); }
        .php-file-tree LI.ext-ruby { list-style-image: url(images/ruby.png); }
        .php-file-tree LI.ext-sql { list-style-image: url(images/db.png); }
        .php-file-tree LI.ext-swf { list-style-image: url(images/flash.png); }
        .php-file-tree LI.ext-tif { list-style-image: url(images/picture.png); }
        .php-file-tree LI.ext-tiff { list-style-image: url(images/picture.png); }
        .php-file-tree LI.ext-txt { list-style-image: url(images/txt.png); }
        .php-file-tree LI.ext-vb { list-style-image: url(images/code.png); }
        .php-file-tree LI.ext-wav { list-style-image: url(images/music.png); }
        .php-file-tree LI.ext-wmv { list-style-image: url(images/film.png); }
        .php-file-tree LI.ext-xls { list-style-image: url(images/xls.png); }
        .php-file-tree LI.ext-xml { list-style-image: url(images/code.png); }
        .php-file-tree LI.ext-zip { list-style-image: url(images/zip.png); }
        /* You can add millions of these... */

Problems [edit]

Warning: This extension doesn't work with mozilla Firefox Browser! Maybe someone knows a workaround?

See also [edit]