Jekyll loop pages by parent directory - jekyll

My Jekyll site is comprised of pages in folders. Like this:
modules
- week 1
-- topic 1
-- topic 2
-- topic 3
- week 2
-- topic 1
- week 3
-- topic 1
Here's a screenshot of my Sublime folder view: http://glui.me/?i=884mtx2vcyv7fjx/2014-08-26_at_11.26_AM.png/
I can just do a simple {% for page in site.pages %} to output a flat list of all the pages in the site, but I want to maintain that folder structure.
Any ideas for how I might output a list that mirrors the directory structure I have?
Thanks!

This pages scheme
--modules
|
--schedule
| |--schedule-01.html
| |--schedule-02.html
|
--week01
| |--topic-01.html
| |--topic-02.html
| |--topic-11.html
|
--week02
| |--topic-01.html
| |--topic-02.html
|
--week11
| |--topic-01.html
| |--topic-02.html
|
|...
can be nicely sorted and presented in a menu
Example page modules/week01/topic-01.html
---
title: Week 1 - Topic 01
layout: page or any custome module layout
menu: modules
---
Topic 01 content
And finally the modules.html page with his menu
<h2>Modules list</h2>
{% assign sorted = site.pages | sort: "url" %}
<ul>
{% for p in sorted %}
{% if p.menu == "modules" %}
<li>{{ p.title }}</li>
{% endif %}
{% endfor %}
</ul>

Related

How to Get Columns Next To One Another and Iterate By Row in Jinja and HTML

I am trying to follow this example to use slice in jinja to create multiple columns:
<div class="columnwrapper">
{%- for column in items|slice(3) %}
<ul class="column-{{ loop.index }}">
{%- for item in column %}
<li>{{ item }}</li>
{%- endfor %}
</ul>
{%- endfor %}
</div>
When I apply to this to my project it generates three different columns in HTML as in the template, but in terms of display instead of displaying as:
Column 1 | Column 2 | Column 3
Item 1 | Item 3 | Item 5
Item 2 | Item 4 | Item 6
It displays as:
Column 1
Item 1
Item 2
Column 2
Item 3
Item 4
Column 3
Item 5
Item 6
I am not sure how to get it to display as actual columns next to one another. Ideally, I'd like to be able to get it to display as columns and have the items iterate across the rows rather than down the columns like this:
Column 1 | Column 2 | Column 3
Item 1 | Item 2 | Item 3
Item 4 | Item 5 | Item 6
How do I change the display to actually be columns next to one another and is there a way in jinja do the slice iteration by row rather than by column?

Jekyll change element based on how you got to post (click order)

Right now I have a Jekyll site theme that allows users to filter posts by selecting tags.
If they are on the home page, it shows all posts and if they have a tag selected it shows only the posts with that tag.
When selecting a post, a new view appears below the post list and tag list which displays the post content. However when this happens, any filtering inside the Post List element goes away.
TAG1 SELECTED POST FROM TAG1 SELECTED
<URL>/tag/tag1 <URL>/POST
+---------+--------------------+ +---------+--------------------+
| Home | Post List | | Home | Post List |
| - Tag1 | <FILTERED ON TAG1> | ---\ | - Tag1 | <SHOWS ALL POSTS> |
| - Tag2 | | ---/ | - Tag2 |<NO LONGER FILTERED>|
+---------+--------------------+ +---------+--------------------+
| POST CONTENT |
| |
+------------------------------+
I have also been able to change the code so that when selecting a tag, then selecting a post, the Post List shows only posts that also contain that tag. However, with this change, it breaks if on the Home page (no tag) and I click a post; the Post List becomes filtered based on the tag associated with the selected post instead of showing all posts. (Note: For my blog I only ever plan on having one tag per post)
HOME SELECTED POST FROM HOME SELECTED
<URL>/ <URL>/POST
+---------+--------------------+ +---------+--------------------+
| Home | Post List | | Home | Post List |
| - Tag1 | <SHOWS ALL POSTS> | ---\ | - Tag1 | <FILTERED ON TAG1> |
| - Tag2 | | ---/ | - Tag2 | <IS NOW FILTERED> |
+---------+--------------------+ +---------+--------------------+
| POST CONTENT |
| |
+------------------------------+
My question is, is there a way in Jekyll to display a post and change the Post List based on how you got to the post?
For instance, if I am on the Home page (that has no filters), and I click a post from the unfiltered Post List, I would like to view the post while keeping the Post List the same (stay unfiltered showing all posts). In addition to that, however, if I click Tag1 in the tag list then click a post from the now filtered Post List, I would like to view the post while keeping the Post List the same (continue to filter all posts on tag1). See the wireframe below for visual explanation.
Is this at all possible using Jekyll and its corresponding tools (Front Matter, Liquid...)? Or would I require a plugin of some kind?
Any help is greatly appreciated.
Yes, you can do that with Jekyll by using a generator plugin. But I think that this introduces unnecessary complication to your navigation and content duplication.
Other solutions can be to go dynamic server side or use some javascript client side, but this is still useless complications.
********** Home *******************
Last posts * TAGS
* - tag 1
(maybe some pagination) * - tag 2
*
Tag Page
********** Tag : tag 1 *************
Last posts for Tag 1 * TAGS
* - tag 1
(maybe some pagination) * - tag 2
*
Post page
********** Post page ***************
Post content * TAGS
Author, Date, Tag : tag 1 * - tag 1
* - tag 2
Post content *
***************************
Post tagged : tag 1 *
- post 1 *
- ... *
And you're done with a simple solution anybody can understand and with no useless complication.

Xpath expression to browse to next page

I am trying to write an XPATH expression that finds the next page URL OR element on this page to navigate to the next page.
It looks something like as follows, where 1, 2, 3, ..., n, and 'More' navigates to pages
Page 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | More
Page source as follows:
<table><tr><td><br />
<p>Page <a href='browse.html?&id=0&count=0'>1</a> | <a href='browse.html?&id=0&count=20'>2</a> | <a href='browse.html?&id=0&count=40'>3</a> | <a href='browse.html?&id=0&count=60'><strong>4</strong></a> | <a href='browse.html?&id=0&count=80'>5</a> | <a href='browse.html?&id=0&count=100'>6</a> | <a href='browse.html?&id=0&count=120'>7</a> | <a href='browse.html?&id=0&count=140'>8</a> | <a href='browse.html?&id=0&count=160'>9</a> | <a href='browse.html?&id=0&count=180'>10</a> | <a href='browse.html?&id=0&count=200'>More</a> </p>
</td></tr></table>
I've tried writing a few but to no avail:
//table/tbody/tr/td/table/tbody/tr/td/p
//td/p
Any suggestions would be greatly appreciated, thank you
first of all, pagination or even visiting any level of a site, totally depends on each site. So there isn't a general way to paginate any site, with any tool.
Now, talking about this specific case, it looks like the site pagination only depends on the count url variable, so you can emulate pagination very easily with just a counter, no need to use xpath or get any part of the html:
browse.html?&id=0&count=0 , count=(0*1) + 20
browse.html?&id=0&count=20 , count=(1*1) + 20
browse.html?&id=0&count=40 , count=(2*1) + 20
...
If you need xpath this should return all your links:
//a/#href
And if you want an index to iterate with xpath, it could also be done with:
//a[1]/#href
//a[2]/#href
...

SQL - Select total of visits for each unique page

I need to get the total of each unique page. However I'm not sure how to approach this. For example
If they are 12x index.php's and 64x home.php's. I need something like
PAGE | TOTAL
index.php | 12
home.php | 64
My table is as follows:
id | page
0 | index.php
1 | index.php
3 | home.php
etc
This will be used to get the total of each page for page visits
SELECT PAGE, COUNT(id) AS TOTAL
FROM TABLE_NAME
GROUP BY PAGE

groupBy filter not working

I would like to display the data, based on the date: for eg
Currently, the code I have come up with is this:
Jade:
ul
li(ng-repeat="history in vm.alertHistoryData | orderBy:'alert-modified-date':true ")
h4
| {{ history["alert-modified-date"] | date:"MMM d yyyy" }}
p
| {{ history["alert-modified-date"] | date:"h:mm:s a"}}
div
p
| Priority: {{ history.priority }}
| State: {{ history.state }}
which gives me result in this format:
May 3
data
May 3
another data
May 2
data
May 1
data
Is there a way to group by the date as per the date. I tried using groupBy filter of Angular js , but it doesnt work
li(ng-repeat="history in vm.alertHistoryData | orderBy:'alert-modified-date':true | groupBy: 'alert-modified-date")
Please help.