Leaderboard
Popular Content
Showing content with the highest reputation on 04/07/2023 in all areas
-
I have been using HTMX recently and it really is a very good option. Of course all of its functionality can be achieved using the Processwire API, and including partial files in the template file. But it would be wonderful to have some kind of facilities in our framework. Maybe with a new method in the PageRender class, that allows to select specific elements of the template file markup. The following is a simple idea based on the Markup Regions syntax: <pw-region id="content"> <h1><?= $page->title ?> <?= $page->summary ?> <h2>Contact Details</h2> <div id="contact_info" pw-fragment> <p><strong>$page->contact_name</strong></p> <p>$page->contact_address</p> </div> <h2>Social Channels</h2> <div id="total_likes" hx-swap-oob="true" pw-fragment> <a href="https://www.facebook.com/">$page->likes</a> </div> <p>Please, Call Us!</p> </pw-region> Since I'm not a programmer and I don't really understand very well how PW works inside, perhaps one of the following options can work to execute the rendering of the fragments (It can use the Find method that Markup Regions has for HTML tags) $output = $page->render("#contact_info#total_likes"); $output = $page->render("basic-page.php#contact_info,total_likes"); $output = $page->render("fragment=contact_info|total_likes"); $output = $page->fragment("contact_info|total_likes")->render(); $output = $page->render()->fragment("contact_info|total_likes"); $output = $page->renderFragment(["contact_info","total_likes"]); wireFragment() Of course this method does not use the append file of the "_main.php", perhaps doing a: $this->halt(); Laravel Blade has this already implemented for precisely the same purpose. Check this video: https://youtu.be/3dPUsXsDZsA https://htmx.org/essays/template-fragments/ @ryan what do you think about this? Everyone, would this be a good idea? ..or something similar?2 points
-
in fact I have a method in the custom page class for that: if (HTMX Blah Blah) $page->renderFragment("todo", [array], "200 OK"); function renderFragment($filename, $bag, $code) { header("HTTP/1.1 $code"); wire("files")->include("services/partials/{$filename}.php", array('view' => $bag)); exit(); } .. but I love to use Markup regions in my projects, and I hate using tens of partial files, that's the reason for the proposal. Get the "partials" from the same template file that I render in the page request. It's a simple helper in tune with Processwire Markup Regions2 points
-
All that you describe is very good for simple examples like the ones you put here, but when it's a much more complex page, or a web application, with several different elements that you want to update, it starts to become complex. You need to start dissecting the template file into small partial files (or even worse build the markup with PHP variables) to be able to render different types of requests to the same template, and it's a mess! ex. complex forms with dependencies between the fields, updating graphs or tables, panels with details of the selected element, couple of counters in different location in the page, etc. The idea is to be able to use the same original template file that initially rendered the page, and that can be used with Markup Regions if you wish. Response with a whole page as @bernhard proposes (although it's already cached, you need to update it with the new query) and send the complete page each time you need to update something, ex. only one <select> element, small text or a counter, these kind of pages regularly weigh MBs ..It's very unreasonable ..is better to reload the page. The ideal is to send the exact piece of html that you need to update on your initial page render. @bernhard Latte already support this kind of rendering. Using the 3rd parameter to only render 1 block from the template $Latte_Engine->render('path/to/template.latte', [ 'foo' => 'bar' ], 'content');2 points
-
Looks like htmx has you covered ? I read the docs like you can add "hx-headers" to your <body> and you're done.2 points
-
I'm developing a site using HTMX to swap images in a gallery (it uses 'picture' element and 'srcset' so I didn't want to load all the markup at once) alongside PW regions and it works great. I haven't really encountered any problems or gymnastics -- but maybe my use-case is simple enough? <?php namespace ProcessWire; $imgMarkup = ''; $thumbMarkup = ''; $imgNum = 0; /** Build the gallery fragment (the bit that changes via HTMX) before output */ if ($page->gallery && $page->gallery->count() > 0) { $imgNum = $input->get('img', 'int', 0); // get image index number from GET var (AJAX and no-JS) $galleryImg = $page->gallery->eq($imgNum); // get the image from index // The image markup (actually rendered from a custom page class) $imgMarkup = '<picture> <source type="image/webp" srcset="..."> <img src="..." width=".." height="..." alt="..." srcset="..." sizes="..."> </picture>'; // If it is a ajax (HTMX) request, just echo the image markup and stop PW processing tyhe rest of the template. if ($config->ajax) { echo $imgMarkup; return $this->halt(); } /* When doing HTMX ajax swap, the rest of this template won't be rendered */ // Build the clickable thumbnails that do the swapping (simplified) foreach ($page->gallery as $item) { $thumbMarkup .= '<li><a href="..." hx-get="..."><img src="..." width="..." height="..." alt="..."></a></li>'; } } ?> <!-- The markup regions --> <pw-region pw-id="imageViewer"> <div class="image-wrapper"> <figure class="image-main-wrapper" id="mainImg"> <?=$imgMarkup?> </figure> <div class="image-thumbs-wrapper"> <!-- where the HTMX magic happens -- note the additional hx-headers, which allows PW's $config->ajax to work --> <ul class="image-thumbs" hx-trigger="click" hx-target="#mainImg" hx-swap="innerHTML" hx-headers='{"X-Requested-With": "XMLHttpRequest"}' > <?=$thumbMarkup?> </ul> </div> </div> </pw-region> <pw-region pw-id="pageContent" class="content-left">....</pw-region> <pw-region id="sidebarContent">...</pw-region> It just works... no need to faff with cancelling prepend/append templates etc, just rember to add the extra hx-header (also, you can do it once on a parent element), you don't need to add it to every call. I haven't ever tried, so I'm not 100%, but there might be a way to automatically add the header to every HTMX call with a bit of javascript in the header/footer. I feel all the tools are probably already there, but if there is an even easier way, though, that would be great.2 points
-
@bernhard This works pretty well for static content, but unfortunately not for content filtered by URL parameters, for example. I really like to use HTMX to dynamically load and replace content on pages. Also asynchronous loading of partial parts of the page becomes very easy. Here is a simple example of the output of a product tile with URL hook <?php foreach ($items as $key => $item) { $pos = $start + $key + 1; ?> <div :hx-get="'/getproduct/'+<?= $item->id ?>" hx-trigger="revealed" hx-indicator=".loader" class="product-tile"> <div class"loader"> Some fancy loader :-) </div> </div> <?php } ?> The hook: (getproduct.php) <?php namespace ProcessWire; $wire->addHook('/getproduct/{prodid}', function ($event) { $id = $event->arguments('prodid'); $item = $event->pages->get("template=product, id=$id"); ?> <div> <p>Producttile</p> </div> <?php exit(); ?> And of course in ready.php include 'templates/functions/getproduct.php'; if (array_key_exists('HTTP_HX_REQUEST', $_SERVER)) { $config->appendTemplateFile = ''; $config->prependTemplateFile = ''; $config->htmxRequest = true; } Maybe that's what @Jonathan Lahijani means by gymnastics. For me personally, this is not a special effort and is actually already part of my workflow. Disclaimer: I know this is not Markup Regions ?2 points
-
@daniel712 You might find these informative: https://processwire.com/talk/topic/21364-legacy-or-second-database-with-processwire/#comment-184482 https://processwire.com/talk/topic/3987-cmscritic-development-case-study Also, site localized googling can be helpful: https://www.google.hu/search?q=external+database+site%3Aprocesswire.com%2Ftalk Hope this helps.2 points
-
Give a read to this Ryan 2012 answer. Then, a good habit in pw, is to just read his clear and concise comments on the source code, easy as .. Do not hesitate to ask for help if needed. Documentation: https://processwire.com/api/ref/wire-database-p-d-o/2 points
-
Hey Friends, thanks for the hints to VSCode... ? but i am too much into vim, like and those functions you mentioned are way more customizable, and so on... but with this little anecdote let's put asleep the $EDITOR topic: Yes i watched Kevin when he was duplicating a section block like 5 times in VSCode ... "1, 2, 4 ... now we have 5, i think..." - lol - so , thats one of the main reasons for vim, i love my "vat" or "8dd", not even touched the macro function... :)) Where to go from here: I found the CSS tuts of Kevin Powell. That will help me through the CSS dschungle! ? Great thanks for that! He also had good tipps for beginners to HTML5 to do it right from the beginning. What i love about this is the close similiarity to LaTeX, because i'm a great fan of LaTeX! And there they copied the principle of keeping apart structure and content... ? Best Wishes to Don Knuth! ? ... Small anecdote to this: I loved the clip where he strippes down the mess in the FIFA Site... ? I heard about DOM manipulation, so this is a topic to look into for the next days... Where would be a good starting point to read about a mysql connection of PW to an external existing database? This topic i am very excited about to get and update values thereof with the nice php functions of PW and the custom style templates... i love this freedom! Great Thanks to all PW Devs! ? Should also be no stress to print nice LaTeX or Markup pdf documents with PW, correct? Has anybody talked about this topic? For the beginning i will follow the advice of Kevin and try to copy existing sites and to contribute to OpenSource projects, because that's my world... Let's see!2 points
-
A friend of mine has changed his job, he owns a video game room, he now "develops" websites, I could see a result, and the tools used, I prefer to keep quiet here (it's in the title). I have to interfere in his conversion process before it's too late: Have the right habits, keep in mind that the goal is to help the client to improve the conversion of his business through his website, and thus to make more money rather than losing it. Otherwise, what's the point, an instagram or facebook page would have been enough. So I wanted to make a synthesis of the arguments to make him take into account, I also saw an old forum thread that came up recently, so I wanted to ask a neutral "person" (person.. lol) what she think. I have the impression that the arguments are those already exposed in the answers given to these threads. In short, a good synthesis, I think, and non-biased, I hope. As always, the same question, "How to convince my client to use Processwire instead Wordpress?" Yours sincerely, GPT ?1 point
-
Added a fix for the on-demand mirroring at the beginning of the hook: //Don't execute for backups!! $backtrace = DEBUG::backtrace(); foreach($backtrace as $item) { if(strpos($item['file'], 'ProcessDatabaseBackups')) return; }1 point
-
This is what I remember you saying in the 'adding RM to existing products' video but I know as this is a work in progress things could have changed. I'm in the middle of applying gebeer's Repeater Matrix migration methods to something I am working on but when I am done I will take a look at the dev branch and try some things.1 point
-
ProcessWire doesn't care what the folder is called it lives in. I could be just /var/www/ or /public_html/ or /home/user/_client/domain.tld/. There are a few things you really need to take care of: $config->httpHosts $config->db* and the whole database setup of course file/folder permissions https://processwire.com/docs/security/file-permissions/ take care of all .htaccess files, especially in the root You could just move all files by hand or use either ProcessExportProfile or Duplicator. Some even just use Git to move a ProcessWire instance around. It get's a bit more complicated in case you want to run ProcessWire inside a subfolder of another project. But there are different threads about this here in the forum.1 point
-
Hey @gornycreative I've just pushed that do the dev branch and it will be available in the next release of RockMigrations. I have added "permissions-" and "access-" keys to the migrate() method. I have to correct myself here. Actually the default is that RM keeps existing values! That's in line with how it works in general. It only add's things or overwrites them but it does not remove anything unless you tell it to. Could you please grab the dev branch and let me know if everything works as expected? https://github.com/baumrock/RockMigrations/tree/dev1 point
-
I get it, in PW it can be done too with $files->render() ..now do the example without partials ? I mean when a page has many moving parts, you have to dissection too much the "view" in files, and it becomes complex (not impossible) to handle... I want to make clear my first post says that it can be done now, in fact I have done it... but it would be much more productive and simple something like what I propose .. but it's only an idea based on my opinion1 point
-
Ok thx I think I get the point ? Maybe I was not seeing the problem because RockFrontend let's you split your markup in as many files as you want, which is also helpful with HTMX. In your template you could have this <div uk-grid> <div n:foreach="$page->cards() as $card"> {$rockfrontend->render('partials/card.latte', $card)} </div> </div> And in your HTMX Endpoint you could have this: <?php $wire->addHook("/cards/{id}", function($event) { $rockfrontend = $event->wire->rockfrontend; $post = $event->wire->pages->get($event->id); if($post->template != 'blogpost') throw new Wire404Exception("Invalid Page"); return $rockfrontend->render("partials/card.latte", $post); });1 point
-
Ingenious, that means in the ready.php the HTMX request does not have to be declared extra. Note to me: RTFM ?1 point
-
Ahh, yes.... I've only been putting it on the local parent element where required, because the <body> is controlled by a different template. But if your entire site is HTMX powered that is absolutely the way to go.1 point
-
I've only little experience with HTMX. Is your request for making something possible that currently is not. Or is it about making something easier? Or is it about making something more performant? I thought you can simply request the whole page and HTMX will select the correct elements to replace? If it's about performance I'm not sure if your suggestion is really a good idea. The whole page would in my case almost always be pro-cached and therefore requests would be blazing fast. If the request returned only a portion that was not cached I guess it would be a lot slower. But it's just a guess ? I'm missing the WHY - maybe you want to explain that a little more detailed so that others that are not familiar to HTMX can better understand? Maybe @Jonathan Lahijani can also explain the gymnastics that are necessary at the moment?1 point
-
I've recently had to switch to a new machine and it was no issue. If I remember correctly I did not sync anything. Sometimes a refresh is a good thing to throw away things that you once installed and never needed again. Things that I'm missing I will realise immediately and just reinstall. But VSCode recently introduced Profiles (https://code.visualstudio.com/docs/editor/profiles) which would do exactly what you are asking for.1 point
-
I did this thing with a keystroke for now... with <F9> and <F10> i can switch the filetype btw html and php, so this works...1 point
-
Thanks for the fix @flydev - I've added it to the latest version.1 point
-
While learning ProcessWire you will burn through a lot of test and demo sites. Or at least I did. And it was fun. Just start building something you already know the structure of. Like a blog, music collection or movie review type of site. Those data structures are relatively easy so it's a good starting point in my opinion. You will get things wrong at the beginning or will find better solutions later on. Enjoy the process. I rarely use HTML-comments in my PHP files so there is nothing I had to change. There are two awesome plugins preservim/nerdcommenter and tpope/vim-commentary - maybe those have some settings available to master this part. Yet I support @flydev's recommendation of using VS Code could be a better option right now. You have way easier access to everything and always see where you are, where you might need to go, and yes... the whole structure. Way more important are extensions. That's way easier in VS Code than in VIM. Maybe not better but faster. The moment you know all necessary files, where they are, which names they have, which names and files might be in several places or are similar (init.php and _init.php for example) switch back to VIM if you like. FZF or Telescope are way faster and more reliable than VS Code's Ctrl+P feature. With NVIM's LSP setup and some configs it could probably outsmart VS Code extensions as well.1 point
-
@SebastianP if you really need the module, you can try to check xhr (I can't confirm the behavior..): if (!$this->config->ajax) { // add this if(in_array('View', $this->hiddenTabs)) { $event->return .= ' <script> $(document).ready(function() { $("#_ProcessPageEditViewDropdown").remove(); }); </script>'; } } // <-- add this https://github.com/adrianbj/RestrictTabView/blob/88bbee5a1fbf9a52e16df8573c0a243ee9feca97/RestrictTabView.module.php#L72-L791 point
-
I've found the reason. The module "Restrict Tab View", especially the activation of the "tab-view-hide"-permission causes this behaviour. After deactivting this option, the upload works again. Best regards Sebastian1 point
-
Hi @adrian, thank you for providing this helpfull module! I've found a strange behaviour in my backend: when the "tab-view-hide"-permission is set for a role, the image or file upload fails. Please have a look at my post. Thank you, best regards Sebastian1 point
-
Yeah, but it seems they can be used and don't work similarly with and without UTF8 settings? There was also this issue: https://github.com/processwire/processwire-issues/issues/4881 point