ExpressionEngine & Taxonomy 3 - How to split nodes into blocks of 5? - expressionengine

I am using ExpressionEngine 2.10.3 and also Taxonomy 3 plugin. I have the following code which, when run, returns the 15 nodes I have set up:
<div class="col-md-4">
{exp:taxonomy:nav tree_id="1" display_root="no" root_node_id="2"}
<li>
{node_title}
</li>
{/exp:taxonomy:nav}
</div>
What I would like to do is after every 5 entries, end the current <div> and start a new col-md-4. Usually, I would use {switch} and I have tried it like this:
<div class="col-md-4">
{exp:taxonomy:nav tree_id="1" display_root="no" root_node_id="2"}
<li>
{node_title}
</li>
{switch='||||</div><div class="col-md-4">'}
{/exp:taxonomy:nav}
</div>
But it doesn't work at all, instead it just prints out {switch='||||'}
Is there any way of doing what I'm trying to do?

If you're on 2.7.1 or greater and your taxonomy:nav has the nav_count variable, use the modulo operator. Instead of your {switch...} thing, put
{if nav_count % 5 == 1}
</div><div class="col-md-4">
{/if}
If you end on an modulo-5 count, though, you're going to have an empty div....

Related

Get first element Xpath

I have a HTML like this :
<ol class="list">
<li class="list-item " id="37647629">
<!---->
<div>
<!---->
<div>
<!---->
<book class="book">
<div class="title">
someText
</div>
<div class="year">
2022
</div>
</book>
</div>
<!---->
</div>
<!---->
</li>
<li class="list-item " id="37647778">
<!---->
<div>
<!---->
<div>
<!---->
<book class="book">
<div class="title">
someOtherText
</div>
<div class="year">
2014
</div>
</book>
</div>
</div>
<!---->
</li>
</ol>
I want to get the first book title and year, directly with two xPath expression.
I tried :
$x('//book') => Ok, get the two books list
$x('//book[0]') => Empty list
$x('//book[0]/div[#class="title"]') => Nothing
Seems I have to do this :
$x('//book')[0]
and then process title, but why I can't do this just with Xpath and directly access the first title with a Xpath expression ?
This will give you the first book title
"(//book)[1]//div[#class='title']"
And this gives the first book year
"(//book)[1]//div[#class='year']"
You're missing that XPath indexing starts at 1; JavaScript indexing starts at 0.
$x('//book') selects all book elements in the document.
$x('//book[0]') selects nothing because XPath indexing starts at 1. (It also signifies to select all book elements that are the first among siblings — not necessarily the same as the first of all book elements in the document.)
$x('//book')[0] would select the first book element because JavaScript indexing starts at 0.
$x('(//book)[1]') would select the first book element because XPath indexing starts at 1.
To select the first div with class of 'title', all in XPath:
$x('(//div[#class="title"])[1]')
or, using JavaScript to index:
$x('(//div[#class="title"])')[0]
To return just the string value without the leading/trailing whitespace, wrap in normalize-space():
$x('normalize-space((//div[#class="title"])[1])')
Note that normalize-space() will also consolidate internal whitespace, but that is of no consequence with this example.
See also
How to select first element via XPath? (And be sure not to miss the explanation of the difference between //book[1] and (//book)[1] — they are not the same.)

Prestashop 1.7 attribute groups - check stock and apply css to unavailable combination

Prestashop option to hide unavailable attributes on product page doesn't work when attribute groups are used, for example color and size (for clothing shops).
I need to keep showing all possible combinations, but grey out (or strikethrough) the combinations with no stock.
Like this:
I tried several things.
In Prestashop 1.6 the following piece of code worked to apply css class (.out-of-stock-float-left) to unavailable combinations:
{elseif $group.group_type == 'radio'}
<ul id="group_{$id_attribute_group}">
{foreach from=$group.attributes key=id_attribute item=group_attribute}
{if {$group.attributes_quantity[{$id_attribute|intval}]} > 1} <!-- product in stock -->
<li class="input-container float-left">
<input class="input-radio" type="radio" data-product-attribute="{$id_attribute_group}"
name="group[{$id_attribute_group}]"
value="{$id_attribute}"{if $group_attribute.selected} checked="checked"{/if}>
<span class="radio-label">{$group_attribute.name}</span>
</li>
{else} <!-- product out of stock -->
<li class="input-container out-of-stock-float-left">
<input class="input-radio" type="radio" data-product-attribute="{$id_attribute_group}"
name="group[{$id_attribute_group}]"
value="{$id_attribute}"{if $group_attribute.selected} checked="checked"{/if}>
<span class="radio-label">{$group_attribute.name}</span>
</li>
{/if}
{/foreach}
</ul>
{/if}
When changing combinations there is an ajax request. I don't know how to grey out combinations with no stock and make them not clickable.
Thanks

How to input text to non standard input elements

I'm faced with a span element for text input instead of an input box, and I'm struggling to use Watir (Ruby) to enter text. There's no set method, there is a text method that returns the text fine, but I don't seem to be able to set the text that way.
I've also tried using span.select and span.focus and then browser.send_keys but nothing is input in the field.
<div class="UFIAddCommentInput _1osb _5yk1">
<div class="_5yk2" tabindex="-2">
<div class="_5rp7">
<div class="_1p1t">
<div class="_1p1v">
Write a reply...
</div>
</div>
<div class="_5rpb">
<div aria-autocomplete="list" aria-expanded="false" aria-haspopup="false" aria-owns="js_3i" class="_5rpu" contenteditable="true" data-testid="ufi_reply_composer" role="combobox" spellcheck="true" title="Write a reply..." id="js_3j">
<div data-contents="true">
<div data-block="true" data-offset-key="8c176-0-0" class="_45m_ _2vxa">
<span data-offset-key="8c176-0-0">
<br data-text="true">
</br>
</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
What could I try next? Is there a way to stop front end designers using non-standard elements?
You can use javascript to do this. The difficulty for me was to handle the nested quotes.
Two pieces of knowledge I had to figure out first before being able to do this w/ regards to nested strings:
a.) regarding how javascript handles nested quotes: http://www.w3schools.com/js/js_strings.asp
b.) on how to deal with nested quotes in ruby: Escaping single and double qoutes from a string in ruby (the %Q operator lets you set whatever you want to begin and end a string)
css_selector = "span[data-offset-key='8c176-0-0']"
b.execute_script(%Q|query="#{css_selector}"|)
b.execute_script("document.querySelector(query).innerHTML='that was tricky'")
Looks like the ability to inject JavaScript using procedures such as this enables you to be able to do just about anything Watir can't do otherwise. Good question, this was a learning experience for me too

vim sparkup item number in content

Using the sparkup plugin for vim (specifically vim-gnome on Ubuntu 15.04, although I doubt that matters), I am generating a list with item numbers:
ion-content.has-tabs > .list > a.item[href=#/item/$]{Item $}*3
The result substitutes the item number in [href=#/item/$] but not in {Item $}:
<ion-content class="has-tabs">
<div class="list">
Item $
Item $
Item $
</div>
</ion-content>
Feature, bug, or user error?
I don't remember Sparkup ever supporting incrementing numbers inside "content" braces so I would say "feature".
Don't waste your time asking for a fix on the plugin's issue tracker, though.
I am afriad that this plugin deems the $ in curly braces as a text which should not be affected. To numerate your Item $ list, you can try this command
:let #a=1 | %s/\$/\=(#a+setreg('a',#a+1))/g
or for selected block in visual mode
:let #a=1 | '<,'>s/\$/\=(#a+setreg('a',#a+1))/g
I accepted an answer to the question as I asked it, but I'm adding this to show an alternate approach for a slightly different requirement. I needed to add a nested tag along with the text, which Sparkup does not support. So I found a single 2-step solution to this that also solved the original item number problem (more complex in my real world solution but simplified here).
This sparkup:
ion-content > .list > a.item.item-icon-left.Item$[href=#/items/$]*3 > i.icon.ion-email
generates this:
<ion-content>
<div class="list">
<a href="#/items/1" class="item item-icon-left Item1">
<i class="icon ion-email"></i>
</a>
<a href="#/items/2" class="item item-icon-left Item2">
<i class="icon ion-email"></i>
</a>
<a href="#/items/3" class="item item-icon-left Item3">
<i class="icon ion-email"></i>
</a>
</div>
</ion-content>
Then after I select the lines in visual mode, running this:
:'<,'>s/ Item\([0-9]*\)">/">Item \1/g
produces my desired result:
<ion-content>
<div class="list">
<a href="#/items/1" class="item item-icon-left">Item 1
<i class="icon ion-email"></i>
</a>
<a href="#/items/2" class="item item-icon-left">Item 2
<i class="icon ion-email"></i>
</a>
<a href="#/items/3" class="item item-icon-left">Item 3
<i class="icon ion-email"></i>
</a>
</div>
</ion-content>

ExpressionEngine swtich tag working inconsistently

In ExpressioneEngine, I'm creating a list with conditionals that is returning some strange behavior. The code below is part of a bigger set:
<li><h4>DERMATOLOGY</h4>
<ul>
{exp:channel:entries channel="specialist" dynamic="no" orderby="sp_order" sort="asc"}
{if sp_specialty == "sp_dermatology"}
<li>
<img src="{sp_headshot}" />
<p>{title}</p>
</li>
{/if}
{/exp:channel:entries}
</ul>
</li>
<li><h4>EMERGENCY AND CRITICAL CARE</h4>
<ul>
{exp:channel:entries channel="specialist" dynamic="no" orderby="sp_order" sort="asc"}
{if sp_specialty == "sp_emergency"}
<li class="{switch='one|two'}">
<img src="{sp_headshot}" />
<p>{title}</p>
</li>
{/if}
{/exp:channel:entries}
</ul>
</li>
What happens, in the case of EMERGENCY AND CRITICAL CARE, is that with the 5 entries I have under that, the classes are returned like this: two, one, one, one, two. Any suggestions on getting the behavior I need?
I see what you mean. The switch variable applies its logic to all entries returned by the entries loop - which is why you're seeing odd numbering in your rendered page - because it's applying them to entries returned by the loop that you are then applying conditionals to in order to do your grouping. You could use the search param to do some of that for you, returning only the entries you're looking for within each loop. Like this:
<li><h4>DERMATOLOGY</h4>
<ul>
{exp:channel:entries channel="specialist" search:sp_specialty="=sp_dermatology" dynamic="no" orderby="sp_order" sort="asc"}
<li>
<img src="{sp_headshot}" />
<p>{title}</p>
</li>
{/exp:channel:entries}
</ul>
</li>
<li><h4>EMERGENCY AND CRITICAL CARE</h4>
<ul>
{exp:channel:entries channel="specialist" search:sp_specialty="=sp_emergency" dynamic="no" orderby="sp_order" sort="asc"}
<li class="{switch='one|two'}">
<img src="{sp_headshot}" />
<p>{title}</p>
</li>
{/exp:channel:entries}
</ul>
</li>
This way each loop returns ONLY the matching items you're looking for, eliminating the need for the conditional and allowing the switch param to operate as it wants to - applying itself in alternating fashion to every returned entry from the loop.

Resources