Image upload #18
There are no files selected for viewing
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,17 +1,45 @@ | ||
| const WindowManager = require('./window-manager') | ||
| const { app } = require('electron') | ||
|
|
||
| const dev = require('electron-is-dev') | ||
| const startServer = require('./server') | ||
| const setIPCEvents = require('./ipc-events') | ||
|
|
||
| class Main { | ||
| constructor () { | ||
| this.server = null | ||
| this._windowManager = new WindowManager() | ||
| } | ||
| get windowManager () { | ||
| return this._windowManager | ||
| } | ||
|
|
||
| async onReady () { | ||
| if (dev) { | ||
| try { | ||
| this.server = await startServer() | ||
| } catch (error) { | ||
| console.error(error) | ||
| app.exit(error) | ||
| } | ||
| } | ||
| this._windowManager.createNewWindow() | ||
| } | ||
|
|
||
| onWindowAllClosed () { | ||
| app.quit() | ||
| } | ||
| } | ||
| const main = new Main() | ||
|
|
||
| app.once('ready', () => { | ||
| main.onReady() | ||
| setIPCEvents() | ||
| }) | ||
|
|
||
| app.on('window-all-closed', () => { | ||
| if (process.platform !== 'darwin') { | ||
| main.onWindowAllClosed() | ||
| } | ||
| if (this.server) this.server.close() | ||
| }) |
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,27 @@ | ||
| const { ipcMain, BrowserWindow } = require('electron') | ||
| const createWindow = require('./actions/create-window') | ||
|
|
||
| class WindowManager { | ||
| constructor () { | ||
| this._windows = new Map() | ||
| ipcMain.on('create-new-window', this._onRequestCreateNewWindow.bind(this)) | ||
| } | ||
|
|
||
| reload () { | ||
| const w = BrowserWindow.getFocusedWindow() | ||
| if (w) { | ||
| w.reload() | ||
| } | ||
| } | ||
|
|
||
| createNewWindow (value = '', fileName = undefined) { | ||
| createWindow(this._windows, value, fileName) | ||
| } | ||
|
|
||
| _onRequestCreateNewWindow (event) { | ||
| this.createNewWindow() | ||
| event.sender.send('created-new-window') | ||
| } | ||
| } | ||
|
|
||
| module.exports = WindowManager |
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,57 @@ | ||
| // validate file format with a list of format supports imgur | ||
| let validateFile = (file) => { | ||
|
There was a problem hiding this comment. Use const, only use let if you realize you need to change this variable later (tip: never do it, use immutable code) |
||
| let imageFormat = ['jpeg', 'png', 'gif', 'peg', 'apng', 'tiff', 'pdf', 'xcf'] | ||
|
There was a problem hiding this comment. Use const, only use let if you realize you need to change this variable later (tip: never do it, use immutable code) |
||
| return imageFormat.filter((kind) => { | ||
| let res = new RegExp("\\b(" + kind + ")\\b") | ||
|
There was a problem hiding this comment. Use const, only use let if you realize you need to change this variable later (tip: never do it, use immutable code) |
||
| return res.test(file.type) | ||
| }) | ||
| } | ||
|
|
||
| // send file via XMLHTTP | ||
| let sendData = (_this, file) => { | ||
|
There was a problem hiding this comment. Use const, only use let if you realize you need to change this variable later (tip: never do it, use immutable code) |
||
| let fd = new FormData() | ||
|
There was a problem hiding this comment. Use const, only use let if you realize you need to change this variable later (tip: never do it, use immutable code) Be explicit, use formData not fd, fd doesn't say anything about what's inside |
||
| fd.append('image', file) | ||
| let xhttp = new XMLHttpRequest() | ||
|
There was a problem hiding this comment. Use const, only use let if you realize you need to change this variable later (tip: never do it, use immutable code) Use Fetch API not XMLHttpRequest |
||
| xhttp.open('POST', 'https://api.imgur.com/3/image', true) | ||
| xhttp.setRequestHeader('Authorization', `Client-ID e3f6a51d5c12580`) | ||
| xhttp.onreadystatechange = function () { | ||
| let response = '' | ||
| let event = {} | ||
| if (this.readyState === 4) { | ||
| if (this.status >= 200 && this.status < 300) { | ||
| try { | ||
| response = JSON.parse(this.responseText) | ||
| } catch (err) { | ||
| response = this.responseText; | ||
| } | ||
| event.target = { | ||
| value: `${_this.editor.domField.value} ` | ||
| } | ||
| // write response on editor | ||
| _this.editor.writeValue(event) | ||
| } else { | ||
| throw new Error(this.status + " - " + this.statusText) | ||
| } | ||
| } | ||
| } | ||
| xhttp.send(fd) | ||
| xhttp = null | ||
| } | ||
|
|
||
| let imageDrop = (e, _this) => { | ||
|
There was a problem hiding this comment. Use const, only use let if you realize you need to change this variable later (tip: never do it, use immutable code) |
||
| // without 'preventDefault', when you drop the image, change the whole editor view | ||
| e.preventDefault() | ||
|
There was a problem hiding this comment. Be explicit, use |
||
| let event = {} | ||
|
There was a problem hiding this comment. Use const, only use let if you realize you need to change this variable later (tip: never do it, use immutable code) |
||
| let file = e.dataTransfer.files[0] | ||
|
There was a problem hiding this comment. Use const, only use let if you realize you need to change this variable later (tip: never do it, use immutable code) |
||
| let valido = validateFile(file) | ||
|
There was a problem hiding this comment. Use const, only use let if you realize you need to change this variable later (tip: never do it, use immutable code) Code in english |
||
| if (!!valido && valido.length !== 0) { | ||
| sendData(_this, file) | ||
| } else { | ||
|
There was a problem hiding this comment. Don't use |
||
| event.target = { | ||
|
|
||
| value: `${_this.editor.domField.value} ` | ||
| } | ||
| // if file format doesn't support by imgur, advice the user | ||
| _this.editor.writeValue(event) | ||
| } | ||
| } | ||
| export default imageDrop | ||
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,48 @@ | ||
| import { Component } from 'react' | ||
| import { Base } from 'pulse-editor/buttons' | ||
| import { ipcRenderer } from 'electron' | ||
| import { func } from 'prop-types' | ||
| import isMac from 'pulse-editor/built/utils/is-mac' | ||
| import Icon from 'react-icons/lib/fa/plus-circle' | ||
|
|
||
| export default class CreateButton extends Component { | ||
| static contextTypes = { | ||
| setShortcut: func.isRequired, | ||
| removeShortcut: func.isRequired, | ||
| writeValue: func.isRequired, | ||
| setFileName: func.isRequired | ||
| } | ||
|
|
||
| componentDidMount () { | ||
| ipcRenderer.on('shortcut-press', this.createWindow) | ||
| this.context.setShortcut({ | ||
| ctrlKey: !isMac(), | ||
| metaKey: isMac(), | ||
| altKey: true, | ||
| shiftKey: false, | ||
| keyName: 'n', | ||
| updater: selected => selected, | ||
| handler: event => { | ||
| this.createWindow() | ||
| return event.selection | ||
| } | ||
| }) | ||
| } | ||
|
|
||
| componentWillUnmount () { | ||
| this.context.removeShortcut({ keyName: 'n' }) | ||
| ipcRenderer.removeListener('shortcut-press', this.createWindow) | ||
| } | ||
|
|
||
| createWindow = () => ipcRenderer.send('create-new-window') | ||
|
|
||
| handleClick = () => this.createWindow() | ||
|
|
||
| render = () => ( | ||
| <Base onClick={this.handleClick} name='open'> | ||
| <span title='New Window [CMD+ALT+N]'> | ||
| <Icon /> New Window | ||
| </span> | ||
| </Base> | ||
| ) | ||
| } |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This whole file is not a component, is a lib, move it to another directory.