diff --git a/app/main.development.js b/app/main.development.js index ebd60989f..3a2a0422d 100644 --- a/app/main.development.js +++ b/app/main.development.js @@ -3,6 +3,7 @@ if (reboot) { process.exit(0); } +import fs from 'fs'; import raven from 'raven'; import request from 'request'; import path from 'path'; @@ -507,7 +508,7 @@ function createWindow () { accelerator: "CmdOrCtrl+?", click: () => { trackEvent('App Menu', 'Help'); - shell.openExternal('https://insomnia.rest/documentation'); + shell.openExternal('https://insomnia.rest/documentation/'); } } ] @@ -530,6 +531,20 @@ function createWindow () { click: function () { mainWindow.toggleDevTools(); } + }, { + label: 'Resize to Default', + click: function () { + mainWindow.setBounds({x: 100, y: 100, width: 1000, height: 480}); + } + }, { + label: 'Take Screenshot', + click: function () { + mainWindow.capturePage(image => { + const buffer = image.toPNG(); + const dir = app.getPath('desktop'); + fs.writeFileSync(path.join(dir, `Screenshot-${new Date()}.png`), buffer); + }); + } }] }); } diff --git a/app/models/request.js b/app/models/request.js index 426a0cd43..821346ec1 100644 --- a/app/models/request.js +++ b/app/models/request.js @@ -16,7 +16,7 @@ export function init () { parameters: [], headers: [], authentication: {}, - metaSortKey: -1 * Date.now() + metaSortKey: -1 * Date.now(), }; } diff --git a/app/models/settings.js b/app/models/settings.js index 210ffbb7f..4d1c74a77 100644 --- a/app/models/settings.js +++ b/app/models/settings.js @@ -11,6 +11,7 @@ export function init () { followRedirects: true, editorFontSize: 12, editorLineWrapping: true, + editorKeyMap: 'default', httpProxy: '', httpsProxy: '', timeout: 0, diff --git a/app/static/themes/dark.png b/app/static/themes/dark.png index 7888eac68..31765ba46 100644 Binary files a/app/static/themes/dark.png and b/app/static/themes/dark.png differ diff --git a/app/static/themes/default.png b/app/static/themes/default.png index 5a33dd106..29693f6b5 100644 Binary files a/app/static/themes/default.png and b/app/static/themes/default.png differ diff --git a/app/static/themes/light.png b/app/static/themes/light.png index ad1729a54..dd10b48a4 100644 Binary files a/app/static/themes/light.png and b/app/static/themes/light.png differ diff --git a/app/static/themes/material.png b/app/static/themes/material.png index 53e096c80..d60733de9 100644 Binary files a/app/static/themes/material.png and b/app/static/themes/material.png differ diff --git a/app/static/themes/purple.png b/app/static/themes/purple.png index d16d0614b..f2c9feb0b 100644 Binary files a/app/static/themes/purple.png and b/app/static/themes/purple.png differ diff --git a/app/static/themes/railscasts.png b/app/static/themes/railscasts.png index 7d4b76e61..cc71934ea 100644 Binary files a/app/static/themes/railscasts.png and b/app/static/themes/railscasts.png differ diff --git a/app/static/themes/solarized-dark.png b/app/static/themes/solarized-dark.png index fea9a213e..ffd02ac51 100644 Binary files a/app/static/themes/solarized-dark.png and b/app/static/themes/solarized-dark.png differ diff --git a/app/static/themes/solarized-light.png b/app/static/themes/solarized-light.png index 4a1a83ed6..667bf22ff 100644 Binary files a/app/static/themes/solarized-light.png and b/app/static/themes/solarized-light.png differ diff --git a/app/static/themes/solarized.png b/app/static/themes/solarized.png index d93168c4b..ca55a9be5 100644 Binary files a/app/static/themes/solarized.png and b/app/static/themes/solarized.png differ diff --git a/app/ui/components/RequestPane.js b/app/ui/components/RequestPane.js index 21455af8f..274f5e902 100644 --- a/app/ui/components/RequestPane.js +++ b/app/ui/components/RequestPane.js @@ -68,6 +68,7 @@ class RequestPane extends PureComponent { environmentId, showPasswords, editorFontSize, + editorKeyMap, editorLineWrapping, handleSend, forceRefreshCounter, @@ -189,6 +190,7 @@ class RequestPane extends PureComponent { request={request} onChange={updateRequestBody} fontSize={editorFontSize} + keyMap={editorKeyMap} lineWrapping={editorLineWrapping} /> @@ -293,6 +295,7 @@ RequestPane.propTypes = { useBulkHeaderEditor: PropTypes.bool.isRequired, showPasswords: PropTypes.bool.isRequired, editorFontSize: PropTypes.number.isRequired, + editorKeyMap: PropTypes.string.isRequired, editorLineWrapping: PropTypes.bool.isRequired, workspace: PropTypes.object.isRequired, environmentId: PropTypes.string.isRequired, diff --git a/app/ui/components/ResponsePane.js b/app/ui/components/ResponsePane.js index 6f3fa9169..cecbb79cb 100644 --- a/app/ui/components/ResponsePane.js +++ b/app/ui/components/ResponsePane.js @@ -91,6 +91,7 @@ class ResponsePane extends Component { loadStartTime, editorLineWrapping, editorFontSize, + editorKeyMap, filter, activeResponseId, showCookiesModal @@ -230,6 +231,7 @@ class ResponsePane extends Component { responseId={response._id} editorLineWrapping={editorLineWrapping} editorFontSize={editorFontSize} + editorKeyMap={editorKeyMap} url={response.url} /> @@ -268,6 +270,7 @@ ResponsePane.propTypes = { previewMode: PropTypes.string.isRequired, filter: PropTypes.string.isRequired, editorFontSize: PropTypes.number.isRequired, + editorKeyMap: PropTypes.string.isRequired, editorLineWrapping: PropTypes.bool.isRequired, loadStartTime: PropTypes.number.isRequired, activeResponseId: PropTypes.string.isRequired, diff --git a/app/ui/components/Wrapper.js b/app/ui/components/Wrapper.js index 633bb635a..7b2f71b49 100644 --- a/app/ui/components/Wrapper.js +++ b/app/ui/components/Wrapper.js @@ -230,6 +230,7 @@ class Wrapper extends Component { showPasswords={settings.showPasswords} useBulkHeaderEditor={settings.useBulkHeaderEditor} editorFontSize={settings.editorFontSize} + editorKeyMap={settings.editorKeyMap} editorLineWrapping={settings.editorLineWrapping} environmentId={activeEnvironment ? activeEnvironment._id : 'n/a'} workspace={activeWorkspace} @@ -257,6 +258,7 @@ class Wrapper extends Component { ref={handleSetResponsePaneRef} request={activeRequest} editorFontSize={settings.editorFontSize} + editorKeyMap={settings.editorKeyMap} editorLineWrapping={settings.editorLineWrapping} previewMode={responsePreviewMode} activeResponseId={activeResponseId} @@ -287,12 +289,14 @@ class Wrapper extends Component { ) diff --git a/app/ui/components/base/Editor.js b/app/ui/components/base/Editor.js index ecc9978ac..f24c9e10d 100644 --- a/app/ui/components/base/Editor.js +++ b/app/ui/components/base/Editor.js @@ -39,6 +39,9 @@ import 'codemirror/addon/display/placeholder'; import 'codemirror/addon/lint/lint'; import 'codemirror/addon/lint/json-lint'; import 'codemirror/addon/lint/lint.css'; +import 'codemirror/keymap/vim'; +import 'codemirror/keymap/emacs'; +import 'codemirror/keymap/sublime'; import '../../css/components/editor.less'; import {showModal} from '../modals/index'; import AlertModal from '../modals/AlertModal'; @@ -60,6 +63,7 @@ const BASE_CODEMIRROR_OPTIONS = { autoCloseBrackets: true, indentUnit: 4, indentWithTabs: true, + keyMap: 'default', gutters: [ 'CodeMirror-linenumbers', 'CodeMirror-foldgutter', @@ -222,7 +226,8 @@ class Editor extends Component { readOnly, placeholder: this.props.placeholder || '', mode: this.props.mode || 'text/plain', - lineWrapping: !!this.props.lineWrapping, + lineWrapping: this.props.lineWrapping, + keyMap: this.props.keyMap || 'default', matchBrackets: !readOnly, lint: !readOnly }; @@ -437,6 +442,7 @@ class Editor extends Component { Editor.propTypes = { onChange: PropTypes.func, onFocusChange: PropTypes.func, + keyMap: PropTypes.string, mode: PropTypes.string, placeholder: PropTypes.string, lineWrapping: PropTypes.bool, diff --git a/app/ui/components/editors/EnvironmentEditor.js b/app/ui/components/editors/EnvironmentEditor.js index adfba0afc..db5693a2f 100644 --- a/app/ui/components/editors/EnvironmentEditor.js +++ b/app/ui/components/editors/EnvironmentEditor.js @@ -22,12 +22,13 @@ class EnvironmentEditor extends Component { } render () { - const {environment, editorFontSize, ...props} = this.props; + const {environment, editorFontSize, editorKeyMap, ...props} = this.props; return ( this._envEditor = node} key={requestGroup ? requestGroup._id : 'n/a'} environment={requestGroup ? requestGroup.environment : {}} @@ -77,6 +78,7 @@ class EnvironmentEditModal extends Component { EnvironmentEditModal.propTypes = { onChange: PropTypes.func.isRequired, editorFontSize: PropTypes.number.isRequired, + editorKeyMap: PropTypes.string.isRequired, }; export default EnvironmentEditModal; diff --git a/app/ui/components/modals/GenerateCodeModal.js b/app/ui/components/modals/GenerateCodeModal.js index 5d125dd71..de87aac26 100644 --- a/app/ui/components/modals/GenerateCodeModal.js +++ b/app/ui/components/modals/GenerateCodeModal.js @@ -95,7 +95,7 @@ class GenerateCodeModal extends Component { render () { const {cmd, target, client} = this.state; - const {editorFontSize} = this.props; + const {editorFontSize, editorKeyMap} = this.props; const targets = availableTargets(); @@ -147,6 +147,7 @@ class GenerateCodeModal extends Component { mode={MODE_MAP[target.key] || target.key} ref={n => this._editor = n} fontSize={editorFontSize} + keyMap={editorKeyMap} lightTheme={true} lineWrapping={true} value={cmd} @@ -168,6 +169,7 @@ class GenerateCodeModal extends Component { GenerateCodeModal.propTypes = { environmentId: PropTypes.string.isRequired, editorFontSize: PropTypes.number.isRequired, + editorKeyMap: PropTypes.string.isRequired, }; export default GenerateCodeModal; diff --git a/app/ui/components/modals/WorkspaceEnvironmentsEditModal.js b/app/ui/components/modals/WorkspaceEnvironmentsEditModal.js index c1a3c5e0e..8f2cfeafb 100644 --- a/app/ui/components/modals/WorkspaceEnvironmentsEditModal.js +++ b/app/ui/components/modals/WorkspaceEnvironmentsEditModal.js @@ -139,7 +139,7 @@ class WorkspaceEnvironmentsEditModal extends Component { } render () { - const {editorFontSize} = this.props; + const {editorFontSize, editorKeyMap} = this.props; const {subEnvironments, rootEnvironment, isValid, forceRefreshKey} = this.state; const activeEnvironment = this._getActiveEnvironment(); @@ -201,6 +201,7 @@ class WorkspaceEnvironmentsEditModal extends Component {
this._envEditor = n} key={`${forceRefreshKey}::${(activeEnvironment ? activeEnvironment._id : 'n/a')}`} environment={activeEnvironment ? activeEnvironment.data : {}} @@ -230,6 +231,7 @@ class WorkspaceEnvironmentsEditModal extends Component { WorkspaceEnvironmentsEditModal.propTypes = { onChange: PropTypes.func.isRequired, editorFontSize: PropTypes.number.isRequired, + editorKeyMap: PropTypes.string.isRequired, }; export default WorkspaceEnvironmentsEditModal; diff --git a/app/ui/components/settings/SettingsGeneral.js b/app/ui/components/settings/SettingsGeneral.js index e564e49d8..6f3715d96 100644 --- a/app/ui/components/settings/SettingsGeneral.js +++ b/app/ui/components/settings/SettingsGeneral.js @@ -51,20 +51,32 @@ const SettingsGeneral = ({settings, updateSetting}) => (
-
+
+ +
+
diff --git a/app/ui/components/viewers/ResponseViewer.js b/app/ui/components/viewers/ResponseViewer.js index 1d06ba686..af1eeb815 100644 --- a/app/ui/components/viewers/ResponseViewer.js +++ b/app/ui/components/viewers/ResponseViewer.js @@ -65,6 +65,7 @@ class ResponseViewer extends Component { contentType, editorLineWrapping, editorFontSize, + editorKeyMap, updateFilter, statusCode, body: base64Body, @@ -156,6 +157,7 @@ class ResponseViewer extends Component { readOnly={true} lineWrapping={editorLineWrapping} fontSize={editorFontSize} + keyMap={editorKeyMap} placeholder="..." /> ); @@ -176,6 +178,7 @@ ResponseViewer.propTypes = { previewMode: PropTypes.string.isRequired, filter: PropTypes.string.isRequired, editorFontSize: PropTypes.number.isRequired, + editorKeyMap: PropTypes.string.isRequired, editorLineWrapping: PropTypes.bool.isRequired, url: PropTypes.string.isRequired, bytes: PropTypes.number.isRequired, diff --git a/app/ui/css/components/editor.less b/app/ui/css/components/editor.less index 70dc5c145..510358707 100644 --- a/app/ui/css/components/editor.less +++ b/app/ui/css/components/editor.less @@ -140,108 +140,113 @@ } /* Based on Sublime Text's Monokai theme */ -.editor { - .cm-s-default.CodeMirror { - color: var(--color-font); - } +.CodeMirror { + color: var(--color-font); - .cm-s-default div.CodeMirror-selected { + div.CodeMirror-selected { background: @hl-md; border-radius: 2px; } - .cm-s-default .CodeMirror-gutters { + .CodeMirror-gutters { border-right: 0; } - .cm-s-default .CodeMirror-guttermarker { + .CodeMirror-guttermarker { color: var(--color-font); } - .cm-s-default .CodeMirror-guttermarker-subtle { + .CodeMirror-guttermarker-subtle { color: @hl-lg; } - .cm-s-default .CodeMirror-linenumber { + .CodeMirror-linenumber { color: @hl; } - .cm-s-default .CodeMirror-cursor { + .CodeMirror-cursor { border-left: 1px solid var(--color-font); } - .cm-s-default span.cm-comment, - .cm-s-default span.cm-meta, - .cm-s-default span.cm-qualifier { + .cm-animate-fat-cursor, + &.cm-fat-cursor .CodeMirror-cursor { + background-color: rgba(255, 139, 147, 0.5) !important; + border-bottom: 2px solid #d60000 !important; + box-sizing: border-box; + } + + span.cm-comment, + span.cm-meta, + span.cm-qualifier { color: var(--color-font); } - .cm-s-default span.cm-atom { + span.cm-atom { color: var(--color-surprise); } - .cm-s-default span.cm-number { + span.cm-number { color: var(--color-surprise); } - .cm-s-default span.cm-keyword { + span.cm-keyword { color: var(--color-danger); } - .cm-s-default span.cm-builtin { + span.cm-builtin { color: var(--color-info); } - .cm-s-default span.cm-string { + span.cm-string { color: var(--color-notice); } - .cm-s-default span.cm-property, .cm-s-default span.cm-attribute { + span.cm-property, span.cm-attribute { color: var(--color-success); } - .cm-s-default span.cm-variable { + span.cm-variable { color: var(--color-font); } - .cm-s-default span.cm-variable-2 { + span.cm-variable-2 { color: var(--color-info); } - .cm-s-default span.cm-variable-3 { + span.cm-variable-3 { color: var(--color-info); } - .cm-s-default span.cm-def { + span.cm-def { color: var(--color-warning); } - .cm-s-default span.cm-bracket { + span.cm-bracket { color: var(--color-font); } - .cm-s-default span.cm-tag { + span.cm-tag { color: var(--color-danger); } - .cm-s-default span.cm-header { + span.cm-header { color: var(--color-surprise); } - .cm-s-default span.cm-link { + span.cm-link { color: var(--color-surprise); } - .cm-s-default span.cm-error { + span.cm-error { background: var(--color-danger); color: var(--color-font-danger); } - .cm-s-default .CodeMirror-activeline-background { + .CodeMirror-activeline-background { background: @hl-md; } - .cm-s-default .CodeMirror-matchingbracket { + .CodeMirror-matchingbracket { text-decoration: underline; color: inherit !important; } diff --git a/app/ui/css/components/sidebar.less b/app/ui/css/components/sidebar.less index 4d1c14e57..8e95609f9 100644 --- a/app/ui/css/components/sidebar.less +++ b/app/ui/css/components/sidebar.less @@ -228,13 +228,11 @@ color: @hl; .tag { - opacity: 1; + // This might be too faint... + //opacity: @opacity-subtle; } } - & > .tag { - } - & > * { height: 100%; } @@ -245,6 +243,7 @@ &.sidebar__item--active > button { color: var(--color-font); + .tag { opacity: 1; }