[solved] Weekend Challenge: RockTabulator needs JS Experts :)

[bernhard]

I've a strange problem where I got stuck developing RockTabulator and I'd really appreciate getting help. I had to refactor quite a bit and the earlier working "rowactions" now don't work any more. See the short screencast demonstrating the problem:

You can install this setup easily by downloading the files here: https://transfer.sh/3YGE7/tabulator.zip (will be available for 14 days)

Please make sure you are not installing it in a sub-folder!!

Then just restore the database from https://transfer.sh/KFjiY/tabulator.zip and login as tabulator/tabulator

The interesting parts of the code are:

https://github.com/BernhardBaumrock/RockTabulator/blob/a868858bdd85d20dba056d6b07c6ecbd0c69c894/rowactions/_rowactions.js#L90-L99

https://github.com/BernhardBaumrock/RockTabulator/tree/a868858bdd85d20dba056d6b07c6ecbd0c69c894#L38

https://github.com/BernhardBaumrock/RockTabulator/blob/a868858bdd85d20dba056d6b07c6ecbd0c69c894/RockTabulatorGrid.js#L122-L139

I wonder why grid.reload() behaves differently in the ajax callback and when using it from the console. And also why the clicks on the trash icons are not intercepted correctly after reloading the grid ? 

Thx for your help!

[dragan]

Downloading now... but quickly looking at the code: Did you try to remove return false, and instead use event.preventDefault() after line 91 in _rowactions.js?

[dragan]

Wow... this should be fun! I removed the cache insert queries, but now it still says 7 hours (using HeidiSQL)... ?

[bernhard]

1 hour ago, dragan said:

Did you try to remove return false, and instead use event.preventDefault() after line 91 in _rowactions.js?

no, but that should not  be the issue as it works when the grid is freshly loaded https://stackoverflow.com/a/1357151/6370411

58 minutes ago, dragan said:

Wow... this should be fun! I removed the cache insert queries, but now it still says 7 hours (using HeidiSQL)... ?

?

That one should be better: https://transfer.sh/KFjiY/tabulator.zip

Thx for having a look!

PS: The second sql file is a regular sql backup while the first one is a PW interal database backup. I know that PW adds some overhead to the backup files with additional checks but I've been wondering for a while now if that is really the best... But that's a different topic ? 

[dragan]

OK, finally the sql-import is done and I'm in the admin. But under setup/rocktabulator/ I just see "ProcessWire: Process does not exist: Module 'ProcessRockTabulator' is not present or listed as installable"

and under modules it says "no modules found"

[bernhard]

Please try the second db dump that I linked above (takes 1min on my laptop). Just tried and everything works ? 

[dragan]

Right, after clearing caches, I can now see your modules installed. Now on to the next challenge:

Folder /tabulator/site/modules/RockTabulator/examples/ does not exist, Folder /tabulator/site/modules/RockTabulator/examples/ is not writable for PHP

It exists, and the examples are there, but apart from the error messages I don't see any files in PW. I'm on Windows w/Laragon. Even trying to create a new file "rt14_test.php" didn't work: not writeable error again.

[dragan]

Wow, the 2nd .sql loads really fast... wished I didn't waste time with the other one.

But unfortunately, the "not writable" errors are still there.

[bernhard]

Strange, I'm also on Win10+Laragon... can you access the example directly at /tabulator/setup/rocktabulator/?name=rt12_rowactions ?

[bernhard]

3 minutes ago, dragan said:

Wow, the 2nd .sql loads really fast... wished I didn't waste time with the other one.

Yeah sorry for that... The default db dump sucks unfortunately...

3 minutes ago, dragan said:

But unfortunately, the "not writable" errors are still

Just remove those lines from the code ? 

[dragan]

nope: I get "ProcessRockTabulator: No PHP file for rt12_rowactions found - please create it!"

[dragan]

OK, I did that, then tried to access the example file directly again, and whoops, get a 403 error. Updated to latest dev, and now even stranger stuff happens. I can't even get to the backend again - just get a 403 EVERYWHERE, incl. frontend. *sigh*

[dragan]

I give up for today, sorry.

[bernhard]

Well... restoring an existing installation should not have been the challenge ? No idea what's going on. I think the best would be to reinstall everything, clear everything (db, browser cache/cookies)...

You can also try to follow the instructions there: https://github.com/BernhardBaumrock/tabulator.test and install it via GIT (make sure to specify the new-init-method branch)

git clone -b new-init-concept git@github.com:BernhardBaumrock/tabulator.test.git .

 

[dragan]

There's other funky stuff going on as well: When trying to access setup/rockfinder2/sandbox/?name=01_cats

I get this:

site/templates/.php ?

[dragan]

And trying to open an endpoint link takes me to http://localhost/5d4dafe7929fd/?name=01_cats&type=debug

which is rubbish, since I have this installation in a subdir: localhost/tabulator/

[bernhard]

1 minute ago, dragan said:

which is rubbish, since I have this installation in a subdir: localhost/tabulator/

I guess that's the issue! I'm never using installations in a subdir so there might be some quirks about paths and urls...

[dragan]

*grumble*... yeah so now I restarted Laragon and used tabulator.test instead - seems to work now. Sheesh. Please do not use absolute paths/urls, but PW's $config->urls / ->paths instead.

[bernhard]

4 minutes ago, dragan said:

Please do not use absolute paths/urls, but PW's $config->urls / ->paths instead.

Thx for reminding me about that ? 

[bernhard]

I've had a look into the code and it does not seem to be too easy to fix. That's exactly the reason why I think that a $config->url() and $config->path() method would make a LOT of sense. It would reduce the chance of such bugs drastically... https://github.com/processwire/processwire-requests/issues/326

[dragan]

OK, I really gotta get going soon. I couldn't fix anything in that short period of time, but I noticed something strange:

line 5 of trash.js:

var grid = RockTabulator.getGrid(e.target);

PHPStorm says "unresolved function or method getGrid"

same goes for the next line: it doesn't recognize rowactions. Don't know if it helps...

[dragan]

Yep: you should get used to use "use strict" in every JS file, then you would have found this error earlier: 

https://developer.mozilla.org/de/docs/Web/JavaScript/Reference/Strict_mode

Now I see this is my console:

Also, I see quite a few IDE warnings like these:

panel.js: if(name != 'panel') return;

Quote

Comparison name != 'panel' may cause unexpected type coercion
This inspection reports usages of JavaScript equality operators which may cause unexpected type coercions. It is considered a good practice to use the type-safe equality operators === and !== instead of their regular counterparts == and !=.

 

[dragan]

Also:

if(!RockTabulator) {
    console.log('there is no RT here!');
}

RT is not even instantiated / defined in trash.js, so even just hardcoding the tabulator with a DOM-selector won't help...

[bernhard]

RockTabulator is the global object that is loaded in RockTabulator.js and therefore it's available in all files that are loaded after RockTabulator.js - which is the case for all plugins...

[dragan]

Well, in the case of trash.js RT is clearly NOT defined and recognized. Try it out yourself. Consoles don't lie :-)