Stuck on building a extra hello world

Hi guys, I’m getting my hands dirty (once again) with the building process of an extra, for most of the process I’ve been following the guide here and managed to generate the model, create most of my classes, and solved a couple “file not found” issues related to paths.

Today I just go to this amazing post and managed to solve some of my doubts, still, the Doodles extra isn’t working. The main pieces I have are the init class which is referenced from the menu:

require_once dirname(MODX_BASE_PATH) . ‘/html/doodlesMine/core/components/doodles/model/doodles/doodles.class.php’;
class MyDoodlesInitManagerController extends modExtraManagerController {
/** @var Doodles $doodles */
public $doodles;
public function initialize() {
$this->doodles = new Doodles($this->modx);

    $this->modx->log(modX::LOG_LEVEL_ERROR, 'Will initializae: '. ($this->doodles->config['jsUrl'].'mgr/widgets/doodles.grid.js'));
    
    $this->addCss($this->doodles->config['cssUrl'].'mgr.css');
    $this->addJavascript($this->doodles->config['jsUrl'].'mgr/doodles.js');
    $this->addHtml('<script type="text/javascript">
    Ext.onReady(function() {
        Doodles.config = '.$this->modx->toJSON($this->doodles->config).';
    });
    </script>');
    return parent::initialize();
}
public function getLanguageTopics() {
        return array('doodles:default');
}
public function checkPermissions() { return true;}
public function process(array $scriptProperties = array()) {}
public function getPageTitle() { return $this->modx->lexicon('doodles'); }
public function loadCustomCssJs() {
    $this->addJavascript($this->doodles->config['jsUrl'].'mgr/widgets/doodles.grid.js');
    $this->addJavascript($this->doodles->config['jsUrl'].'mgr/widgets/home.panel.js');
    $this->addLastJavascript($this->doodles->config['jsUrl'].'mgr/sections/index.js');
}
public function getTemplateFile() {
    return $this->doodles->config['templatesPath'].'home.tpl';
}}

and my template

<div id="doodles-panel-home-div"></div>
<h2>Pegueloooo!</h2>

I also have al the JS files on the right locations, and the paths configured inside the Doodles class.

I also tried just downloading the doodles repo and just creating the namespaces and menu items, but sill im just getting and empy screen with the ‘Pegueloooo’ message but nothing else.

Also came across this but could not find the “original” repo.

The generate schema process worked as expected and the table is correctly generated inside mysql

Any ideas of what could be wrong? I’m trying to understand the basic elements of an extra before digging on the VueJS done by @aredfhealy

2 Likes

Doodles is notoriously difficult to get working. If you turn on dev. tools, do you see any JS errors in the console? Anything in the MODX error log?

1 Like

Hi Bob, thanks for your response, that was basically the issue, in a closer inspection I found out that the routes of the imported JS files on the site were wrong, and this was due to a misconfiguration in the ‘doodles.assets_url’ system setting, Now I can see the Doodles Management page, maybe a file not found or something like in the addJavascript method of modExtraManagerController would help.

And totally, this is really hard to get up and running, but you learn a lot, this is the second time I’m giving it a try, and today it’s the furthest that I have ever got. If everything goes fine, I’ll pack everything up on a nice docker container, and have an example you can actually see running without losing your mind

Just read the headline, maybe this thread is of interesst for you :

1 Like

I’m glad you got it sorted. If the extra is for distribution, you might also want to take a look at MyComponent. Even if you don’t use it for your extra, it has a fairly extensive, built-in, Example project you can build and install in a few minutes.

1 Like

Thanks a lot @raffenberg , in that one, the author followed a totally different path by implementing the page using Vue, which is pretty cool, but I want to first understand how the bare-bones MODx works, but thanks to that project and the guide @bobray provided I managed to make a pretty good process and almost everything is working now.

Thanks a lot, there also lots of useful info there, we created a docker container with the doodles extra up and running for anyone else struggling with this, sometimes its easier to analyze something running, than to break your head trying to make it run, Doodles extra up and running on docker