mirrors/insomnia
1
0
Fork 0
mirror of https://github.com/Kong/insomnia synced 2024-11-07 14:19:58 +00:00
Code Issues Packages Projects Releases Wiki Activity

Electron working

Browse Source
This commit is contained in:
Gregory Schier 2016-03-22 11:20:05 -07:00
parent 633295f0b9
commit faf4796a1e
12 changed files with 141 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.gitignore vendored
View File

@ -1,3 +1,4 @@
node_modules
.idea
dist
npm-debug.log

15
app/components/UrlInput.js → app/components/RequestUrlBar.js
View File

@ -4,13 +4,16 @@ import Dropdown from './base/Dropdown';
import {METHODS} from '../constants/global';
class UrlInput extends Component {
shouldComponentUpdate(nextProps) {
return this.props.request.url !== nextProps.request.url;
}
render () {
const {onUrlChange, onMethodChange, urlValue, method} = this.props;
const {onUrlChange, onMethodChange, request} = this.props;
return (
<div className="grid form-control form-control--left form-control--right">
<Dropdown>
<button className="btn txt-lg">
{method}&nbsp;&nbsp;<i className="fa fa-caret-down"></i>
{request.method}&nbsp;&nbsp;<i className="fa fa-caret-down"></i>
</button>
<ul className="bg-super-light">
{METHODS.map((method) => (
@ -25,7 +28,7 @@ class UrlInput extends Component {
<Input type="text"
className="txt-lg"
placeholder="https://google.com"
initialValue={urlValue}
initialValue={request.url}
onChange={onUrlChange}/>
<button className="btn">
<i className="fa fa-repeat txt-xl"></i>
@ -38,8 +41,10 @@ class UrlInput extends Component {
UrlInput.propTypes = {
onUrlChange: PropTypes.func.isRequired,
onMethodChange: PropTypes.func.isRequired,
urlValue: PropTypes.string.isRequired,
method: PropTypes.string.isRequired
request: PropTypes.shape({
url: PropTypes.string.isRequired,
method: PropTypes.string.isRequired
}).isRequired
};
export default UrlInput;

7
app/containers/App.js
View File

@ -5,7 +5,7 @@ import {Tab, Tabs, TabList, TabPanel} from 'react-tabs';
import CodeEditor from '../components/base/Editor'
import RequestBodyEditor from '../components/RequestBodyEditor'
import UrlInput from '../components/UrlInput'
import RequestUrlBar from '../components/RequestUrlBar'
import Sidebar from '../components/Sidebar'
import * as RequestActions from '../actions/requests'
@ -29,11 +29,10 @@ class App extends Component {
<div className="grid grid-collapse">
<section id="request" className="pane col grid-v">
<header className="pane__header bg-super-light">
<UrlInput
<RequestUrlBar
onUrlChange={updateRequestUrl}
onMethodChange={updateRequestMethod}
method={activeRequest.method}
urlValue={activeRequest.url}/>
request={activeRequest}/>
</header>
<div className="pane__body grid-v">
<Tabs selectedIndex={0} className="grid-v">

4
app/css/components/response.scss
View File

@ -7,5 +7,9 @@
margin-top: -4px;
}
}
.pane__header, .pane__body {
border-right: 0;
}
}

4
app/css/components/sidebar.scss
View File

@ -8,6 +8,10 @@
overflow-y: auto;
}
.pane__header, .pane__body {
border-left: 0;
}
a {
box-sizing: border-box;
display: block;

17
app/electron.html Normal file
View File

@ -0,0 +1,17 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Insomnia REST Client</title>
</head>
<body>
<div id="root"></div>
<script>
(function () {
const script = document.createElement('script');
script.src = (process.env.HOT) ? 'http://localhost:3000/dist/bundle.js' : '../dist/bundle.js';
document.write(script.outerHTML);
}());
</script>
</body>
</html>

11
app/index.html
View File

@ -1,11 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Insomnia REST Client</title>
</head>
<body>
<div id="root"></div>
<script src="bundle.js"></script>
</body>
</html>

46
electron.js Normal file
View File

@ -0,0 +1,46 @@
'use strict';
// Don't npm install this (it breaks). Rely on the global one.
const electron = require('electron');
const app = electron.app; // Module to control application life.
const BrowserWindow = electron.BrowserWindow; // Module to create native browser window.
// Keep a global reference of the window object, if you don't, the window will
// be closed automatically when the JavaScript object is garbage collected.
var mainWindow = null;
// Quit when all windows are closed.
app.on('window-all-closed', function () {
// On OS X it is common for applications and their menu bar
// to stay active until the user quits explicitly with Cmd + Q
if (process.platform != 'darwin') {
app.quit();
}
});
// This method will be called when Electron has finished
// initialization and is ready to create browser windows.
app.on('ready', function () {
// Create the browser window.
mainWindow = new BrowserWindow({
width: process.env.NODE_ENV === 'development' ? 1600 : 1200,
height: 800
});
// and load the electron.html of the app.
mainWindow.loadURL(`file://${__dirname}/app/electron.html`);
// Open the DevTools.
if (process.env.NODE_ENV === 'development') {
mainWindow.webContents.openDevTools();
}
// Emitted when the window is closed.
mainWindow.on('closed', function () {
// Dereference the window object, usually you would store windows
// in an array if your app supports multi windows, this is the time
// when you should delete the corresponding element.
mainWindow = null;
});
});

13
package.json
View File

@ -29,7 +29,10 @@
"babel-polyfill": "^6.7.2",
"babel-preset-es2015": "^6.6.0",
"babel-preset-react": "^6.5.0",
"concurrently": "^2.0.0",
"css-loader": "^0.23.1",
"electron-prebuilt": "^0.37.2",
"express": "latest",
"file-loader": "^0.8.5",
"jest": "^0.1.40",
"jest-cli": "^0.9.2",
@ -40,10 +43,16 @@
"sass-loader": "^3.2.0",
"style-loader": "^0.13.0",
"url-loader": "^0.5.7",
"webpack-dev-server": "^1.14.1"
"webpack-dev-middleware": "latest",
"webpack-dev-server": "^1.14.1",
"webpack-hot-middleware": "^2.10.0",
"webpack-target-electron-renderer": "^0.4.0"
},
"scripts": {
"start": "node ./webpack/server.js",
"start": "electron electron/main.js",
"start-hot": "HOT=1 NODE_ENV=development electron electron.js",
"hot-server": "node ./webpack/server.js",
"dev": "concurrently --kill-others \"npm run hot-server\" \"npm run start-hot\"",
"test": "jest $@",
"package": "npm test && webpack --config webpack/prod.config.js"
},

5
webpack/base.config.js
View File

@ -7,7 +7,7 @@ module.exports = {
context: path.join(__dirname, '../app'),
entry: [
'./index.js',
'./index.html'
'./electron.html'
],
output: {
path: path.join(__dirname, '../dist'),
@ -52,6 +52,7 @@ module.exports = {
]
},
resolve: {
extensions: ['', '.js', '.jsx']
extensions: ['', '.js', '.jsx'],
packageMains: ['webpack', 'browser', 'web', 'browserify', ['jam', 'main'], 'main']
}
};

34
webpack/dev.config.js
View File

@ -1,28 +1,38 @@
var path = require('path');
var webpack = require('webpack');
var base = require('./prod.config');
var base = require('./base.config');
var webpackTargetElectronRenderer = require('webpack-target-electron-renderer');
base.entry = [
'webpack-dev-server/client?http://0.0.0.0:3000',
'webpack/hot/only-dev-server'
'webpack-hot-middleware/client?path=http://localhost:3000/__webpack_hmr',
'webpack/hot/only-dev-server'
].concat(base.entry);
base.devtool = 'eval'; // Fastest form of source maps
base.debug = true;
base.devtool = 'inline-source-maps';
base.output.path = path.join(base.output.path, '/dev');
base.output.publicPath = '/';
base.output.publicPath = 'http://localhost:3000/dist/';
for (var i = 0; i < base.module.loaders.length; i++) {
var loader = base.module.loaders[i];
if (loader.id === 'babel') {
loader.loaders = ['react-hot'].concat(loader.loaders);
break;
}
var loader = base.module.loaders[i];
if (loader.id === 'babel') {
loader.loaders = ['react-hot'].concat(loader.loaders);
break;
}
}
base.plugins = [new webpack.HotModuleReplacementPlugin()];
base.plugins = [
new webpack.HotModuleReplacementPlugin(),
new webpack.NoErrorsPlugin(),
new webpack.DefinePlugin({
__DEV__: true,
'process.env': {
NODE_ENV: JSON.stringify('development')
}
})
];
base.target = webpackTargetElectronRenderer(base);
module.exports = base;

33
webpack/server.js
View File

@ -1,19 +1,26 @@
var webpack = require('webpack');
var WebpackDevServer = require('webpack-dev-server');
var config = require('./dev.config.js');
'use strict';
new WebpackDevServer(webpack(config), {
const express = require('express');
const webpack = require('webpack');
const config = require('../webpack/dev.config');
const app = express();
const compiler = webpack(config);
const PORT = 3000;
app.use(require('webpack-dev-middleware')(compiler, {
publicPath: config.output.publicPath,
debug: true,
hot: true,
stats: {
colors: true
},
historyApiFallback: true
}).listen(3000, 'localhost', function (err, result) {
stats: {colors: true}
}));
app.use(require('webpack-hot-middleware')(compiler));
app.listen(PORT, 'localhost', err => {
if (err) {
return console.log(err);
console.log(err);
return;
}
console.log('Listening at http://localhost:3000/');
console.log(`Listening at http://localhost:${PORT}`);
});