Skip to content

Commit 05a922c

Browse files
bmuenzenmeyerbmuenzenmeyer
committed
add user defined atoms-_head and atoms-_foot pattern move patterns to account for new dir move footer and header to proper place inject header and footer into styleguide, index, and pattern html
1 parent b5622af commit 05a922c

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

52 files changed

+125
-211
lines changed

‎core/lib/patternlab.js

Lines changed: 53 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -57,8 +57,9 @@ var patternlab_engine = function (config) {
5757
function buildPatterns(deletePatternDir) {
5858
patternlab.data = fs.readJSONSync(path.resolve(paths.source.data, 'data.json'));
5959
patternlab.listitems = fs.readJSONSync(path.resolve(paths.source.data, 'listitems.json'));
60-
patternlab.header = fs.readFileSync(path.resolve(paths.source.patternlabFiles, 'source/_meta/header.html'), 'utf8');
61-
patternlab.footer = fs.readFileSync(path.resolve(paths.source.patternlabFiles, 'source/_meta/footer.html'), 'utf8');
60+
patternlab.header = fs.readFileSync(path.resolve(paths.source.patternlabFiles, 'templates/pattern-header-footer/header.html'), 'utf8');
61+
patternlab.footerPattern = fs.readFileSync(path.resolve(paths.source.patternlabFiles, 'templates/pattern-header-footer/footer-pattern.html'), 'utf8');
62+
patternlab.footer = fs.readFileSync(path.resolve(paths.source.patternlabFiles, 'templates/pattern-header-footer/footer.html'), 'utf8');
6263
patternlab.patterns = [];
6364
patternlab.partials = {};
6465
patternlab.data.link = {};
@@ -116,6 +117,25 @@ var patternlab_engine = function (config) {
116117
pattern_assembler.process_pattern_recursive(path.resolve(file), patternlab);
117118
});
118119

120+
//set user defined head and foot if they exist
121+
try {
122+
patternlab.userHead = pattern_assembler.get_pattern_by_key('atoms-head', patternlab);
123+
}
124+
catch(ex) {
125+
if (patternlab.config.debug) {
126+
console.log(ex);
127+
console.log('Could not find optional user-defined header, atoms-head pattern. It was likely deleted.');
128+
}
129+
}
130+
try {
131+
patternlab.userFoot = pattern_assembler.get_pattern_by_key('atoms-foot', patternlab);
132+
}
133+
catch(ex) {
134+
if (patternlab.config.debug) {
135+
console.log(ex);
136+
console.log('Could not find optional user-defined footer, atoms-foot pattern. It was likely deleted.');
137+
}
138+
}
119139

120140
//now that all the main patterns are known, look for any links that might be within data and expand them
121141
//we need to do this before expanding patterns & partials into extendedTemplates, otherwise we could lose the data -> partial reference
@@ -126,21 +146,40 @@ var patternlab_engine = function (config) {
126146
fs.emptyDirSync(paths.public.patterns);
127147
}
128148

149+
//set pattern-specific header if necessary
150+
var head;
151+
if (patternlab.userHead) {
152+
head = patternlab.userHead.extendedTemplate.replace('{% pattern-lab-head %}', patternlab.header);
153+
} else {
154+
head = patternlab.header;
155+
}
156+
129157
//render all patterns last, so lineageR works
130158
patternlab.patterns.forEach(function (pattern) {
131159

160+
pattern.header = head;
161+
132162
//render the pattern, but first consolidate any data we may have
133163
var allData = JSON.parse(JSON.stringify(patternlab.data));
134164
allData = pattern_assembler.merge_data(allData, pattern.jsonFileData);
135165

166+
//render the pattern-specific header
167+
var headHtml = pattern_assembler.renderPattern(pattern.header, allData);
168+
136169
//render the extendedTemplate with all data
137170
pattern.patternPartial = pattern_assembler.renderPattern(pattern.extendedTemplate, allData);
138171

139-
//add footer info before writing
140-
var patternFooter = pattern_assembler.renderPattern(patternlab.footer, pattern);
172+
//set the pattern-specific footer if necessary
173+
if (patternlab.userFoot) {
174+
console.log('found custom userFoot')
175+
var userFooter = patternlab.userFoot.extendedTemplate.replace('{% pattern-lab-foot %}', patternlab.footerPattern + patternlab.footer);
176+
pattern.footer = pattern_assembler.renderPattern(userFooter, pattern);
177+
} else {
178+
pattern.footer = pattern_assembler.renderPattern(patternlab.footerPattern, pattern);
179+
}
141180

142181
//write the compiled template to the public patterns directory
143-
fs.outputFileSync(paths.public.patterns + pattern.patternLink, patternlab.header + pattern.patternPartial + patternFooter);
182+
fs.outputFileSync(paths.public.patterns + pattern.patternLink, headHtml + pattern.patternPartial + pattern.footer);
144183

145184
//write the mustache file too
146185
fs.outputFileSync(paths.public.patterns + pattern.patternLink.replace('.html', '.mustache'), entity_encoder.encode(pattern.template));
@@ -211,11 +250,17 @@ var patternlab_engine = function (config) {
211250
styleguidePatterns = patternlab.patterns;
212251
}
213252

253+
//get the main page head and foot
254+
var mainPageHead = patternlab.userHead.extendedTemplate.replace('{% pattern-lab-head %}', patternlab.header);
255+
var mainPageHeadHtml = pattern_assembler.renderPattern(mainPageHead, patternlab.data);
256+
var mainPageFoot = patternlab.userFoot.extendedTemplate.replace('{% pattern-lab-foot %}', patternlab.footer);
257+
var mainPageFootHtml = pattern_assembler.renderPattern(mainPageFoot, patternlab.data);
258+
214259
//build the styleguide
215260
var styleguideTemplate = fs.readFileSync(path.resolve(paths.source.patternlabFiles, 'templates/styleguide.mustache'), 'utf8'),
216261
styleguideHtml = pattern_assembler.renderPattern(styleguideTemplate, {partials: styleguidePatterns});
217262

218-
fs.outputFileSync(path.resolve(paths.public.styleguide, 'html/styleguide.html'), styleguideHtml);
263+
fs.outputFileSync(path.resolve(paths.public.styleguide, 'html/styleguide.html'), mainPageHeadHtml + styleguideHtml + mainPageFootHtml);
219264

220265
//build the viewall pages
221266
var prevSubdir = '',
@@ -257,7 +302,7 @@ var patternlab_engine = function (config) {
257302

258303
var viewAllTemplate = fs.readFileSync(path.resolve(paths.source.patternlabFiles, 'templates/viewall.mustache'), 'utf8');
259304
var viewAllHtml = pattern_assembler.renderPattern(viewAllTemplate, {partials: viewAllPatterns, patternPartial: patternPartial});
260-
fs.outputFileSync(paths.public.patterns + pattern.subdir.slice(0, pattern.subdir.indexOf(pattern.patternGroup) + pattern.patternGroup.length) + '/index.html', viewAllHtml);
305+
fs.outputFileSync(paths.public.patterns + pattern.subdir.slice(0, pattern.subdir.indexOf(pattern.patternGroup) + pattern.patternGroup.length) + '/index.html', mainPageHead + viewAllHtml + mainPageFoot);
261306
}
262307

263308
// create the view all for the subsection
@@ -284,7 +329,7 @@ var patternlab_engine = function (config) {
284329

285330
var viewAllTemplate = fs.readFileSync(path.resolve(paths.source.patternlabFiles, 'templates/viewall.mustache'), 'utf8');
286331
var viewAllHtml = pattern_assembler.renderPattern(viewAllTemplate, {partials: viewAllPatterns, patternPartial: patternPartial});
287-
fs.outputFileSync(paths.public.patterns + pattern.flatPatternPath + '/index.html', viewAllHtml);
332+
fs.outputFileSync(paths.public.patterns + pattern.flatPatternPath + '/index.html', mainPageHeadHtml + viewAllHtml + mainPageFootHtml);
288333
}
289334
}
290335

‎core/source/_meta/footer.html

Lines changed: 0 additions & 34 deletions
This file was deleted.

‎core/source/_meta/header.html

Lines changed: 0 additions & 35 deletions
This file was deleted.

‎core/templates/index.mustache

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,14 @@
33
<head id="patternlab-head">
44
<title id="title">Pattern Lab</title>
55
<meta charset="UTF-8">
6+
7+
<!-- never cache patterns -->
8+
<meta http-equiv="cache-control" content="max-age=0" />
9+
<meta http-equiv="cache-control" content="no-cache" />
10+
<meta http-equiv="expires" content="0" />
11+
<meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT" />
12+
<meta http-equiv="pragma" content="no-cache" />
13+
614
<meta name="viewport" content="width=device-width" />
715
<link rel="stylesheet" href="styleguide/css/styleguide.css" media="all" />
816
<link rel="stylesheet" href="styleguide/css/styleguide-specific.css" media="all" />
@@ -21,7 +29,7 @@
2129
</div>
2230
</header>
2331
<!--End Style Guide Header-->
24-
32+
2533
<!-- Iframe -->
2634
<div id="sg-vp-wrap">
2735
<div id="sg-cover"></div>
@@ -91,4 +99,4 @@
9199
<script src="styleguide/js/pattern-finder.js"></script>
92100

93101
</body>
94-
</html>
102+
</html>

‎core/source/_meta/README.txt renamed to ‎core/templates/pattern-header-footer/README.txt

File renamed without changes.

‎core/templates/pattern-header-footer/footer-pattern.html

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
2+
<!-- DO NOT MODIFY -->
3+
<script>
4+
// handle injection of items from Node
5+
var patternPartial = "{{ patternGroup }}-{{ patternName }}";
6+
var lineage = [{{{ lineage }}}];
7+
var lineageR = [{{{ lineageR }}}];
8+
var patternState = "{{patternState}}";
9+
var baseurl = "{{{baseurl}}}";
10+
var cssEnabled = false; //TODO
11+
</script>
12+
13+
<script type="text/html" id="sg-pattern-html">
14+
{% patternHTML %}
15+
</script>
16+
17+
<script type="text/html" id="sg-pattern-css">
18+
{% patternCSS %}
19+
</script>

‎core/templates/pattern-header-footer/footer.html

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
2+
<script src="../../styleguide/js/vendor/jwerty.js"></script>
3+
<script src="../../styleguide/js/postmessage.js"></script>
4+
<script src="../../data/annotations.js"></script>
5+
<script src="../../styleguide/js/annotations-pattern.js"></script>
6+
<script src="../../styleguide/js/code-pattern.js"></script>

‎core/templates/pattern-header-footer/header.html

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
<!-- never cache patterns -->
2+
<meta http-equiv="cache-control" content="max-age=0" />
3+
<meta http-equiv="cache-control" content="no-cache" />
4+
<meta http-equiv="expires" content="0" />
5+
<meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT" />
6+
<meta http-equiv="pragma" content="no-cache" />
7+
8+
<link rel="stylesheet" href="../../styleguide/css/styleguide.css?" media="all">
9+
<link rel="stylesheet" href="../../styleguide/css/styleguide-specific.css" media="all" />

‎core/templates/styleguide.mustache

Lines changed: 0 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,3 @@
1-
<!DOCTYPE html>
2-
<html id="patternlab-html">
3-
<head id="patternlab-head">
4-
<title>Pattern Lab Style Guide</title>
5-
<meta charset="UTF-8">
6-
<meta name="viewport" content="width=device-width" />
7-
<link rel="stylesheet" href="../../styleguide/css/styleguide.css" media="all" />
8-
<link rel="stylesheet" href="../../styleguide/css/styleguide-specific.css" media="all" />
9-
<link rel="stylesheet" href="../../css/style.css" media="all" />
10-
</head>
11-
<body class="sg-pattern-list">
12-
131
<!-- Style Guide Main Content -->
142
<div class="sg-main" role="main">
153

@@ -58,11 +46,3 @@
5846
var lineage = "";
5947
var baseurl = "{{{baseurl}}}";
6048
</script>
61-
<script src="../../styleguide/js/vendor/jwerty.js"></script>
62-
<script src="../../styleguide/js/vendor/prism.js"></script>
63-
<script src="../../styleguide/js/postmessage.js"></script>
64-
<script src="../../data/annotations.js"></script>
65-
<script src="../../styleguide/js/annotations-pattern.js"></script>
66-
<script src="../../styleguide/js/code-pattern.js"></script>
67-
</body>
68-
</html>

‎core/templates/viewall.mustache

Lines changed: 0 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,3 @@
1-
<!DOCTYPE html>
2-
<html>
3-
<head id="patternlab-head">
4-
<title>Pattern Lab Sub-type Style Guide</title>
5-
<meta charset="UTF-8">
6-
<meta name="viewport" content="width=device-width" />
7-
<link rel="stylesheet" href="../../styleguide/css/styleguide.css" media="all" />
8-
<link rel="stylesheet" href="../../styleguide/css/styleguide-specific.css" media="all" />
9-
<link rel="stylesheet" href="../../css/style.css" media="all" />
10-
</head>
11-
<body class="sg-pattern-list">
121

132
<!-- View All Patterns in a Pattern Sub-Type -->
143
<div class="sg-main" role="main">
@@ -58,11 +47,3 @@
5847
var lineage = "";
5948
var baseurl = "{{{baseurl}}}";
6049
</script>
61-
<script src="../../styleguide/js/vendor/jwerty.js"></script>
62-
<script src="../../styleguide/js/postmessage.js"></script>
63-
<script src="../../data/annotations.js"></script>
64-
<script src="../../styleguide/js/annotations-pattern.js"></script>
65-
<script src="../../styleguide/js/code-pattern.js"></script>
66-
67-
</body>
68-
</html>

0 commit comments

Comments
 (0)