
Fieldtype Page Table Grid – Page Builder Preview
By
jploch, in Module/Plugin Development
-
Recently Browsing 0 members
No registered users viewing this page.
-
Similar Content
-
By jploch
Hey folks,
for a module (a pagebuilder based on PageTable) I need to save some settings as JSON. The values are saved for each page table item (a pw page). It's working well, but I am looking for ways to improve the structure I have. As I'm not that experienced with JSON, maybe someone more experienced can take a look and tell me if my approach is good practice.
My goal is to make all the items accessible by page id, without looping over them (using objects instead of arrays):
// access from template with pw page var $jsonObject->items->{$page}->cssClass; Her is an example of my JSON structure:
{ "items": { "3252": { "id": "3252", "cssClass": "pgrid-main", "breakpoints": { "base": { "css": { "grid-column-end": "auto", "grid-row-end": "auto", "grid-column-start": "auto", "grid-row-start": "auto", "align-self": "auto", "z-index": "auto", "padding-left": "60px", "padding-right": "60px", "padding-top": "60px", "padding-bottom": "60px", "background-color": "rgb(255, 255, 255)", "color": "rgb(0, 0, 0)" }, "size": "@media (min-width: 576px)", "name": "base" } } }, "3686": { "id": "3686", "cssClass": "test_global", "breakpoints": { "base": { "css": { "grid-column-end": "-1", "grid-row-end": "span 1", "grid-column-start": "1", "grid-row-start": "auto", "align-self": "auto", "z-index": "auto", "padding-left": "0px", "padding-right": "0px", "padding-top": "0px", "padding-bottom": "0px", "background-color": "rgba(0, 0, 0, 0)", "color": "rgb(0, 0, 0)" }, "size": "@media (min-width: 576px)", "name": "base" } } }, "3687": { "id": "3687", "cssClass": "block_editor-3687", "breakpoints": { "base": { "css": { "grid-column-end": "span 2", "grid-row-end": "span 1", "grid-column-start": "auto", "grid-row-start": "auto", "align-self": "auto", "z-index": "auto", "padding-left": "0px", "padding-right": "0px", "padding-top": "0px", "padding-bottom": "0px", "background-color": "rgba(0, 0, 0, 0)", "color": "rgb(0, 0, 0)" }, "size": "@media (min-width: 576px)", "name": "base" } } }, "3696": { "id": "3696", "cssClass": "block_editor-3696", "breakpoints": { "base": { "css": { "grid-column-end": "span 2", "grid-row-end": "span 1", "grid-column-start": "auto", "grid-row-start": "auto", "align-self": "auto", "z-index": "auto", "padding-left": "0px", "padding-right": "0px", "padding-top": "0px", "padding-bottom": "0px", "background-color": "rgba(0, 0, 0, 0)", "color": "rgb(0, 0, 0)" }, "size": "@media (min-width: 576px)", "name": "base" } } } }, "breakpointActive": "base", "breakpointActiveSize": "@media (min-width: 576px)" }
-
By franciccio-ITALIANO
Hi everyone.
I've created 12 templates that are the same but each with an extra bit of html code.
The piece of code is as follows:
<div> <div class="box-pf"> <i class="fa fa-map-pin fa-2x fa-red faa-pulse animated"></i> <a href=""> <span class="uk-text-middle"><i>Sonchus oleraceus</i> 'Grespino degli Orti'</span></b> </a> </div> </div> On the third line we read "fa-red."
I created 12 similar templates.
The first template has only one box with fa-red, the last template has 12 boxes with icons of 12 different colors.
So. is there any way to have only 1 template and add, if I want and when I want, a small or big, same or different piece of html code?
-
By bernhard
I built this module because I needed a versatile solution to replace tags and simple if-blocks in some E-Mails and PDF documents.
If you only need to replace static tags (no if-conditions), then you can use default PW api and need no module:
$str = "My favourite color is {color}."; $texttools = $sanitizer->getTextTools(); echo $texttools->populatePlaceholders($str, ['color' => 'red']); // output: My favourite color is red. Usage:
See the two example Files in the folder /replacements
Methods:
replacementsTable()
Renders an overview of all available replacements (see the example in the Module's config file:
Create new Replacements:
Simply copy the sample file and adopt to your needs.
Download:
https://gitlab.com/baumrock/RockReplacer
-
By bernhard
DEPRECATED
I'm using this module in several projects, but it will likely not see any updates in the future. I'm not happy with it and I'm looking for ways to develop better solutions. RockTabulator was my first try, but I'm also not 100% happy with that. The tabulator library is great, but my module implementation is not. I hope to get a good solution soon, but it will be a lot of work...
---
Some of you might have followed the development of this module here: https://processwire.com/talk/topic/15524-previewdiscussion-rockdatatables/ . It is the successor of "RockDataTables" and requires RockFinder to get the data for the grid easily and efficiently. It uses the open source part of agGrid for grid rendering.
WHY?
ProcessWire is awesome for creating all kinds of custom backend applications, but where it is not so awesome in my opinion is when it comes to listing this data. Of course we have the built in page lister and we have ListerPro, but none of that solutions is capable of properly displaying large amounts of data, for example lists of revenues, aggregations, quick and easy sorts by the user, instant filter and those kind of features. RockGrid to the rescue 😉
Features/Highlights:
100k+ rows Instant (client side) filter, search, sort (different sort based on data type, eg "lower/greater than" for numbers, "contains" for strings) extendable via plugins (available plugins at the moment: fullscreen, csv export, reload, batch-processing of data, column sum/statistics, row selection) all the agGrid features (cell renderers, cell styling, pagination, column grouping etc) vanilla javascript, backend and frontend support (though not all plugins are working on the frontend yet and I don't plan to support it as long as I don't need it myself)
Limitations:
While there is an option to retrieve data via AJAX the actual processing of the grid (displaying, filtering, sorting) is done on the client side, meaning that you can get into troubles when handling really large datasets of several thousands of rows. agGrid should be one of the most performant grid options in the world (see the official example page with a 100k row example) and does a lot to prevent problems (such as virtual row rendering), but you should always have this limitation in mind as this is a major difference to the available lister options that do not have this limitation.
Currently it only supports AdminThemeUikit and I don't plan to support any other admin theme.
Download: https://gitlab.com/baumrock/FieldtypeRockGrid
Installation: https://gitlab.com/baumrock/RockGrid/wikis/Installation
Quikckstart: https://gitlab.com/baumrock/RockGrid/wikis/quickstart
Further instructions: https://gitlab.com/baumrock/RockGrid/wikis/quickstart#further-instructions
German Translation File: site--modules--fieldtyperockgrid--fieldtyperockgrid-module-php.json
Changelog: https://gitlab.com/baumrock/FieldtypeRockGrid/raw/master/changelog.md
Module status: alpha, License: MIT
Note that every installation and uninstallation sends an anonymous google analytics event to my google analytics account. If you don't want that feel free to remove the appropriate lines of code before installation/uninstallation.
Contribute:
You can contribute to the development of this and other modules or just say thank you by
testing, reporting issues and making PRs at gitlab liking this post buying me a drink: paypal.me/baumrock/5 liking my facebook page: facebook.com/baumrock hiring me for pw work: baumrock.com
Support: Please note that this module might not be as easy and plug&play as many other modules. It needs a good understanding of agGrid (and JavaScript in general) and it likely needs some looks into the code to get all the options. Please understand that I can not provide free support for every request here in the forum. I try to answer all questions that might also help others or that might improve the module but for individual requests I offer paid support (please contact me via PM).
Use Cases / Examples:
Colored grid cells, Icons, Links etc. The Grid also has a "batcher" feature built in that helps communicating with the server via AJAX and managing resource intensive tasks in batches:
Filters, PW panel links and instant reload on panel close:
You can combine the grid with a chart library like I did with the (outdated) RockDataTables module:
-
By Paul Greinke
Hi there. I wrote a custom module for one of my projects. In fact I maybe want to use my module in other projects too. In order to be variable and customizable I need to implement some custom hooks into my module. So I can afterwards hook into the my functions in order to modify them to match the needs of the new project.
I tried simply defining functions with the '__' prefix. But that did not work. I'm imagining something like the following:
<?php class MyClass { public function ___someFunction() { // Do something } } // ready.php $this->addHookBefore('MyClass::someFunction', function($event) { // some customization }); Is there a way to accomplish that?
-