Using the File Manager in a dialog from the front end.

Permalink 1 user found helpful
(New thread started after http://www.concrete5.org/community/forums/usage/where-did-this-dial... because the topic ahas moved on significantly)

I have used the C5 dialog to pop up a File Manager directly from a block view in the front end (I aim to give a specific group of users the ability to manage a file set without showing the dashboard menu bar).

The file manager shows (just a case of setting the right permissions).

However, clicking buttons like Search on it is jumping me out of the file manager to a page, which fails to render as a file manager. I suspect a mix up between tools and pages, or maybe something further to do with permissions.

JohntheFish
 
JohntheFish replied on at Permalink Reply
JohntheFish
Turns out that without the dashboard menu, I needed to load the following in the block controller for the file manager to load from a block view.

$this->addHeaderItem($html->javascript("jquery.js"));
$this->addHeaderItem($html->css("jquery.ui.css"));
$this->addHeaderItem($html->javascript('jquery.form.js'));
$this->addHeaderItem($html->css("ccm.app.css"));
$this->addHeaderItem($html->javascript("jquery.ui.js"));
$this->addHeaderItem('<script type="text/javascript" src="' . REL_DIR_FILES_TOOLS_REQUIRED . '/i18n_js"></script>'); 
$this->addHeaderItem($html->javascript("ccm.app.js"));


The actual code in the view:
$().ready(function(){
  $("#fm_link;?>").click(function(ev){
    ev.preventDefault();
    ccm_chooseAsset=false;
    // method1 - commented out
    // ccm_launchFileManager('');
    // method2
    $.fn.dialog.open({
      width: '90%',
      height: '70%',
      appendButtons: true,
      modal: false,
      href: CCM_TOOLS_PATH + '/files/search_dialog?ocID=' + CCM_CID + '&search=1&fType=' +ccmi18n_filemanager.FTYPE_IMAGE,
      title: 'My Title',
      close: function(event, ui){

I tried the ccm_launchFileManager method, but wanted to play with some more dialog parameters, hence the second method. Even then, the 'close' event handler does not get triggered.
ScottC replied on at Permalink Reply
ScottC
i thought it was onClose, though i'm probably wrong there.

Another thing you used to be able to do, which I am not sure is still the case is that you can do a modal true which omits the close button, and in that case you are then responsible for closing the modal yourself by binding to your own close button ie $('.modal-close').live('click',$.fn.dialog.closeAll);
Shotster replied on at Permalink Reply
Shotster
> The file manager shows (just a case of setting the right permissions).

Are you doing that programmatically or through the dashboard?

> $this->addHeaderItem($html->javascript("jquery.js"));

Seems odd that you would have to load jQuery, as I thought it was loaded by default.

> I tried the ccm_launchFileManager method...

That's the method I used when I was toying with something similar a while back.

> Even then, the 'close' event handler does not get triggered

Have you tried onFileSelected or onDialogClose?

-Steve
Shotster replied on at Permalink Reply
Shotster
> Have you tried onFileSelected or onDialogClose?

Just checked, and I did successfully hook into those events (which were apparently added by C5), but it was in 5.4.2.2 by passing an options object to ccm_launchFileManager(). You can also specify a filters property that allows you to restrict the list to only files of a certain type - e.g. just images. Again, don't know if this has changed in 5.5.x.

-Steve
JohntheFish replied on at Permalink Reply
JohntheFish
I am doing it all in code for a customised gallery block with front end editing.

Hence there is no dashboard /edit bar across the top, hence jQuery etc. is not loaded by default.

The 'close' event is the jQuery event. I think onClose is is a raw javascript event, so it can only apply to browser objects (like window), but has some browser specific issues that are resolved in jquery.

I will do some searching about for C5 dialog specific events such as onDialogClose as you have suggested and give it a try.

I may also try going straight to the jQuery dialog and bypass the C5 dialog completely, but have concerns that it may cause knock on effects with the file manager.

While on the subject, does anyone know how to prevent a user of the file manager from creating new sets (ie constrain it to existing sets)
Shotster replied on at Permalink Reply
Shotster
> Hence there is no dashboard /edit bar across the top, hence jQuery etc.
> is not loaded by default.

I thought jQuery was loaded on the front end by default.

> I will do some searching about for C5 dialog specific events such as
> onDialogClose as you have suggested and give it a try.

I'm an idiot. I think those events were added by me, so I guess I did a fair amount of customization, the details of which I don't recall. Sorry.

:-/

-Steve
omars786 replied on at Permalink Reply 2 Attachments
omars786
Hi John,

thanks for your thread on this matter, has helped somewhat..

I'm having an issue which I believe is because of a purchased Theme that prevents the Filemanager/Page Selector from working in the front end. The dashboard is still accessible, so its not a permissions problem..

Basically when the dialog is launched, the box is blank, only the title exists on the top of the window. See Attached..

The theme is Anitya, the author is not responding to support tickets presently and I've tested it on other themes as well as elemental, all working fine there.

Any chance you could you point me in the right direction as to get it working?
JohntheFish replied on at Permalink Reply
JohntheFish
Despite the section heading, this thread dates from 2012 and hence c5.6 core. The file manager was pretty much re-written for 5.7+, so please post the core c5 version you are working with.
omars786 replied on at Permalink Reply
omars786
Hi John,

thanks for the quick response,

I'm working on 5.7 at the moment..

Thanks,
Omar
JohntheFish replied on at Permalink Reply
JohntheFish