Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Link to Next/Previous objects in a JSON file #189

Closed
myk13 opened this issue Jan 8, 2014 · 8 comments
Closed

Link to Next/Previous objects in a JSON file #189

myk13 opened this issue Jan 8, 2014 · 8 comments
Assignees
Labels

Comments

@myk13
Copy link

myk13 commented Jan 8, 2014

I'm looking for a way to link to the 'next' and 'previous' objects in a JSON file.

On IRC kennethormandy requested I log this as he has a recipe for it.

@ghost ghost assigned kennethormandy Jan 8, 2014
@kennethormandy
Copy link
Collaborator

Here it is with comments, I will get around to making it a full recipe soon with a lot more detail, but hopefully this is enough to get you going.

//- Create an empty array of the articles
articles = []
//- Iterate over the articles like you would normally
for article, slug in public.articles._data
  //- Assign the slug, which is the object key, to a value instead
  - article.slug = slug
  //- Push each article into the empty array
  - articles.push(public.articles._data[slug])

//- Iterate over the articles array
each article, i in articles
  //- Article slug is the old object key that matched the file name,
  //- Like "a-post" for example
  //- Match it against the current page
  if article.slug == current.source
      //- Previous is one before this array item
      //- Next is one after
      //- Variables make it easy to template
      - prev = articles[i - 1]
      - next = articles[i + 1]
      //- The actual links
      ul
      if prev
        a(href="#{ prev.slug }") ← #{ prev.title }
      if next
        a(href="#{ next.slug }") #{ next.title } →

Here is the _data.json file I’m using, in articles/_data.json:

{
  "welcome-to-harp": {
    "title": "Welcome to Harp"
  },
  "go-out-and-make-it-your-own": {
    "title": "Go Out & Make It Your Own"
  },
  "a-post": {
    "title": "An example post"
  }
}

@kennethormandy
Copy link
Collaborator

Added it to the next-post branch of my Harp boilerplate, hb-remedy if you want a working example. It will also handle draft posts and sorting by dates appropriately.

hb-remedy-next-prev

@ajmalafif
Copy link

OMG what a week for me! This is the feature I've been loooong wanting for static generator. I asked Ghost forum every other month about this and the latest they gonna have it is v0.5 (now is v0.3.3), hexo, assemble.io and others..

I thought that porting from WordPress I'm only going to miss this one feature when using static gen, but now that @kennethormandy figured this out ⚡

@silentrob
Copy link
Collaborator

@ajmalafif How did you first hear about Harp? We need to find more people as excited as you are to try it :)

@ajmalafif
Copy link

@silentrob Ouch! 😆

I don't remember exactly which one was first, but it's either from these two sources;

  1. http://staticsitegenerators.net/ — you can safely say I tried almost all just to find the right fit. From ruby-based to JS. Was liking JS since I tried Hexo, Ghost, Wintersmith, and Docpad (in that order; some others afterward as well like roots.cx).

  2. I think there's this week Harp is being featured in Github's explore, JS Daily and web-tools weekly.

Beautiful things don't ask for attention. — Sean O'Connell, The Secret Life of Walter Mitty

I think if you've gone through almost everything on http://staticsitegenerators.net/ but can't really find a comparable to current setup/choice (WordPress), everyone would be as excited as I am! I mean generally of course static is always faster that's a given but to what extend can I compromise features-wise (like assets file management, SEO-wise as a blog/site, interactivity-wise for showcasing my work).

I would confidently and proudly say Harp is the best option out there for static generator, at very little need to compromise anything at all.

My next concern would be how to handle external/3rd-party javascript for some extra interactivity to be included in my Harp setup, but from what I can wrap my head around right now, that's already doable in Harp. I believe I just need to figure out or ask here (since you guys are very helpful and welcoming)!

@myk13
Copy link
Author

myk13 commented Jan 9, 2014

That's awesome! Thanks @kennethormandy. I was sooo close - can't believe I didn't get there. Very much appreciated.

@silentrob - Personally, I only stumbled across harp a few days ago. I'm pretty sure it was initially via http://webdevrefinery.com/forums/topic/13153-ghost-a-nodejs-blogging-framework/. I was playing with assemble.io and Wintersmith as an alternative to Middleman. I was just looking for something really simple, that I could drop into my existing Grunt workflow. My test was to build an average small site with 30 pages across 5 templates exactly the same with Harp, Assemble and Wintersmith. I had already built the site once with Middleman, so had worked out the structure, design concerns, etc. I simply built it with Harp faster - I just needed the 'next'/'previous' issue answered.

As far as static sites go, I'm sold. The only thing I could ask for at this point is more recipes and the ability to generate pages from JSON - both of which are already being discussed.

@kennethormandy
Copy link
Collaborator

This has been pretty well covered now, so I’m going to close the issue.

If you want to read about it, check out:

@mcbjam
Copy link

mcbjam commented Jan 30, 2015

Hi.

You are looking for

articles.indexOf(current.source);

This is a link explain what you want to do with harp :
http://www.raymondcamden.com/2014/02/26/Creating-NextPrevious-Links-in-HarpJS

One of my Website with Harp : http://buzz.mcbjam.com/

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

5 participants