Skip to content
This repository was archived by the owner on Sep 10, 2022. It is now read-only.

Commit b0a8246

Browse files
author
Matt Gaunt
committed
Adding a version that flips over app shell and takes over links in nav drawer
1 parent c9c4c6a commit b0a8246

24 files changed

+406
-746
lines changed

‎.eslintrc

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,12 @@
3939
"space-before-function-paren": [2, "never"],
4040
"spaced-comment": 2,
4141
"valid-typeof": 2,
42-
"no-unused-vars": [2, {"args": "none"}]
42+
"no-unused-vars": [2, {"args": "none"}],
43+
"no-empty-class": 0,
44+
"no-extra-strict": 0,
45+
"no-reserved-keys": 0,
46+
"no-space-before-semi": 0,
47+
"no-wrap-func": 0
4348
},
4449
"env": {
4550
"es6": true,

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "app-shell",
3-
"version": "0.1.150",
3+
"version": "0.1.159",
44
"private": true,
55
"license": "Apache",
66
"engines": {

‎server/app.js

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,9 @@
1313

1414
var serverController = require('./controllers/server-controller');
1515
var StaticPageController = require('./controllers/static-page-controller');
16-
var AppShellController = require('./controllers/app-shell-controller');
16+
var PartialsController = require('./controllers/partials-controller');
1717

18-
serverController.addEndpoint('/app-shell', new AppShellController());
18+
// PartialsController serves up the HTML without any HTML body or head
19+
serverController.addEndpoint('/partials*', new PartialsController());
20+
// The static page controller serves the basic form of the pages
1921
serverController.addEndpoint('/*', new StaticPageController());

‎server/controllers/app-shell-controller.js

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

‎server/controllers/partials-controller.js

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
'use strict';
2+
3+
var pathConfigs = require('../models/path-config.js');
4+
5+
function PartialsController() {
6+
7+
}
8+
9+
// This method looks at the request path and renders the appropriate handlebars
10+
// template
11+
PartialsController.prototype.onRequest = function(req, res) {
12+
var urlSections = req.path.split('/');
13+
urlSections = urlSections.filter(function(sectionString) {
14+
return sectionString.length > 0;
15+
});
16+
17+
var urlPath = null;
18+
if (urlSections.length === 1) {
19+
urlPath = '/';
20+
} else {
21+
urlPath = '/' + urlSections[1];
22+
}
23+
24+
var pathConfig = pathConfigs.getConfig(urlPath);
25+
if (!pathConfig) {
26+
res.status(404).send();
27+
return;
28+
}
29+
30+
pathConfig.layout = 'partial';
31+
res.render(pathConfig.view, pathConfig);
32+
};
33+
34+
module.exports = PartialsController;

‎server/controllers/static-page-controller.js

Lines changed: 16 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -1,57 +1,31 @@
11
'use strict';
22

3-
var fs = require('fs');
4-
var path = require('path');
3+
var pathConfigs = require('../models/path-config.js');
54

65
function StaticPageController() {
76

87
}
98

10-
function prepareData(config) {
11-
// Concat inline styles for document <head>
12-
var flattenedStyles = '';
13-
var pathPrefix = '/../../dist/';
14-
config.inlineStyles.forEach(function(file) {
15-
flattenedStyles += fs.readFileSync(path.resolve(__dirname) +
16-
pathPrefix + file);
17-
});
18-
19-
// Replace array with flattened string of content
20-
config.inlineStyles = flattenedStyles;
21-
return config;
22-
}
23-
249
// This method looks at the request path and renders the appropriate handlebars
2510
// template
2611
StaticPageController.prototype.onRequest = function(req, res) {
12+
var pathConfig = pathConfigs.getConfig(req.path);
13+
if (!pathConfig) {
14+
res.status(404).send();
15+
return;
16+
}
17+
18+
2719
switch (req.path) {
28-
case '/':
29-
res.render('index', prepareData({
30-
inlineStyles: ['/styles/core.css'],
31-
remoteStyles: [],
32-
inlineScripts: [],
33-
remoteScripts: ['/scripts/static-page.js']
34-
}));
35-
break;
36-
case '/url-1':
37-
res.render('url-1', prepareData({
38-
inlineStyles: ['/styles/core.css'],
39-
remoteStyles: [],
40-
inlineScripts: [],
41-
remoteScripts: ['/scripts/static-page.js']
42-
}));
43-
break;
44-
case '/url-2':
45-
res.render('url-2', prepareData({
46-
inlineStyles: ['/styles/core.css'],
47-
remoteStyles: [],
48-
inlineScripts: [],
49-
remoteScripts: ['/scripts/static-page.js']
50-
}));
51-
break;
20+
case '/app-shell':
21+
// Render with app-shell layout and include no initial content
22+
pathConfig.layout = 'app-shell';
23+
res.render('', pathConfig);
24+
return;
5225
default:
53-
res.status(404).send();
54-
break;
26+
// Use default layout
27+
res.render(pathConfig.view, pathConfig);
28+
return;
5529
}
5630
};
5731

‎server/layouts/app-shell.handlebars

Lines changed: 6 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,7 @@ limitations under the License.
3333
</head>
3434
<body class="{{ deeplink_class }}">
3535

36+
<!-- Header element -->
3637
<header class="header">
3738
<button tabindex="-1" class="header__menu js-toggle-menu">
3839
Toggle nav menu
@@ -41,36 +42,10 @@ limitations under the License.
4142
<h1 class="header__title">App Shell</h1>
4243
</header>
4344

44-
<main class="main js-main" aria-role="main">
45-
46-
</main>
47-
48-
<aside class="empty-set-cta js-cta">
49-
<span style="margin-top: 16px;">Sup!</span>
50-
</aside>
51-
52-
<!-- The panel to sit beneath all other panels -->
53-
<div class="view-underpanel js-underpanel">
54-
<div class="view-underpanel__block"></div>
55-
</div>
56-
57-
<section class="hidden appshell-view js-appshell-view">
58-
<div class="appshell-view__panel">
59-
<div class="appshell-view__panel-title">This is a dialog</div>
60-
<div class="appshell-view__panel-mic">
61-
<canvas class="appshell-view__volume-readout js-volume-readout"></canvas>
62-
</div>
63-
64-
<button tabindex="-1" class="appshell-view__appshell-start-btn js-appshell-start-btn">appshell</button>
65-
<button tabindex="-1" class="appshell-view__appshell-stop-btn js-appshell-stop-btn" disabled>Stop appshelling</button>
66-
67-
<p class="appshell-view__warning">This is some lorem ipsum text.</p>
68-
69-
<button tabindex="-1" class="appshell-view__appshell-cancel-btn js-appshell-cancel-btn">Cancel</button>
70-
71-
</div>
72-
</section>
45+
<!-- Main Content goes here -->
46+
<main class="main js-global-main" aria-role="main"></main>
7347

48+
<!-- Navigation Drawer -->
7449
<section class="side-nav js-side-nav">
7550
<div class="side-nav__content js-side-nav-content">
7651
<div class="side-nav__header">
@@ -87,17 +62,8 @@ limitations under the License.
8762
</div>
8863
</section>
8964

90-
<aside class="toast-view"></aside>
91-
92-
<div class="edit-view__circular-reveal-container">
93-
<div class="edit-view__circular-reveal edit-view__circular-reveal--collapsed js-circular-reveal"></div>
94-
</div>
95-
96-
<button tabindex="-1" class="new-appshelling-btn js-new-appshelling-btn">
97-
New appshelling
98-
</button>
99-
100-
<div class="loader">
65+
<!-- Loading Dialog For use by Activities -->
66+
<div class="loader js-global-loader is-hidden">
10167
<svg viewBox="0 0 32 32" width="32" height="32">
10268
<style>
10369
#spinner {

‎server/layouts/default.handlebars

Lines changed: 19 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,26 @@
1+
<!--
2+
3+
Copyright 2015 Google Inc. All rights reserved.
4+
5+
Licensed under the Apache License, Version 2.0 (the "License");
6+
you may not use this file except in compliance with the License.
7+
You may obtain a copy of the License at
8+
9+
http://www.apache.org/licenses/LICENSE-2.0
10+
11+
Unless required by applicable law or agreed to in writing, software
12+
distributed under the License is distributed on an "AS IS" BASIS,
13+
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
14+
See the License for the specific language governing permissions and
15+
limitations under the License.
16+
17+
-->
18+
119
<!DOCTYPE html>
220
<html>
321
<head>
422
<meta charset="utf-8">
5-
<title>App Shell</title>
23+
<title>Static Page</title>
624

725
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
826
<meta name="viewport" content="width=device-width, initial-scale=1">

‎server/layouts/partial.handlebars

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
<style type="text/css">{{{inlineStyles}}}</style>
2+
3+
{{{ body }}}
4+
5+
{{#each remoteScripts}}
6+
<script src="{{this}}" async></script>
7+
{{~/each}}

‎server/models/path-config.js

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
var fs = require('fs');
2+
var path = require('path');
3+
4+
var pathConfigs = {
5+
'/': {
6+
view: 'index',
7+
inlineStyles: getFileContents(['/styles/core.css']),
8+
remoteScripts: ['/scripts/static-page.js']
9+
},
10+
'/url-1': {
11+
view: 'url-1',
12+
inlineStyles: getFileContents(['/styles/core.css']),
13+
remoteScripts: ['/scripts/static-page.js']
14+
},
15+
'/url-2': {
16+
view: 'url-2',
17+
inlineStyles: getFileContents(['/styles/core.css']),
18+
remoteScripts: ['/scripts/static-page.js']
19+
},
20+
'/app-shell': {
21+
view: '',
22+
inlineStyles: getFileContents(['/styles/core.css']),
23+
remoteScripts: ['/scripts/core.js']
24+
}
25+
};
26+
27+
function getFileContents(files) {
28+
// Concat inline styles for document <head>
29+
var flattenedContents = '';
30+
var pathPrefix = '/../../dist/';
31+
files.forEach(function(file) {
32+
flattenedContents += fs.readFileSync(path.resolve(__dirname) +
33+
pathPrefix + file);
34+
});
35+
36+
return flattenedContents;
37+
}
38+
39+
module.exports = {
40+
getConfig: function(urlPath) {
41+
// This needed to ensure changes made to the objects dont stick / alter
42+
// the original object
43+
return Object.create(pathConfigs[urlPath]);
44+
}
45+
};

0 commit comments

Comments
 (0)