Mirrors/responsively-app
2
0
Fork 0
mirror of https://github.com/responsively-org/responsively-app synced 2024-09-20 14:21:54 +00:00
Code Issues Projects Releases Packages Wiki Activity

Improvement address bar interaction and changes app name

Browse source
This commit is contained in:
Manoj Vivek 2019-08-11 13:25:58 +05:30
parent 80309858f6
commit 8a079e548b
4 changed files with 95 additions and 111 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
desktop-app/app/components/Addressinput/index.js
View file

@ -33,6 +33,7 @@ class AddressBar extends React.Component<Props> {
className={styles.addressInput}
placeholder="https://your-website.com"
value={this.state.userTypedAddress || this.props.address}
onKeyDown={this._handleKeyDown}
onChange={e => this.setState({userTypedAddress: e.target.value})}
/>
<button className={styles.goButton} onClick={this._onChange}>
@ -42,9 +43,25 @@ class AddressBar extends React.Component<Props> {
);
}
_handleKeyDown = e => {
if (e.key === 'Enter') {
this._onChange();
}
};
_onChange = () => {
console.log('in _onChange', this.props.onChange);
this.props.onChange && this.props.onChange(this.state.userTypedAddress);
if (!this.state.userTypedAddress) {
return;
}
this.props.onChange &&
this.props.onChange(this._normalize(this.state.userTypedAddress));
};
_normalize = address => {
if (!address.startsWith('http')) {
address = 'https://' + address;
}
return address;
};
}

4
desktop-app/app/components/Renderer/index.js
View file

@ -9,7 +9,7 @@ class Renderer extends Component {
console.log('Renderer this.props', this.props);
return (
<div className={cx(styles.container)}>
<h2>{this.props.device.name}</h2>
<h3>{this.props.device.name}</h3>
<div
className={cx(styles.deviceWrapper)}
style={{
@ -20,7 +20,7 @@ class Renderer extends Component {
<webview
className={cx(styles.device)}
title={this.props.device.name}
src={this.props.src}
src={this.props.src || 'about:blank'}
width={this.props.device.width}
height={this.props.device.height}
style={{

126
desktop-app/app/menu.js
View file

@ -1,5 +1,5 @@
// @flow
import { app, Menu, shell, BrowserWindow } from 'electron';
import {app, Menu, shell, BrowserWindow} from 'electron';
export default class MenuBuilder {
mainWindow: BrowserWindow;
@ -30,15 +30,15 @@ export default class MenuBuilder {
setupDevelopmentEnvironment() {
this.mainWindow.openDevTools();
this.mainWindow.webContents.on('context-menu', (e, props) => {
const { x, y } = props;
const {x, y} = props;
Menu.buildFromTemplate([
{
label: 'Inspect element',
click: () => {
this.mainWindow.inspectElement(x, y);
}
}
},
},
]).popup(this.mainWindow);
});
}
@ -48,48 +48,48 @@ export default class MenuBuilder {
label: 'Electron',
submenu: [
{
label: 'About ElectronReact',
selector: 'orderFrontStandardAboutPanel:'
label: 'About ResponsivelyApp',
selector: 'orderFrontStandardAboutPanel:',
},
{ type: 'separator' },
{ label: 'Services', submenu: [] },
{ type: 'separator' },
{type: 'separator'},
{label: 'Services', submenu: []},
{type: 'separator'},
{
label: 'Hide ElectronReact',
label: 'Hide ResponsivelyApp',
accelerator: 'Command+H',
selector: 'hide:'
selector: 'hide:',
},
{
label: 'Hide Others',
accelerator: 'Command+Shift+H',
selector: 'hideOtherApplications:'
selector: 'hideOtherApplications:',
},
{ label: 'Show All', selector: 'unhideAllApplications:' },
{ type: 'separator' },
{label: 'Show All', selector: 'unhideAllApplications:'},
{type: 'separator'},
{
label: 'Quit',
accelerator: 'Command+Q',
click: () => {
app.quit();
}
}
]
},
},
],
};
const subMenuEdit = {
label: 'Edit',
submenu: [
{ label: 'Undo', accelerator: 'Command+Z', selector: 'undo:' },
{ label: 'Redo', accelerator: 'Shift+Command+Z', selector: 'redo:' },
{ type: 'separator' },
{ label: 'Cut', accelerator: 'Command+X', selector: 'cut:' },
{ label: 'Copy', accelerator: 'Command+C', selector: 'copy:' },
{ label: 'Paste', accelerator: 'Command+V', selector: 'paste:' },
{label: 'Undo', accelerator: 'Command+Z', selector: 'undo:'},
{label: 'Redo', accelerator: 'Shift+Command+Z', selector: 'redo:'},
{type: 'separator'},
{label: 'Cut', accelerator: 'Command+X', selector: 'cut:'},
{label: 'Copy', accelerator: 'Command+C', selector: 'copy:'},
{label: 'Paste', accelerator: 'Command+V', selector: 'paste:'},
{
label: 'Select All',
accelerator: 'Command+A',
selector: 'selectAll:'
}
]
selector: 'selectAll:',
},
],
};
const subMenuViewDev = {
label: 'View',
@ -99,23 +99,23 @@ export default class MenuBuilder {
accelerator: 'Command+R',
click: () => {
this.mainWindow.webContents.reload();
}
},
},
{
label: 'Toggle Full Screen',
accelerator: 'Ctrl+Command+F',
click: () => {
this.mainWindow.setFullScreen(!this.mainWindow.isFullScreen());
}
},
},
{
label: 'Toggle Developer Tools',
accelerator: 'Alt+Command+I',
click: () => {
this.mainWindow.toggleDevTools();
}
}
]
},
},
],
};
const subMenuViewProd = {
label: 'View',
@ -125,9 +125,9 @@ export default class MenuBuilder {
accelerator: 'Ctrl+Command+F',
click: () => {
this.mainWindow.setFullScreen(!this.mainWindow.isFullScreen());
}
}
]
},
},
],
};
const subMenuWindow = {
label: 'Window',
@ -135,12 +135,12 @@ export default class MenuBuilder {
{
label: 'Minimize',
accelerator: 'Command+M',
selector: 'performMiniaturize:'
selector: 'performMiniaturize:',
},
{ label: 'Close', accelerator: 'Command+W', selector: 'performClose:' },
{ type: 'separator' },
{ label: 'Bring All to Front', selector: 'arrangeInFront:' }
]
{label: 'Close', accelerator: 'Command+W', selector: 'performClose:'},
{type: 'separator'},
{label: 'Bring All to Front', selector: 'arrangeInFront:'},
],
};
const subMenuHelp = {
label: 'Help',
@ -149,7 +149,7 @@ export default class MenuBuilder {
label: 'Learn More',
click() {
shell.openExternal('http://electron.atom.io');
}
},
},
{
label: 'Documentation',
@ -157,21 +157,21 @@ export default class MenuBuilder {
shell.openExternal(
'https://github.com/atom/electron/tree/master/docs#readme'
);
}
},
},
{
label: 'Community Discussions',
click() {
shell.openExternal('https://discuss.atom.io/c/electron');
}
},
},
{
label: 'Search Issues',
click() {
shell.openExternal('https://github.com/atom/electron/issues');
}
}
]
},
},
],
};
const subMenuView =
@ -187,16 +187,16 @@ export default class MenuBuilder {
submenu: [
{
label: '&Open',
accelerator: 'Ctrl+O'
accelerator: 'Ctrl+O',
},
{
label: '&Close',
accelerator: 'Ctrl+W',
click: () => {
this.mainWindow.close();
}
}
]
},
},
],
},
{
label: '&View',
@ -208,7 +208,7 @@ export default class MenuBuilder {
accelerator: 'Ctrl+R',
click: () => {
this.mainWindow.webContents.reload();
}
},
},
{
label: 'Toggle &Full Screen',
@ -217,15 +217,15 @@ export default class MenuBuilder {
this.mainWindow.setFullScreen(
!this.mainWindow.isFullScreen()
);
}
},
},
{
label: 'Toggle &Developer Tools',
accelerator: 'Alt+Ctrl+I',
click: () => {
this.mainWindow.toggleDevTools();
}
}
},
},
]
: [
{
@ -235,9 +235,9 @@ export default class MenuBuilder {
this.mainWindow.setFullScreen(
!this.mainWindow.isFullScreen()
);
}
}
]
},
},
],
},
{
label: 'Help',
@ -246,7 +246,7 @@ export default class MenuBuilder {
label: 'Learn More',
click() {
shell.openExternal('http://electron.atom.io');
}
},
},
{
label: 'Documentation',
@ -254,22 +254,22 @@ export default class MenuBuilder {
shell.openExternal(
'https://github.com/atom/electron/tree/master/docs#readme'
);
}
},
},
{
label: 'Community Discussions',
click() {
shell.openExternal('https://discuss.atom.io/c/electron');
}
},
},
{
label: 'Search Issues',
click() {
shell.openExternal('https://github.com/atom/electron/issues');
}
}
]
}
},
},
],
},
];
return templateDefault;

55
desktop-app/package.json
View file

@ -1,8 +1,8 @@
{
"name": "electron-react-boilerplate",
"productName": "ElectronReact",
"name": "Responsively-App",
"productName": "ResponsivelyApp",
"version": "0.17.1",
"description": "Electron application boilerplate based on React, React Router, Webpack, React Hot Loader for rapid application development",
"description": "A developer-friendly browser for developing responsive web apps",
"scripts": {
"build": "concurrently \"yarn build-main\" \"yarn build-renderer\"",
"build-dll": "cross-env NODE_ENV=development webpack --config ./configs/webpack.config.renderer.dev.dll.babel.js --colors",
@ -57,8 +57,8 @@
},
"main": "./app/main.prod.js",
"build": {
"productName": "ElectronReact",
"appId": "org.develar.ElectronReact",
"productName": "ResponsivelyApp",
"appId": "app.ResponsivelyApp",
"files": [
"app/dist/",
"app/app.html",
@ -106,43 +106,13 @@
"private": false
}
},
"repository": {
"type": "git",
"url": "git+https://github.com/electron-react-boilerplate/electron-react-boilerplate.git"
},
"author": {
"name": "Electron React Boilerplte Maintainers",
"email": "electronreactboilerplate@gmail.com",
"url": "https://electron-react-boilerplate.js.org"
},
"contributors": [
{
"name": "Vikram Rangaraj",
"email": "vikr01@icloud.com",
"url": "https://github.com/vikr01"
},
{
"name": "Amila Welihinda",
"email": "amilajack@gmail.com",
"url": "https://github.com/amilajack"
}
],
"repository": {},
"author": {},
"contributors": [],
"license": "MIT",
"bugs": {
"url": "https://github.com/electron-react-boilerplate/electron-react-boilerplate/issues"
},
"keywords": [
"electron",
"boilerplate",
"react",
"redux",
"flow",
"sass",
"webpack",
"hot",
"reload"
],
"homepage": "https://github.com/electron-react-boilerplate/electron-react-boilerplate#readme",
"bugs": {},
"keywords": [],
"homepage": "",
"jest": {
"testURL": "http://localhost/",
"moduleNameMapper": {
@ -279,8 +249,5 @@
"npm": ">=4.x",
"yarn": ">=0.21.3"
},
"collective": {
"url": "https://opencollective.com/electron-react-boilerplate-594"
},
"browserslist": "electron 1.6"
}