PageEditor, Children-Tab, possible to load children directly on open?

[horst]

How can I change the Children-Tab in PageEditor to directly load the children, and not via Ajax, after clicking the tab label?

I have a special need, where I have to remove all other tabs, only leaving the Children Tab visible.

Normally, you have Content Tab displayed first, when opening a page in PageEditor. Then, when clicking the Children Tab, the children tree loads via Ajax.

I need to change the behavior from within a hook in ready.php.

Any hints are much appreciated. ?

[dragan]

I don't know, but the function itself is hookable, see here:

https://github.com/processwire/processwire/blob/master/wire/modules/Process/ProcessPageEdit/ProcessPageEdit.module#L864

protected function ___buildFormChildren() {
...
if(!empty($settings['ajaxChildren'])) $wrapper->collapsed = Inputfield::collapsedYesAjax;

Guess you'll have to find out where $settings is stored... in config.php or elsewhere?

[dragan]

For hiding all other tabs, you could use an admin CSS with a hook (I guess you only want that behaviour for a specific type of page/template).

[horst]

2 hours ago, dragan said:

I don't know, but the function itself is hookable, see here:

https://github.com/processwire/processwire/blob/master/wire/modules/Process/ProcessPageEdit/ProcessPageEdit.module#L864

protected function ___buildFormChildren() {
...
if(!empty($settings['ajaxChildren'])) $wrapper->collapsed = Inputfield::collapsedYesAjax;

Guess you'll have to find out where $settings is stored... in config.php or elsewhere?

Thanks dragan. Will look there.

 

50 minutes ago, dragan said:

For hiding all other tabs, you could use an admin CSS with a hook (I guess you only want that behaviour for a specific type of page/template).

This I have allready sloved with the help of forum tips:

 

[Robin S]

Hi @horst,

Not sure if you have already solved this now, but below is a quick demo module.

A couple of notes:

• The Children tab is supposed to AJAX-load automatically when visible, but it's buggy: https://github.com/processwire/processwire-issues/issues/618
• I can't remember the details but I seem to recall there might be an issue if the name field is not present in the ProcessPageEdit form. So if you strike problems you may need to move the name field to the Children tab and then hide it. Maybe @adrian knows about the name field issue?

 

<?php namespace ProcessWire;

class HideTabs extends WireData implements Module {

    /**
     * Module information
     */
    public static function getModuleInfo() {
        return array(
            'title' => "Hide Tabs",
            'version' => 1,
            'autoload' => 'template=admin',
        );
    }

    /* @var ProcessPageEdit $ppe */
    protected $ppe;
    /* @var InputfieldForm $form */
    protected $form;

    /**
     * Ready
     */
    public function ready() {
        $this->addHookAfter('ProcessPageEdit::buildForm', $this, 'afterBuildForm');
    }

    /**
     * After ProcessPageEdit::buildForm
     *
     * @param HookEvent $event
     */
    protected function afterBuildForm(HookEvent $event) {
        // Only for ProcessPageEdit (not ProcessUser)
        if($this->process != 'ProcessPageEdit') return;
        $this->ppe = $event->object;
        $this->form = $event->return;
        $page = $this->ppe->getPage();
        // Only for one template (adjust as needed)
        if($page->template != 'my-template') return;

        // Remove the unwanted tabs
        $remove_tabs = [
            'ProcessPageEditContent',
            'ProcessPageEditSettings',
            'ProcessPageEditDelete',
        ];
        foreach($remove_tabs as $tab_id) $this->removeTabFromForm($tab_id);

        // Trigger loading of Children tab
        // Hacky workaround for bug: https://github.com/processwire/processwire-issues/issues/618
        $this->form->appendMarkup = "
<script>
$(window).load(function () {
    $('#_ProcessPageEditChildren').trigger('click');
});
</script>
";
    }

    /**
     * Remove tab from ProcessPageEdit form
     */
    protected function removeTabFromForm($tab_id) {
        $tab = $this->form->find("id=$tab_id")->first();
        if(!$tab) return;
        $this->form->remove($tab);
        $this->ppe->removeTab($tab_id);
    }

}

 

[adrian]

34 minutes ago, Robin S said:

I can't remember the details but I seem to recall there might be an issue if the name field is not present in the ProcessPageEdit form. So if you strike problems you may need to move the name field to the Children tab and then hide it. Maybe @adrian knows about the name field issue?

Yeah, it will cause problems if the name field is not available somewhere. If you enable PW's Advanced mode you can use the "Display 'name' field in content tab?" option in a template's System tab. Or you can do this in a module with:

$page->template->nameContentTab = 1;

You may also want to do:

$form->_pw_page_name->collapsed = Inputfield::collapsedYes;

Both of these can be seen in action in: https://github.com/adrianbj/RestrictTabView

Hope that helps.

[horst]

Many thanks, will look at it tomorrow and report back.  

[horst]

Many thanks @Robin S and @adrian, finally I managed to find time and come back to this.

Interestingly, I already was on the right track with my own first try ?:

            // JS in Markup to toggle the Tab-Url
            $markUp = wire('modules')->get('InputfieldMarkup');
            ob_start();
            ?>
            <script>
                function hnConfigureEditorChildrenTab() {
                    document.location.replace('#ProcessPageEditChildren', '') + '#ProcessPageEditChildren';
                    //var dropDown = $('.pw-button-dropdown').children();
                    //console.log(dropDown);
                    //dropDown.children().each().attr('style', 'display:none!important;');
                }
                document.body.onload = hnConfigureEditorChildrenTab();
            </script>
            <?php
            $markUp->value = ob_get_clean();
            $form->append($markUp);

The first JS line triggers a click on the tab too, by rewriting the location href with a newly added anchor. ?

But it wasn't bullet proof. 20% the time, it doesn't work. So, many thanks for your solutions and the hint with the name-field!

------

Another issue I have in the wider context is, that I want to hide the save buttons on that template, because it only has informational character.

            // remove save button
            $saveButton = $form->children->get('id=submit_save');
            $form->remove($saveButton);

This results in removing the top-right placed button completly, but with some left over from the bottom-left placed button:

     ==>  

I'm not sure why it behvaes like this. Maybe it has to do with that there are two items with the same ID (submit_save) in the DOM?

EDIT: I now solved it by injecting some styles, as targetting this by JS dindn't fully work. Maybe because AOS also targets the dropdowns when selected there "show on_hover instead on_click"?

<style>
    #submit_save,
    #pw-dropdown-toggle-submit_save,
    #wrap_submit_save,
    #pw-dropdown-toggle-submit_save_copy,
    .pw-button-dropdown-wrap {
        display: none !important;
    }
</style>

 

Now my pages look as they should ?

Spoiler

 

Edited July 7, 2018 by horst

[Robin S]

18 hours ago, horst said:

Another issue I have in the wider context is, that I want to hide the save buttons on that template, because it only has informational character.

If all you want the edit page to show is a list of children then maybe you would be better off replacing ProcessPageEdit::execute() entirely. E.g.

$wire->addHookBefore('ProcessPageEdit::execute', function(HookEvent $event) {
    /* @var ProcessPageEdit $ppe */
    $ppe = $event->object;
    $page = $ppe->getPage();
    if($page->template != 'my-template') return;
    $event->replace = true;
    
    /* @var InputfieldForm $form */
    $form = $this->modules->InputfieldForm;
    /* @var InputfieldMarkup $f */
    $f = $this->modules->InputfieldMarkup;
    $f->name = 'ChildrenPageList';
    $f->label = 'Children / Subpages';
    if($page->numChildren) {
        /* @var ProcessPageList $ppl */
        $ppl = $this->modules->ProcessPageList;
        $ppl->id = $page->id;
        $ppl->showRootPage = false;
        $f->value = $ppl->execute();
        $template_sortfield = $page->template->sortfield;
        if($template_sortfield && $template_sortfield != 'sort') {
            $f->notes = sprintf('Children are sorted by "%s", per the template setting.', $template_sortfield);
        }
    } else {
        $f->description = 'There are currently no children/subpages below this page.';
    }
    $form->add($f);
    $event->return = $form->render();
});

If you wanted the "Add New Page Here" button and "Sort Settings" fieldset too then you could add those by borrowing from the code in ProcessPageEdit::buildFormChildren().