initial
This commit is contained in:
23
.gitignore
vendored
Normal file
23
.gitignore
vendored
Normal file
@@ -0,0 +1,23 @@
|
|||||||
|
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
|
||||||
|
|
||||||
|
# dependencies
|
||||||
|
/node_modules
|
||||||
|
/.pnp
|
||||||
|
.pnp.js
|
||||||
|
|
||||||
|
# testing
|
||||||
|
/coverage
|
||||||
|
|
||||||
|
# production
|
||||||
|
/build
|
||||||
|
|
||||||
|
# misc
|
||||||
|
.DS_Store
|
||||||
|
.env.local
|
||||||
|
.env.development.local
|
||||||
|
.env.test.local
|
||||||
|
.env.production.local
|
||||||
|
|
||||||
|
npm-debug.log*
|
||||||
|
yarn-debug.log*
|
||||||
|
yarn-error.log*
|
||||||
114
.vscode/.ropeproject/config.py
vendored
Normal file
114
.vscode/.ropeproject/config.py
vendored
Normal file
@@ -0,0 +1,114 @@
|
|||||||
|
# The default ``config.py``
|
||||||
|
# flake8: noqa
|
||||||
|
|
||||||
|
|
||||||
|
def set_prefs(prefs):
|
||||||
|
"""This function is called before opening the project"""
|
||||||
|
|
||||||
|
# Specify which files and folders to ignore in the project.
|
||||||
|
# Changes to ignored resources are not added to the history and
|
||||||
|
# VCSs. Also they are not returned in `Project.get_files()`.
|
||||||
|
# Note that ``?`` and ``*`` match all characters but slashes.
|
||||||
|
# '*.pyc': matches 'test.pyc' and 'pkg/test.pyc'
|
||||||
|
# 'mod*.pyc': matches 'test/mod1.pyc' but not 'mod/1.pyc'
|
||||||
|
# '.svn': matches 'pkg/.svn' and all of its children
|
||||||
|
# 'build/*.o': matches 'build/lib.o' but not 'build/sub/lib.o'
|
||||||
|
# 'build//*.o': matches 'build/lib.o' and 'build/sub/lib.o'
|
||||||
|
prefs['ignored_resources'] = ['*.pyc', '*~', '.ropeproject',
|
||||||
|
'.hg', '.svn', '_svn', '.git', '.tox']
|
||||||
|
|
||||||
|
# Specifies which files should be considered python files. It is
|
||||||
|
# useful when you have scripts inside your project. Only files
|
||||||
|
# ending with ``.py`` are considered to be python files by
|
||||||
|
# default.
|
||||||
|
# prefs['python_files'] = ['*.py']
|
||||||
|
|
||||||
|
# Custom source folders: By default rope searches the project
|
||||||
|
# for finding source folders (folders that should be searched
|
||||||
|
# for finding modules). You can add paths to that list. Note
|
||||||
|
# that rope guesses project source folders correctly most of the
|
||||||
|
# time; use this if you have any problems.
|
||||||
|
# The folders should be relative to project root and use '/' for
|
||||||
|
# separating folders regardless of the platform rope is running on.
|
||||||
|
# 'src/my_source_folder' for instance.
|
||||||
|
# prefs.add('source_folders', 'src')
|
||||||
|
|
||||||
|
# You can extend python path for looking up modules
|
||||||
|
# prefs.add('python_path', '~/python/')
|
||||||
|
|
||||||
|
# Should rope save object information or not.
|
||||||
|
prefs['save_objectdb'] = True
|
||||||
|
prefs['compress_objectdb'] = False
|
||||||
|
|
||||||
|
# If `True`, rope analyzes each module when it is being saved.
|
||||||
|
prefs['automatic_soa'] = True
|
||||||
|
# The depth of calls to follow in static object analysis
|
||||||
|
prefs['soa_followed_calls'] = 0
|
||||||
|
|
||||||
|
# If `False` when running modules or unit tests "dynamic object
|
||||||
|
# analysis" is turned off. This makes them much faster.
|
||||||
|
prefs['perform_doa'] = True
|
||||||
|
|
||||||
|
# Rope can check the validity of its object DB when running.
|
||||||
|
prefs['validate_objectdb'] = True
|
||||||
|
|
||||||
|
# How many undos to hold?
|
||||||
|
prefs['max_history_items'] = 32
|
||||||
|
|
||||||
|
# Shows whether to save history across sessions.
|
||||||
|
prefs['save_history'] = True
|
||||||
|
prefs['compress_history'] = False
|
||||||
|
|
||||||
|
# Set the number spaces used for indenting. According to
|
||||||
|
# :PEP:`8`, it is best to use 4 spaces. Since most of rope's
|
||||||
|
# unit-tests use 4 spaces it is more reliable, too.
|
||||||
|
prefs['indent_size'] = 4
|
||||||
|
|
||||||
|
# Builtin and c-extension modules that are allowed to be imported
|
||||||
|
# and inspected by rope.
|
||||||
|
prefs['extension_modules'] = []
|
||||||
|
|
||||||
|
# Add all standard c-extensions to extension_modules list.
|
||||||
|
prefs['import_dynload_stdmods'] = True
|
||||||
|
|
||||||
|
# If `True` modules with syntax errors are considered to be empty.
|
||||||
|
# The default value is `False`; When `False` syntax errors raise
|
||||||
|
# `rope.base.exceptions.ModuleSyntaxError` exception.
|
||||||
|
prefs['ignore_syntax_errors'] = False
|
||||||
|
|
||||||
|
# If `True`, rope ignores unresolvable imports. Otherwise, they
|
||||||
|
# appear in the importing namespace.
|
||||||
|
prefs['ignore_bad_imports'] = False
|
||||||
|
|
||||||
|
# If `True`, rope will insert new module imports as
|
||||||
|
# `from <package> import <module>` by default.
|
||||||
|
prefs['prefer_module_from_imports'] = False
|
||||||
|
|
||||||
|
# If `True`, rope will transform a comma list of imports into
|
||||||
|
# multiple separate import statements when organizing
|
||||||
|
# imports.
|
||||||
|
prefs['split_imports'] = False
|
||||||
|
|
||||||
|
# If `True`, rope will remove all top-level import statements and
|
||||||
|
# reinsert them at the top of the module when making changes.
|
||||||
|
prefs['pull_imports_to_top'] = True
|
||||||
|
|
||||||
|
# If `True`, rope will sort imports alphabetically by module name instead
|
||||||
|
# of alphabetically by import statement, with from imports after normal
|
||||||
|
# imports.
|
||||||
|
prefs['sort_imports_alphabetically'] = False
|
||||||
|
|
||||||
|
# Location of implementation of
|
||||||
|
# rope.base.oi.type_hinting.interfaces.ITypeHintingFactory In general
|
||||||
|
# case, you don't have to change this value, unless you're an rope expert.
|
||||||
|
# Change this value to inject you own implementations of interfaces
|
||||||
|
# listed in module rope.base.oi.type_hinting.providers.interfaces
|
||||||
|
# For example, you can add you own providers for Django Models, or disable
|
||||||
|
# the search type-hinting in a class hierarchy, etc.
|
||||||
|
prefs['type_hinting_factory'] = (
|
||||||
|
'rope.base.oi.type_hinting.factory.default_type_hinting_factory')
|
||||||
|
|
||||||
|
|
||||||
|
def project_opened(project):
|
||||||
|
"""This function is called after opening the project"""
|
||||||
|
# Do whatever you like here!
|
||||||
3
.vscode/settings.json
vendored
Normal file
3
.vscode/settings.json
vendored
Normal file
@@ -0,0 +1,3 @@
|
|||||||
|
{
|
||||||
|
"python.pythonPath": "C:\\Python27\\python.exe"
|
||||||
|
}
|
||||||
68
README.md
Normal file
68
README.md
Normal file
@@ -0,0 +1,68 @@
|
|||||||
|
This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
|
||||||
|
|
||||||
|
## Available Scripts
|
||||||
|
|
||||||
|
In the project directory, you can run:
|
||||||
|
|
||||||
|
### `yarn start`
|
||||||
|
|
||||||
|
Runs the app in the development mode.<br />
|
||||||
|
Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
|
||||||
|
|
||||||
|
The page will reload if you make edits.<br />
|
||||||
|
You will also see any lint errors in the console.
|
||||||
|
|
||||||
|
### `yarn test`
|
||||||
|
|
||||||
|
Launches the test runner in the interactive watch mode.<br />
|
||||||
|
See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.
|
||||||
|
|
||||||
|
### `yarn build`
|
||||||
|
|
||||||
|
Builds the app for production to the `build` folder.<br />
|
||||||
|
It correctly bundles React in production mode and optimizes the build for the best performance.
|
||||||
|
|
||||||
|
The build is minified and the filenames include the hashes.<br />
|
||||||
|
Your app is ready to be deployed!
|
||||||
|
|
||||||
|
See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.
|
||||||
|
|
||||||
|
### `yarn eject`
|
||||||
|
|
||||||
|
**Note: this is a one-way operation. Once you `eject`, you can’t go back!**
|
||||||
|
|
||||||
|
If you aren’t satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.
|
||||||
|
|
||||||
|
Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own.
|
||||||
|
|
||||||
|
You don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it.
|
||||||
|
|
||||||
|
## Learn More
|
||||||
|
|
||||||
|
You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).
|
||||||
|
|
||||||
|
To learn React, check out the [React documentation](https://reactjs.org/).
|
||||||
|
|
||||||
|
### Code Splitting
|
||||||
|
|
||||||
|
This section has moved here: https://facebook.github.io/create-react-app/docs/code-splitting
|
||||||
|
|
||||||
|
### Analyzing the Bundle Size
|
||||||
|
|
||||||
|
This section has moved here: https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size
|
||||||
|
|
||||||
|
### Making a Progressive Web App
|
||||||
|
|
||||||
|
This section has moved here: https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app
|
||||||
|
|
||||||
|
### Advanced Configuration
|
||||||
|
|
||||||
|
This section has moved here: https://facebook.github.io/create-react-app/docs/advanced-configuration
|
||||||
|
|
||||||
|
### Deployment
|
||||||
|
|
||||||
|
This section has moved here: https://facebook.github.io/create-react-app/docs/deployment
|
||||||
|
|
||||||
|
### `yarn build` fails to minify
|
||||||
|
|
||||||
|
This section has moved here: https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify
|
||||||
16621
package-lock.json
generated
Normal file
16621
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
42
package.json
Normal file
42
package.json
Normal file
@@ -0,0 +1,42 @@
|
|||||||
|
{
|
||||||
|
"name": "hp-tools-3",
|
||||||
|
"version": "0.1.0",
|
||||||
|
"private": true,
|
||||||
|
"dependencies": {
|
||||||
|
"@testing-library/jest-dom": "^4.2.4",
|
||||||
|
"@testing-library/react": "^9.3.2",
|
||||||
|
"@testing-library/user-event": "^7.1.2",
|
||||||
|
"aws-sdk": "^2.707.0",
|
||||||
|
"axios": "^0.19.2",
|
||||||
|
"cors": "^2.8.5",
|
||||||
|
"express": "^4.17.1",
|
||||||
|
"fetch-retry": "^4.0.1",
|
||||||
|
"multer": "^1.4.2",
|
||||||
|
"nodemon": "^2.0.4",
|
||||||
|
"react": "^16.13.1",
|
||||||
|
"react-dom": "^16.13.1",
|
||||||
|
"react-scripts": "3.4.1",
|
||||||
|
"react-toastify": "^6.0.6"
|
||||||
|
},
|
||||||
|
"scripts": {
|
||||||
|
"start": "react-scripts start",
|
||||||
|
"build": "react-scripts build",
|
||||||
|
"test": "react-scripts test",
|
||||||
|
"eject": "react-scripts eject"
|
||||||
|
},
|
||||||
|
"eslintConfig": {
|
||||||
|
"extends": "react-app"
|
||||||
|
},
|
||||||
|
"browserslist": {
|
||||||
|
"production": [
|
||||||
|
">0.2%",
|
||||||
|
"not dead",
|
||||||
|
"not op_mini all"
|
||||||
|
],
|
||||||
|
"development": [
|
||||||
|
"last 1 chrome version",
|
||||||
|
"last 1 firefox version",
|
||||||
|
"last 1 safari version"
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
BIN
public/favicon.ico
Normal file
BIN
public/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.1 KiB |
43
public/index.html
Normal file
43
public/index.html
Normal file
@@ -0,0 +1,43 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<meta name="theme-color" content="#000000" />
|
||||||
|
<meta
|
||||||
|
name="description"
|
||||||
|
content="Web site created using create-react-app"
|
||||||
|
/>
|
||||||
|
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
|
||||||
|
<!--
|
||||||
|
manifest.json provides metadata used when your web app is installed on a
|
||||||
|
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
|
||||||
|
-->
|
||||||
|
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
|
||||||
|
<!--
|
||||||
|
Notice the use of %PUBLIC_URL% in the tags above.
|
||||||
|
It will be replaced with the URL of the `public` folder during the build.
|
||||||
|
Only files inside the `public` folder can be referenced from the HTML.
|
||||||
|
|
||||||
|
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
|
||||||
|
work correctly both with client-side routing and a non-root public URL.
|
||||||
|
Learn how to configure a non-root public URL by running `npm run build`.
|
||||||
|
-->
|
||||||
|
<title>React App</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<noscript>You need to enable JavaScript to run this app.</noscript>
|
||||||
|
<div id="root"></div>
|
||||||
|
<!--
|
||||||
|
This HTML file is a template.
|
||||||
|
If you open it directly in the browser, you will see an empty page.
|
||||||
|
|
||||||
|
You can add webfonts, meta tags, or analytics to this file.
|
||||||
|
The build step will place the bundled scripts into the <body> tag.
|
||||||
|
|
||||||
|
To begin the development, run `npm start` or `yarn start`.
|
||||||
|
To create a production bundle, use `npm run build` or `yarn build`.
|
||||||
|
-->
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
BIN
public/logo192.png
Normal file
BIN
public/logo192.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.2 KiB |
BIN
public/logo512.png
Normal file
BIN
public/logo512.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 9.4 KiB |
25
public/manifest.json
Normal file
25
public/manifest.json
Normal file
@@ -0,0 +1,25 @@
|
|||||||
|
{
|
||||||
|
"short_name": "React App",
|
||||||
|
"name": "Create React App Sample",
|
||||||
|
"icons": [
|
||||||
|
{
|
||||||
|
"src": "favicon.ico",
|
||||||
|
"sizes": "64x64 32x32 24x24 16x16",
|
||||||
|
"type": "image/x-icon"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"src": "logo192.png",
|
||||||
|
"type": "image/png",
|
||||||
|
"sizes": "192x192"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"src": "logo512.png",
|
||||||
|
"type": "image/png",
|
||||||
|
"sizes": "512x512"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"start_url": ".",
|
||||||
|
"display": "standalone",
|
||||||
|
"theme_color": "#000000",
|
||||||
|
"background_color": "#ffffff"
|
||||||
|
}
|
||||||
3
public/robots.txt
Normal file
3
public/robots.txt
Normal file
@@ -0,0 +1,3 @@
|
|||||||
|
# https://www.robotstxt.org/robotstxt.html
|
||||||
|
User-agent: *
|
||||||
|
Disallow:
|
||||||
39
src/App.css
Normal file
39
src/App.css
Normal file
@@ -0,0 +1,39 @@
|
|||||||
|
.App {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
label {
|
||||||
|
padding: 0.5rem;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: medium;
|
||||||
|
}
|
||||||
|
|
||||||
|
.App-header {
|
||||||
|
background-color: #282c34;
|
||||||
|
min-height: 5vh;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-size: calc(10px + 2vmin);
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
UpdateDeviceForm {
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
SyncForm {
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
FileUpload {
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.toolheader {
|
||||||
|
padding-bottom: 0.5em;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: larger;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tool {
|
||||||
|
padding-bottom: 5em;
|
||||||
|
}
|
||||||
476
src/App.js
Normal file
476
src/App.js
Normal file
@@ -0,0 +1,476 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import { ToastContainer, toast } from 'react-toastify';
|
||||||
|
import axios from 'axios';
|
||||||
|
import 'react-toastify/dist/ReactToastify.css';
|
||||||
|
import './App.css';
|
||||||
|
|
||||||
|
class UpdateDeviceForm extends React.Component {
|
||||||
|
constructor(props) {
|
||||||
|
super(props);
|
||||||
|
this.state = {
|
||||||
|
mac: '',
|
||||||
|
devicetype: '',
|
||||||
|
m1: true
|
||||||
|
};
|
||||||
|
|
||||||
|
this.handleChange = this.handleChange.bind(this);
|
||||||
|
this.handleSubmit = this.handleSubmit.bind(this);
|
||||||
|
}
|
||||||
|
|
||||||
|
handleChange(event) {
|
||||||
|
const target = event.target;
|
||||||
|
const value = target.name === 'm1' ? target.checked : target.value;
|
||||||
|
const name = target.name;
|
||||||
|
this.setState({[name]: value});
|
||||||
|
}
|
||||||
|
|
||||||
|
handleSubmit(event) {
|
||||||
|
|
||||||
|
const devUrl = {
|
||||||
|
"abbflow": "abbflow",
|
||||||
|
"advvfdipp": "advvfdipp/advvfdippv2",
|
||||||
|
"dhsensor": "dhsensor",
|
||||||
|
"dual_flowmeter": "dual_flowmeter",
|
||||||
|
"flowmeterskid": "flowmeterskid",
|
||||||
|
"flowmonitor": "flow-monitor",
|
||||||
|
"PiFlow": "piflow",
|
||||||
|
"ipp": "ipp",
|
||||||
|
"plcpond": "plcpond",
|
||||||
|
"multisensor": "multisensor",
|
||||||
|
"dualactuator": "dualactuator",
|
||||||
|
"dualactuatorpri": "dualactuator/alt",
|
||||||
|
"plcfreshwater": "plcfreshwater",
|
||||||
|
"pondlevel": "pondlevel",
|
||||||
|
"promagmbs": "promagmbs",
|
||||||
|
"poc": "poc",
|
||||||
|
"recycle_train": "recycle_train",
|
||||||
|
"rigpump": "rigpump",
|
||||||
|
"submonitor": "submonitor",
|
||||||
|
"tanktransfer": "tanktransfer",
|
||||||
|
"tenflowmeterskid": "tenflowmeterskid",
|
||||||
|
"transferlite": "transferlite"
|
||||||
|
}
|
||||||
|
let config = ""
|
||||||
|
if (this.state.m1) {
|
||||||
|
if (this.state.devicetype === "plcfreshwater"){
|
||||||
|
config = "'mainHP': 'https://hp-drivers.s3-us-west-2.amazonaws.com/mainMeshify/plcfresh/'";
|
||||||
|
}else if(this.state.devicetype === "PiFlow"){
|
||||||
|
config = "'mainHP': 'https://hp-drivers.s3-us-west-2.amazonaws.com/mainMeshify/piflow/'";
|
||||||
|
}else{
|
||||||
|
config = "'mainHP': 'https://hp-drivers.s3-us-west-2.amazonaws.com/mainMeshify/','m1': 'https://hp-drivers.s3-us-west-2.amazonaws.com/M1/'"
|
||||||
|
}
|
||||||
|
}else {
|
||||||
|
if (this.state.devicetype === "plcfreshwater"){
|
||||||
|
config = "'mainHP': 'https://hp-drivers.s3-us-west-2.amazonaws.com/mainMeshify/plcfresh/'";
|
||||||
|
}else{
|
||||||
|
config = "'mainHP': 'https://hp-drivers.s3-us-west-2.amazonaws.com/mainMeshify/piflow/'"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
const devArray = this.state.devicetype.split(',');
|
||||||
|
//console.log(devArray);
|
||||||
|
for(let index = 0; index < devArray.length; index ++){
|
||||||
|
if (devArray[index] === "dualactuatorpri"){
|
||||||
|
config = config + ", 'dualactuator': 'https://s3.amazonaws.com/pocloud-drivers/" + devUrl[devArray[index]] +"/'";
|
||||||
|
}else{
|
||||||
|
config = config + ",'" + devArray[index] +"': 'https://s3.amazonaws.com/pocloud-drivers/" + devUrl[devArray[index]] +"/'";
|
||||||
|
}
|
||||||
|
};
|
||||||
|
fetch('https://f5rrbd3r45.execute-api.us-east-1.amazonaws.com/device_config?mac='+this.state.mac + '&config={' + config + '}')
|
||||||
|
.then(res => {
|
||||||
|
res.json();
|
||||||
|
if (res["status"] === 200){
|
||||||
|
toast.success("Added to Database", {
|
||||||
|
position: "bottom-center",
|
||||||
|
autoClose: 5000,
|
||||||
|
hideProgressBar: false,
|
||||||
|
closeOnClick: true,
|
||||||
|
pauseOnHover: true,
|
||||||
|
draggable: true,
|
||||||
|
progress: undefined,
|
||||||
|
});
|
||||||
|
}else {
|
||||||
|
toast.error("Something went wrong try again", {
|
||||||
|
position: "bottom-center",
|
||||||
|
autoClose: 5000,
|
||||||
|
hideProgressBar: false,
|
||||||
|
closeOnClick: true,
|
||||||
|
pauseOnHover: true,
|
||||||
|
draggable: true,
|
||||||
|
progress: undefined,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
console.log(res);
|
||||||
|
})
|
||||||
|
//console.log(config);
|
||||||
|
event.preventDefault();
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
render() {
|
||||||
|
return (
|
||||||
|
<div className="tool">
|
||||||
|
<form onSubmit={this.handleSubmit}>
|
||||||
|
<label>
|
||||||
|
MAC: </label>
|
||||||
|
<input name="mac" type="text" value={this.state.value} onChange={this.handleChange} />
|
||||||
|
|
||||||
|
<label>
|
||||||
|
Device Type: </label>
|
||||||
|
<select name="devicetype" value={this.state.devicetype} onChange={this.handleChange}>
|
||||||
|
<option value=""></option>
|
||||||
|
<option value="abbflow">ABB Flow Meter</option>
|
||||||
|
<option value="advvfdipp">Advanced VFD IPP</option>
|
||||||
|
<option value="dhsensor">Down Hole Sensor Monitor</option>
|
||||||
|
<option value="dual_flowmeter">Dual Flow Meter</option>
|
||||||
|
<option value="flowmeterskid">Flow Meter Skid</option>
|
||||||
|
<option value="flowmonitor">Flow Monitor</option>
|
||||||
|
<option value="flowmonitor,submonitor">Flow Monitor + Submonitor</option>
|
||||||
|
<option value="PiFlow">Fresh Water Flowmeter</option>
|
||||||
|
<option value="ipp">Intelligent Pump Panel</option>
|
||||||
|
<option value="plcpond">Multi-Pond Sensor</option>
|
||||||
|
<option value="multisensor">Multi-Sensor</option>
|
||||||
|
<option value="dualactuator">Pipeline Actuator</option>
|
||||||
|
<option value="dualactuatorpri">Pipeline Actuator(PRI)</option>
|
||||||
|
<option value="plcfreshwater">PLC Fresh Water</option>
|
||||||
|
<option value="pondlevel">Pond Level Sensor</option>
|
||||||
|
<option value="pondlevel,promagmbs">Pond Level + Promag</option>
|
||||||
|
<option value="promagmbs">Promag 400 (Modbus)</option>
|
||||||
|
<option value="poc">Pump Off Controller</option>
|
||||||
|
<option value="recycle_train">Recycle Train</option>
|
||||||
|
<option value="rigpump">Rig Pump</option>
|
||||||
|
<option value="submonitor">Submonitor</option>
|
||||||
|
<option value="tanktransfer">Tank Transfer System</option>
|
||||||
|
<option value="tenflowmeterskid">Ten Flow Meter Skid</option>
|
||||||
|
<option value="transferlite">Transfer Station Lite</option>
|
||||||
|
</select>
|
||||||
|
|
||||||
|
<label>
|
||||||
|
M1: </label>
|
||||||
|
<input name="m1" type="checkbox" checked={this.state.m1} onChange={this.handleChange}/>
|
||||||
|
|
||||||
|
<input type="submit" value="Submit" />
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
class SyncForm extends React.Component {
|
||||||
|
constructor(props) {
|
||||||
|
super(props);
|
||||||
|
this.state = {
|
||||||
|
mac: '',
|
||||||
|
devicetype: ''
|
||||||
|
};
|
||||||
|
|
||||||
|
this.handleChange = this.handleChange.bind(this);
|
||||||
|
this.handleSubmit = this.handleSubmit.bind(this);
|
||||||
|
}
|
||||||
|
|
||||||
|
handleChange(event) {
|
||||||
|
const target = event.target;
|
||||||
|
const value = target.value;
|
||||||
|
const name = target.name;
|
||||||
|
this.setState({[name]: value});
|
||||||
|
}
|
||||||
|
|
||||||
|
handleSubmit(event) {
|
||||||
|
const tech = {
|
||||||
|
"abbflow": "01:99",
|
||||||
|
"advvfdipp": "01:99",
|
||||||
|
"dhsensor": "01:99",
|
||||||
|
"dual_flowmeter": "01:99",
|
||||||
|
"flowmeterskid": "01:99",
|
||||||
|
"flowmonitor": "01:40",
|
||||||
|
"PiFlow": "01:99",
|
||||||
|
"ipp": "01:99",
|
||||||
|
"plcpond": "01:99",
|
||||||
|
"multisensor": "01:99",
|
||||||
|
"dualactuator": "01:99",
|
||||||
|
"M1": "00:30",
|
||||||
|
"plcfreshwater": "01:99",
|
||||||
|
"pondlevel": "01:30",
|
||||||
|
"promagmbs": "01:99",
|
||||||
|
"poc": "01:99",
|
||||||
|
"recycle_train": "01:99",
|
||||||
|
"rigpump": "01:99",
|
||||||
|
"submonitor": "01:99",
|
||||||
|
"tanktransfer": "01:99",
|
||||||
|
"tenflowmeterskid": "01:99",
|
||||||
|
"transferlite": "01:99",
|
||||||
|
}
|
||||||
|
fetch('https://f5rrbd3r45.execute-api.us-east-1.amazonaws.com/sync?mac='+this.state.mac + '&devicetype='+ this.state.devicetype + '&technumber=' + tech[this.state.devicetype])
|
||||||
|
.then(res => {
|
||||||
|
res.json();
|
||||||
|
console.log(res);
|
||||||
|
if (res["status"] === 200){
|
||||||
|
toast.success("Sent to MQTT Broker", {
|
||||||
|
position: "bottom-center",
|
||||||
|
autoClose: 5000,
|
||||||
|
hideProgressBar: false,
|
||||||
|
closeOnClick: true,
|
||||||
|
pauseOnHover: true,
|
||||||
|
draggable: true,
|
||||||
|
progress: undefined,
|
||||||
|
});
|
||||||
|
}else {
|
||||||
|
toast.error("Something went wrong try again", {
|
||||||
|
position: "bottom-center",
|
||||||
|
autoClose: 5000,
|
||||||
|
hideProgressBar: false,
|
||||||
|
closeOnClick: true,
|
||||||
|
pauseOnHover: true,
|
||||||
|
draggable: true,
|
||||||
|
progress: undefined,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
})
|
||||||
|
event.preventDefault();
|
||||||
|
}
|
||||||
|
render() {
|
||||||
|
return (
|
||||||
|
<div className="tool">
|
||||||
|
<form onSubmit={this.handleSubmit}>
|
||||||
|
<label>
|
||||||
|
MAC: </label>
|
||||||
|
<input name="mac" type="text" value={this.state.value} onChange={this.handleChange} />
|
||||||
|
|
||||||
|
<label>
|
||||||
|
Device Type: </label>
|
||||||
|
<select name="devicetype" value={this.state.devicetype} onChange={this.handleChange}>
|
||||||
|
<option value=""></option>
|
||||||
|
<option value="abbflow">ABB Flow Meter</option>
|
||||||
|
<option value="advvfdipp">Advanced VFD IPP</option>
|
||||||
|
<option value="dhsensor">Down Hole Sensor Monitor</option>
|
||||||
|
<option value="dual_flowmeter">Dual Flow Meter</option>
|
||||||
|
<option value="flowmeterskid">Flow Meter Skid</option>
|
||||||
|
<option value="flowmonitor">Flow Monitor</option>
|
||||||
|
<option value="PiFlow">Fresh Water Flowmeter</option>
|
||||||
|
<option value="ipp">Intelligent Pump Panel</option>
|
||||||
|
<option value="M1">M1(Cloud Connect)</option>
|
||||||
|
<option value="plcpond">Multi-Pond Sensor</option>
|
||||||
|
<option value="multisensor">Multi-Sensor</option>
|
||||||
|
<option value="dualactuator">Pipeline Actuator</option>
|
||||||
|
<option value="plcfreshwater">PLC Fresh Water</option>
|
||||||
|
<option value="pondlevel">Pond Level Sensor</option>
|
||||||
|
<option value="promagmbs">Promag 400 (Modbus)</option>
|
||||||
|
<option value="poc">Pump Off Controller</option>
|
||||||
|
<option value="recycle_train">Recycle Train</option>
|
||||||
|
<option value="rigpump">Rig Pump</option>
|
||||||
|
<option value="submonitor">Submonitor</option>
|
||||||
|
<option value="tanktransfer">Tank Transfer System</option>
|
||||||
|
<option value="tenflowmeterskid">Ten Flow Meter Skid</option>
|
||||||
|
<option value="transferlite">Transfer Station Lite</option>
|
||||||
|
</select>
|
||||||
|
|
||||||
|
<input type="submit" value="Submit" />
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
class FileUpload extends React.Component {
|
||||||
|
|
||||||
|
constructor(props) {
|
||||||
|
super(props);
|
||||||
|
this.state = {
|
||||||
|
selectedFile: null,
|
||||||
|
resample: '',
|
||||||
|
timescale: 'S',
|
||||||
|
file: null
|
||||||
|
};
|
||||||
|
|
||||||
|
this.onSampleChange = this.onSampleChange.bind(this);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
/* state = {
|
||||||
|
|
||||||
|
// Initially, no file is selected
|
||||||
|
selectedFile: null,
|
||||||
|
resample: ''
|
||||||
|
}; */
|
||||||
|
|
||||||
|
// On file select (from the pop up)
|
||||||
|
onFileChange = event => {
|
||||||
|
|
||||||
|
// Update the state
|
||||||
|
this.setState({ selectedFile: event.target.files });
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
onSampleChange(event) {
|
||||||
|
const target = event.target;
|
||||||
|
const value = target.value;
|
||||||
|
const name = target.name;
|
||||||
|
this.setState({[name]: value});
|
||||||
|
}
|
||||||
|
// On file upload (click the upload button)
|
||||||
|
onFileUpload = () => {
|
||||||
|
|
||||||
|
let requests = [];
|
||||||
|
let names = [];
|
||||||
|
let resample = this.state.resample;
|
||||||
|
let timescale = this.state.timescale;
|
||||||
|
// Update the formData object
|
||||||
|
for(var x = 0; x<this.state.selectedFile.length; x++){
|
||||||
|
// Request made to the backend api
|
||||||
|
// Send formData object
|
||||||
|
names.push(this.state.selectedFile[x].name)
|
||||||
|
requests.push(axios.put("https://gvya48j9o5.execute-api.us-east-1.amazonaws.com/beta/channel-combiner/"+this.state.selectedFile[x].name, this.state.selectedFile[x]))
|
||||||
|
|
||||||
|
}
|
||||||
|
axios.all(requests).then(axios.spread((...respones) => {
|
||||||
|
let sentData = true;
|
||||||
|
for( var y = 0; y<respones.length; y++){
|
||||||
|
//console.log(respones[y]);
|
||||||
|
if(respones[y]["data"] !== ""){
|
||||||
|
sentData = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (sentData){
|
||||||
|
toast.success("File(s) uploaded successfully", {
|
||||||
|
position: "bottom-center",
|
||||||
|
autoClose: 2500,
|
||||||
|
hideProgressBar: false,
|
||||||
|
closeOnClick: true,
|
||||||
|
pauseOnHover: true,
|
||||||
|
draggable: true,
|
||||||
|
progress: undefined,
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
//trigger lambda to process files
|
||||||
|
setTimeout(() => {fetch('https://gvya48j9o5.execute-api.us-east-1.amazonaws.com/beta/processing?filenames='+names + '&resample='+resample+timescale)
|
||||||
|
.catch(console.log("API Gateway Timed Out"))},1000);
|
||||||
|
//poll to get output csv every 30 secs until success because API Gateway will likely timeout
|
||||||
|
const fetch_retry = (n) => {
|
||||||
|
fetch('https://gvya48j9o5.execute-api.us-east-1.amazonaws.com/beta/channel-combiner/output.csv')
|
||||||
|
.then(res => {
|
||||||
|
res.text()
|
||||||
|
.then((blob, error) => {
|
||||||
|
if (blob[0] === "<") throw error;
|
||||||
|
const url = window.URL.createObjectURL(new Blob([blob]));
|
||||||
|
const link = document.createElement('a');
|
||||||
|
link.href = url;
|
||||||
|
link.setAttribute('download', 'output.csv');
|
||||||
|
document.body.appendChild(link);
|
||||||
|
link.click();
|
||||||
|
link.parentNode.removeChild(link);
|
||||||
|
axios.delete("https://gvya48j9o5.execute-api.us-east-1.amazonaws.com/beta/channel-combiner/output.csv")
|
||||||
|
}).catch((error) => {
|
||||||
|
if (n === 1) throw error;
|
||||||
|
toast.warning(`File not ready trying again in 30s, ${n-1} tries left`, {
|
||||||
|
position: "bottom-center",
|
||||||
|
autoClose: 2500,
|
||||||
|
hideProgressBar: false,
|
||||||
|
closeOnClick: true,
|
||||||
|
pauseOnHover: true,
|
||||||
|
draggable: true,
|
||||||
|
progress: undefined,
|
||||||
|
});
|
||||||
|
return setTimeout(() => {fetch_retry(n-1);}, 30000);
|
||||||
|
});
|
||||||
|
}).catch((error) => {
|
||||||
|
if (n === 1) throw error;
|
||||||
|
console.log("There are " + n-1 + " tries left")
|
||||||
|
return setTimeout(() => {fetch_retry(n-1);}, 30000);
|
||||||
|
})
|
||||||
|
}
|
||||||
|
fetch_retry(6);
|
||||||
|
}else{
|
||||||
|
toast.error("File(s) failed to upload try again", {
|
||||||
|
position: "bottom-center",
|
||||||
|
autoClose: 2500,
|
||||||
|
hideProgressBar: false,
|
||||||
|
closeOnClick: true,
|
||||||
|
pauseOnHover: true,
|
||||||
|
draggable: true,
|
||||||
|
progress: undefined,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
}))
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
// File content to be displayed after
|
||||||
|
// file upload is complete
|
||||||
|
fileData = () => {
|
||||||
|
|
||||||
|
if (this.state.selectedFile) {
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<h2>File Details:</h2>
|
||||||
|
<p>File Name: {this.state.selectedFile.name}</p>
|
||||||
|
<p>File Type: {this.state.selectedFile.type}</p>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<br />
|
||||||
|
<h4>Choose before Pressing the Upload button</h4>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
render() {
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<div className="tool">
|
||||||
|
<label>Input Files: </label>
|
||||||
|
<input type="file" multiple onChange={this.onFileChange} />
|
||||||
|
<label>Resample Rate: </label>
|
||||||
|
<input name="resample" type="text" value={this.state.resample} onChange={this.onSampleChange} />
|
||||||
|
<select name="timescale" value={this.state.timescale} onChange={this.onSampleChange}>
|
||||||
|
<option value="S">Seconds</option>
|
||||||
|
<option value="T">Minutes</option>
|
||||||
|
<option value="H">Hours</option>
|
||||||
|
<option value="D">Days</option>
|
||||||
|
</select>
|
||||||
|
{<button onClick={this.onFileUpload}>
|
||||||
|
Upload
|
||||||
|
</button> }
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function App() {
|
||||||
|
document.title = "HP Tools"
|
||||||
|
return (
|
||||||
|
<div className="App">
|
||||||
|
<header className="App-header">
|
||||||
|
Tools
|
||||||
|
</header>
|
||||||
|
<header className="toolheader">Update/Create Device</header>
|
||||||
|
<UpdateDeviceForm></UpdateDeviceForm>
|
||||||
|
<header className="toolheader">Sync Device</header>
|
||||||
|
<SyncForm></SyncForm>
|
||||||
|
<header className="toolheader">Channel Combiner</header>
|
||||||
|
<FileUpload></FileUpload>
|
||||||
|
<ToastContainer
|
||||||
|
position="bottom-center"
|
||||||
|
autoClose={5000}
|
||||||
|
hideProgressBar={false}
|
||||||
|
newestOnTop={false}
|
||||||
|
closeOnClick
|
||||||
|
rtl={false}
|
||||||
|
pauseOnFocusLoss
|
||||||
|
draggable
|
||||||
|
pauseOnHover
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default App;
|
||||||
9
src/App.test.js
Normal file
9
src/App.test.js
Normal file
@@ -0,0 +1,9 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import { render } from '@testing-library/react';
|
||||||
|
import App from './App';
|
||||||
|
|
||||||
|
test('renders learn react link', () => {
|
||||||
|
const { getByText } = render(<App />);
|
||||||
|
const linkElement = getByText(/learn react/i);
|
||||||
|
expect(linkElement).toBeInTheDocument();
|
||||||
|
});
|
||||||
13
src/index.css
Normal file
13
src/index.css
Normal file
@@ -0,0 +1,13 @@
|
|||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
|
||||||
|
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
|
||||||
|
sans-serif;
|
||||||
|
-webkit-font-smoothing: antialiased;
|
||||||
|
-moz-osx-font-smoothing: grayscale;
|
||||||
|
}
|
||||||
|
|
||||||
|
code {
|
||||||
|
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
|
||||||
|
monospace;
|
||||||
|
}
|
||||||
17
src/index.js
Normal file
17
src/index.js
Normal file
@@ -0,0 +1,17 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import ReactDOM from 'react-dom';
|
||||||
|
import './index.css';
|
||||||
|
import App from './App';
|
||||||
|
import * as serviceWorker from './serviceWorker';
|
||||||
|
|
||||||
|
ReactDOM.render(
|
||||||
|
<React.StrictMode>
|
||||||
|
<App />
|
||||||
|
</React.StrictMode>,
|
||||||
|
document.getElementById('root')
|
||||||
|
);
|
||||||
|
|
||||||
|
// If you want your app to work offline and load faster, you can change
|
||||||
|
// unregister() to register() below. Note this comes with some pitfalls.
|
||||||
|
// Learn more about service workers: https://bit.ly/CRA-PWA
|
||||||
|
serviceWorker.unregister();
|
||||||
7
src/logo.svg
Normal file
7
src/logo.svg
Normal file
@@ -0,0 +1,7 @@
|
|||||||
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 841.9 595.3">
|
||||||
|
<g fill="#61DAFB">
|
||||||
|
<path d="M666.3 296.5c0-32.5-40.7-63.3-103.1-82.4 14.4-63.6 8-114.2-20.2-130.4-6.5-3.8-14.1-5.6-22.4-5.6v22.3c4.6 0 8.3.9 11.4 2.6 13.6 7.8 19.5 37.5 14.9 75.7-1.1 9.4-2.9 19.3-5.1 29.4-19.6-4.8-41-8.5-63.5-10.9-13.5-18.5-27.5-35.3-41.6-50 32.6-30.3 63.2-46.9 84-46.9V78c-27.5 0-63.5 19.6-99.9 53.6-36.4-33.8-72.4-53.2-99.9-53.2v22.3c20.7 0 51.4 16.5 84 46.6-14 14.7-28 31.4-41.3 49.9-22.6 2.4-44 6.1-63.6 11-2.3-10-4-19.7-5.2-29-4.7-38.2 1.1-67.9 14.6-75.8 3-1.8 6.9-2.6 11.5-2.6V78.5c-8.4 0-16 1.8-22.6 5.6-28.1 16.2-34.4 66.7-19.9 130.1-62.2 19.2-102.7 49.9-102.7 82.3 0 32.5 40.7 63.3 103.1 82.4-14.4 63.6-8 114.2 20.2 130.4 6.5 3.8 14.1 5.6 22.5 5.6 27.5 0 63.5-19.6 99.9-53.6 36.4 33.8 72.4 53.2 99.9 53.2 8.4 0 16-1.8 22.6-5.6 28.1-16.2 34.4-66.7 19.9-130.1 62-19.1 102.5-49.9 102.5-82.3zm-130.2-66.7c-3.7 12.9-8.3 26.2-13.5 39.5-4.1-8-8.4-16-13.1-24-4.6-8-9.5-15.8-14.4-23.4 14.2 2.1 27.9 4.7 41 7.9zm-45.8 106.5c-7.8 13.5-15.8 26.3-24.1 38.2-14.9 1.3-30 2-45.2 2-15.1 0-30.2-.7-45-1.9-8.3-11.9-16.4-24.6-24.2-38-7.6-13.1-14.5-26.4-20.8-39.8 6.2-13.4 13.2-26.8 20.7-39.9 7.8-13.5 15.8-26.3 24.1-38.2 14.9-1.3 30-2 45.2-2 15.1 0 30.2.7 45 1.9 8.3 11.9 16.4 24.6 24.2 38 7.6 13.1 14.5 26.4 20.8 39.8-6.3 13.4-13.2 26.8-20.7 39.9zm32.3-13c5.4 13.4 10 26.8 13.8 39.8-13.1 3.2-26.9 5.9-41.2 8 4.9-7.7 9.8-15.6 14.4-23.7 4.6-8 8.9-16.1 13-24.1zM421.2 430c-9.3-9.6-18.6-20.3-27.8-32 9 .4 18.2.7 27.5.7 9.4 0 18.7-.2 27.8-.7-9 11.7-18.3 22.4-27.5 32zm-74.4-58.9c-14.2-2.1-27.9-4.7-41-7.9 3.7-12.9 8.3-26.2 13.5-39.5 4.1 8 8.4 16 13.1 24 4.7 8 9.5 15.8 14.4 23.4zM420.7 163c9.3 9.6 18.6 20.3 27.8 32-9-.4-18.2-.7-27.5-.7-9.4 0-18.7.2-27.8.7 9-11.7 18.3-22.4 27.5-32zm-74 58.9c-4.9 7.7-9.8 15.6-14.4 23.7-4.6 8-8.9 16-13 24-5.4-13.4-10-26.8-13.8-39.8 13.1-3.1 26.9-5.8 41.2-7.9zm-90.5 125.2c-35.4-15.1-58.3-34.9-58.3-50.6 0-15.7 22.9-35.6 58.3-50.6 8.6-3.7 18-7 27.7-10.1 5.7 19.6 13.2 40 22.5 60.9-9.2 20.8-16.6 41.1-22.2 60.6-9.9-3.1-19.3-6.5-28-10.2zM310 490c-13.6-7.8-19.5-37.5-14.9-75.7 1.1-9.4 2.9-19.3 5.1-29.4 19.6 4.8 41 8.5 63.5 10.9 13.5 18.5 27.5 35.3 41.6 50-32.6 30.3-63.2 46.9-84 46.9-4.5-.1-8.3-1-11.3-2.7zm237.2-76.2c4.7 38.2-1.1 67.9-14.6 75.8-3 1.8-6.9 2.6-11.5 2.6-20.7 0-51.4-16.5-84-46.6 14-14.7 28-31.4 41.3-49.9 22.6-2.4 44-6.1 63.6-11 2.3 10.1 4.1 19.8 5.2 29.1zm38.5-66.7c-8.6 3.7-18 7-27.7 10.1-5.7-19.6-13.2-40-22.5-60.9 9.2-20.8 16.6-41.1 22.2-60.6 9.9 3.1 19.3 6.5 28.1 10.2 35.4 15.1 58.3 34.9 58.3 50.6-.1 15.7-23 35.6-58.4 50.6zM320.8 78.4z"/>
|
||||||
|
<circle cx="420.9" cy="296.5" r="45.7"/>
|
||||||
|
<path d="M520.5 78.1z"/>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.6 KiB |
141
src/serviceWorker.js
Normal file
141
src/serviceWorker.js
Normal file
@@ -0,0 +1,141 @@
|
|||||||
|
// This optional code is used to register a service worker.
|
||||||
|
// register() is not called by default.
|
||||||
|
|
||||||
|
// This lets the app load faster on subsequent visits in production, and gives
|
||||||
|
// it offline capabilities. However, it also means that developers (and users)
|
||||||
|
// will only see deployed updates on subsequent visits to a page, after all the
|
||||||
|
// existing tabs open on the page have been closed, since previously cached
|
||||||
|
// resources are updated in the background.
|
||||||
|
|
||||||
|
// To learn more about the benefits of this model and instructions on how to
|
||||||
|
// opt-in, read https://bit.ly/CRA-PWA
|
||||||
|
|
||||||
|
const isLocalhost = Boolean(
|
||||||
|
window.location.hostname === 'localhost' ||
|
||||||
|
// [::1] is the IPv6 localhost address.
|
||||||
|
window.location.hostname === '[::1]' ||
|
||||||
|
// 127.0.0.0/8 are considered localhost for IPv4.
|
||||||
|
window.location.hostname.match(
|
||||||
|
/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/
|
||||||
|
)
|
||||||
|
);
|
||||||
|
|
||||||
|
export function register(config) {
|
||||||
|
if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
|
||||||
|
// The URL constructor is available in all browsers that support SW.
|
||||||
|
const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);
|
||||||
|
if (publicUrl.origin !== window.location.origin) {
|
||||||
|
// Our service worker won't work if PUBLIC_URL is on a different origin
|
||||||
|
// from what our page is served on. This might happen if a CDN is used to
|
||||||
|
// serve assets; see https://github.com/facebook/create-react-app/issues/2374
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
window.addEventListener('load', () => {
|
||||||
|
const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
|
||||||
|
|
||||||
|
if (isLocalhost) {
|
||||||
|
// This is running on localhost. Let's check if a service worker still exists or not.
|
||||||
|
checkValidServiceWorker(swUrl, config);
|
||||||
|
|
||||||
|
// Add some additional logging to localhost, pointing developers to the
|
||||||
|
// service worker/PWA documentation.
|
||||||
|
navigator.serviceWorker.ready.then(() => {
|
||||||
|
console.log(
|
||||||
|
'This web app is being served cache-first by a service ' +
|
||||||
|
'worker. To learn more, visit https://bit.ly/CRA-PWA'
|
||||||
|
);
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
// Is not localhost. Just register service worker
|
||||||
|
registerValidSW(swUrl, config);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function registerValidSW(swUrl, config) {
|
||||||
|
navigator.serviceWorker
|
||||||
|
.register(swUrl)
|
||||||
|
.then(registration => {
|
||||||
|
registration.onupdatefound = () => {
|
||||||
|
const installingWorker = registration.installing;
|
||||||
|
if (installingWorker == null) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
installingWorker.onstatechange = () => {
|
||||||
|
if (installingWorker.state === 'installed') {
|
||||||
|
if (navigator.serviceWorker.controller) {
|
||||||
|
// At this point, the updated precached content has been fetched,
|
||||||
|
// but the previous service worker will still serve the older
|
||||||
|
// content until all client tabs are closed.
|
||||||
|
console.log(
|
||||||
|
'New content is available and will be used when all ' +
|
||||||
|
'tabs for this page are closed. See https://bit.ly/CRA-PWA.'
|
||||||
|
);
|
||||||
|
|
||||||
|
// Execute callback
|
||||||
|
if (config && config.onUpdate) {
|
||||||
|
config.onUpdate(registration);
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
// At this point, everything has been precached.
|
||||||
|
// It's the perfect time to display a
|
||||||
|
// "Content is cached for offline use." message.
|
||||||
|
console.log('Content is cached for offline use.');
|
||||||
|
|
||||||
|
// Execute callback
|
||||||
|
if (config && config.onSuccess) {
|
||||||
|
config.onSuccess(registration);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
};
|
||||||
|
})
|
||||||
|
.catch(error => {
|
||||||
|
console.error('Error during service worker registration:', error);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function checkValidServiceWorker(swUrl, config) {
|
||||||
|
// Check if the service worker can be found. If it can't reload the page.
|
||||||
|
fetch(swUrl, {
|
||||||
|
headers: { 'Service-Worker': 'script' },
|
||||||
|
})
|
||||||
|
.then(response => {
|
||||||
|
// Ensure service worker exists, and that we really are getting a JS file.
|
||||||
|
const contentType = response.headers.get('content-type');
|
||||||
|
if (
|
||||||
|
response.status === 404 ||
|
||||||
|
(contentType != null && contentType.indexOf('javascript') === -1)
|
||||||
|
) {
|
||||||
|
// No service worker found. Probably a different app. Reload the page.
|
||||||
|
navigator.serviceWorker.ready.then(registration => {
|
||||||
|
registration.unregister().then(() => {
|
||||||
|
window.location.reload();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
// Service worker found. Proceed as normal.
|
||||||
|
registerValidSW(swUrl, config);
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.catch(() => {
|
||||||
|
console.log(
|
||||||
|
'No internet connection found. App is running in offline mode.'
|
||||||
|
);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function unregister() {
|
||||||
|
if ('serviceWorker' in navigator) {
|
||||||
|
navigator.serviceWorker.ready
|
||||||
|
.then(registration => {
|
||||||
|
registration.unregister();
|
||||||
|
})
|
||||||
|
.catch(error => {
|
||||||
|
console.error(error.message);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
5
src/setupTests.js
Normal file
5
src/setupTests.js
Normal file
@@ -0,0 +1,5 @@
|
|||||||
|
// jest-dom adds custom jest matchers for asserting on DOM nodes.
|
||||||
|
// allows you to do things like:
|
||||||
|
// expect(element).toHaveTextContent(/react/i)
|
||||||
|
// learn more: https://github.com/testing-library/jest-dom
|
||||||
|
import '@testing-library/jest-dom/extend-expect';
|
||||||
Reference in New Issue
Block a user