Add a Method to Export Pages and Static Assets

[dmolsen]

This issue builds off of ideas raised in #40. Create an export/ folder in the root of Pattern Lab into which static assets and Pages can be copied to from source/.

[bradfrost]

So is the idea here to have a version of public/ that doesn't have any reference to the Pattern Lab files/directories? I reread #40 and am not really getting it still.

[dmolsen]

@bradfrost -

My idea was that an export would end up with something like:

- export/
    -- static files/dirs from source/
    -- homepage.html
    -- blog.html
    -- some-other-page.html

Seems sort of thin but that's what I got from #40. Low on the list.

[bradfrost]

OK, yeah. I mean that all sounds great, but I agree it should be low on the
priority list. Because obviously there typically would to be some sort of
handoff/integration process, so everyone would be dissecting/messing with
the output code anyways.

---

Brad Frost
http://bradfrostweb.com
http://twitter.com/brad_frost

On Fri, Dec 6, 2013 at 2:54 PM, Dave Olsen notifications@github.com wrote:

@bradfrost https://github.com/bradfrost -

My idea was that an export would end up with something like:

• export/
  -- static files/dirs from source/
  -- homepage.html
  -- blog.html
  -- some-other-page.html

Seems sort of thin but that's what I got from #40#40.
Low on the list.

—

Reply to this email directly or view it on GitHubhttps://github.com//issues/67#issuecomment-30024010
.

[aarongustafson]

I’d like to resurface this one with higher priority for one reason: unit testing in older devices (e.g. BB4 is a PiTA because the extra JS makes the page so big (and causes hanging).

To accomplish this, you would need to be able to set up your own header and footer bits (head contents and scripts just before </body>) and have a static version generated that only includes those (so no PL stuff is injected). This seems doable and would only require a little rewrite to accomplish. And the build script could generate two build folders (or two files in the one folder).

Thoughts?

[dmolsen]

@aarongustafson -

It shouldn't be difficult. Do you want all of the pattern exported this way or just pages? Or some combo? I'm currently working through the Windows bug but then I can move onto the stuff I've tagged as v0.7.1 and this one.

[aarongustafson]

I think having every pattern would be awesome.

On Tue, Feb 4, 2014 at 2:38 PM, Dave Olsen notifications@github.com wrote:

@aarongustafson https://github.com/aarongustafson -

It shouldn't be difficult. Do you want all of the pattern exported this
way or just pages? Or some combo? I'm currently working through the Windows
bug but then I can move onto the stuff I've tagged as v0.7.1 and this one.

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/67#issuecomment-34098047
.

[dmolsen]

@aarongustafson -

Ok, so the requirements (for your needs at least) are "every pattern exported with a single custom header/footer combo (v0.7.0 introduced two patterns for that FWIW) and sans any PL BS". Correct?

[aarongustafson]

Yes, please!

On Tuesday, February 4, 2014 at 2:59 PM, Dave Olsen wrote:

@aarongustafson (https://github.com/aarongustafson) -
Ok, so the requirements (for your needs at least) are "every pattern exported with a single custom header/footer combo (v0.7.0 introduced two patterns for that FWIW) and sans any PL BS". Correct?

—
Reply to this email directly or view it on GitHub (#67 (comment)).

[aarongustafson]

Circling back to this after a little more thought… what would you think about tuning the PL JS to dynamically load in the JS and CSS resources needed within the software? I think the base HTML could stay in the generated files, but things like this:

<script src="../../styleguide/js/postmessage.js"></script>
<script src="../../data/annotations.js"></script>
<script src="../../styleguide/js/annotations-pattern.js"></script>
<script src="../../styleguide/js/code-pattern.js"></script>

Might be better injected into the iFrame by the wrapper.

Thoughts?

[dmolsen]

@aarongustafson -

One of the requirements of PL is that it needs to limit dependencies. This includes Apache. I can't inject to the iFrame when files are served with the file:// protocol. Security policies prevent it. Hence all of the broken up & postMessage code. So with that as the requirement I couldn't do what you're proposing. Sorry.

[aarongustafson]

Oh well, it was worth a thought.

On Thu, Feb 6, 2014 at 11:21 AM, Dave Olsen notifications@github.comwrote:

@aarongustafson https://github.com/aarongustafson -

One of the requirements of PL is that it needs to limit dependencies. This
includes Apache. I can't inject to the iFrame when files are served with
the file:// protocol. Security policies prevent it. Hence all of the
broken up & postMessage code. So with that as the requirement I couldn't do
what you're proposing. Sorry.

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/67#issuecomment-34340449
.

[dmolsen]

@aarongustafson -

Based on your missive today does this mean that you're happy to use the "raw" version of patterns as they're built now as long as I drop the loading of select JS/CSS? Unfortunately, styleguide.css is also included on patterns. One idea I had was that I could have a little snippet of code added to each pattern that checked to see if the pattern was part of a frame. If it is then load the list of assets you identified. It's not entirely clean but it's close to it.

[dmolsen]

@aarongustafson -

For now I've made sure that the Pattern Lab-specific JavaScript in each pattern is only loaded when it's in a frame. That should work for now. This feature is in dev. I have a few more things to do before I push out a new release. Hopefully I'll make progress on those tonight.

I won't close this issue. I'd still like to add a true "export" feature.

[aarongustafson]

Sorry for the radio silence… I was prepping for a trip.

Thanks so much for this @dmolsen! Any ETA for the release? When I return this Sunday, I may have some time to help. Let me know if you want me to jump in on anything.

[aarongustafson]

Doh, I wrote too soon. It looks like 0.7.2 is ready. I’ll give it a whirl. Anything I ned to know migration-wise? I’m running v0.6.0 still.

[dmolsen]

@aarongustafson -

You didn't write too soon. This set of features is going to roll-out in v0.7.5 sometime next week. I just had some bug fixes I had to get out hence v0.7.1 and v0.7.2. I shouldn't have put such a low release number on this. I just got lazy in updating the release tag for these related features.

Kept you in mind for the upgrade ;) The big thing for you is to back-up your version of public/. PL might try to clean that in the upgrade. More directions on upgrading.

[aarongustafson]

Thanks!

On Mon, Feb 10, 2014 at 10:43 AM, Dave Olsen notifications@github.comwrote:

@aarongustafson https://github.com/aarongustafson -

You didn't write too soon. This set of features is going to roll-out in
v0.7.5 sometime next week. I just had some bug fixes I had to get out
hence v0.7.1 and v0.7.2. I shouldn't have put such a low release number
on this. I just got lazy in updating the release tag for these related
features.

Kept you in mind for the upgrade ;) The big thing for you is to back-up
your version of public/. PL might try to clean that in the upgrade. More directions
on upgrading http://pattern-lab.info/docs/upgrading.html.

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/67#issuecomment-34645962
.

[bradfrost]

Just adding this in here for my own sanity. Are we talking about conditionally removing this bit from 00-atoms/00-meta/_00-head.mustache:

{% pattern-lab-head %}

and this from 00-atoms/00-meta/_00-foot.mustache:

{% pattern-lab-foot %}

Yeah? So the idea is to have a clean build devoid of any reference to Pattern Lab. We're doing some IE testing now where I'm having to manually go in and these out in order to get the page not to hang. Definitely something worth taking on.

[dmolsen]

@bradfrost -

Longer-term? Yes. In the short-term I've implemented a feature in dev where the PL-specific JS in the footer is only loaded if the pattern is in an iFrame. The Pattern Lab CSS is included no matter what. That feature will now have to be tested on IE9. Conceivably you could cherry-pick that JS out of dev and see if it helps you.

[dmolsen]

In talking to @bradfrost we will pursue the following as a first step:

• provide a config to include/exclude directories (e.g. pages, templates) to be exported
• straight HTML conversion
• provide an index that links to each of the generated items based on directory

A "converter" is a separate process/feature.