Skip to content

Commit

Permalink
Merge pull request #354 from emqx/dev/1.4.0
Browse files Browse the repository at this point in the history
Dev/1.4.0
  • Loading branch information
CrazyWisdom authored Nov 11, 2020
2 parents 642289b + 92f3d6b commit 336af3d
Show file tree
Hide file tree
Showing 29 changed files with 4,325 additions and 3,123 deletions.
34 changes: 26 additions & 8 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "MQTTX",
"version": "1.3.4",
"version": "1.4.0",
"description": "MQTT desktop client",
"author": "EMQ X Team",
"scripts": {
Expand All @@ -19,23 +19,27 @@
"dependencies": {
"axios": "^0.19.0",
"core-js": "^2.6.11",
"csvtojson": "^2.0.10",
"element-ui": "^2.13.0",
"fs-extra": "^8.1.0",
"json2csv": "^5.0.3",
"jump.js": "^1.0.2",
"lodash-id": "^0.14.0",
"lowdb": "^1.0.0",
"moment": "^2.24.0",
"monaco-editor": "^0.20.0",
"mqtt": "^4.2.1",
"vue": "^2.6.10",
"vue": "^2.6.12",
"vue-class-component": "^7.0.2",
"vue-click-outside": "^1.1.0",
"vue-clipboard2": "^0.3.1",
"vue-i18n": "^8.11.2",
"vue-property-decorator": "^8.1.0",
"vue-router": "^3.0.3",
"vue-property-decorator": "^8.5.1",
"vue-router": "^3.4.9",
"vuex": "^3.0.1",
"vuex-class": "^0.3.2"
"vuex-class": "^0.3.2",
"xlsx": "^0.16.8",
"xml-js": "^1.6.11"
},
"devDependencies": {
"@fullhuman/postcss-purgecss": "^2.1.0",
Expand All @@ -46,6 +50,7 @@
"@types/lodash": "^4.14.142",
"@types/lowdb": "^1.0.9",
"@types/mocha": "^5.2.7",
"@types/node": "^12.12.6",
"@typescript-eslint/eslint-plugin": "^3.8.0",
"@typescript-eslint/parser": "^3.8.0",
"@vue/cli-plugin-babel": "^3.12.1",
Expand All @@ -57,17 +62,19 @@
"@vue/test-utils": "1.0.0-beta.29",
"babel-plugin-component": "^1.1.1",
"chai": "^4.1.2",
"electron": "^5.0.0",
"electron": "^5.0.13",
"eslint": "6.5.1",
"eslint-config-prettier": "^6.11.0",
"eslint-plugin-prettier": "^3.1.4",
"husky": "^4.3.0",
"lint-staged": "^10.4.2",
"monaco-editor-webpack-plugin": "^1.9.0",
"node-sass": "^4.13.1",
"prettier": "^2.0.5",
"sass-loader": "^7.3.1",
"typescript": "^3.7.4",
"vue-cli-plugin-electron-builder": "^1.4.4",
"vue-template-compiler": "^2.6.10"
"vue-cli-plugin-electron-builder": "^1.4.6",
"vue-template-compiler": "^2.6.12"
},
"postcss": {
"plugins": {
Expand All @@ -78,6 +85,17 @@
"> 1%",
"last 2 versions"
],
"husky": {
"hooks": {
"pre-commit": "lint-staged"
}
},
"lint-staged": {
"*.{vue,ts,js,scss}": [
"prettier --write \"src/**/*.ts\" \"src/**/*.vue\" \"src/**/*.scss\"",
"git add"
]
},
"license": "Apache",
"repository": "https://github.com/emqx/MQTTX"
}
165 changes: 164 additions & 1 deletion public/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -6,12 +6,175 @@
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title>MQTTX</title>
<style>
html,
body,
#app {
height: 100%;
margin: 0;
padding: 0;
}
.content-box {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
@keyframes loading-animate {
0% {
opacity: 1;
transform: translateZ(0) scale(1.5, 1.5);
}
100% {
opacity: 0;
transform: translateZ(0) scale(1, 1);
}
}
.loading-inner-box div > div {
position: absolute;
width: 16px;
height: 16px;
border-radius: 50%;
background: #34c388;
-webkit-animation: loading-animate 1s linear infinite;
animation: loading-animate 1s linear infinite;
}
.loading-inner-box div:nth-child(1) > div {
left: 234px;
top: 144px;
animation-delay: -0.9s;
}
.loading-inner-box > div:nth-child(1) {
transform: rotate(0deg);
transform-origin: 240px 150px;
}
.loading-inner-box div:nth-child(2) > div {
left: 217px;
top: 197px;
animation-delay: -0.8s;
}
.loading-inner-box > div:nth-child(2) {
transform: rotate(36deg);
transform-origin: 223px 203px;
}
.loading-inner-box div:nth-child(3) > div {
left: 172px;
top: 230px;
animation-delay: -0.7s;
}
.loading-inner-box > div:nth-child(3) {
transform: rotate(72deg);
transform-origin: 178px 236px;
}
.loading-inner-box div:nth-child(4) > div {
left: 116px;
top: 230px;
animation-delay: -0.6s;
}
.loading-inner-box > div:nth-child(4) {
transform: rotate(108deg);
transform-origin: 122px 236px;
}
.loading-inner-box div:nth-child(5) > div {
left: 71px;
top: 197px;
animation-delay: -0.5s;
}
.loading-inner-box > div:nth-child(5) {
transform: rotate(144deg);
transform-origin: 77px 203px;
}
.loading-inner-box div:nth-child(6) > div {
left: 54px;
top: 144px;
animation-delay: -0.4s;
}
.loading-inner-box > div:nth-child(6) {
transform: rotate(180deg);
transform-origin: 60px 150px;
}
.loading-inner-box div:nth-child(7) > div {
left: 71px;
top: 91px;
animation-delay: -0.3s;
}
.loading-inner-box > div:nth-child(7) {
transform: rotate(216deg);
transform-origin: 77px 97px;
}
.loading-inner-box div:nth-child(8) > div {
left: 116px;
top: 58px;
animation-delay: -0.2s;
}
.loading-inner-box > div:nth-child(8) {
transform: rotate(252deg);
transform-origin: 122px 64px;
}
.loading-inner-box div:nth-child(9) > div {
left: 172px;
top: 58px;
animation-delay: -0.1s;
}
.loading-inner-box > div:nth-child(9) {
transform: rotate(288deg);
transform-origin: 178px 64px;
}
.loading-inner-box div:nth-child(10) > div {
left: 217px;
top: 91px;
animation-delay: 0s;
}
.loading-inner-box > div:nth-child(10) {
transform: rotate(324deg);
transform-origin: 223px 97px;
}
.loading-wrapper {
width: 300px;
height: 300px;
display: inline-block;
overflow: hidden;
background: url('./app.png') no-repeat;
background-size: 32% 32%;
background-position: 50%;
}
.loading-inner-box {
width: 100%;
height: 100%;
position: relative;
transform: translateZ(0) scale(1);
backface-visibility: hidden;
transform-origin: 0 0;
}
.loading-inner-box div {
box-sizing: content-box;
}
</style>
</head>
<body>
<noscript>
<strong>We're sorry but mqttx doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<div id="app">
<div class="content-box">
<div class="loading-wrapper">
<div class="loading-inner-box">
<div><div></div></div>
<div><div></div></div>
<div><div></div></div>
<div><div></div></div>
<div><div></div></div>
<div><div></div></div>
<div><div></div></div>
<div><div></div></div>
<div><div></div></div>
<div><div></div></div>
</div>
</div>
</div>
</div>
<!-- built files will be auto injected -->
</body>
</html>
23 changes: 23 additions & 0 deletions src/assets/scss/connections.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
.connections {
.titlebar {
padding: 16px;
}
}
.leftList {
position: fixed;
width: 260px;
left: 81px;
top: 0;
bottom: 0;
overflow-x: hidden;
z-index: 1000;
border-right: 1px solid var(--color-border-default);
background-color: var(--color-bg-primary);
.no-data {
text-align: center;
position: absolute;
top: 45%;
left: 40%;
color: var(--color-text-light);
}
}
6 changes: 3 additions & 3 deletions src/assets/scss/theme/light.scss
Original file line number Diff line number Diff line change
Expand Up @@ -22,8 +22,8 @@ body.light {
--color-text-light: #a2a9b0;
--color-text-tips: #b4b4b4;
--color-text-right_block: #34c388;
--color-text-right_info: #ade7cf;
--color-text-left_info: #959599;
--color-text-right_info: #ffffffde;
--color-text-left_info: #00000075;

/* Accent color */
--color-main-green: #34c388;
Expand All @@ -32,7 +32,7 @@ body.light {
--color-main-red: #e86aa6;
--color-second-red: #f56c6c;
--color-third-red: #fcdee4;
--color-main-grey: #e9eaf0;
--color-main-grey: #edeef3;
--color-main-yellow: #e6a23cb3;

/* Border color */
Expand Down
29 changes: 24 additions & 5 deletions src/background.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,10 +2,13 @@

import { app, protocol, BrowserWindow, ipcMain, shell, Menu } from 'electron'
import { createProtocol, installVueDevtools } from 'vue-cli-plugin-electron-builder/lib'
import { updateConnectionMessage } from '@/utils/api/connection'
import db from './database/index'
import updateChecker from './main/updateChecker'
import getMenuTemplate from './main/getMenuTemplate'
import saveFile from './main/saveFile'
import saveExcel from './main/saveExcel'
import newWindow from './main/newWindow'

interface WindowSizeModel {
width: number
Expand All @@ -23,27 +26,43 @@ let win: BrowserWindow | null

let menu: Menu | null

const windowSize = db.get<WindowSizeModel>('windowSize')

const theme = db.get<Theme>('settings.currentTheme')

// Scheme must be registered before the app is ready
protocol.registerSchemesAsPrivileged([{ scheme: 'app', privileges: { secure: true, standard: true } }])

function handleIpcMessages() {
ipcMain.on('setting', (event: any, ...args: any[]) => {
ipcMain.on('setting', (event: Electron.Event, ...args: any[]) => {
event.sender.send('setting', ...args)
})
ipcMain.on('checkUpdate', () => {
updateChecker(false)
})
ipcMain.on('exportData', (event: any, ...args: string[]) => {
ipcMain.on('exportData', (event: Electron.Event, ...args: any[]) => {
const [filename, content, type] = args
if (win) {
saveFile(win, filename, content, type)
if (typeof content === 'string') {
saveFile(win, filename, content, type)
} else {
saveExcel(win, filename, content)
}
}
})
ipcMain.on('newWindow', (event: Electron.Event, ...args: any[]) => {
if (win) {
const id = args[0]
newWindow(id, { isMac, theme, static: __static })
}
})
ipcMain.on('saveMessages', (event: Electron.Event, ...args: any[]) => {
const { id, receivedMessage } = args[0]
updateConnectionMessage(id, { ...receivedMessage })
})
}

function createWindow() {
const windowSize = db.get<WindowSizeModel>('windowSize')
const theme = db.get<Theme>('settings.currentTheme')
// Create the browser window.
win = new BrowserWindow({
...windowSize,
Expand Down
Loading

0 comments on commit 336af3d

Please sign in to comment.