aboutsummaryrefslogtreecommitdiffstats
path: root/sdnr/wt/odlux/framework/src/app.tsx
blob: 1879c7bc6ee9d52b8c63ecb119672b6dfaa2651c (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
/******************************************************************************
 * Copyright 2018 highstreet technologies GmbH
 * 
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 * 
 *     http://www.apache.org/licenses/LICENSE-2.0
 * 
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 *****************************************************************************/

import * as React from 'react';
import * as ReactDOM from 'react-dom';

import { MuiThemeProvider } from '@material-ui/core/styles';

import { Frame } from './views/frame';

import { AddErrorInfoAction } from './actions/errorActions';

import { applicationStoreCreator } from './store/applicationStore';
import { ApplicationStoreProvider } from './flux/connect';

import { startHistoryListener } from './middleware/navigation';

import theme from './design/default';
import '!style-loader!css-loader!./app.css';

declare module '@material-ui/core/styles/createMuiTheme' {

  interface IDesign {
    id: string,
    name: string,
    url: string,        // image url of a company logo, which will be presented in the ui header
    height: number,     // image height [px] as delivered by the url
    width: number,      // image width [px] as delivered by the url
    logoHeight: number  // height in [px] of the logo (see url) within the ui header
  }

  interface Theme {
    design?: IDesign
  }
  interface ThemeOptions {
    design?: IDesign
  }
}

export const runApplication = () => {
  const applicationStore = applicationStoreCreator();

  window.onerror = function (msg: string, url: string, line: number, col: number, error: Error) {
    // Note that col & error are new to the HTML 5 spec and may not be 
    // supported in every browser.  It worked for me in Chrome.
    var extra = !col ? '' : '\ncolumn: ' + col;
    extra += !error ? '' : '\nerror: ' + error;

    // You can view the information in an alert to see things working like this:
    applicationStore.dispatch(new AddErrorInfoAction({ error, message: msg, url, line, col, info: { extra } }));

    var suppressErrorAlert = true;
    // If you return true, then error alerts (like in older versions of 
    // Internet Explorer) will be suppressed.
    return suppressErrorAlert;
  };

  startHistoryListener(applicationStore);

  const App = (): JSX.Element => (
    <ApplicationStoreProvider applicationStore={applicationStore} >
      <MuiThemeProvider theme={theme}>
        <Frame />
      </MuiThemeProvider>
    </ApplicationStoreProvider>
  );

  ReactDOM.render(<App />, document.getElementById('app'));
};