Jump to content
creativejay

New to Hooks, trying to wrap my head around the syntax

Recommended Posts

I really wanted to create this post with some sample code to show that I at least tried to figure it out on my own first, but I'm really struggling with how hooks are even written. I know it's a very simple context for anyone who's already using them (and hopefully it will be for me, soon), but this is my first time.

What I'm trying to achieve in this attempt is to verify/change the name and title fields of a page, of one specific template with one specific field, whenever the page is saved.

Initially, I am using the Family / Name Format for Children to skip the name/title/confirm save page when an author creates a new page in my site using kongondo's ProcessBlog module.

In English, I want to: Detect when a page of template blog_page is saved with the blog_categories field value of Swatch, and replace the title and name string with a concatenated version of the following fields (from the same page): blog_date, createdUser, blog_brand and blog_name.

From what I've read so far, I should build this hook into site/templates/admin.php, and I should use the saveReady() and maybe saveField() hooks. Other than knowing I need to define a custom hook, I really haven't got any idea of where to go from here. 

Here's my mangled first attempt at coding my hook. Hopefully you'll be able to tell how I might be misunderstanding this from the following:

$pages->addHookAfter('saveReady', $this, 'myPageRename);

public function myPageRename($event) {
 }

I'm afraid that's really as far as I've gotten because I have no idea what I'm doing. I try to follow examples but they feel really far removed from context for me.

Thanks for any light that can be shed on this!

Share this post


Link to post
Share on other sites

There's a really great and simple example given by ryan here that can help you understand.

In your case, you should be able to do the following (not tested):

$pages->addHook('saveReady', function($event) {
  $sanitizer = wire('sanitizer');
  $pages = $event->object;
  $page = $event->arguments(0); 
  if($page->template == 'blog_page' && $page->blog_categories == 'Swatch') {
    // You can build the string as you wish, here is an example
    $concatenatedName = $page->blog_date;
    $concatenatedName .= '-' . $page->createdUser;
    $concatenatedName .= '-' . $page->blog_brand;
    $concatenatedName .= '-' . $page->blog_name;

    $page->title = $concatenatedName;
    $page->name = $sanitizer->pageName($concatenatedName);
  }
});
  • Like 2

Share this post


Link to post
Share on other sites

I find it easier to manage these things in a module like this. Also you need to use a before hook, as saving the page with the new title after saving would trigger an infinite loop. See next posts

<?php

/**
 * ProcessWire 'Hello world' demonstration module
 * 
 * ProcessWire 2.x 
 * Copyright (C) 2014 by Ryan Cramer 
 * Licensed under GNU/GPL v2, see LICENSE.TXT
 * 
 * http://processwire.com
 *
 */

class PutYourNameHere extends WireData implements Module {

	/**
	 * getModuleInfo is a module required by all modules to tell ProcessWire about them
	 *
	 * @return array
	 *
	 */
	public static function getModuleInfo() {

		return array(
			'title' => '', 
			'version' => 1, 
			'summary' => '',
			'singular' => true, 
			'autoload' => true,
			);
	}

	public function init() {
		$this->addHookAfter('Pages::saveReady', $this, 'doStuffOnPage'); 
	}

	public function doStuffOnPage($event) {
		$page = $event->arguments[0]; 

		if($page->template->name === "blog_page" && $page->blog_categories == "Swatch"){
			// Do your thing
		}
	}
	
}

  • Like 3

Share this post


Link to post
Share on other sites

I find it easier to manage these things in a module like this. Also you need to use a before hook, as saving the page with the new title after saving would trigger an infinite loop.

Thank you! So using the string code from @ESRCH in the "//Do your thing" line of your example, I would then install this module in my site and then it will automatically run, or do I need to call it from somewhere else as well?

Share this post


Link to post
Share on other sites

Exactly. You just would do good in renaming the module and placeing it in a file like ModuleClassName.module and mostly it's a good idea to pack it in a folder with this name, too. 

Edit:

Just for your education: The "autoload" config tells processwire to load the module everytime. 

Also you could use this to alert the user in the admin about the modules activity. This will generate a message, e. g. like the one telling you the page has been saved.

$this->message("Changed title according to settings in …");

Share this post


Link to post
Share on other sites

Putting this in a separate module is indeed cleaner.

You probably already read these pages, but I'm putting the links here just in case, since they really helped me develop my own modules/hooks:

https://processwire.com/api/hooks/

http://wiki.processwire.com/index.php/Module_Creation

Also, the Helloworld Module in /site/modules is a great example module to get going.

Share this post


Link to post
Share on other sites

Very good advice from soma (as always).

This is what I usually do:

$this->addHookAfter('Pages::saveReady', $this, 'renameBeforeSave');

public function renameBeforeSave(HookEvent $event) {
        $p = $event->arguments[0];
        $p->name = $new_name;
        $event->return = $p; // maybe this isn't actually needed - haven't tested and can't remember 
        //as soma mentioned - this last line definitely isn't needed!
}

Of course you'll need to add in your logic to limit by template/category and to build up the new name/title.

Share this post


Link to post
Share on other sites

Actually saveReady is an after hook and it's especially useful as you know that the page is saved right after that. So no endless recursion and you don't need to save the page. With a before save hook you don't know if an error will occur.

Also no need to set the page back to the argument after you done with manipulating the page. So lots of mis-infos here..

Means the best answer isn't the best really :P

Edit: removed the 'Solved' flag for now.

  • Like 1

Share this post


Link to post
Share on other sites

No need for the event->return = $p or anything like that, Adrian ;)

Share this post


Link to post
Share on other sites

No need for the event->return = $p or anything like that, Adrian ;)

Yeah, looks like my comment about that crossed with your correction :)

Share this post


Link to post
Share on other sites

@adrian here's the module I made from your code. I'm getting a unexpected T_VARIABLE, expecting T_FUNCTION (line 55) - that would be on "public function renameBeforeSave(HookEvent $event) {"

<?php

/**
 * ProcessWire 'Rename Page' module by forum user creativejay
 *
 * Checks to see if a page uses the template "blog-post" and has a $page->blog_categories value of "Swatch" then redefines the value of $page->title and $page->name
 * 
 * 
 * ProcessWire 2.x 
 * Copyright (C) 2014 by Ryan Cramer 
 * Licensed under GNU/GPL v2, see LICENSE.TXT
 * 
 * http://processwire.com
 *
 */

class RenamePage extends WireData implements Module {

	/**
	 * getModuleInfo is a module required by all modules to tell ProcessWire about them
	 *
	 * @return array
	 *
	 */
	public static function getModuleInfo() {

		return array(

			// The module's title, typically a little more descriptive than the class name
			'title' => 'Rename Page', 

			// version number 
			'version' => 3, 

			// summary is brief description of what this module is
			'summary' => 'Checks to see if a page uses the template blog-post and has a blog_categories value of Swatch then redefines the value of title and name',
			
			// Optional URL to more information about the module
			'href' => 'https://processwire.com/talk/topic/8863-new-to-hooks-trying-to-wrap-my-head-around-the-syntax/',

			// singular=true: indicates that only one instance of the module is allowed.
			// This is usually what you want for modules that attach hooks. 
			'singular' => true, 

			// autoload=true: indicates the module should be started with ProcessWire.
			// This is necessary for any modules that attach runtime hooks, otherwise those
			// hooks won't get attached unless some other code calls the module on it's own.
			// Note that autoload modules are almost always also 'singular' (seen above).
			'autoload' => true, 
		
			// Optional font-awesome icon name, minus the 'fa-' part
			'icon' => 'eraser', 
			);
	}
$this->addHookAfter('Pages::saveReady', $this, 'renameBeforeSave');

public function renameBeforeSave(HookEvent $event) {
        if($page->template->name === "blog_post" && $page->blog_categories == "Swatches"){
        	$concatenatedName = $page->blog_date;
		    $concatenatedName .= '-' . $page->createdUser;
		    $concatenatedName .= '-' . $page->blog_brand;
		    $concatenatedName .= '-' . $page->blog_name;
		    
			$concatenatedTitle = $page->blog_brand;
		    $concatenatedTitle .= ' ' . $page->blog_name;
		
		    $page->title = $concatenatedTitle;
		    $page->name = $sanitizer->pageName($concatenatedName);
		    }
        $event->arguments[0] = $page;
}

Can you spot what I've done wrong?

Share this post


Link to post
Share on other sites

You need to add the hook in the init function as you can see it done in my first post here. The thing you're writing there is a class, these can only hold properties and functions and not raw code, like you did. It's only there to provide functionality, which can be called later. The init function of a module is always called on loading the module.

  • Like 1

Share this post


Link to post
Share on other sites

Try this:

<?php

/**
 * ProcessWire 'Rename Page' module by forum user creativejay
 *
 * Checks to see if a page uses the template "blog-post" and has a $p->blog_categories value of "Swatch" then redefines the value of $p->title and $p->name
 * 
 * 
 * ProcessWire 2.x 
 * Copyright (C) 2014 by Ryan Cramer 
 * Licensed under GNU/GPL v2, see LICENSE.TXT
 * 
 * http://processwire.com
 *
 */

class RenamePage extends WireData implements Module {

    /**
     * getModuleInfo is a module required by all modules to tell ProcessWire about them
     *
     * @return array
     *
     */
    public static function getModuleInfo() {

        return array(

            // The module's title, typically a little more descriptive than the class name
            'title' => 'Rename Page', 

            // version number 
            'version' => 3, 

            // summary is brief description of what this module is
            'summary' => 'Checks to see if a page uses the template blog-post and has a blog_categories value of Swatch then redefines the value of title and name',
            
            // Optional URL to more information about the module
            'href' => 'https://processwire.com/talk/topic/8863-new-to-hooks-trying-to-wrap-my-head-around-the-syntax/',

            // singular=true: indicates that only one instance of the module is allowed.
            // This is usually what you want for modules that attach hooks. 
            'singular' => true, 

            // autoload=true:indicates the module should be started with ProcessWire.
            // This is necessary for any modules that attach runtime hooks, otherwise those
            // hooks won't get attached unless some other code calls the module on it's own.
            // Note that autoload modules are almost always also 'singular' (seen above).
            'autoload' => true, 
        
            // Optional font-awesome icon name, minus the 'fa-' part
            'icon' => 'eraser', 
            );
    }
    
    public function init() {
        $this->addHookAfter('Pages::saveReady', $this, 'renameBeforeSave');
    }

    public function renameBeforeSave(HookEvent $event) {

        $p = $event->arguments[0];

        if($p->template->name === "blog_post" && $p->blog_categories == "Swatches"){
            $concatenatedName = $p->blog_date;
            $concatenatedName .= '-' . $p->createdUser;
            $concatenatedName .= '-' . $p->blog_brand;
            $concatenatedName .= '-' . $p->blog_name;
            
            $concatenatedTitle = $p->blog_brand;
            $concatenatedTitle .= ' ' . $p->blog_name;
        
            $p->title = $concatenatedTitle;
            $p->name = $sanitizer->pageName($concatenatedName, true);
        }
    }
}

Share this post


Link to post
Share on other sites

Okay, I fixed the mismatched names inside the code (I changed the name to RenameSwatches a few times but the code was still referring to RenamePages). That fixed the 500 error, but nothing happens when I save an existing page.

I suppose I could add a dialog to see if it thinks it's running.

Another thought occurs to me.. the field blog_categories is a Page fieldtype. Would that require an adjustment?

Share this post


Link to post
Share on other sites

Another thought occurs to me.. the field blog_categories is a Page fieldtype. Would that require an adjustment?

// Page field single
if($page->blog_categories->title === "Swatch"){
}

// Page field multiple
if($page->blog_categories->get("title=Swatch")){
}

Share this post


Link to post
Share on other sites

There's a lot not right in your renameBeforeSave method. Naming is also a little bit weird:

You hook after, but you call the method with before in the name.

$p->blog_categories == "Swatches" // If blog_categories is type of page it will not be a string.

$p->createdUser // is a Page // you can't concatenate it like this.

You can't call $sanitizer like this in module scope. (use $this->sanitizer)

Share this post


Link to post
Share on other sites

$p->blog_categories->title ?

$p->createdUser->title ?

And I should turn $p->blog_date into a string, I imagine?

Share this post


Link to post
Share on other sites

$p->blog_categores->title == 'Swatch';

For the $p->createdUser, you can actually still use $p->createdUser, since the toString method of the page will convert it to its page id.

Share this post


Link to post
Share on other sites

blog_categories is a Multiple Page field. This will not work $p->blog_categories == 'swatch'; This has been pointed out above with example code by LostKobrakai.

Edit - see next post...

Edited by kongondo

Share this post


Link to post
Share on other sites

@kongondo your default blog_categories is, but I changed it to a Single Page field because of the way my (already familiarly strange to you) blog is structured. ;)

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    No registered users viewing this page.

  • Similar Content

    • By EyeDentify
      I have been experimenting with the new $page->meta() method and find it useful.

      Once i figured out that the data i "save" with it is tied to the page where i called the method from.

      So this is not obvious at least not for me in the documentation:
      https://processwire.com/api/ref/page/meta/
       
      So i just wanted to share that revelation with the community so you don´t get as confused as i was.

      Happy Coding Everyone.
    • By louisstephens
      Going through my long quest to get better with ajax and utilizing the api, I have hit yet another roadblock. I currently have a form with an image field (thanks to flydev for getting that sorted), "title" text input, and a select field set to multiple. In my ajax call, I added in:
      tags = $("#select-tags").val(); form_data.append('tags', tags); $.ajax({ type: 'POST', data: form_data, contentType: false, processData: false, url: '/ajax/upload-preview/', success: function(data) { console.log("Woo"); }, error: function(xhr, ajaxOptions, thrownError) { alert(xhr.responseText); } }); And in the ajax template: 
      $tags = $sanitizer->text($_POST['tags']); $image = $sanitizer->text($_POST['image']); $p = new Page(); $p->template = "preview"; $p->parent = $pages->get("/previews/"); $p->name = $title; $p->title = $title; $p->tags = $tags; $p->save(); If I select a "tag" from the select input and submit, it does indeed add it to the Page Reference field in the backend. However, this does not work with an array being passed to it of multiple options.

      So it does appear that my ajax call is trying to submit multiple options, but I am really just unsure how to get these two added in. I saw in other forums posts of add($page) and even add(array()). Do I need to handle this js array differently or do  I need to foreach through the $tags to add it like:
      foreach($tags as $tag) { $p->tags->add($tag); $p->save(); } I tried this approach, but apparently I am still missing something.
       
      Edit:
      I was doing some tweaking, and I know I can split the js array out like:
      for (i = 0, len = tags.length; i < len; i++) { console.log(tags[i]); } However, I am not sure then how to handle the POST in php if I were to split it out.
    • By louisstephens
      I have been messing around with creating pages from ajax requests, and it has gone swimmingly thus far. However, I am really struggling with creating a page and saving an image via ajax. 
      The form:
      <form action="./" role="form" method="post" enctype="multipart/form-data"> <div> <input type="text" id="preview" name="preview" placeholder="Image Title"> </div> <div> <input type="file" id="preview-name" name="preview-name"> </div> <div> <select id="select-tags" name="select-tags"> <?php $tags = $pages->find("template=tag"); ?> <option value="">Select Your Tags</option> <?php foreach ($tags as $tag) : ?> <option value="<?= $tag->name; ?>"><?= $tag->name; ?></option> <?php endforeach; ?> </select> </div> <div> <button type="button" id="submit-preview" name="submit" class="">Upload Images</button> </div> </form>  
      The ajax in my home template:
      $('#submit-preview').click(function(e) { e.preventDefault(); title = $("#preview").val(); image = $("input[name=preview-name]"); console.log(title); console.log(image); data = { title: title, image: image //not sure if this is actually needed }; $.ajax({ type: 'POST', data: data, url: '/development/upload-preview/', success: function(data) { console.log("Woo"); }, error: function(xhr, ajaxOptions, thrownError) { alert(xhr.responseText); } }); }); And finally in my ajax template:
      $imagePath = $config->paths->assets . "files/pdfs/"; //was from an older iteration $title = $sanitizer->text($_POST['title']); $image = $sanitizer->text($_POST['image']); $p = new Page(); $p->template = "preview"; $p->parent = $pages->get("/previews/"); $p->name = $title; $p->title = $title; $p->save(); $p->setOutputFormatting(false); $u = new WireUpload('preview_image'); $u->setMaxFiles(1); $u->setOverwrite(false); $u->setDestinationPath($p->preview_image->path()); $u->setValidExtensions(array('jpg', 'jpeg', 'gif', 'png', 'pdf')); foreach($u->execute() as $filename) { $p->preview_image->add($filename); } $p->save(); I can complete the file upload but just using a simple post to the same page and it it works well, but I was really trying to work out the ajax on this so I could utilize some modals for success on creation (and to keep my templates a little cleaner). When I do run the code I have, a new/blank folder is created under assets, and a new page is created with the correct title entered. However, no image is being processed. I do get a 200 status in my console. I have searched google for help, but everything seems to be slightly off from my needs. If anyone could help point me in the right direction I would greatly appreciate it. 
    • By louisstephens
      This might be a completely dumb question, but I cant seem to wrap my head around it. I have a page reference field that allows users to select "Tags". In the front end I would like to use the titles as class names for a single item. ie:
      <?php $previews = $pages->find("template=preview"); ?> <?php foreach($previews as $preview): ?> <div class="tagOne TagTwo tagThree"> <!-- use another foreach to output--> <img src="<?=$preview->preview_image->url; ?>" /> </div> <?php endforeach; ?> I am little stumped as I know I need a foreach loop to produce each tag title, but how do I insert them all into one corresponding div class with spaces?
      Whelp, that was the easiest thing, but my brain just didnt "get it". Just put the foreach in the "class" inside of the overall foreach. Ugh 😓
    • By schwarzdesign
      We recently rebuilt the Architekturführer Köln (architectural guide Cologne) as a mobile-first JavaScript web app, powered by VueJS in the frontend and ProcessWire in the backend. Concept, design and implementation by schwarzdesign!
      The Architekturführer Köln is a guidebook and now a web application about architectural highlights in Cologne, Germany. It contains detailled information about around 100 objects (architectural landmarks) in Cologne. The web app offers multiple ways to search through all available objects, including:
      An interactive live map A list of object near the user's location Filtering based on architect, district and category Favourites saved by the user The frontend is written entirely in JavaScript, with the data coming from a ProcessWire-powered API-first backend.
      Frontend
      The app is built with the Vue framework and compiled with Webpack 4. As a learning exercise and for greater customizability we opted to not use Vue CLI, and instead wrote our own Webpack config with individually defined dependencies.
      The site is a SPA (Single Page Application), which means all internal links are intercepted by the Vue app and the corresponding routes (pages) are generated by the framework directly in the browser, using data retrieved from the API. It's also a PWA (Progressive Web App), the main feature of which is that you can install it to your home screen on your phone and launch it from there like a regular app. It also includes a service worker which catches requests to the API and returns cached responses when the network is not available. The Architekturführer is supposed to be taken with you on a walk through the city, and will keep working even if you are completely offline.
      Notable mentions from the tech stack:
      Vue Vue Router for the SPA functionality VueX for state management and storage / caching of the data returned through the API Leaflet (with Mapbox tiles) for the interactive maps Webpack 4 for compilation of the app into a single distributable Babel for transpilation of ES6+ SASS & PostCSS with Autoprefixer as a convenience for SASS in SFCs Google Workbox to generate the service worker instead of writing lots of boilerplate code Bootstrap 4 is barely used here, but we still included it's reboot and grid system Backend
      The ProcessWire backend is API-only, there are no server-side rendered templates, which means the only PHP template is the one used for the API. For this API, we used a single content type (template) with a couple of pre-defined endpoints (url segments); most importantly we built entdpoints to get a list of all objects (either including the full data, or only the data necessary to show teaser tiles), as well as individual objects and taxonomies. The API template which acts as a controller contains all the necessary switches and selectors to serve the correct response in <100 lines of code.
      Since we wanted some flexibility regarding the format in which different fields were transmitted over the api, we wrote a function to extract arbitrary page fields from ProcessWire pages and return them as serializable standard objects. There's also a function that takes a Pageimage object, creates multiple variants in different sizes and returns an object containing their base path and an array of variants (identified by their basename and width). We use that one to generate responsive images in the frontend. Check out the code for both functions in this gist.
      We used native ProcessWire data wherever possible, so as to not duplicate that work in the frontend app. For example:
      Page names from the backend translate to URLs in the frontend in the form of route parameters for the Vue Router Page IDs from ProcessWire are included in the API responses, we use those to identify objects across the app, for example to store the user's favourites, and as render keys for object lists Taxonomies have their own API endpoints, and objects contain their taxonomies only as IDs (in the same way ProcessWire uses Page References) Finally, the raw JSON data is cached using the cache API and this handy trick by @LostKobrakai to store raw JSON strings over the cache API.
      Screenshots














×
×
  • Create New...