Work-in-progress on routing, renders mock-api content at

- /static/#/browse/src
- /static/#/browse/src/lib.rs

package.json

@@ -7,13 +7,16 @@
   },
   "dependencies": {
     "@types/react": "^16.0.5",
+    "@types/react-dom": "^15.5.4",
     "@types/react-redux": "^5.0.8",
+    "@types/react-router-dom": "^4.0.7",
     "@types/redux": "^3.6.0",
     "css-loader": "^0.28.7",
     "eslint-plugin-jquery": "^1.2.1",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "react-redux": "^5.0.5",
+    "react-router-dom": "^4.2.2",
     "redux": "^3.7.0",
     "redux-thunk": "^2.2.0",
     "style-loader": "^0.18.2"

static/app.js

@@ -22,6 +22,18 @@ import { DirView } from './dirView';
 import { SourceViewController } from './srcView';
 import { Summary } from './summary';
 
+import {
+  HashRouter,
+  Route,
+  Redirect
+} from 'react-router-dom';
+
+import {
+  Home,
+  Search,
+  Source
+} from './pages';
+
 // TODOs in build
 
 class RustwApp extends React.Component {
@@ -116,9 +128,13 @@ let store = createStore(rustwReducer, applyMiddleware(thunk));
 
 export function renderApp() {
     ReactDOM.render(
-        <Provider store={store}>
-            <AppController />
-        </Provider>,
+      <HashRouter>
+        <div className="main">
+          <Route exact path="/" component={Home} />
+          <Route path="/search" component={Search} />
+          <Route path="/browse(/\w+\.?\w+)*" component={Source} />
+        </div>
+      </HashRouter>,
         document.getElementById('container')
     );
 }

static/codeBrowser.tsx

@@ -0,0 +1,96 @@
+// Copyright 2017 The Rustw Project Developers.
+//
+// Licensed under the Apache License, Version 2.0 <LICENSE-APACHE or
+// http://www.apache.org/licenses/LICENSE-2.0> or the MIT license
+// <LICENSE-MIT or http://opensource.org/licenses/MIT>, at your
+// option. This file may not be copied, modified, or distributed
+// except according to those terms.
+
+import * as React from 'react';
+
+import * as utils from './utils';
+import { DirView } from './dirView';
+import { SourceView } from './srcView';
+
+declare const $: any;
+
+interface Props {
+  path: string,
+}
+
+// TODO: consider switching path to default prop with value of 'src'
+// interface DefaultProps {
+//   path: string,
+// }
+
+interface State {
+  isFile: boolean,
+  lines?: Array<string>,
+  files?: any,
+  highlight?: any,
+  lineStart?: any,
+  getSource?: (path :string) => any,
+  name: any,
+}
+
+export class CodeBrowser extends React.Component<Props, State> {
+  constructor(props: Props) {
+    super(props);
+    this.state = {
+      isFile: false,
+      lines: [],
+      files: [],
+      highlight: [],
+      lineStart: [],
+      getSource: (path) => {},
+      name: this.props.path,
+    }
+  }
+
+  componentWillMount() {
+    const path = this.props.path;
+    $.ajax({
+        url: 'http://localhost:3000/src' + path, // json-server mock API base url
+        type: 'GET',
+        dataType: 'JSON',
+        cache: false
+    })
+    .done((json: any) => {
+        if (json.Directory) {
+            this.setState({
+              isFile: false,
+              files: json.Directory.files,
+              lines: [],
+              highlight: [],
+              lineStart: [],
+              name: this.props.path,
+            });
+        } else if (json.Source) {
+            this.setState({
+              isFile: true,
+              lines: json.Source.lines,
+              highlight: [],
+              lineStart: [],
+            });
+        } else {
+            console.log("Unexpected source data.")
+            console.log(json);
+        }
+    })
+    .fail(function (xhr: any, status: any, errorThrown: any) {
+        // console.log(errStr);
+        console.log("error: " + errorThrown + "; status: " + status);
+
+    });
+  }
+
+  render() {
+    const path = this.props.path.split('/');
+
+    if (this.state.isFile) {
+      return <SourceView path={path} lines={this.state.lines} highlight={this.state.highlight} scrollTo={this.state.lineStart} />
+    } else {
+      return <DirView file={this.state.name} files={this.state.files} getSource={this.state.getSource} />;
+    }
+  }
+}

static/pages.js

@@ -0,0 +1,39 @@
+// Copyright 2017 The Rustw Project Developers.
+//
+// Licensed under the Apache License, Version 2.0 <LICENSE-APACHE or
+// http://www.apache.org/licenses/LICENSE-2.0> or the MIT license
+// <LICENSE-MIT or http://opensource.org/licenses/MIT>, at your
+// option. This file may not be copied, modified, or distributed
+// except according to those terms.
+
+import * as React from 'react';
+
+import { CodeBrowser } from './codeBrowser';
+
+const PageTemplate = ({children}) =>
+  <div id="div_app">
+      <div id="div_main">
+          {children}
+      </div>
+  </div>
+
+export const Home = () =>
+  <PageTemplate>
+    <section className="home">
+      [Home]
+    </section>
+  </PageTemplate>
+
+export const Search = () =>
+  <PageTemplate>
+    <section className="search">
+      [Search]
+    </section>
+  </PageTemplate>
+
+export const Source = ({match}) =>
+  <PageTemplate>
+    <section className="source">
+      <CodeBrowser path={match.params[0]} />
+    </section>
+  </PageTemplate>

static/srcView.js

@@ -85,7 +85,7 @@ function view_in_vcs(target) {
     window.open(CONFIG.vcs_link.replace("$file", file_name).replace("$line", line_number), '_blank');
 }
 
-class SourceView extends React.Component {
+export class SourceView extends React.Component {
     constructor(props) {
         super(props);
         this.state = { refMenu: null };