Skip to content

Commit f03f9ba

Browse files
daveseahdaveseah
committed
refactor init.jsx into new jsx in the view/ and component/ directories
1 parent cc7ef59 commit f03f9ba

7 files changed

Lines changed: 64 additions & 56 deletions

File tree

‎build/app/assets/index.html‎

Lines changed: 2 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -15,42 +15,9 @@
1515
<script src="netc-app.js"></script>
1616
<link rel="stylesheet" href="netc-app.css">
1717
</head>
18-
<body>
19-
20-
<nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark">
21-
<a class="navbar-brand" href="#">NetCreate</a>
22-
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
23-
<span class="navbar-toggler-icon"></span>
24-
</button>
25-
<div class="collapse navbar-collapse" id="navbarCollapse">
26-
<ul class="navbar-nav mr-auto">
27-
<li class="nav-item active">
28-
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
29-
</li>
30-
<li class="nav-item">
31-
<a class="nav-link" href="#">Link</a>
32-
</li>
33-
<li class="nav-item">
34-
<a class="nav-link disabled" href="#">Disabled</a>
35-
</li>
36-
</ul>
37-
<form class="form-inline mt-2 mt-md-0">
38-
<input class="form-control mr-sm-2" type="text" placeholder="Search" aria-label="Search">
39-
<button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
40-
</form>
41-
</div>
42-
</nav>
43-
44-
<div class="container">
45-
<div class="jumbotron">
46-
<h1>Navbar example</h1>
47-
<p class="lead">This example is a quick exercise to illustrate how fixed to top navbar works. As you scroll, it will remain fixed to the top of your browser's viewport.</p>
48-
<a class="btn btn-lg btn-primary" href="../../components/navbar/" role="button">View navbar docs &raquo;</a>
49-
</div>
50-
<div id="system-shell"></div>
51-
</div>
5218

19+
<body>
20+
<div id="app-container"></div>
5321
<script>require("init")</script>
54-
5522
</body>
5623
</html>

‎build/app/component/AppContainer.jsx‎

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
import React from 'react';
2+
import AppDefault from 'view/AppDefault';
3+
4+
export default class App extends React.Component {
5+
6+
render() {
7+
return (
8+
<div>
9+
<nav className="navbar navbar-expand-md navbar-dark fixed-top bg-dark">
10+
<a className="navbar-brand" href="#">NetCreate</a>
11+
<button className="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
12+
<span className="navbar-toggler-icon"></span>
13+
</button>
14+
<div className="collapse navbar-collapse" id="navbarCollapse">
15+
<ul className="navbar-nav mr-auto">
16+
<li className="nav-item active">
17+
<a className="nav-link" href="#">Home <span className="sr-only">(current)</span></a>
18+
</li>
19+
<li className="nav-item">
20+
<a className="nav-link" href="#">Link</a>
21+
</li>
22+
<li className="nav-item">
23+
<a className="nav-link" href="#">Link</a>
24+
</li>
25+
</ul>
26+
</div>
27+
</nav>
28+
<AppDefault/>
29+
</div>
30+
);
31+
}
32+
33+
}

‎build/app/gui/App.jsx‎

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

‎build/app/init.jsx‎

Lines changed: 12 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
1-
import ReactDOM from 'react-dom';
2-
import React from 'react';
3-
import App from 'gui/App';
1+
import ReactDOM from 'react-dom';
2+
import React from 'react';
43

5-
import UNISYS from 'sys/unisys';
6-
import DATASTORE from 'sys/datastore';
4+
import AppContainer from 'component/AppContainer';
5+
import UNISYS from 'system/unisys';
6+
import DATASTORE from 'system/datastore';
77

8-
import SETTINGS from 'settings';
8+
import SETTINGS from 'settings';
99

1010
console.group('init.jsx module comparison');
1111
console.log('ReactDOM', ReactDOM);
@@ -14,10 +14,14 @@ console.groupEnd();
1414

1515
console.log('> init.jsx loaded');
1616

17+
// test initialization; this probably won't actually be used like this.
1718
UNISYS.Initialize();
1819
DATASTORE.Initialize();
1920

21+
const APP_CONTAINER = '#app-container';
22+
23+
// initialize AppContainer, which will load view/AppDefault to set up routing
2024
document.addEventListener('DOMContentLoaded', () => {
21-
console.log('init.jsx initializing App into #system-shell');
22-
ReactDOM.render(<App />, document.querySelector('#system-shell'));
25+
console.log('init.jsx initializing App into', APP_CONTAINER);
26+
ReactDOM.render(<AppContainer />, document.querySelector( APP_CONTAINER ));
2327
});

build/app/sys/datastore.js renamed to build/app/system/datastore.js

File renamed without changes.

build/app/sys/unisys.js renamed to build/app/system/unisys.js

File renamed without changes.

‎build/app/view/AppDefault.jsx‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import React from 'react';
2+
3+
export default class App extends React.Component {
4+
5+
render() {
6+
return (
7+
<div className="container">
8+
<div className="jumbotron">
9+
<h1>Prototype</h1>
10+
<p className="lead">This is the placeholder AppDefault component.</p>
11+
<a className="btn btn-lg btn-primary" href="http://github.com/daveseah/netcreate-2018/wiki" role="button">View the NetCreate Wiki</a>
12+
</div>
13+
</div>
14+
);
15+
}
16+
17+
}

0 commit comments

Comments
 (0)