All about the Equal Predicate


I came across this interesting question on Answers today and I thought I'd write a brief overview of the Equal Predicate as well as share a quirky discovery here.

In JSONT, the Equal Predicate tests if one argument equals another argument, and returns true or false.  If true, the markup (or code) inside the JSONT is rendered.  

There are three parts to the Equal Predicate:

  1. The predicate itself ".equal?"
  2. The first argument
  3. The second argument

Here's some pseudo code:

{.equal? argument1 argument2}
  <!-- HTML or whatever -->
{.end}

If argument one equals argument two, then the test condition is true and anything inside will be outputted. Here's a quick example:

{.equal? collection.typeName "blog"}
  <h1>Welcome to my Blog page.</h1>
{.end}

 If you check out the JSONT of this page and do a search for typeName, you'll see that its associated value is "blog."  This is a Squarespace thing.  There are different types of pages (collections as they are known) in Squarespace - things like blog, gallery, page, products, events, and album are several examples.

So in the above test, I'm basically asking "is this a blog page? If yes, render an <h1> that says Welcome to my Blog page.  If no, ignore everything in the condition and don't render any code."

Pretty powerful stuff!

Now, there's a catch with this nifty little Equal Predicate.  That catch is:

The first character after the predicate (.equal?) signifies the delimiter for the arguments.

What does that mean in plain english? Take a look at the following example with a test for a specific category.  In this example, we're assuming you're wanting to output some HTML on a specific category filter page. (Example: http://www.bcarroll.us/?category=JSONT )

{.section categoryFilter}
  {.equal? categoryFilter "My Awesome Category"}
    <h2>You're looking at the category "My Awesome Category"</h2>
  {.end}
{.end}

The above code will break!  But why?? Well, because the first character after .equal? is a space. And so, JSONT is saying "okay, all spaces from here on out will tell me that a new argument is next."  And since "My Awesome Category" has two spaces in the whole string, it will treat that one argument as three separate arguments! Oh nooooooo

Well, it's not that big of a deal, because you can use any character to signify the argument delimiter! Here's the above code, written using a new character as the delimiter - namely, the colon! : : : : : : : ) : ) :)

Check it:

{.section categoryFilter}
  {.equal?:categoryFilter:"My Awesome Category"}
    <h2>You're looking at the category "My Awesome Category"</h2>
  {.end}
{.end}

This code will work because the delimiter is set to be a : instead of a space, and the spaces in the string "My Awesome Category" will render as space characters correctly. So now, if you're on the blog list view of the category My Awesome Category, you'll see a super awesome <h2> waiting to tell you which category you're looking at.

Woohoo, good fun. Until next time...

/