phlux/mattermostest
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Use React on main page

Browse Source
This commit is contained in:
Yuya Ochiai
2015-12-22 21:11:49 +09:00
parent 8c24475c68
commit e7d48d6d0d
2 changed files with 32 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
src/index.html
View File

@@ -3,25 +3,16 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Mattermost</title> <title>electron-mattermost</title>
<script src="node_modules/react/dist/react.min.js"></script>
<script src="node_modules/react-dom/dist/react-dom.min.js"></script>
<script src="node_modules/react-bootstrap/dist/react-bootstrap.min.js"></script>
<link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.min.css">
</head> </head>
<body> <body>
<!-- <div id="content"></div>
'disablewebsecurity' is necessary to display external images. <script src="build/index.js"></script>
However, it allows also CSS/JavaScript.
So webview should use 'allowDisplayingInsecureContent' as same as BrowserWindow.
-->
<webview id="mainWebview" autosize="on" preload="webview/mattermost.js"></webview>
<style>
webview {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
</style>
<script src="./index.js"></script> <script src="./index.js"></script>
</body> </body>

25
src/index.jsx Normal file
View File

@@ -0,0 +1,25 @@
'use strict';
var MainPage = React.createClass({
render: function() {
var style = {
position: 'absolute',
top: 0,
right: 0,
bottom: 0,
left: 0
};
// 'disablewebsecurity' is necessary to display external images.
// However, it allows also CSS/JavaScript.
// So webview should use 'allowDisplayingInsecureContent' as same as BrowserWindow.
return (
<webview style={ style } id="mainWebview" autosize="on" preload="webview/mattermost.js"></webview>
);
}
});
ReactDOM.render(
<MainPage />,
document.getElementById('content')
);