轉載 : 修改 FCKEditor FileManager 以支援刪除目錄及檔案的功能

/ 2008-06-20

原文網址 , 如下

http://www.castlesblog.com/2007/12/06/fckeditor-delete-filefolder/

怕有些人看不懂 , 我把我自己修改步驟寫下 , 我的版本是 2.6.1 且Server端程式是 PHP , 修改後運作很正常

1. 編輯 "fckeditor/editor/filemanager/connectors/php/commands.php" 增加下面三個 function

function DeleteFile( $resourceType, $currentFolder ) {
    $file = $_SERVER['DOCUMENT_ROOT'].$_GET['FileUrl'];
    if (is_file($file)) {
        unlink($file);
    } else {
        echo '<error number="1" originaldescription="unable to locate file">' ;
    }
}
function DeleteFolder( $resourceType, $currentFolder ) {
    $folder = $_SERVER['DOCUMENT_ROOT'].$_GET['FolderName'];
    if (is_dir($folder) )   {
        DELETE_RECURSIVE_DIRS($folder);
    } else {
        echo '<error number="2" originaldescription="unable to locate folder">' ;
    }
}
function DELETE_RECURSIVE_DIRS($dirname) { // recursive function to delete
    // all subdirectories and contents:
    if(is_dir($dirname))$dir_handle=opendir($dirname);
    while($file=readdir($dir_handle)) {
        if($file!="." && $file!="..") {
            if(!is_dir($dirname."/".$file)) {
                unlink ($dirname."/".$file);
            } else {
                DELETE_RECURSIVE_DIRS($dirname."/".$file);
            }
        }
    }
    closedir($dir_handle);
    rmdir($dirname);
}

2. 修改 "fckeditor/editor/filemanager/connectors/php/connector.php" 中的 switch 區段需要增加程式碼如下 , 請注意註解後面的兩段 case , 我用紅字標起來就是要新增的部份

switch ( $sCommand ) {
    case 'GetFolders' :
        GetFolders( $sResourceType, $sCurrentFolder ) ;
    break ;
    case 'GetFoldersAndFiles' :
    GetFoldersAndFiles( $sResourceType, $sCurrentFolder ) ;
    break ;
    case 'CreateFolder' :
        CreateFolder( $sResourceType, $sCurrentFolder ) ;
    break ;
    /******ADDED DELETE COMMANDS******/
    case 'DeleteFile' :
        DeleteFile( $sResourceType, $sCurrentFolder ) ;
    break ;
    case 'DeleteFolder' :
        DeleteFolder( $sResourceType, $sCurrentFolder ) ;
    break ;
}

3. 修改 "fckeditor/editor/filemanager/connectors/php/config.php" 中的設定 $Config['ConfigAllowedCommands']

原來的應該是

$Config['ConfigAllowedCommands'] = array('QuickUpload', 'FileUpload', 'GetFolders', 'GetFoldersAndFiles', 'CreateFolder') ;

需要修改成這樣

$Config['ConfigAllowedCommands'] = array('QuickUpload', 'FileUpload', 'GetFolders', 'GetFoldersAndFiles', 'CreateFolder', 'DeleteFile', 'DeleteFolder') ;

4. 修改 "fckeditor/editor/filemanager/browser/default/frmresourceslist.html" 需要長的像這樣 , 這段有點長 , 主要是修改 oListManager.GetFolderRowHtml 及 oListManager.GetFileRowHtml 及新增 DeleteFile 及 DeleteFolder 兩個 function

oListManager.GetFolderRowHtml = function( folderName, folderPath, folderUrl ) //added folderUrl
{  
    // Build the link to view the folder.
    var sLink = '<a href="#" mce_href="#" onclick="OpenFolder(\'' + folderPath.replace( /'/g, '\\\'') + '\');return false;">' ;
 
    return '<tr>' +
            '<td width="16">' +
                sLink +
                '<img alt="" src="images/Folder.gif" mce_src="images/Folder.gif" width="16" height="16" border="0"></a>' +
            '</td><td nowrap colspan="2"> ' +
                sLink +
                folderName +
                '</a>' +
        '</td><td align="right"><a href="#" mce_href="#" onclick="DeleteFolder(\''+folderName+'\',\''+ folderUrl.replace( /'/g, '\\\'') + '\');return false;">DELETE</a></td></tr>' ;
}
 
oListManager.GetFileRowHtml = function( fileName, fileUrl, fileSize )
{     
    // Build the link to view the folder.
    var sLink = '<a href="#" mce_href="#" onclick="OpenFile(\'' + fileUrl.replace( /'/g, '\\\'') + '\');return false;">' ;
 
    // Get the file icon.
    var sIcon = oIcons.GetIcon( fileName ) ;
 
    return '<tr>' +
            '<td width="16">' +
                sLink +
                '<img src="'+fileUrl+'" mce_src="'+fileUrl+'" border="0" style="border:1px solid black; margin:5px;" alt="" height="70" /></a>' +
            '</td><td> ' +
                sLink +
                fileName +
                '</a>' +
            '</td><td align="right" nowrap> ' +
                fileSize +
                ' KB' +
        '</td><td align="right"><a href="#" mce_href="#" onclick="DeleteFile(\''+fileName+'\',\'' + fileUrl.replace( /'/g, '\\\'') + '\');return false;">DELETE</a></td></tr>' ;
}
 
function DeleteFile( fileName, fileUrl )
{
    if (confirm('Are you sure you wish to delete ' + fileName + '?')) {
        oConnector.SendCommand( 'DeleteFile', "FileUrl=" + escape( fileUrl ), Refresh ) ;
    }
 
}
 
function DeleteFolder( folderName, folderPath )
{
    if (confirm('Are you sure you wish to delete \'' + folderName + '\' and all files in it?')) {
        oConnector.SendCommand( 'DeleteFolder', "FolderName=" + escape( folderPath + folderName ), Refresh ) ;
    }
}

5. 繼續編輯檔案 "fckeditor/editor/filemanager/browser/default/frmresourceslist.html"

在 GetFoldersAndFilesCallBack 這個 function 中找到一行

oHtml.Append( oListManager.GetFolderRowHtml( sFolderName, sCurrentFolderPath + sFolderName + "/" ) ) ;

修改為

oHtml.Append( oListManager.GetFolderRowHtml( sFolderName, sCurrentFolderPath + sFolderName + "/", sCurrentFolderUrl ) ) ;

好啦 !! 大功告成 ^^

以上 5 個步驟基本上就可以讓 FCKEditor 具備刪除的功能 , 但這個刪除法的原始作者有修改檔案圖示變成小圖預覽 , 可能有人覺得不習慣 , 其實我也不習慣 , 所以我又把  "fckeditor/editor/filemanager/browser/default/frmresourceslist.html" 中的 oListManager.GetFileRowHtml 改成如下 , 還原成預設的檔案圖示

oListManager.GetFileRowHtml = function( fileName, fileUrl, fileSize )
{
 // Build the link to view the folder.
 var sLink = '<a href="#" mce_href="#" onclick="OpenFile(\'' + ProtectPath( fileUrl ) + '\');return false;">' ;

 // Get the file icon.
 var sIcon = oIcons.GetIcon( fileName ) ;

 return '<tr>' +
   '<td width="16">' +
    sLink +
    '<img alt="" src="images/icons/' + sIcon + '.gif" width="16" height="16" border="0"><\/a>' +
   '<\/td><td> ' +
    sLink +
    fileName +
    '<\/a>' +
   '<\/td><td align="right" nowrap> ' +
    fileSize +
    ' KB' +
  '<\/td><td align="right"><a href="#" mce_href="#" onclick="DeleteFile(\''+fileName+'\',\'' + fileUrl.replace( /'/g, '\\\'') + '\');return false;">DELETE</a></td><\/tr>' ;
}

後記 :

後來在 FCKEditor 官網發現到有 CKFinder 這套 . 真是很棒的檔案瀏覽器 , 而且對於安全性上有做處理 , 自己試用過後不錯 , 但也是屬於要付費的 , 不過不付費也可以使用 , 相關的 License 說明官網有 , 也是處於模糊地帶可以用在非商業行為上 ..

Unlicensed Copies

If you did not pay for a license, you may use unlicensed copies of CKFinder for
the exclusive purpose of demonstration. In this case you will be using CKFinder
in "demo mode". Without derogating from the forgoing, you may not use CKFinder in
"demo mode" for commercial purposes. CKFinder shall be used only for evaluation
purposes and may not be used or disclosed for any other purposes, including without
limitation, external distribution or software development. You may not remove demo
notices from the interface nor disable the ability to display such notices or otherwise
modify CKFinder. Product support is not offered for CKFinder in "demo mode".

相關文章

3 則評論在 轉載 : 修改 FCKEditor FileManager 以支援刪除目錄及檔案的功能.

發佈留言