1 Topic by Guido Neele

  • Guido Neele
  • Member
  • Offline
  • From: The Netherlands
  • Registered: 2009-11-25
  • Posts: 80

Topic: Another File Browser

Hi there,

I'm right in the middle of writing a file browser for the TinyMCE editor. I've come a long way but it isn't finished just yet. I would really like to know what you think of it so far. Please give it a test and let me know if you like it or not. If you come across any bugs, faults, browser quirks or whatever please leave a post.

Demo: http://www.neele.name/filebrowser/

Features
- Multiple view layouts (Large images, small images, list, content, tiles and details)
- Flash file upload
- Multiple file selections via shift click and ctrl click
- 30+ file icons
- Search
- Filtering
- Image caching
- Copy, cut, paste and delete (files and folders)
- Create new folders
- Multiple languages
      + Catalan direct link --> http://www.neele.name/pdw_file_browser/ … anguage=ca
      + Dutch direct link --> http://www.neele.name/pdw_file_browser/ … anguage=nl
      + English direct link --> http://www.neele.name/pdw_file_browser/ … anguage=en
      + French direct link --> http://www.neele.name/pdw_file_browser/ … anguage=fr
      + German direct link --> http://www.neele.name/pdw_file_browser/ … anguage=de
      + Greek direct link --> http://www.neele.name/pdw_file_browser/ … anguage=el
      + Russian direct link --> http://www.neele.name/pdw_file_browser/ … anguage=ru
      + Swedish direct link --> http://www.neele.name/pdw_file_browser/ … anguage=se
      + Spanish direct link --> http://www.neele.name/pdw_file_browser/ … anguage=es
- File information pane
- Renaming folders and files
- Multiple skins
      + Redmond (standard)
      + Cupertino direct link --> http://www.neele.name/pdw_file_browser/ … =cupertino
      + Mountain View direct link --> http://www.neele.name/pdw_file_browser/ … untainview

To do list
- Editing of images
- Preview pane (maybe)
- If you know more....

Download: http://sourceforge.net/projects/pdwfilebrowser/

Please give it a go!

Thanks,

Guido

Last edited by Guido Neele (2010-09-13 13:25:19)

2 Reply by imglib_dev

  • imglib_dev
  • Member
  • Offline
  • Registered: 2010-01-12
  • Posts: 16

Re: Another File Browser

Nice, but I could not immediately figure how to exit from dialogue to create the directory or download. Think about it.

imgLib - image manager --- jstoys.org.ua
Sory for my bad english (Ukraine)

3 Reply by scooter

  • scooter
  • Member
  • Offline
  • Registered: 2006-07-17
  • Posts: 3

Re: Another File Browser

This is looking very nice, I would love to give it a try on my server and suggest feedback!

4 Reply by amanuo

  • amanuo
  • Member
  • Offline
  • Registered: 2010-03-17
  • Posts: 1

Re: Another File Browser

Best looking/working TinyMCE filebrowser i've come across!
Looking forward to a release. It's definitely functional enough already.

5 Reply by BonySoft

  • BonySoft
  • Member
  • Offline
  • Registered: 2008-01-21
  • Posts: 14

Re: Another File Browser

Looks and feels great!

6 Reply by Guido Neele

  • Guido Neele
  • Member
  • Offline
  • From: The Netherlands
  • Registered: 2009-11-25
  • Posts: 80

Re: Another File Browser

Thanks for the feedback.

This weekend I will try to fix some lose ends and hopefully make it download ready.
The image editor will not be included because I currently don't have the time to write the code for it. I will implement it later but this could take months to finish because my time is limited these days.

Guido

Last edited by Guido Neele (2010-05-04 21:15:04)

7 Reply by Guido Neele

  • Guido Neele
  • Member
  • Offline
  • From: The Netherlands
  • Registered: 2009-11-25
  • Posts: 80

Re: Another File Browser

Download PDW File Browser Version 1.0 Beta

http://www.neele.name/filebrowser/

Read the README.txt for more information.

8 Reply by BonySoft

  • BonySoft
  • Member
  • Offline
  • Registered: 2008-01-21
  • Posts: 14

Re: Another File Browser

Awesome! Already testing and it works cool Thanks, Guido Neele.

.. Can't insert an image by double-clicking one, only by 'Insert' button. Is that supposed to be?

Last edited by BonySoft (2010-05-09 21:32:17)

9 Reply by redeye86

  • redeye86
  • Member
  • Offline
  • Registered: 2010-05-21
  • Posts: 5

Re: Another File Browser

Hello,

i just created a german language file:

<?PHP
//filename: lang/de.php
$lang = array(
    "decimal seperator" => ",",
    "thousands separator" => ".",
    "datetime format" => "d.m.Y H:i", // www.php.net/manual/en/function.date.php
    "Insert" => "Einfügen",
    "File" => "Datei",
    "Root" => "Root",
    "Close" => "Schließen",
    "New folder" => "Neuer Ordner",
    "Upload" => "Upload",
    "Clipboard" => "Zwischenablage",
    "Items" => "Objekt(e)",
    "Change view" => "Ansicht wechseln",
    "View" => "Ansicht",
    "Large images" => "Große Bilder",
    "Small images" => "Kleine Bilder",
    "List" => "Liste",
    "Details" => "Details",
    "Tiles" => "Kacheln",
    "Content" => "Inhalt",
    "Show the preview pane" => "Vorschauleiste anzeigen",
    "Help" => "Hilfe",
    "Search" => "Suche",
    "Dimensions" => "Dimension",
    "Filename" => "Name",
    "Filetype" => "Typ",
    "Size" => "Größe",
    "Modified on" => "Geändert am",
    "Directory" => "Ornder",
    "Add a new folder" => "Neuen Ordner hinzufügen",
    "New folder is created in" => "Neuer Ordner wird erstellt in",
    "Name of the new folder" => "Ordnername",
    "Create folder" => "Neuen Ordner erstellen",
    "Upload a new file" => "Datei hochladen",
    "Image editor" => "Bildeditor",
    "Browse" => "Durchsuchen...",
    "Upload Queue" => "Uploadwarteschlange",
    "Currently uploading in folder" => "Lade in Verzeichnis",
    "Select your file" => "Datei(en) auswählen",
    
    //Context menu
    "cmenu_insert" => "Einfügen",
    "cmenu_edit" => "Bild bearbeiten",
    "cmenu_copy" => "Kopieren",
    "cmenu_cut" => "Ausschneiden",
    "cmenu_paste" => "Einfügen",
    "cmenu_delete" => "Löschen",
    "cmenu_delete_confirm_message_folder" => "Wollen Sie diesen Ordner und seinen Inhalt wirklich löschen?",
    "cmenu_delete_confirm_message_file" => "Wollen Sie diese datei wirklich löschen?",
    "cmenu_delete_confirm_message_image" => "Wollen Sie dieses bild wirklich löschen?",
    "cmenu_open" => "Öffnen",
    "cmenu_large_images" => "Große Bilder",
    "cmenu_small_images" => "Kleine Bilder",
    "cmenu_list" => "Liste",
    "cmenu_details" => "Details",
    "cmenu_tiles" => "Kacheln",
    "cmenu_content" => "Inhalt",
    "cmenu_refresh" => "Aktualisieren",
    "cmenu_new_folder" => "Neuer Ordner",
    "cmenu_rename" => "Umbenennen",
    
    //Messages
    "folder_tampered_with" => "Der Verzeichnispfad wurde zwischenzeitlich geändert!",
    "folder_name_invalid" => "Ordner konnte nicht erstellt werden!<br />Die folgenden Zeichen sind nicht erlaubt: ^ \\ / ? * \" ' < > : |",
    "create_folder_successful" => "Neuer Ordner wurde erstellt!",
    "create_folder_failed" => "Ordner konnte nicht erstellt werden!",    
    "file_tampered_with" => "Der Verzeichnispfad wurde zwischenzeitlich geändert!",
    "loadfolder_error_1" => "Der Verzeichnispfad wurde zwischenzeitlich geändert!",
    "delete_error_1" => "Der Datei- oder Verzeichnispfad wurde zwischenzeitlich geändert!",
    "delete_error_2" => "Datei löschen fehlgeschlagen!",
    "delete_error_3" => "Ordner löschen fehlgeschlagen",
    "delete_success" => " Dateien erfolgreich gelöscht!",
    "select_one_file" => "Bitte wählen Sie nur eine Datei!",
    "insert_cancelled" => "Einfügen abgebrochen!",
    "directory_already_exists" => "Ornder existiert bereits!",
    "file_already_exists" => "Datei existiert bereits!",
    "rename_failed" => "Umbenennen fehlgeschlagen!",
    "rename_file" => "Geben Sie einen Namen für {0}{1} an. Die Dateierweiterung wird automatisch hinzugefügt!{1}(Folgende Zeichen sind nicht erlaubt {2})",
    "rename_folder" => "Geben Sie einen Namen für {0}{1} an(Folgende Zeichen sind nicht erlaubt {2})"
);

?>

Last edited by redeye86 (2010-05-21 14:03:41)

10 Reply by BonySoft

  • BonySoft
  • Member
  • Offline
  • Registered: 2008-01-21
  • Posts: 14

Re: Another File Browser

Russian language file:

<?php
/*
Language: Russian
File: lang/ru.php
*/ 
$lang = array(
    "decimal seperator" => ".",
    "thousands separator" => ",",
    "datetime format" => "d.m.Y H:i", // www.php.net/manual/en/function.date.php
    "Insert" => "????????",
    "File" => "????",
    "Root" => "??????",
    "Close" => "???????",
    "New folder" => "????? ?????",
    "Upload" => "????????",
    "Clipboard" => "????? ??????",
    "Items" => "????????",
    "Change view" => "???????? ???",
    "View" => "???",
    "Large images" => "???????????",
    "Small images" => "??????",
    "List" => "??????",
    "Details" => "???????",
    "Tiles" => "??????",
    "Content" => "?????????",
    "Show the preview pane" => "???????? ?????? ?????????????",
    "Help" => "??????",
    "Search" => "?????",
    "Dimensions" => "??????????",
    "Filename" => "??? ?????",
    "Filetype" => "???",
    "Size" => "??????",
    "Modified on" => "????????",
    "Directory" => "??????????",
    "Add a new folder" => "???????? ????? ?????",
    "New folder is created in" => "????? ????? ????? ??????? ?",
    "Name of the new folder" => "???????? ????? ?????",
    "Create folder" => "??????? ????? ?????",
    "Upload a new file" => "???????? ????? ????",
    "Image editor" => "???????? ???????????",
    "Browse" => "???????...",
    "Upload Queue" => "??????? ???????",
    "Currently uploading in folder" => "???????????? ? ?????",
    "Select your file" => "???????? ????(?)",
    
    //Context menu
    "cmenu_insert" => "????????",
    "cmenu_edit" => "????????????? ???????????",
    "cmenu_copy" => "??????????",
    "cmenu_cut" => "????????",
    "cmenu_paste" => "????????",
    "cmenu_delete" => "???????",
    "cmenu_delete_confirm_message_folder" => "?? ????????????? ?????? ??????? ??? ????? ?? ???? ???????????",
    "cmenu_delete_confirm_message_file" => "?? ????????????? ?????? ??????? ???? ?????",
    "cmenu_delete_confirm_message_image" => "?? ????????????? ?????? ??????? ??? ????????????",
    "cmenu_open" => "???????",
    "cmenu_large_images" => "???????????",
    "cmenu_small_images" => "??????",
    "cmenu_list" => "??????",
    "cmenu_details" => "???????",
    "cmenu_tiles" => "??????",
    "cmenu_content" => "?????????",
    "cmenu_refresh" => "????????",
    "cmenu_new_folder" => "????? ?????",
    "cmenu_rename" => "?????????????",
    
    //Messages
    "folder_tampered_with" => "???? ? ????? ??? ???????!",
    "folder_name_invalid" => "????? ????? ?? ???????!<br />??????????? ????????????? ????????? ????????: ^ \\ / ? * \" ' < > : |",
    "create_folder_successful" => "????? ????? ???????!",
    "create_folder_failed" => "????? ????? ?? ???????!",
    "file_tampered_with" => "???? ? ????? ??? ???????!",
    "loadfolder_error_1" => "???? ? ????? ??? ???????!",
    "delete_error_1" => "???? ? ????? ??? ????? ??? ???????!",
    "delete_error_2" => "???? ?? ??????!",
    "delete_error_3" => "????? ?? ???????!",
    "delete_success" => " ????? ??????? ???????!",
    "select_one_file" => "???????? ???? ???? ??? ???????!",
    "insert_cancelled" => "??????? ?? ???????????, ??? ??? ?? ??????? ???????????????!",
    "directory_already_exists" => "????? ?????????? ??? ????!",
    "file_already_exists" => "????? ???? ??? ????!",
    "rename_failed" => "?????????????? ?? ???????????!",
    "rename_file" => "?????????? ??????? ????? ??? ??? {0}{1}?????????? ??????????? ?????????????!{1}(????????? ??????? ???????????: {2})",
    "rename_folder" => "?????????? ??????? ????? ??? ??? {0}{1}(????????? ??????? ???????????: {2})"
);

?>

11 Reply by Guido Neele

  • Guido Neele
  • Member
  • Offline
  • From: The Netherlands
  • Registered: 2009-11-25
  • Posts: 80

Re: Another File Browser

Thanks guys. I will include those in the download.

Have you come a cross any difficulties or problems while installing/working with the filebrowser?

BonySoft your question was: .. Can't insert an image by double-clicking one, only by 'Insert' button. Is that supposed to be?
For now this is the default behavior but I will keep in mind fixing this. Shouldn't be that hard to add because there are already double click events attached to the folders.

If anybody has made additional translations please post them here. Thanks in advance.

Guido

12 Reply by BonySoft

  • BonySoft
  • Member
  • Offline
  • Registered: 2008-01-21
  • Posts: 14

Re: Another File Browser

Guido,

how to restrict file types allowed for upload (for example, allowing upload of images only) and file/folder operations?

Last edited by BonySoft (2010-05-21 14:49:38)

13 Reply by Guido Neele

  • Guido Neele
  • Member
  • Offline
  • From: The Netherlands
  • Registered: 2009-11-25
  • Posts: 80

Re: Another File Browser

There is a file called upload.php in the swfupload folder. On line 65 is a commented line of code.

//$extension_whitelist = array("jpg", "gif", "png");     //Allowed file extensions

Remove "//" and now only images are allowed. You can add other file types in the array.


You also have to change lines 127 to 136

$is_valid_extension = true;
/*
$is_valid_extension = false;
foreach ($extension_whitelist as $extension) {
    if (strcasecmp($file_extension, $extension) == 0) {
        $is_valid_extension = true;
        break;
    }
}
*/

Change to:

//$is_valid_extension = true;
$is_valid_extension = false;
foreach ($extension_whitelist as $extension) {
    if (strcasecmp($file_extension, $extension) == 0) {
        $is_valid_extension = true;
        break;
    }
}

Last edited by Guido Neele (2010-05-21 14:58:51)

14 Reply by BonySoft

  • BonySoft
  • Member
  • Offline
  • Registered: 2008-01-21
  • Posts: 14

Re: Another File Browser

Got it, thanks. What about file/folder operations, can they be allowed/disallowed?

Last edited by BonySoft (2010-05-21 15:15:29)

15 Reply by Guido Neele

  • Guido Neele
  • Member
  • Offline
  • From: The Netherlands
  • Registered: 2009-11-25
  • Posts: 80

Re: Another File Browser

BonySoft wrote:

Got it, thanks. What about file/folder operations, can they be allowed/disallowed?

I haven't implemented settings for that but you could change some lines in the main index.php file.

From line 136 to 307 the right click context menus are initialized. You could add disabled:true to some or all buttons, see line 169 for example. By adding disable: true the action will not be available. This however doesn't prevent people with javascript knowledge to delete files or folders from your server, but it will make it harder to do so. They could access the functions directly via firebug for example.

If you really want to prevent everybody from deleting/copying/renaming your files then changes should be made to the actions.php file.

Last edited by Guido Neele (2010-05-21 15:16:50)

16 Reply by BonySoft

  • BonySoft
  • Member
  • Offline
  • Registered: 2008-01-21
  • Posts: 14

Re: Another File Browser

Guido Neele wrote:

If you really want to prevent everybody from deleting/copying/renaming your files then changes should be made to the actions.php file.

I've tried and found it pretty easy smile

actions.php: replaced switch($_POST["action"]) with:

$action = $_POST["action"];
if (!in_array($action, $allowed_actions))
{
    echo $lang["action_not_allowed"];
    exit();
}

added a line in config.php:

$allowed_actions = array('cut_paste', 'copy_paste', 'rename', 'delete', 'create_folder');

and an appropriate term in language file:

en.php

[...]
    "rename_folder" => "Please give a new name for {0}{1}(These characters are not allowed {2})",
    "action_not_allowed" => "Action not allowed!"
);

ru.php

[...]
    "rename_folder" => "?????????? ??????? ????? ??? ??? {0}{1}(????????? ??????? ???????????: {2})",
    "action_not_allowed" => "???????? ?? ?????????!"
);

and that's it! cool Thanks for hint, Guido.

Last edited by BonySoft (2010-05-21 15:44:05)

17 Reply by Guido Neele

  • Guido Neele
  • Member
  • Offline
  • From: The Netherlands
  • Registered: 2009-11-25
  • Posts: 80

Re: Another File Browser

Thanks BonySoft that's a much better solution then I gave.

18 Reply by BonySoft

  • BonySoft
  • Member
  • Offline
  • Registered: 2008-01-21
  • Posts: 14

Re: Another File Browser

I've uncommented the validation code in upload.php. When I'm trying to upload invalid file, the target directory doesn't get one (yeah!) BUT swfupload says 'Complete' as if it was uploaded successfully  hmm

Last edited by BonySoft (2010-05-21 21:55:19)

19 Reply by redeye86

  • redeye86
  • Member
  • Offline
  • Registered: 2010-05-21
  • Posts: 5

Re: Another File Browser

BonySoft wrote:

en.php

[...]
    "rename_folder" => "Please give a new name for {0}{1}(These characters are not allowed {2})",
    "action_not_allowed" => "Action not allowed!"
);

German Version of this would be:
de.php

[...]
    "rename_folder" => "Bitte geben Sie einen neuen Namen für {0}{1} an (Folgende Zeichen sind nicht erlaubt: {2})",
    "action_not_allowed" => "Aktion nicht erlaubt!"
);

Edit:

Could you please add an option that allows to hide dot-Files (e.g.:  .XYZ) from the filebrowser?

Last edited by redeye86 (2010-05-22 01:13:40)

20 Reply by Guido Neele

  • Guido Neele
  • Member
  • Offline
  • From: The Netherlands
  • Registered: 2009-11-25
  • Posts: 80

Re: Another File Browser

redeye86 wrote:

Could you please add an option that allows to hide dot-Files (e.g.:  .XYZ) from the filebrowser?

Redeye,

This is fairly easy to accomplish.

Change line 82 in the functions.php (The getDirTree function)

if($r != "." && $r != ".." &&(($showfiles==false&&is_dir($dir.$r))||$showfiles==true)) {

Change to:

if($r != "." && $r != ".." && ((!preg_match('/^\..*/', $r) && !is_dir($dir.$r)) || is_dir($dir.$r)) && (($showfiles == false && is_dir($dir.$r)) || $showfiles == true)) {

That's it. Your .htaccess files etc. will be hidden

Last edited by Guido Neele (2010-05-22 22:52:42)

21 Reply by emesaj

  • emesaj
  • Member
  • Offline
  • Registered: 2010-05-23
  • Posts: 1

Re: Another File Browser

hi thanks for the plugin its really very nice... but i have a problem with thumbs... it doesnt show thumb images for me... can u pls share ur config files? it will give us some idea how to configure our config files...

22 Reply by Guido Neele

  • Guido Neele
  • Member
  • Offline
  • From: The Netherlands
  • Registered: 2009-11-25
  • Posts: 80

Re: Another File Browser

Hi Emesaj,

I think you need to change the permissions on the cache folder. Phpthumb needs the cache folder to be writable for the thumbs to be stored. The only config file that you will have to change is config.php. Instructions are inside the Readme.txt and as comments in the config.php.

Hope this will work out for you.

Guido

23 Reply by utvairs

  • utvairs
  • Member
  • Offline
  • Registered: 2010-05-27
  • Posts: 1

Re: Another File Browser

Guido,

This plugin roks!

But I have a couple of issues, and I'm just getting started with tinymce (and javascript for that matter)

Issue 1: I can't create new subdirectories in my upload directory. Permissions on that folder were 755. I tried changing to 777, thinking it might be permissions issue. But still does not work. Is there something else I need to change in your code, or would this be a server config issue?

These are the steps to recreate:
1. click Insert/edit image button
2. click Browse icon
3. click New folder
4. type name for forlder
5. click Create new folder

pretty red warning slides down that says "Creating the new folder failed!"

Issue 2: This is a UI/UE issue: I happened to name my upload folder "upload".  Unfortunately for me, because you have made the folder names look like buttons, my "upload" folder looks like I should be clicking on it to begin a file upload. The folder names should not look like buttons. Is there a quick way to modify the states of the directory buttons so they don't look like buttons?

This is a very nice plugin, Guido. Thank you!

Blaine

24 Reply by Guido Neele

  • Guido Neele
  • Member
  • Offline
  • From: The Netherlands
  • Registered: 2009-11-25
  • Posts: 80

Re: Another File Browser

utvairs wrote:

Guido,

This plugin roks!

But I have a couple of issues, and I'm just getting started with tinymce (and javascript for that matter)

Issue 1: I can't create new subdirectories in my upload directory. Permissions on that folder were 755. I tried changing to 777, thinking it might be permissions issue. But still does not work. Is there something else I need to change in your code, or would this be a server config issue?

These are the steps to recreate:
1. click Insert/edit image button
2. click Browse icon
3. click New folder
4. type name for forlder
5. click Create new folder

pretty red warning slides down that says "Creating the new folder failed!"

Issue 2: This is a UI/UE issue: I happened to name my upload folder "upload".  Unfortunately for me, because you have made the folder names look like buttons, my "upload" folder looks like I should be clicking on it to begin a file upload. The folder names should not look like buttons. Is there a quick way to modify the states of the directory buttons so they don't look like buttons?

This is a very nice plugin, Guido. Thank you!

Blaine

Hi Blaine,

Thank you for trying PDW File Browser. I'm glad you like it.

I hope I can provide you with the answers to your issues.

Issue 1: I think you forgot the ending slash for the $uploadpath variable in config.php. If the slash is missing then errors occur and creation of folders will fail.

Issue 2: The folder is highlighted because upload is the currently selected folder. If you add more files and folders it will become more clear that it is a tree view. You could comment out all lines starting with "ul.treeview li.selected" in the mediabrowser.css file but I wouldn't recommend.

I hope this helps.


Guido

25 Reply by troex

  • troex
  • Member
  • Offline
  • Registered: 2010-05-29
  • Posts: 2

Re: Another File Browser

On TinyMce integration demo page file manager not opens in Chrome