Click here to Skip to main content
16,015,594 members
Articles / Web Development / HTML
Tip/Trick

Using Responsive File Manager in ASP.NET MVC

Rate me:
Please Sign up or sign in to vote.
4.91/5 (20 votes)
21 May 2018CPOL6 min read 106.1K   3.6K   25   26
Using Responsive File Manager in ASP.NET MVC

Update (2018.05.22)

Note: I have now made ResponsiveFileManager available to .NET Core users as well (as a NuGet package). It uses the new PeachPie PHP compiler for .NET Core. You can find the project on GitHub with instructions, here: PeachPie ResponsiveFileManager

Update (2017.03.15)

Just a couple of notes:

Firstly, I uploaded the source code to GitHub a few months ago in case anyone wants to fork it

Secondly, I was curious as to how one could integrate this in .NET Core. I've discovered that Phalanger is being superceded by a new project called PeachPie (same guys I think). I have been in contact and they inform me that while it is not yet possible to integrate this file manager due to PeachPie being incomplete as of now (The cURL library, for example, has yet to be implemented). However, they seem very much excited about this as a practical use for PeachPie and as such have agreed to write a blog post on their site as soon as this becomes possible.

I encourage you to keep an eye on this project; it is shaping up very nicely. They can already run Wordpress on .NET Core!

Background

About a year ago, I started my own open source CMS project in ASP.NET MVC (soon to be released) and as any good CMS needs a file manager, I began looking around for open source projects. I was somewhat disappointed in the fact that there's not much available. After searching for a while, I managed to find what seemed to be perfect: Responsive File Manager, by Alberto Peripolli (see: http://www.responsivefilemanager.com/). To my disappointment, I discovered it was written in PHP and not JavaScript as I had hoped. I settled for the next best thing; ELFinder. ELFinder is good for what it is, but also takes a bit of work to get up and running. I found ELFinder Connector for .NET and used that. All was working fine, but I still wasn't very happy - not with the look of the thing or various issues I won't go into.

In any case, I continued work on my CMS and decided to forget about this issue for the time being. Fast forward a year to just a couple of weeks ago: I decided to look around again and see if anything was available. I even searched the envato market in the hopes of finding something to purchase. Alas, no luck. In 2015, we are still sorely in need of a decent file manager (at least for non-PHP developers that is). So I decided to take another crack at Responsive File Manager - firstly to see how complex it was and if I should attempt to rewrite it in JQuery.

It was at this time that I had a thought; .NET now has compilers for Ruby (Iron Ruby), Python (Iron Python) and so forth... I wondered if there was something for PHP. A few minutes of Googling later and bingo! I discovered Phalanger - the PHP compiler for .NET. I spent the next few days struggling with various issues to make it work just right, but I am happy to say, I now have Responsive File Manager working very well within my ASP.NET MVC site. Follow the steps below and you can too...

Installation & Configuration

  1. First of all, you should download Responsive File Manager, which you can do so from the GitHub page here: https://github.com/trippo/ResponsiveFilemanager
  2. Extract the files and copy the filemanager folder to the root of your site.
    Note: If you try to copy it anywhere else, it seems to return incorrect relative URLs.
  3. Download Phalanger 4.0 from the following link: https://github.com/DEVSENSE/Phalanger
  4. Open the source code and find the function imagecolorsforindex() in /Extensions/Gd2/PhpGd.cs. You will notice that it is not implemented. Copy the code from this pull request: https://github.com/DEVSENSE/Phalanger/pull/19/files. Here it is below to save you searching:
    PHP
    [ImplementsFunction("imagecolorsforindex")]
    public static PhpArray imagecolorsforindex(PhpResource im, int col)
    {
        // implementation from:
        //  https://github.com/DEVSENSE/Phalanger/pull/19/files
        var im1 = (PhpGdImageResource)im;
        var arr = new PhpArray();
        var entries = im1.Image.Palette.Entries;
        Color color;
        if (entries.Length > 0)
        {
            color = entries[col];
        }
        else
        {
            color = Color.FromArgb(col);
        }
        arr["red"] = (int)color.R;
        arr["green"] = (int)color.G;
        arr["blue"] = (int)color.B;
        arr["alpha"] = (int)color.A;
        return arr;
    }

    This prevents a particular compiler error. If I recall correctly, it's used when handling bitmap files.

  5. Build the source code in release mode and reference the DLLs from your project. Note that you will need to have opened Visual Studio with Administrator privileges or you will get build errors. Also note, I have not yet determined exactly which DLLs are required and which can be ignored. You can definitely ignore the SQL and zip DLLs though.
  6. You will need the following added to your web.config file:
    XML
    <configuration>
        <configsections>
            <section name="phpNet" type="PHP.Core.ConfigurationSectionHandler, 
            PhpNetCore, Version=4.0.0.0, Culture=neutral, PublicKeyToken=0a8e8c4c76728c71" />
        </configsections>
        <phpnet>
            <classlibrary>
                <add assembly="PhpNetClassLibrary, Version=4.0.0.0, 
                Culture=neutral, PublicKeyToken=4af37afe3cde05fb" section="bcl" />
                <add assembly="PhpNetMbstring, Version=4.0.0.0, 
                Culture=neutral, PublicKeyToken=2771987119c16a03" />
                <add assembly="PhpNetGd2, Version=4.0.0.0, 
                Culture=neutral, PublicKeyToken=2771987119c16a03" />
            </classlibrary>
        </phpnet>
        <system.webserver>
            <handlers>
                <add name="Phalanger" path="*.php" 
                verb="*" type="PHP.Core.RequestHandler, PhpNetCore, 
                Version=4.0.0.0, Culture=neutral, PublicKeyToken=0a8e8c4c76728c71" 
                resourcetype="Unspecified" precondition="integratedMode" />
            </handlers>
        </system.webserver>
        <runtime>
            <assemblybinding xmlns="urn:schemas-microsoft-com:asm.v1">
                <probing privatepath="Phalanger" />
    	    </assemblybinding>
        </runtime>
    </configuration>
  7. To prevent various errors, find and remove all exit; commands in the file manager's .php files. Note: I have no experience with PHP so perhaps I should have taken another approach to solving this, but so far I have not seen any bad side effects of doing so. My guess is these exit; keywords are not needed when using Phalanger.
  8. There were two functions being called by the file manager which are not yet implemented by Phalanger. The first of these is the following: ini_set('memory_limit' .... This appears in the image_check_memory_usage function on line 567 of /filemanager/include/utils.php. This function is called when the file manager is creating thumbnails. Apparently, this is not required when using Phalanger, since simply returning true at the top of the function works just fine.
  9. Again in utils.php, we want to change one more thing: on Windows (or at least on my machine), the rename_folder function fails with a permissions exception when it calls PHP's rename function. Oddly, the rename function only seems to fail when renaming folders; files are fine. So, replace the last line:
    PHP
    return rename($old_path, $new_path);

    with:

    PHP
    if (!mkdir($new_path, 0755, true))
    {
        return false;
    }
    rcopy($old_path, $new_path, true);
            
    return deleteDir($old_path);

    And that works fine.

  10. Find the resizeImage function near the top of the file in /filemanager/include/php_image_magician.php. At the end of this function, comment out the following 3 lines:
    PHP
    if ($sharpen && in_array($this->fileExtension, $this->sharpenArray))
    {
        $this->sharpen();
    }

    This needs to be commented out because the sharpen() function makes a call to imageconvolution which is something not yet supported by Phalanger. Luckily for us, ignoring this doesn't seem to make any noticeable difference.

That should be all you need to get started.

Issues

So far pretty much everything seems to be working well, but I will note that I didn't bother checking the Aviary image editing features because I have no need of them at this point. It is likely there will be a few issues to fix with that too. I simply turned off that feature in the /config/config.php file by setting aviary_active to false.

Final Thoughts and Conclusion

It may be interesting to note that I originally believed I would need a PHP view engine, such as the one on Codeplex at https://phpviewengine.codeplex.com/ which makes use of Phalanger as well. To my satisfaction, this is not the case; there is absolutely no need whatsoever for a PHP view engine; you can continue using your .cshtml files as you normally would. However, I do find the thought of adding a PHP view engine alongside the Razor one to be very intriguing. Those more interested should have some fun with that.

Hats off to the Phalanger team and to Alberto Peripolli for his excellent file manager. Now us .NET developers can have the best file manager in our MVC applications (likely Web Forms would work just as well too). If you have any comments or any suggestions on improving upon my work, please do share with the rest of us. My hope is we'll all eventually end up with a perfect implementation of the Responsive File Manager in ASP.NET.

Enjoy!

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
Software Developer (Senior) Freelancer
Australia Australia
This member has not yet provided a Biography. Assume it's interesting and varied, and probably something to do with programming.

Comments and Discussions

 
QuestionUnable to Edit XML file Pin
SamraatVerma26-Apr-20 21:06
SamraatVerma26-Apr-20 21:06 
QuestionSecurity Pin
Nairdaj27-Aug-18 16:35
Nairdaj27-Aug-18 16:35 
AnswerRe: Security Pin
j_ghadiri30-Apr-19 19:24
j_ghadiri30-Apr-19 19:24 
QuestionError on the published environment Pin
Nairdaj26-Aug-18 3:35
Nairdaj26-Aug-18 3:35 
QuestionThanks you! Pin
anhtuan4.712-Apr-17 5:06
anhtuan4.712-Apr-17 5:06 
AnswerRe: Thanks you! Pin
vnmatt21-May-18 20:15
vnmatt21-May-18 20:15 
QuestionImplementation in asp.net Core Pin
touinta13-Oct-16 21:17
touinta13-Oct-16 21:17 
Hello I have implement this in my mvc app and it works fine. Now I need to implement it to my new asp.net CORE app. I tried the tutorial but it doesn't work. Is there something that I need to add to project.json file or somewhere else?

thank you very much
AnswerRe: Implementation in asp.net Core Pin
vnmatt15-Feb-17 17:05
vnmatt15-Feb-17 17:05 
AnswerRe: Implementation in asp.net Core Pin
vnmatt21-May-18 20:12
vnmatt21-May-18 20:12 
GeneralRe: Implementation in asp.net Core Pin
touinta1-Apr-19 0:33
touinta1-Apr-19 0:33 
GeneralRe: Implementation in asp.net Core Pin
j_ghadiri16-Jun-19 19:46
j_ghadiri16-Jun-19 19:46 
QuestionUpdate to new responsive file manager version 9.9.7 Pin
Gigavisto12-Jan-16 1:47
Gigavisto12-Jan-16 1:47 
AnswerRe: Update to new responsive file manager version 9.9.7 Pin
vnmatt21-May-18 20:14
vnmatt21-May-18 20:14 
QuestionWhich version of responsive file manager? Pin
Gigavisto29-Dec-15 6:15
Gigavisto29-Dec-15 6:15 
QuestionASP.NET File Manager Pin
Member 1028738922-Nov-15 21:46
Member 1028738922-Nov-15 21:46 
AnswerRe: ASP.NET File Manager Pin
vnmatt2-Dec-15 17:28
vnmatt2-Dec-15 17:28 
GeneralGreat article Pin
nguyenminhtien14111-Oct-15 23:05
nguyenminhtien14111-Oct-15 23:05 
QuestionCan only upload small size file only using Simple Upload in Responsive File manager? Pin
moon_eyes24-Aug-15 18:39
moon_eyes24-Aug-15 18:39 
AnswerRe: Can only upload small size file only using Simple Upload in Responsive File manager? Pin
vnmatt22-Sep-15 14:10
vnmatt22-Sep-15 14:10 
GeneralRe: Can only upload small size file only using Simple Upload in Responsive File manager? Pin
Gigavisto23-Oct-15 15:28
Gigavisto23-Oct-15 15:28 
GeneralRe: Can only upload small size file only using Simple Upload in Responsive File manager? Pin
Gigavisto27-Oct-15 8:50
Gigavisto27-Oct-15 8:50 
GeneralRe: Can only upload small size file only using Simple Upload in Responsive File manager? Pin
climbah21-Apr-16 2:11
climbah21-Apr-16 2:11 
QuestionGreat! It works Pin
Gigavisto24-Aug-15 15:24
Gigavisto24-Aug-15 15:24 
AnswerRe: Great! It works Pin
Gigavisto25-Aug-15 1:17
Gigavisto25-Aug-15 1:17 
GeneralRe: Great! It works Pin
vnmatt22-Sep-15 14:12
vnmatt22-Sep-15 14:12 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.