Webfmtv1.0

Example one

selected files:

selected folder

browse

call back function excute result:

How to Use:

Part 1 - Setup

1. You will need to include the Javascript files in your header.

   
       <script type="text/javascript" src="webfmt.js"></script>
                           

Part 2 -Page call

1. Create a callback function . For example:

                           
       function webfmt_callback(urls,folder)
       {
           var obj=fbis.getobj("status");
           if(obj)
           {
               obj.innerHTML="selected files:"+urls+"<br>selected folder:"+folder;
           }
       }
                           
                           

   Optional: Use the function, can get the user selects files and folder.
2. Prepare the params. For example:

   Js Code:

   
       var pararm={
             "basedir":"/upfile",               //folder tree root path
             "ftype":["gif","png","jpg","zip"],  //allow to upload file type
             "selmod":"multiselect",           //if "multiselect",allow to select multiple files at once,else only one file.
             "showok":1,            //if 1,show "ok" and "cancle" buttons on window footer,else nothing
             "maxszie":2*1024*1024, //allow to upload file max size
             "filesid":"selfile",  //through element accept return selected files
             "folderid":"selfolder",//through element accept return selected folder
             "ReturnFunc":"webfmt_callback",
             "lang":"en"
              };
                           

   CWebFmt object

       CWebFmt object has a function "show"
       CWebFmt.show=function(param,height,width,IsPop)
   
       Parameters:
       param         parame object
       height        window height
       width         window width
       IsPop         if true,show in popup window,else local window
                               

   Html code

   
       <p>selected files:</p>
       <input id="selfile"  type="text" name="selfile" value="" size="100">
       <p>selected folder</p>
       <input id="selfolder" type="text" name="selfolder" value="">
       <a href="javascript:CWebFmt.show(pararm,600,800,true);">browse</a>
       <p>call back function excute result:</p>
       <div id="status">
       </div>
                           

Part 3 -Html online editor integration

1. Ckeditor integration . For example:

   
       <textarea cols="80" id="editor_kama" name="content" rows="5" cols="10"></textarea>
       <script type="text/javascript">
       var bparams={"showok":true};
       var imgparams={"showok":true,ftype:["jpg","png","gif","swf"]};
       var fparams={"showok":true,ftype:["swf"]};
       //<![CDATA[
       CKEDITOR.replace('content',
       {
       "filebrowserBrowseUrl": "webfmt/webfmt.php?params='"+urlEncode(base64encode(JSON.stringify(bparams)))+"'",
       "filebrowserImageBrowseUrl": "webfmt/webfmt.php?params='"+urlEncode(base64encode(JSON.stringify(imgparams)))+"'",
       "filebrowserFlashBrowseUrl": "webfmt/webfmt.php?params='"+urlEncode(base64encode(JSON.stringify(fparams)))+"'"
       });
       //]]>
       </script>