lekoala/silverstripe-modular-behaviour

Use modular-behaviour.js in SilverStripe

dev-master 2023-08-10 15:02 UTC

Requires

• php: ^7.4 || ^8
• silverstripe/assets: ^1.6 || ^2
• silverstripe/framework: ^4 || ^5
• silverstripe/versioned: ^1.6 || ^2

Requires (Dev)

• phpunit/phpunit: ^9.5
• squizlabs/php_codesniffer: ^3.0

MIT

• LeKoala

• form
• module
• cms
• silverstripe
• modular-behaviour

README

Intro

Allow usage of modular-behaviour in Silverstripe.

ModularBehaviour is a tool that helps you to bind behaviour to a specific html node. As such, it works in a similar fashion than entwine, but works consistently in frontend and backend in a standalone fashion, because forcing usage of entwine in the frontend is not always feasible.

How to use

Simply extend ModularFormField instead of FormField. If it's not possible, simply use the ModularBehaviour trait. This module is mainly built with FormFields in mind, but it should work just fine for widgets, etc.

You can then override as needed any of the built in methods:

• getModularManual
• getModularSrc
• getModularSelector
• getModularFunc
• getModularName
• getModularConfig
• getModularConfigName

Please refer to the phpdoc for detailed usage.

Here is an example:

class MyModularField extends ModularFormField {
    public function getModularName()
    {
        return 'MyApp.MyModularField';
    }

    public function getModularSelector()
    {
        return '.my-modular-field';
    }

    public function getModularConfigName()
    {
        return str_replace('-', '_', $this->ID()) . '_config';
    }

    public function getModularConfig()
    {
        $script = $this->getInitScript();
        $configName = $this->getModularConfigName();
        $script = "var $configName = $script";
        return $script;
    }
}

Lazy

Fields wrapped by modular behaviour can lazily load themselves (which is very useful when used in long pages or in tabs).

Simply call setModularLazy and pass true and it should all work magically.

Dynamic src

You can also (lazily if needed) load the source script instead of relying on the requirements api.

Simply override getModularSrc to return the public path to the js file that contains the constructor.

ESM Note

Due to ajax scripts being loaded through globalEval and not supporting esm module (export not recognized), the min file is built using iife.

Compatibility

Tested with ^4.10 but should work on any 4.x projects

Maintainer

LeKoala - [e-mail]