Leaderboard

Hello fellow coders. ProcessWire is really easy to jump into. But a few projects in you start to want some version control, look around for what to put or not in .gitignore, want some SCSS magic going on, and it makes sense to make a boilerplate. So I did: https://github.com/heldercervantes/PWBoilerplate Some of the things going on here: src and dist separation, so you do version control on only what matters; scss compilation; js combining; asset monitoring and mirroring. Here it is for you all, in case someone finds it useful. Any comments, suggestions or criticism are appreciated.

Another small update for Captain Hook. Now if you have Ryan's ProcessWire API Explorer module installed, the Class::method link will take you to the appropriate page of the API Explorer interface, rather than to the processwire.com API docs page. This means it will work offline, and of course also means it will be updated to the version of PW running on your site.

I hope your dog isn't reading that

Thank you for your input guys. @szabesz: Well spotted. I have to fix that. @adrian: Yes, I'm aware this is a heavy one. With the 3d library, models, sound, there's no way around it. Something I had to accept with all this 3d going on. @pwired: As to how this is achieved, actually there's a bunch of stuff working together... The sphere The base library is three.js (https://threejs.org/), using a wrapper that simplifies implementation called whitestorm (https://whsjs.io/ - I was involved in development and this site served as a guinea-pig). Using those I generate the sphere and background. The animation is made with greensock. Here, I'm animating each vertex on the sphere to a random position. The maximum displacement changes as you hover each link to make it more or less chaotic. The wave in the background that spreads as you touch the logo is achieved by calculating a radius that animates from the center to the edge, and on each cycle the vertices get displaced according to their proximity to that radius. The about section Here it's simpler. Each scene is modeled in blender, and greensock animates the positioning of the camera. Except for the second step. There, it's a single guy that's duplicated a bunch of times, and greensock animates a marching cycle that loops with each step. You can actually see the loop as a new row pops up at the end of the group on each step. The sound Not much to say here. Freebie audio, that I've edited on audacity to make deeper, longer, more consistent.

These tutorials by @Michael van Laar should help you get started https://digitalardor.com/articles/cms-content-blocks/ https://digitalardor.com/articles/basic-setup-for-content-blocks-in-processwire/ Also https://processwire.com/api/fieldtypes/repeaters/

https://github.com/rolandtoth/AdminOnSteroids/wiki#misc

Also, one can provide an "image not available" image (an image file with baked-in text) I prefer this approach because I find that most site editors are urged to fix the issue of a placeholder image showing up, while simply leaving out an image often stays ignored. That is why I use something like this: https://processwire.com/talk/topic/16811-addhookmethod-example-for-pageimages/

And completely crashes my 2007 iMac at work. Which isn't a unique experience... Note to Self - Next time you change jobs, get one where they have up to date hardware.

You could build some custom logic into templates/admin.php to switch the language to something else temporarily. But by default switching languages for users does use one and the same field to store that switch. So you'd probably need to add another field to the user to store something like a "backend_language".

Bumped to 0.1.2-beta Fixed descriptions to better explain the purpose of the fields added to templates. If additional non-related fields are ever added, these descriptions will be amended accordingly. Removes sitemap cache on module-save. This is already done when pages are saved, unless the option in MarkupCache's config dictates otherwise.

looks like the process is returning a 403... maybe a file permissions issue, or host is blocking something, maybe mod security... check these topics:

Docs & Download: rockettpw/seo/markup-sitemap Modules Directory: MarkupSitemap Composer: rockett/sitemap ⚠️ NEW MAINTAINER NEEDED: Sitemap is in need of developer to take over the project. There are a few minor issues with it, but for the most part, most scenarios, it works, and it works well. However, I'm unable to commit to further development, and would appreciate it if someone could take it over. If you're interested, please send me a private message and we can take it from there. MarkupSitemap is essentially an upgrade to MarkupSitemapXML by Pete. It adds multi-language support using the built-in LanguageSupportPageNames. Where multi-language pages are available, they are added to the sitemap by means of an alternate link in that page's <url>. Support for listing images in the sitemap on a page-by-page basis and using a sitemap stylesheet are also added. Example when using the built-in multi-language profile: <url> <loc>http://domain.local/about/</loc> <lastmod>2017-08-27T16:16:32+02:00</lastmod> <xhtml:link rel="alternate" hreflang="en" href="http://domain.local/en/about/"/> <xhtml:link rel="alternate" hreflang="de" href="http://domain.local/de/uber/"/> <xhtml:link rel="alternate" hreflang="fi" href="http://domain.local/fi/tietoja/"/> </url> It also uses a locally maintained fork of a sitemap package by Matthew Davies that assists in automating the process. The doesn't use the same sitemap_ignore field available in MarkupSitemapXML. Rather, it renders sitemap options fields in a Page's Settings tab. One of the fields is for excluding a Page from the sitemap, and another is for excluding its children. You can assign which templates get these config fields in the module's configuration (much like you would with MarkupSEO). Note that the two exclusion options are mutually exclusive at this point as there may be cases where you don't want to show a parent page, but only its children. Whilst unorthodox, I'm leaving the flexibility there. (The home page cannot be excluded from the sitemap, so the applicable exclusion fields won't be available there.) As of December 2017, you can also exclude templates from sitemap access altogether, whilst retaining their settings if previously configured. Sitemap also allows you to include images for each page at the template level, and you can disable image output at the page level. The module allows you to set the priority on a per-page basis (it's optional and will not be included if not set). Lastly, a stylesheet option has also been added. You can use the default one (enabled by default), or set your own. Note that if the module is uninstalled, any saved data on a per-page basis is removed. The same thing happens for a specific page when it is deleted after having been trashed.

I am working on a module that runs/previews (for pub/unpub) imports on importer page view. The template has to be in site/templates, so far as I know, so one is created there on install which includes a file to run from within the module, but then when it's run and tries to read the importer csv file it cannot, since it's in the admin, I guess... Is it possible to set the template page to a file in the module directory? Will that work?

Thanks szabesz, I just figured it out right as you posted. Under the "modules" menu there is a "refresh" button. I hit that and my modules showed up.

I haven't done Site Profile export and installing it along with PW for a while but as far as I know only a certain set of core modules are "installed" by default and another modules must be "installed" manually by clicking on the install button in the admin's module listing. Have you tried that?

I would love to see your mockup of a GUI for it. No promises though I'm afraid - there is a LOT going on in Edit mode and I am not really sure how that would fit in with Lister, but if it looks doable and others here sound interested, I'd be willing to give it a go.

If you could, please reference your link here, Thanks

Have you played around with "Lister" mode - maybe that would suit your needs already, rather than me adding a selector to "Edit" mode. I know the Lister mode isn't perfect, but it's pretty useful in the way it lets you define and adjust columns to show and the inline edit mode (if you have Lister Pro installed). Anyway, just an idea.

This is exactly what I needed. Exactly! Thanks. And I should thank you for pretty much co-developing this module.

I am preparing a testing site for you and will send a PM when done. Thanks in advance.

created an issue, thanks.

@Chris Falkenstein, There is also the "Auto Grow" plugin for ckeditor. Simply download the plugin (and expand/unzip), and put it under : "site->modules->InputfieldCKEditor" . Edit the textarea field in question (make sure ckeditor is selected under details), navigate to the "Input" tab, and select "autogrow" from additional plugins and save. I just tested it out and it seems to work perfectly for me.

I need to import a list of users my client sends me. He wants to know what rules make a valid username. Sounds easy, but I need to make it bulletproof, when I tell my client, because he sends a lot of print letters with those usernames When I look at the name (aka username) filed it says: Any combination of letters (a-z), numbers (0-9), dashes or underscores (no spaces). As I think, those are pagenames and thus the sanitizer->pageName() is applied? This one says something different: Page names by default support lowercase ASCII letters, digits, underscore, hyphen and period. Usernames with periods apparently are ok. ASCII letters, however, sounds a bit ambiguous. @ or $ is in some manner a letter too. Perhaps I am wrong, but haven't studied english linguistic And I think it only counts for the 128-ASCII table, not the extended one. Seriously, I don't want to make it more complicated than it needs to be, but the docs made me think of it. Thanks!

Not suggesting to trust it, just using it to give you a quick idea of what happens with various characters. Depending on how you are doing things regarding the password, you might find these useful for automatic password generation and emailing the user with their username and temporary password: http://modules.processwire.com/modules/email-new-user/ http://modules.processwire.com/modules/password-force-change/

Usernames are also sanitized in real time via JS - try adding an uppercase letter or a $ or @ and they will be converted/removed as soon as you unfocus the field. I agree that when adding a user or normal page (both are effectively the same) it should note that periods are allowed. OT a little - if you are adding users by a batch import, be sure to check out the Create Users Batcher action in the AdminActions module.

I decided to go ahead to do this so now you can specify exactly which pages will be exported. Hopefully others will find this useful also:

@szabesz I was looking for that post, but couldn't find it. I'm using the same hook but without a placeholder image. I hope using placeholder will convince my editors. Thanks for linking it ?

Hey @szabesz - I have fixed the issue with the page specific settings not being populated to the CSV export interface (new version now available), but I can't reproduce the problem you are having with an empty CSV file. Make sure you do a hard reload of the page to ensure the update JS file in this module isn't being cached. If that doesn't help, we'll try again I am not sure I understand this - are you wanting a way to filter which pages will be exported? I guess I could add an InputfieldSelector field to the export options to limit the child pages that are exported to the match selector. Is that what you are looking for?

Thanks, that's coming from the latest PR I merged yesterday, will fix soon.

This stuff is amazing! The built-in help videos for ERPNext are auto-generated and are always in sync with the evolving interface. Just wanted to share.

@szabesz I can confirm this behaviour.

Is it just me who has strange looking AdminDataTable filter box in AOS 1.5.2? See: I tried different browsers in incognito/private browsing but it stays like that The label introduced is not too useful btw, it takes up space however most users can recognize a filter box these days.

It's heavy. Specially the marching group on the about section. But I think this has to do with older machines not supporting some of the stuff that's needed for webgl to perform well. Three.js reverts to more CPU intensive approaches and it starts burning. I'll have to look into that eventually.

Anyway this is one hell of a cool morph/sound animation done in a web page. Strange, I am on an Acer laptop Aspire E15 and dont experience any lag or resource drain from the page. Didnt know threejs is involved here too. Lets give it a try to replicate this animation.

Thanks @abdus for those links, I didn't knew they exist! Good articles @Michael van Laar, please keep going on the series!

Thank you very much for the idea - a simple "wire("user")->language = wire("languages")->get("name=default");" on the top of the admin template does the job (in this case all admin users use the default language, so a separate field is not necessary) Regards Sebastian

You should know that this site brings my late 2011 Macbook Pro to its knees. I really love the story you are telling and it's definitely a great way to show clients how working with you would be a great experience, but I would also be worried that if your site crashes a potential clients machine, it might not give the best impression. Also, a 4MB payload for your homepage is pretty steep for someone on a slow connection. SpeedTest shows my download at 163 Mbps and it still takes 9-10 seconds to load your homepage. Please don't take offense at this, because I really do like the message and the way the story is presented, although I could do without the sound effects

I guess the spiked ball animation is done with greensock. https://konsernsjefen2017.arkivert.no/ http://www.weareuprising.com/work/1

Nice concept, thanks for sharing! One issue though: the X on a Folio page does not seem to work. There is no "back" either:

The module uses ProcessWire's own form API; you just need to set the required fields to be required in the admin.

Wow, never seen that cool of an animation, both the morphing and the sounds. How is it done ? I looked at the page source but couldnt figure it out yet.

I will be testing Laragon ... I just started to refresh the partition on some Linux derivative (maybe manjaro) ... I have to admit that Processwire has very good people around you who help ... Thank you both @kixe and you @bernhard ... Next time before I start looking for problems I will check on other machines - Such a lesson for the future

Unless you changed it, Blog does not have an image field called 'images'. If you didn't change it, then the field is called 'blog_images'. FYI, all fields in Blog are prefixed blog_. The following should get you going... <img src=\"{$child->blog_images->first->size(200,200)->url}\">

Here's WireArray::first method public function first() { return reset($this->data); } Documentation for reset() function says Returns: the value of the first array element, or false if the array is empty. Error: Call to a member function size() on a non-object i.e. boolean false happens because $child->images is empty for a certain child. A simple JS should help you pinpoint the faulty page. foreach ($pages->find("template=blog-post, limit=12, sort=-blog_date") as $child) { if (!is_object($child->images->first)) { $content .= "<script>alert('something wrong with $child->name')</script>"; } $content .= // ... }

I love you more than my dog.

More improvements to the Captain Hook panel which I think now makes it the definitive source for browsing and understanding what each hook does. You have always been able to click the line number to open the file to the line of the method in your code editor (if you have things set up correctly), but this new version adds the following two new features: 1) Inline documentation for each hook - click method (last column) to expand/collapse the docs: 2) Direct link to PW API reference (from the Class::method link in the first column), eg clicking on "Pages::saved" will take you directly to this page:

One of the most obvious uses of this is I can finally make my own bunch of SEO fields and apply them to multiple pages. SEO is a core part of every site I develop and MarkupSEO just isn't getting the development it requires.

Thanks for that. I've read it over a few times now but I'm not quite getting it. How is this unnecessary? How else would one determine where each permission is applicable? Does he mean you could create a separate permission for each template, e.g. page-edit-home page-edit-basic-page, etc.? Yes, yes, yes... THIS sounds like the type of solution I would expect from ProcessWire. Simple, powerful, and un-opinionated. What became of this?

If you are using Processwire 3.x you could import PW namespace <?php namespace Processwire; and use the functions without the need for wire() method.

Background - I came across http://www.responsivebreakpoints.com/ the other day and thought it was a nice idea, but that could be done in PW using the API. In a nutshell, what it does is create an image width breakpoint at roughly every 20kb of file size between a minimum and maximum pixel size. According to this article on CSS-Tricks, "If you’re just changing resolutions, use srcset", so the markup is as suggested there. There is already the excellent Srcset Image Textformatter which works on images in RTE fields, but if you want responsive images elsewhere in your templates, you need to do the markup and decide on breakpoint sizes yourself. However, Field Templates have got you covered! Just save this as a field template file in /site/templates/fields/my_image.php as described above. <?php $maxWidth = 1000; //largest breakpoint $minWidth = 200; //smallest breakpoint $srcQuality = 40; //jpeg quality of the 'src' image $srcsetQuality = 80; //jpeg quality of the 'srcset' images $breakpointStepFileSize = 20; //i.e. 20kb $class = ""; //change this if you want to add eg "class='responsive'" $horizAspect = $value->width / $value->height; $minSizeArea = round($minWidth * ($minWidth / $horizAspect)); $maxSizeArea = round($maxWidth * ($maxWidth / $horizAspect)); $areaDiff = $maxSizeArea - $minSizeArea; $minFile = $value->width($minWidth, array('quality' => $srcsetQuality)); $maxFile = $value->width($maxWidth, array('quality' => $srcsetQuality)); $minFileSize = $minFile->filesize; $maxFileSize = $maxFile->filesize; $fileSizeDiff = $maxFileSize - $minFileSize; if($fileSizeDiff > ($breakpointStepFileSize * 1024)){ $numBreakpoints = round($fileSizeDiff / ($breakpointStepFileSize * 1024)); for($s = 1; $s < $numBreakpoints; $s++){ $breakpointStepArea = $minSizeArea + (($areaDiff / $numBreakpoints) * $s); $breakpointWidth = round(sqrt($breakpointStepArea * $horizAspect)); $breakpoints[] = $breakpointWidth; } } $src = $value->width($maxWidth, array('quality' => $srcQuality))->url; $min = "$minFile->url {$minWidth}w, "; $out = "<img src='$src' srcset='$min"; foreach($breakpoints as $breakpoint){ $bp = $value->width($breakpoint, array('quality' => $srcsetQuality))->url; $out .= "$bp {$breakpoint}w, "; } $out .= "$maxFile->url {$maxWidth}w"; $out .= "' alt='$value->description' $class>"; echo $out; Then use something like echo $page->render->my_image; in your page template and you'll get something like <img src='/site/assets/files/1/photo.1000x0.jpg' srcset='/site/assets/files/1/photo.200x0.jpg 200w, /site/assets/files/1/photo.482x0.jpg 482w, /site/assets/files/1/photo.651x0.jpg 651w, /site/assets/files/1/photo.785x0.jpg 785w, /site/assets/files/1/photo.899x0.jpg 899w, /site/assets/files/1/photo.1000x0.jpg 1000w' alt='pic' > (Bear in mind that PW has to create all these image variations on first page load, so it will take a moment.) Give it a try and see what you think!