Skip to content
This repository was archived by the owner on Feb 7, 2023. It is now read-only.

Commit e300e61

Browse files
committed
Merge branch 'release-0.3.0'
2 parents 7ea2e3a + ba3cc62 commit e300e61

File tree

18 files changed

+104
-37
lines changed

18 files changed

+104
-37
lines changed

CHANGELOG

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,15 @@
11
THIS CHANGELOG IS AN ATTEMPT TO DOCUMENT CHANGES TO THIS PROJECT.
22

3+
PL-v0.3.0
4+
- ADD: added "all" link to the nav that takes the user back to the style guide
5+
- ADD: title tag updates when switching patterns
6+
- FIX: if a pattern type or pattern sub-type doesn't have any patterns it's removed from the nav
7+
- FIX: added styleguide.css to the pattern header
8+
- FIX: commented out the video & audio patterns to address an issue w/ Chrome 29, frames, & History API
9+
- FIX: reduced the number of comments called in the comment-thread pattern
10+
- FIX: patterns won't try to auto-reload if viewed directly
11+
- THX: thanks to @bmuenzenmeyer for the "all link" suggestion
12+
313
PL-v0.2.0
414
- ADD: better styling in the overall navigation (via @geibi)
515
- FIX: better windows support for the generator and watcher

builder/builder.php

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<?php
22

33
/*!
4-
* Pattern Lab Builder CLI - v0.1
4+
* Pattern Lab Builder CLI - v0.3.0
55
*
66
* Copyright (c) 2013 Dave Olsen, http://dmolsen.com
77
* Licensed under the MIT license

builder/lib/builder.lib.php

Lines changed: 21 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<?php
22

33
/*!
4-
* Pattern Lab Builder Class - v0.1
4+
* Pattern Lab Builder Class - v0.3.0
55
*
66
* Copyright (c) 2013 Dave Olsen, http://dmolsen.com
77
* Licensed under the MIT license
@@ -346,6 +346,7 @@ protected function gatherNavItems() {
346346
$b = array("buckets" => array()); // the array that will contain the items
347347
$bi = 0; // track the number for the bucket array
348348
$ni = 0; // track the number for the nav items array
349+
$incrementNavItem = true; // track nav item regeneration so we avoid rebuilding view all pages
349350

350351
// iterate through each pattern type and add them as buckets
351352
foreach($this->patternTypes as $patternType) {
@@ -380,6 +381,12 @@ protected function gatherNavItems() {
380381

381382
}
382383

384+
// if all of the patterns for a given pattern type (e.g. atoms) were commented out we need to unset it
385+
if (!isset($b["buckets"][$bi]["patternItems"])) {
386+
unset($b["buckets"][$bi]);
387+
$bi--;
388+
}
389+
383390
} else {
384391

385392
// iterate over pattern sub-types
@@ -413,6 +420,12 @@ protected function gatherNavItems() {
413420

414421
}
415422

423+
// if all of the patterns for a given sub-type were commented out we need to unset it
424+
if (!isset($b["buckets"][$bi]["navItems"][$ni]["navSubItems"])) {
425+
unset($b["buckets"][$bi]["navItems"][$ni]);
426+
$incrementNavItem = false;
427+
}
428+
416429
}
417430

418431
// add a view all for the section
@@ -428,7 +441,13 @@ protected function gatherNavItems() {
428441
$this->viewAllPaths[$vaBucket][$vaDirFinal] = $patternType."-".$dirClean;
429442
}
430443

431-
$ni++;
444+
// this feels like such a hacky way of doing it
445+
if (!$incrementNavItem) {
446+
$incrementNavItem = true;
447+
} else {
448+
$ni++;
449+
}
450+
432451
}
433452
}
434453

builder/lib/generator.lib.php

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<?php
22

33
/*!
4-
* Pattern Lab Generator Class - v0.1
4+
* Pattern Lab Generator Class - v0.3.0
55
*
66
* Copyright (c) 2013 Dave Olsen, http://dmolsen.com
77
* Licensed under the MIT license

builder/lib/watcher.lib.php

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<?php
22

33
/*!
4-
* Pattern Lab Watcher Class - v0.1
4+
* Pattern Lab Watcher Class - v0.3.0
55
*
66
* Copyright (c) 2013 Dave Olsen, http://dmolsen.com
77
* Licensed under the MIT license

public/styleguide/css/styleguide.css

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -55,6 +55,10 @@ html, body {
5555
background: #dddddd;
5656
-webkit-text-size-adjust: 100%; }
5757

58+
html#pattern-frame {
59+
background: #ffffff;
60+
}
61+
5862
.sg-nav-wrapper {
5963
overflow: hidden;
6064
background: #dddddd; }

public/styleguide/css/styleguide.scss

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -112,6 +112,10 @@ html, body {
112112
-webkit-text-size-adjust: 100%;
113113
}
114114

115+
html#pattern-frame {
116+
background: #fff;
117+
}
118+
115119
.sg-nav-wrapper {
116120
overflow: hidden;
117121
background: $sg-tertiary;

public/styleguide/js/styleguide.js

Lines changed: 19 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
(function(w){
2+
23
var sw = document.body.clientWidth, //Viewport Width
34
sh = document.body.clientHeight, //Viewport Height
45
minViewportWidth = 240, //Minimum Size for Viewport
@@ -355,7 +356,7 @@
355356
}
356357

357358
// load the iframe source
358-
var patternName = "";
359+
var patternName = "all";
359360
var patternPath = "";
360361
var iFramePath = window.location.protocol+"//"+window.location.host+window.location.pathname.replace("index.html","")+"styleguide/html/styleguide.html";
361362
if ((oGetVars.p != undefined) || (oGetVars.pattern != undefined)) {
@@ -364,14 +365,20 @@
364365
iFramePath = (patternPath != "") ? window.location.protocol+"//"+window.location.host+window.location.pathname.replace("index.html","")+patternPath : iFramePath;
365366
}
366367

367-
document.getElementById("sg-viewport").contentWindow.location.assign(iFramePath);
368+
if (patternName != "all") {
369+
document.getElementById("title").innerHTML = "Pattern Lab - "+patternName;
370+
history.replaceState({ "pattern": patternName }, null, null);
371+
}
368372

369-
history.replaceState({ "pattern": patternName }, null, null);
373+
urlHandler.skipBack = true;
374+
document.getElementById("sg-viewport").contentWindow.location.replace(iFramePath);
370375

371376
//IFrame functionality
372377

373378
//Scripts to run after the page has loaded into the iframe
374379
$sgViewport.load(function (){
380+
381+
/*
375382
var $sgSrc = $sgViewport.attr('src'),
376383
$vp = $sgViewport.contents(),
377384
$sgPattern = $vp.find('.sg-pattern');
@@ -431,6 +438,7 @@
431438
});
432439
$vp.find('.sg-annotations').show();
433440
}
441+
*/
434442

435443
// Pattern Click
436444
// this doesn't work because patternlab-php assumes the iframe is being refreshed. not the overall app
@@ -449,15 +457,15 @@
449457
// having it outside fixes an auto-close bug i ran into
450458
$('.sg-nav a').not('.sg-acc-handle').on("click", function(e){
451459

460+
e.preventDefault();
461+
452462
// update the iframe via the history api handler
453-
urlHandler.pushPattern($(this).attr("data-patternpartial"));
463+
document.getElementById("sg-viewport").contentWindow.postMessage( { "path": urlHandler.getFileName($(this).attr("data-patternpartial")) }, urlHandler.targetOrigin);
454464

455465
// close up the menu
456466
$(this).parents('.sg-acc-panel').toggleClass('active');
457467
$(this).parents('.sg-acc-panel').siblings('.sg-acc-handle').toggleClass('active');
458468

459-
e.stopPropagation();
460-
461469
return false;
462470

463471
});
@@ -501,9 +509,12 @@ function receiveIframeMessage(event) {
501509

502510
if (!urlHandler.skipBack) {
503511

504-
var iFramePath = urlHandler.getFileName(event.data.patternpartial);
505-
urlHandler.pushPattern(event.data.patternpartial, event.data.path);
512+
if ((history.state == null) || (history.state.pattern != event.data.patternpartial)) {
513+
urlHandler.pushPattern(event.data.patternpartial, event.data.path);
514+
}
515+
506516
if (wsnConnected) {
517+
var iFramePath = urlHandler.getFileName(event.data.patternpartial);
507518
wsn.send( '{"url": "'+iFramePath+'", "patternpartial": "'+event.data.patternpartial+'" }' );
508519
}
509520

public/styleguide/js/url-handler.js

Lines changed: 10 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,10 @@ var urlHandler = {
3131
return fileName;
3232
}
3333

34+
if (name == "all") {
35+
return "styleguide/html/styleguide.html";
36+
}
37+
3438
var paths = (name.indexOf("viewall-") != -1) ? viewAllPaths : patternPaths;
3539
nameClean = name.replace("viewall-","");
3640

@@ -125,10 +129,13 @@ var urlHandler = {
125129
var fileName = urlHandler.getFileName(pattern);
126130
var expectedPath = window.location.protocol+"//"+window.location.host+window.location.pathname.replace("public/index.html","public/")+fileName;
127131
if (givenPath != expectedPath) {
132+
// make sure to update the iframe because there was a click
128133
document.getElementById("sg-viewport").contentWindow.postMessage( { "path": fileName }, urlHandler.targetOrigin);
129134
} else {
135+
// add to the history
130136
var addressReplacement = (window.location.protocol == "file:") ? null : window.location.protocol+"//"+window.location.host+window.location.pathname.replace("index.html","")+"?p="+pattern;
131137
history.pushState(data, null, addressReplacement);
138+
document.getElementById("title").innerHTML = "Pattern Lab - "+pattern;
132139
}
133140
},
134141

@@ -141,13 +148,8 @@ var urlHandler = {
141148
var state = e.state;
142149

143150
if (state == null) {
144-
var rVars = this.getRequestVars();
145-
if ((rVars.p != undefined) || (rVars.pattern != undefined)) {
146-
var patternName = (rVars.p != undefined) ? rVars.p : rVars.pattern;
147-
} else {
148-
this.skipBack = false;
149-
return;
150-
}
151+
this.skipBack = false;
152+
return;
151153
} else if (state != null) {
152154
var patternName = state.pattern;
153155
}
@@ -159,6 +161,7 @@ var urlHandler = {
159161
}
160162

161163
document.getElementById("sg-viewport").contentWindow.postMessage( { "path": iFramePath }, urlHandler.targetOrigin);
164+
document.getElementById("title").innerHTML = "Pattern Lab - "+patternName;
162165

163166
if (wsnConnected) {
164167
wsn.send( '{"url": "'+iFramePath+'", "patternpartial": "'+patternName+'" }' );

source/_patternlab-files/index.mustache

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<!DOCTYPE html>
22
<html>
33
<head>
4-
<title>Pattern Lab</title>
4+
<title id="title">Pattern Lab</title>
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width" />
77
<link rel="stylesheet" href="styleguide/css/styleguide.css" media="all" />

0 commit comments

Comments
 (0)