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

templates broken #99

Open
datesss opened this issue Sep 2, 2017 · 3 comments
Open

templates broken #99

datesss opened this issue Sep 2, 2017 · 3 comments

Comments

@datesss
Copy link
Contributor

datesss commented Sep 2, 2017

Something wrong with the writeTemplate function, where it writes the same HTML from the first' posts' entry on my rooftopCMS into every page with that template for me. For example if i add console.logs:

function writeTemplate (ct, compiler, compilation, addDataTo, cb) {
  const data = addDataTo.rooftop[ct.name]
  const filePath = path.join(compiler.options.context, ct.template.path)

  return node.call(fs.readFile.bind(fs), filePath, 'utf8')
    .then((template) => {
      return W.map(data, (item) => {
        addDataTo = Object.assign(addDataTo, { item: item })
        compiler.resourcePath = filePath

        // webpack context is used by default in spike for plugins, so we need
        // to mock it so that plugins dont crash
        const fakeContext = { addDependency: (x) => x, resourcePath: filePath }
        const options = loader.parseOptions.call(fakeContext, this.util.getSpikeOptions().reshape)

        // W.map fires events as quickly as possible, so the locals will be
        // swapped for the last item unless bound to the result function
        return reshape(options)
          .process(template)
          .then(((locals, res) => {
            console.log(ct.template.output(item));
            const html = res.output(locals);
            console.log(html);
            compilation.assets[ct.template.output(item)] = {
              source: () => html,
              size: () => html.length
            }
          }).bind(null, Object.assign({}, options.locals)), cb)
      })
    })
}

I get:

pages/another-page.html
<!-- <extends src='views/layout.html'>
  <block name='content'>
    <h4>test</h4>
    {{JSON.stringify(item)}}
    <br><BR>
  </block>
</extends> -->{"id":2,"date":"2017-08-08T05:04:35","date_gmt":"2017-08-08T05:04:35","modified":"2017-08-08T05:04:36","modified_gmt":"2017-08-08T05:04:36","slug":"sample-page","status":"publish","type":"page","title":"Here&#8217;s a Rooftop page","author":391,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"open","template":"","meta":[],"eee":[],"taxonomies":[],"forms":[],"content":{"basic":"<p>This is an example page. It's different from a blog post because it will stay in one place and will show up in your site navigation (in most themes). Most people start with an About page that introduces them to potential site visitors. It might say something like this:</p>\n<blockquote><p>Hi there! I'm a bike messenger by day, aspiring actor by night, and this is my website. I live in Los Angeles, have a great dog named Jack, and I like piña coladas. (And gettin' caught in the rain.)</p></blockquote>\n<p>...or something like this:</p>\n<blockquote><p>The XYZ Doohickey Company was founded in 1971, and has been providing quality doohickeys to the public ever since. Located in Gotham City, XYZ employs over 2,000 people and does all kinds of awesome things for the Gotham community.</p></blockquote>\n<p>As a new Rooftop user, you should go to <a href=\"http://rooftopcms.io/docs/\">documentation</a> to delete this page and create new pages for your content. Have fun!</p>\n","advanced":[]}}
pages/about.html
<!-- <extends src='views/layout.html'>
  <block name='content'>
    <h4>test</h4>
    {{JSON.stringify(item)}}
    <br><BR>
  </block>
</extends> -->{"id":2,"date":"2017-08-08T05:04:35","date_gmt":"2017-08-08T05:04:35","modified":"2017-08-08T05:04:36","modified_gmt":"2017-08-08T05:04:36","slug":"sample-page","status":"publish","type":"page","title":"Here&#8217;s a Rooftop page","author":391,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"open","template":"","meta":[],"eee":[],"taxonomies":[],"forms":[],"content":{"basic":"<p>This is an example page. It's different from a blog post because it will stay in one place and will show up in your site navigation (in most themes). Most people start with an About page that introduces them to potential site visitors. It might say something like this:</p>\n<blockquote><p>Hi there! I'm a bike messenger by day, aspiring actor by night, and this is my website. I live in Los Angeles, have a great dog named Jack, and I like piña coladas. (And gettin' caught in the rain.)</p></blockquote>\n<p>...or something like this:</p>\n<blockquote><p>The XYZ Doohickey Company was founded in 1971, and has been providing quality doohickeys to the public ever since. Located in Gotham City, XYZ employs over 2,000 people and does all kinds of awesome things for the Gotham community.</p></blockquote>\n<p>As a new Rooftop user, you should go to <a href=\"http://rooftopcms.io/docs/\">documentation</a> to delete this page and create new pages for your content. Have fun!</p>\n","advanced":[]}}
pages/sample-page.html
<!-- <extends src='views/layout.html'>
  <block name='content'>
    <h4>test</h4>
    {{JSON.stringify(item)}}
    <br><BR>
  </block>
</extends> -->{"id":2,"date":"2017-08-08T05:04:35","date_gmt":"2017-08-08T05:04:35","modified":"2017-08-08T05:04:36","modified_gmt":"2017-08-08T05:04:36","slug":"sample-page","status":"publish","type":"page","title":"Here&#8217;s a Rooftop page","author":391,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"open","template":"","meta":[],"eee":[],"taxonomies":[],"forms":[],"content":{"basic":"<p>This is an example page. It's different from a blog post because it will stay in one place and will show up in your site navigation (in most themes). Most people start with an About page that introduces them to potential site visitors. It might say something like this:</p>\n<blockquote><p>Hi there! I'm a bike messenger by day, aspiring actor by night, and this is my website. I live in Los Angeles, have a great dog named Jack, and I like piña coladas. (And gettin' caught in the rain.)</p></blockquote>\n<p>...or something like this:</p>\n<blockquote><p>The XYZ Doohickey Company was founded in 1971, and has been providing quality doohickeys to the public ever since. Located in Gotham City, XYZ employs over 2,000 people and does all kinds of awesome things for the Gotham community.</p></blockquote>\n<p>As a new Rooftop user, you should go to <a href=\"http://rooftopcms.io/docs/\">documentation</a> to delete this page and create new pages for your content. Have fun!</p>\n","advanced":[]}}
compiled (2.868s)

Kindof messy to look at, but basically its calling the api correctly and writing the page urls correctly, but returning the same page data to every template, because options.locals returns the same page!

@JustinTBrown
Copy link

JustinTBrown commented Sep 26, 2017

@datesss I can confirm I'm experiencing the same issue. My urls are correctly written but the same page data is being used for every page.

Here's my app.js:

const Rooftop = require('spike-rooftop')
const htmlStandards = require('reshape-standard')
const cssStandards = require('spike-css-standards')
const jsStandards = require('spike-js-standards')
const locals = {}

module.exports = {
  devtool: 'source-map',
  ignore: ['**/layout.html', '**/_*', '**/.*', 'readme.md', 'yarn.lock', 'templates/*', 'posts/*', 'pages/*'],
  reshape: htmlStandards({
    locals: () => locals
  }),
  postcss: cssStandards(),
  babel: jsStandards(),
  plugins: [
    new Rooftop({ 
      addDataTo: locals, 
      url: 'https://trigger.rooftopcms.io', 
      apiToken: '<my token>',
      contentTypes: [
        {
          name: 'posts',
          template: {
            path: 'templates/post.html',
            output: (post) => { return `posts/${post.slug}.html` }
          }
        }
      ]
    })
  ]
}

And my markup which is correctly returning each url:

<each loop="post of rooftop.posts">
  <a href="posts/{{post.slug}}">{{ post.title }}</a>
</each>

And my template markup:

<extends src='views/layout.html'>
  <block name='content'>
    <h1>Title: {{ item.title }}</h1>
    <div class="content">
      {{ item.content.basic }}
    </div>
  </block>
</extends>

@jescalan
Copy link
Member

Hey guys, sorry about this, the rooftop plugin isn't up to date. We evaluated rooftop for a bit and it ended up being a bit too buggy at the service level for our needs, so we haven't been using it recently. Unfortunately I don't have the time or need right now to fix this, but if it's particularly important to anyone I would be happy to go over how to contribute a fix!

@JustinTBrown
Copy link

@jescalan thanks for update! It's not critical for me, was just exploring different CMSes. And it's helpful to know your take on rooftop!

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

No branches or pull requests

3 participants