Image tinyMCE

[focoves]

IMAGE LIST FEATURE ON TINYMCE

Hi Internet54, thanks for your reply

I have found a way to implement the IMAGE LIST feature, when you click on INSERT IMAGE of TinyMCE. **and** refreshing that lisk automatically.

1- Mofigy ADMIN/edit.php in order to add the IMAGE LIST (changes on bold)
// Theme options xxx
theme_advanced_buttons1 : "formatselect,styleselect,bold,italic,underline,justifyleft,justifycenter,justifyright,bullist,numlist,link,unlink,image,cleanup,removeformat",
theme_advanced_buttons2 : "",
theme_advanced_buttons3 : "",
theme_advanced_toolbar_location : "top",
theme_advanced_toolbar_align : "left",
theme_advanced_statusbar_location : "bottom",
theme_advanced_resizing : true,
relative_urls:false,
external_image_list_url : "tinymce_image_list.php"
});

2- Fill list contens and make it dinamically update:
Create the file ADMIN/tinymce_image_list.php
with this content (i am also attaching the file to make it easy)

Code:

<?php // this must be the very first line in your PHP file!

// You can't simply echo everything right away because we need to set some headers first!
$output = ''; // Here we buffer the JavaScript code we want to send to the browser.
$delimiter = "\n"; // for eye candy... code gets new lines

$output .= 'var tinyMCEImageList = new Array(';

$directory = "../data/uploads"; // Use your correct (relative!) path here

// Since TinyMCE3.x you need absolute image paths in the list...
$abspath = preg_replace('~^/?(.*)/[^/]+$~', '/\\1', $_SERVER['SCRIPT_NAME']);

if (is_dir($directory)) {
    $direc = opendir($directory);

    while ($file = readdir($direc)) {
        if (!preg_match('~^\.~', $file)) { // no hidden files / directories here...
             if (is_file("$directory/$file") && getimagesize("$directory/$file") != FALSE) {
                // We got ourselves a file! Make an array entry:
                $output .= $delimiter
                    . '["'
                    . utf8_encode($file)
                    . '", "'
                    . utf8_encode("$abspath/$directory/$file")
                    . '"],';
            }
        }
    }

    $output = substr($output, 0, -1); // remove last comma from array item list (breaks some browsers)
    $output .= $delimiter;

    closedir($direc);
}

$output .= ');'; // Finish code: end of array definition. Now we have the JavaScript code ready!

header('Content-type: text/javascript'); // Make output a real JavaScript file!

echo $output; // Now we can send data to the browser because all headers have been set!

?>

This function will explore your DATA/UPLOADS/ folder, and create a list with its files.
You can change the code to only check for JPG PNG GIF files, and it will be nice helping clients on not link an IMG SRC to a PDF file...

thanks to TinyMCE WIKI on http://wiki.moxiecode.com/index.php/Tiny...e_list_url to show me the way

should be this on scripts ?