Theming Cockpit - more triggers in views for custom collection options

[raffaelj]

It would be great to have some more triggers in core module views. I tried something here and added a few possible triggers for custom tabs and options in collection view.

With some simple code it would be possible to extend the layout and to add a lot more options to collections like grouping or adding categories and changing default script options etc.

With more triggers it would be easier for addon development to adjust minor changes to core modules instead of adding extra links to the menu with configuration pages.

// collection.php
$app->on('collections.collection.layout.tabs', function(){
    include(__DIR__.'/views/partials/collection.layout.tabs.php');
});

$app->on('collections.collection.layout.tabs.content', function(){
    include(__DIR__.'/views/partials/collection.layout.tabs.content.php');
});

// entry.php --> change default tab to main
$app->on('collections.entry.layout.script.after', function(){
    echo "this.group = 'Main'";
});

collection.layout.tabs.php:

<li class="{ tab=='more' && 'uk-active'}"><a class="uk-text-capitalize" onclick="{ toggleTab }" data-tab="more">{ App.i18n.get('More') }</a></li>

collection.layout.tabs.content.php:

<div class="uk-form-row" show={tab=='more'}>
    <div class="uk-form-icon uk-form uk-width-1-1 uk-text-muted">
        <div class="uk-margin uk-panel uk-panel-box uk-panel-card">
            
            <script>
            var col_group = "image gallery, user-wishlist, configuration";
            </script>
            
            <label class="uk-text-small">{ App.i18n.get('Collection Type (for Grouping)') }</label>
            
            <field-multipleselect options="{ col_group }" bind="collection.type"></field-multipleselect>
            
            <label class="uk-text-small">{ App.i18n.get('Add custom types') }</label>
            <field-tags bind="collection.type"></field-tags>
            
        </div>
        <div class="uk-margin uk-panel uk-panel-box uk-panel-card">
            <label class="uk-text-small">{ App.i18n.get('Tags') }</label>
            <field-tags bind="collection.tags"></field-tags>
        </div>
        <div class="uk-margin uk-panel uk-panel-box uk-panel-card">
            <label class="uk-text-small">{ App.i18n.get('Color') }</label>
            <field-color bind="collection.color"></field-color>
        </div>
        <div class="uk-margin uk-panel uk-panel-box uk-panel-card">
            <label class="uk-text-small">{ App.i18n.get('All options') }</label>
            <field-object bind="collection" label="@lang('Options')" height="500px"></field-object>
        </div>
    </div>
</div>

Are there any plans in this direction?

I would add triggers everywhere, before and after every menu, over and under important text blocks… but it could become messy if I would decide such things…

[serjoscha87]

I also committed a pull request that would add more triggers to collections because I liked to extend collection functionality https://github.com/agentejo/cockpit/pull/824 but that request is waiting since the 22th of July. Don’t think it will ever be merged.

It would really be awesome if we had some more triggers allowing us to extend native collection functionality

[pauloamgomes]

having more triggers will bring more flexibility, but believe that should be managed very carefully, to avoid impacting the performance and code complexity.

The groups seems an interesting idea, @raffaelj, what you are exactly trying to achieve with them? Is something like spaces?

[raffaelj]

@pauloamgomes

The groups seems an interesting idea, @raffaelj, what you are exactly trying to achieve with them? Is something like spaces?

Yes, “spaces” is a good name. I wanted to name it “groups” first, which could be confusing with acl groups.

I like the concept of storing everything in collections, but if I think about more complex projects, I would like to have a better overview over my collections.

A possible use case:

• 10+ collections with pages, dates, products…
• 10+ collections with meta data like product types, categories…
• 50+ collections with image galleries
• maybe collections with comments or some logging data…
• 100+ custom collections for users

They all are linked together with collection-links and module-links (not written yet).

Searching/Filtering for the right collection would be a mess.

I would build dashboard widgets and views to see only the collections/spaces, I’m interested in, like galleries, pages and products. Multiple galleries could be grouped by categories etc.

[pauloamgomes]

Ok, I see, not sure if is exactly the same, I was viewing Spaces as isolated areas that can share the same structure of collections but not the contents, so you can build n consumers (websites, mobile app, etc…). Your scenario seems more like a better way to filter contents (and that makes also sense).

[raffaelj]

@serjoscha87

I also committed a pull request that would add more triggers to collections because I liked to extend collection functionality [micro PR] added triggers to the collection view by serjoscha87 · Pull Request #824 · agentejo/cockpit · GitHub but that request is waiting since the 22th of July. Don’t think it will ever be merged.

It would really be awesome if we had some more triggers allowing us to extend native collection functionality

Ah, you found exaxtly the same places. I didn’t realize your pull request before.

But I found other triggers, that could be used to achieve the goal: app.{$controller}.init and app.layout.contentbefore

Custom configuration could be included in app.layout.contentbefore and app.layout.contentafter, which will only be triggered, when the Admin Controller for collections gets called on app.collections.controller.admin.init

Add this line

$app->on('app.layout.contentbefore', function() use($controller){echo "<pre>app.".print_r($controller, true).".init</pre>";});

to https://github.com/agentejo/cockpit/blob/next/modules/Cockpit/AuthController.php#L25 to display the called controller.

A list with all triggers, that might be helpful can be generated with https://github.com/raffaelj/cockpit-scripts/blob/master/cli/get-triggers.php

[raffaelj]

@pauloamgomes

Ok, I see, not sure if is exactly the same, I was viewing Spaces as isolated areas that can share the same structure of collections but not the contents, so you can build n consumers (websites, mobile app, etc…). Your scenario seems more like a better way to filter contents (and that makes also sense).

My thoughts were just about an easy way to add more options to collections, like Corporate Design colours or things like categories, tags, types/groups/spaces, custom addon options…

In short:
With Cockpit I have a great tool to store any structured data in collections. But my collections aren’t structured very well.

But your idea sounds interesting, too. I already have another project in mind, where I could use this functionality, if I understand it the same way like you.

Do you mean, copying the database schema for new users? Something in this direction?

collections:
    collection1 # acl: admin
    collection2 # acl: admin

spaces:
    default:
        collection1 # copy only schema
        collection2 # copy schema and create first entry with default contents

And creating new users/groups triggers to generate new collections with the same schema?

collections:
    collection1 # acl: admin
    collection2 # acl: admin
    collection1copy1 # acl: user1
    collection2copy1 # acl: user1
    collection1copy2 # acl: user2
    collection2copy2 # acl: user2

But I got offtopic here. If you want to discuss in this direction, we should start a new thread.

[raffaelj]

@serjoscha87 I found a way without the triggers. It’s not perfect, but it works…

raffaelj/cockpit_MoreOptions/blob/master/admin.php#L8-L35