Leaderboard

Just a brief update today. I’m going to give it another week before bumping the core version, as I don’t think there’s enough changes yet to warrant a version bump. For whatever reason, several of my clients have needed integration with Stripe (payments) over the last few weeks. I’d not worked with it before the last month or so, but now all of the sudden am working with it a lot, because that's what my clients have asked for. I’ve found myself working on four different Stripe integrations on existing PW sites, both Stripe Elements and Stripe Checkout. None of these are for sites that have an actual “store” where they would need a cart, but rather just “pay for your reservation”, “buy this book”, “buy this song”, and “make a donation of $10”, “make a recurring donation”, type things. After doing a few of these, I thought it would make a lot of sense to have this built into FormBuilder, which would save us time on this stuff. So this week I built Stripe support into FormBuilder (using the Stripe Elements API). It’s already fully functional, so I will be releasing a new version of FormBuilder with this capability quite soon. To add a Stripe payment input to your form you just add a new field of type “Stripe payment for FormBuilder”, and then it asks you for some info about it (like amount to charge) and then your form works as a payment processor. Stripe has a clever way of making this all work, so that the user never leaves your site, but your site (and FormBuilder) never sees credit card numbers or anything like that, so it’s secure and you don’t have to consider things like PCI compliance. I've also got some other unrelated updates for FormBuilder that I'll be covering soon as well. Have a great weekend!

I have played with a .htaccess only solution to serve WEBP instead of JPEGs or PNGs. This way you can - leave your existing template markup untouched, and the apache_rewrite will - detect if the browser supports WEBP - if a WEBP copy is available for a JPEG or PNG image. Locally it's working out nicely! ? This markup automatically serves a WEBP copy to all browsers that support it: $options = ['webpAdd'=>true, 'webpQuality'=>90]; $image = $page->images->first()->size(300, 300, $options); // this will create a 300x300 Thumb for JPEGs and PNGs with an additional WEBP copy ?> <img src="<?=$image->src?>" alt="<?=$image->alt?>" /> <!-- this will serve the WEBP image to all Browsers that supports it, and the JPEG/PNG to other browsers --> AddType image/webp .webp <IfModule mod_rewrite.c> RewriteEngine On AddDefaultCharset UTF-8 ### Redirect regular PW JPEGs and PNGs to their WEBP image copies, ### if available and if the Browser supports WEBP: ## Does Browser accept WEBP images? RewriteCond %{HTTP_ACCEPT} image/webp ## Is it an existing file? RewriteCond %{REQUEST_FILENAME} -f ## Does a WEBP copy exist for it? RewriteCond %{DOCUMENT_ROOT}/$1$2$3/$4.webp -f ## With an added GET var or GET value of skiprewrite we do send the original JPEG or PNG RewriteCond expr "! %{QUERY_STRING} -strmatch '*skiprewrite*'" ## With an added GET var or GET value from the PW Page Editor, we do send the original JPEG or PNG RewriteCond expr "! %{QUERY_STRING} -strmatch 'nc=*'" ## Is it a regular PW JPEG or PNG image, stored under site/assets/files? RewriteRule ^(.*?)(site/assets/files/)([0-9]+)/(.*)\.(jpe?g|png)(.*)$ /$1$2$3/$4.webp [L] </IfModule> Adding a GET var or GET value with the string "skiprewrite" added to an image bypasses serving the WEBP copy in favour for the original variation. (Maybe useful for debug purposes!)

Inspired by this thread with a little nugget based on AOS by @benbyf to visually distinguish development systems from production ones, I wrote a small module that does the same and lets you adapt colors and text. Link to the github repo: AdminDevModeColors Version 0.0.1 is still very alpha and only tested on PW 3.0.124. Description This module lets you change the color for the top toolbar and add a small piece of text for development systems, so you are immediately you aren't working on production (and vice versa). The adaptions are made through pure CSS and applied if either the "Enable DEV mode" checkbox in the module's configuration is checked or the property $config->devMode is set to true in site/config.php. Works with Default, Reno and Uikit admin themes (though probably needs a lot of testing with different versions still). Since a screenshot says more than thousand words... Production system (unchanged): Dev system (Default admin theme): Dev system (Reno admin theme): Dev system (Uikit admin theme): Feel free to leave any feedback here and report any problems either in this thread or the github issue tracker.

Hi @Tom. the new code is online in my test branch. And following is a test with also the .htaccess solution installed. My template code: <?php $image1 = $page->images->first->size(100, 100, $options); ?> <img src="<?=$image1->url?>" alt="<?=$image1->alt?>" /> <img src="<?=$image1->url?>?skiprewrite" alt="<?=$image1->alt?>" /> <?php $image2 = $page->images->first->size(100, 100, $options); ?> <img src="<?=$image2->url?>" alt="<?=$image2->alt?>" /> <img src="<?=$image2->url?>?skiprewrite" alt="<?=$image2->alt?>" /> The quality settings for the regular variation is set to 10, it is created first in the image engines. The webpQuality was set to 100, and it is created after the regular variation. The following screen first shows the webp copy and due to the "?skiprewrite" GET varname, it shows the (distorted) jpegs at second place. Once with GD and once with IMagick: I really love the .htaccess only solution! With this, you simply can update any existing site by upgrade to the new PW core that include the webp support and running a maintenance script over all image variations to create the webp copies. After that you are done! ?

@ryan, may I point you to a WebP pull request? https://github.com/processwire/processwire/pull/141 And a ".htaccess only solution" for site wide webp support: https://processwire.com/talk/topic/14236-webp-support/page/2/?tab=comments#comment-184669 ?

@Guy Incognito Also consider to use $page->if() method. https://processwire.com/api/ref/page/if/

@dragan Maybe it has to do with permissions, see below. Ok so I have dug deep and determined why it isn't working. The $page->trashable() method is added by PagePermissions.module as a hook. The method PagePermissions::trashable first calls $this->deleteable(), which returns false for the current page (so far expected and documented behaviour). However, the $this->wire('permissions')->has('page-edit-trash-created') check in this line fails, since the page-edit-trash-created permission doesn't exist in a default install. Since it directly calls the permissions fuel whose has method doesn't check for superuser, and the check fails if the permission doesn't exist. If I either create the permission through the backend or replace the above check with $this->user->hasPermission('page-edit-trash-created'), it works as expected. @ryan Is this a bug or intended behaviour? Seems pretty counterintuitive that the superuser fails a permissions check on a default install (basic profile). Maybe we can replace the line in PagePermissions.module above: // current if(!$event->return && $this->wire('permissions')->has('page-edit-trash-created') && $page->editable()) { // change to if(!$event->return && $this->wire('user')->hasPermission('page-edit-trash-created') && $page->editable()) { I'd be happy to open a Github issue or pull request, but I'm not sure if this is actually the intended behaviour, so it would be nice to get a statement on this. Thanks!

There you are ? The github version adds touch-enabled color pickers.

As mentioned I am going to try to submit some issues / pull requests for this, just super busy right now and want to take some time to fully understand how Ryan has set up the admin theme first.

@horst, it's perfect for me. I already had WebP since your code from late 2018 and use my own ImageSizer, which relies on LibVips. The Vips engine is very fast - about 5 times faster than ImageMagick. I hope WebP will make it into the core soon - many thanks for your hard work!

@Tom. Many thanks for your feedback! And, uhm, - GD does not use the compressed jpeg for webp creation, but currently IMagick does. But this is not intended and I locally have a version that uses the uncompressed src variation for webp creation. I will finalize this and commit an update to the test branch later this evening. So the intended usage is that you can define independend quality settings for jpeg and webp, and both final variations will be created from the uncompressed variation bitimage. ["quality" => 80; "webpQuality" => 90] If you simply want to test out GD-Lib when IMagick is installed with higher priority, you can pass the param "forceEngine" with the options array to the size method: $options = [ 'forceEngine' => 'ImageSizerEngineGD', // ImageSizerEngineGD | ImageSizerEngineIMagick 'forceNew' => true, 'webpAdd' => true, 'webpQuality' => 90, 'quality' => 80, 'sharpening' => 'none' ];

I guess you could also rename your module folder from modulename to .modulename.

That migration-thing is nothing I want to use a module for while syncing dev/test/stage/qa/live environments. I used to use Site Profile Exporter for the most part but once in a while - my own projects - I need a different way that just works of some kind I still try to figure out. But yes... I could and should give your module a try. Besides that... your wish of an independet environment is exactly what I'm looking for as well. Right now im tinkering on a old Thinkpad from 2008, an hour ago I was on a X1 and an hour before that I used my Surface... I wish I could just fire up or log in to whatever to have my dev-environment but actually I haven't found anything that really works. I thought about https://shadow.tech/ and installing everything on that system but still I'd need a fast internet connection which isn't always available. I also thought about slimming down my dev-setup that much that I could easily sync it as a package through Dropbox, OneDrive or any similar solution. VS Code is available as portable version but my Laragon folder is about 6GB which could be a show-stopper somehow.

Perfect thanks - so simple!... I had tried basically every combo of conditionals and was beginning to think it wouldn't work!

What if you just output placeholder text? (I'd guess you'd have to use <edit> tags) $page->text ? $page->text : "Input text here.."

Thought I'd share this quickly as it helps me get to grips with whether I'm looking at the dev site or live site when working on any client project. Dev site only has AdminOnSteroids module. I add the below to sites/templates/admin/admin.css and add that url the admin css field in the module. Currently only works with default adminTheme. #masthead{ background: rgb(153, 12, 94) !important; } #logo:before{ content: 'DEV '; color: white; margin-right: 1em; vertical-align: middle; display: inline-block; font-size: 1em; letter-spacing: 0.05em; margin: -15px 0.6em 0em 0; } Simply adds a DEV string and changes the header color so I can see I'm on Dev not live. I guess you could do the opposite if you wanted adding content: "LIVE" instead in the CSS.

The TracyDebugger module also has a "Module Disabler" panel that can easily disable modules.

I have sent a pull request on github for webP support in the core: https://github.com/processwire/processwire/pull/141 Explanation of its usage: I implemented two new options for the imagesizer that can be set globally in the site/config.php or can be passed within an individual options array to any size-method: $options = [ "webpAdd" => true, // boolean, if true, an additional webp variation will be created "webpQuality" => 80 // integer range 0 - 100, 100 is best ]; This creates an additional webp variation file besides the regular JPEG, PNG or GIF variations. In the template files you have two new image properties to work with the webp variation: $image->hasWebp; // boolean, true indicates that a webp variation is available for that image variation ?> <img src="<?= $image->srcWebp ?>" alt="" /> So we can create conditional markup like in this example: $image = $page->images->first()->size(300, 300); ?> <picture> <?php if($image->hasWebp) { ?> <source srcset="<?=$image->srcWebp?>" type="image/webp" /> <?php } ?> <source srcset="<?=$image->src?>" type="image/jpeg" /> <img src="<?=$image->url?>" alt="Alt Text!" /> </picture> The pull request and my test branch are based on this weeks pw dev branch. So if someone want to test it, please grab a copy, play with it and report back here. I don't know what timeline @ryan has and what parts need to be modified / rearanged, etc. Maybe the property names or the option names will be changed, but I think the main functionality will be close to that in the current test branch. ----- And here are a filesize comparision with different quality settings and with both engines, GD-Lib and IMagick: EDIT: An approach without conditional markup for webp comes from @arjen see lazyload. ...

Yeah, that's why I disabled it lately ? I think it also broke something else (ajax etc. getting more complicated when things are hidden at first...). But if done right, maybe it could improve the usability. Not sure ?

Just a side note: imo such things just increase the percieved page load time and are an unnecessary complication unless the page is expected to load slowly. I would avoid it if possible, even that I have done it a few times in the past.

Are you talking about effects like the one above? I've once created a little module that shows a "loading" overlay animation until the page is fully loaded. Would that also be an option or are you talking about something else? Sorry, I'm not good at frontend stuff ?

Or just use $this->log('foo bar'); https://processwire.com/blog/posts/processwire-core-updates-2.5.15/#new-log-and-this-gt-log-text-api-functions

$log->save('modulename', 'message to log'); will take care of it for you, putting it in /site/assets/logs/modulename.txt

@Mikie, you will probably need to open separate issues for each concern in the Issues or Request repos in order for Ryan to notice - he doesn't tend to participate much in the general forums these days. In terms of which repo, I'd say that it belongs in the Issues repo if something is broken or not working as expected, and in the Request repo if it's about adding a new feature or improving something that already works. In each issue please describe exactly what the problem is and what a solution would look like. And if you are able to contribute code for a suggested fix that's great (but not essential). I have some possible fixes for some of the things you mentioned that you'd be welcome to include in any issue report if you want... The footer sits under whatever content makes up the page, so if new content is loaded into the page by AJAX or page elements change in height then it's expected that the footer will move. Are you suggesting that the footer should be sticky to the bottom of the viewport when the height of the page content is less than the viewport height? Personally I would prefer that, but it's perhaps a matter of opinion. Here is some CSS that could be used for a sticky footer: /* Sticky footer */ html { height:100%; } body:not(.modal) { display:flex; flex-direction:column; height:100%; } body:not(.modal) #main { flex:1 0 auto; width:100%; box-sizing:border-box; } body:not(.modal) footer { flex-shrink:0; } This FOUC with WireTabs was much worse with the older admin themes - I hardly notice it in AdminThemeUikit but it is there. A CSS fix: /* Prevent FOUC for WireTabs content */ .WireTabs + .Inputfields > .InputfieldWrapper { display:none; } The main FOUC relating to fields that bugs me is the delay in hiding inputfields with show-if conditions. I'd rather have show-if fields hidden by default and then shown when necessary. There's an open request about that, along with a roll-your-own fix for the meantime: https://github.com/processwire/processwire-requests/issues/179 I'm not sure what sort of change you want to see with regard to CKEditor fields or image fields. Some inputfields take a moment to initialise - I'd rather see the interface as soon as possible even if parts of it need to adjust slightly after loading than have the whole interface hidden until loading is complete (not sure if that's what you're suggesting). Generally speaking the behaviour of non-core modules is up to the author of those modules. But in the case of the Lister Pro button you mentioned this is due to the way the admin theme wraps and clones "head" buttons. A CSS fix: /* Hide Lister button links at bottom when results are empty */ #ProcessListerResults:empty + .InputfieldButtonLink { display:none; }

I think it will required a complete rewrite, based on some JS "framework" magic... Sure. While adding UIkit 3 to the mix was possible, it just added another layer of complexity. The current admin is a patchwork, although a good one, but there is room for improvement as always I think. Ryan likes proven tech, so I wish he took a closer look at JsViews by Boris Moore: https://www.jsviews.com/#samples/editable/submit 6+ years of constant development without breaking changes and reinventing the wheel, in this sense similar to ProcessWire's path, so I started using it too. It took me a while to stumble upon it by accident.

A terminal for running server commands: http://modules.processwire.com/modules/process-terminal/ https://github.com/adrianbj/ProcessTerminal NOTE: It does not support interactive commands like vi, nano, apt, etc. DO NOT attempt to use these as they may result in you needing to restart apache. This is a bash terminal that lets you quickly execute commands on a server. In addition to normal commands like: ls, cd, cat, mkdir, rm, chmod, chown, etc, you can also do mysql command line calls which is very handy if you need to add a new user, create a mysqldump etc. Note that for mysql commands you need to issue them individually - you can't simply start "mysql" and issue commands from there - each call needs to include your username and password and the command to be run, eg: mysql -u root -p mypassword -e "CREATE DATABASE newtablename"; There is also an upload and download command, eg "upload test.txt" which will spawn a file selector dialog on your machine to upload that file to your server with the given name. It also has arrow up and down for command history as well as tab autocompletion of commands and file names. This module was separated from Tracy because some shared hosts were flagging it as spam. This is because it uses system_exec to run server commands. This can certainly be dangerous, but in my opinion it is no more dangerous than the HannaCode module or the Tracy Console panel which both allow you to run system_exec. The key thing is that ProcessWire's htaccess rules prevent the shell.php file from being run directly and because this is a process module it uses PW's permissions to restrict usage to superusers.

I'm really enjoying the Repeater Matrix field lately and always wished it could (optionally) be enhanced with some icons. A client recently started using Frontify for their brand portal and I thought their implementation was neat. Video attached. I also really like the categories and filtering. What do you think @ryan ? Screen Recording 2019-04-13 at 08.18.06.mov

Hello, here is simplified version of icons font fieldtype module: https://github.com/OLSA/FieldtypeFontIcon This module use the same icons css file like your template (set path relative to template folder, eg. styles/fontawesome5/all.css ). After module install and created field go to field Input tab to set path (and in some cases prefix classes). Examples: Font Awesome 5 IcoMoon If everything is ok you will get something like this: NOTE: "Regular expression pattern parser" input field is not required because it will be set by default (by module itself). Regards.

Just a suggestion but it'd be really useful if there was a Description field available when creating a HannaCode. I like to keep my HC names short and choppy and a description would greatly help users later on establishing what the HC is for or does a Description column on the HannaCode overview page too pulling in above Description It would also be great to be able to see a list of pages where HCs are used within RTEs or templates but that (for me) isn't such a biggie.

Hi, I created a field called "files" with the pagetype "file" (or so). I added "exe" to the allowed upload formats ("Valid File Extensions"). But if I'm trying to upload .exe it says: - seminare.exe - Invalid file extension, please use one of: pdf, doc, docx, xls, xlsx, gif, jpg, jpeg, png, mov, exe, zip, m4v, dmg How can I solve this? / Nico

Isn't this handled in the config.php?