Skip to content

Commit

Permalink
feat(web): playground 自动刷新
Browse files Browse the repository at this point in the history
  • Loading branch information
@AdamCaoQAQ
AdamCaoQAQ committed Apr 21, 2023
1 parent 19a480c commit 61f3092
Show file tree
Hide file tree
Showing 13 changed files with 371 additions and 42 deletions.
26 changes: 16 additions & 10 deletions Web/lerna-debug.log
View file
Original file line number Diff line number Diff line change
@@ -1,10 +1,16 @@
15 error Error: Command failed with exit code 1: git remote update
15 error fatal: unable to access 'https://github.com/didi/DoraemonKit.git/': LibreSSL SSL_connect: SSL_ERROR_SYSCALL in connection to github.com:443
15 error error: Could not fetch origin
15 error Fetching origin
15 error at makeError (/Users/didi/Desktop/DoKit/DoraemonKit/Web/node_modules/execa/lib/error.js:59:11)
15 error at Function.module.exports.sync (/Users/didi/Desktop/DoKit/DoraemonKit/Web/node_modules/execa/index.js:186:17)
15 error at Object.execSync (/Users/didi/Desktop/DoKit/DoraemonKit/Web/node_modules/@lerna/child-process/index.js:39:16)
15 error at updateRemote (/Users/didi/Desktop/DoKit/DoraemonKit/Web/node_modules/@lerna/version/lib/is-behind-upstream.js:34:16)
15 error at isBehindUpstream (/Users/didi/Desktop/DoKit/DoraemonKit/Web/node_modules/@lerna/version/lib/is-behind-upstream.js:16:3)
15 error at VersionCommand.initialize (/Users/didi/Desktop/DoKit/DoraemonKit/Web/node_modules/@lerna/version/index.js:153:9)
0 silly argv { _: [ 'bootstrap' ], lernaVersion: '4.0.0', '$0': 'lerna' }
1 notice cli v4.0.0
2 verbose rootPath /Users/didi/Desktop/DoKit/DoraemonKit/Web
3 error JSONError: Unexpected token "<" (0x3C) in JSON at position 745 while parsing near "... \"dependencies\": {\n<<<<<<< HEAD\n<<<<<<<..." in packages/web/package.json
3 error
3 error   31 | },
3 error   32 | "dependencies": {
3 error > 33 | <<<<<<< HEAD
3 error   | ^
3 error   34 | <<<<<<< HEAD
3 error   35 | =======
3 error   36 | >>>>>>> 4219bdfe (feat: 修改部分一机多控逻辑)
3 error
3 error at parseJson (/Users/didi/Desktop/DoKit/DoraemonKit/Web/node_modules/parse-json/index.js:29:21)
3 error at parse (/Users/didi/Desktop/DoKit/DoraemonKit/Web/node_modules/load-json-file/index.js:15:9)
3 error at module.exports (/Users/didi/Desktop/DoKit/DoraemonKit/Web/node_modules/load-json-file/index.js:18:47)
1 change: 1 addition & 0 deletions Web/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,7 @@
"jest": "^26.6.3",
"lerna": "^4.0.0",
"less": "^4.1.1",
"livereload": "^0.9.3",
"npm-run-all": "^4.1.5",
"open": "^8.0.6",
"postcss": "^8.2.12",
Expand Down
1 change: 1 addition & 0 deletions Web/packages/core/src/components/router-container.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ export default {
},
computed:{
component(){
return this.$route.component
},
title(){
Expand Down
17 changes: 0 additions & 17 deletions Web/packages/web/package.json
View file
Original file line number Diff line number Diff line change
@@ -1,10 +1,6 @@
{
"name": "@dokit/web",
<<<<<<< HEAD
"version": "0.0.3",
=======
"version": "0.0.3-alpha.3",
>>>>>>> cc153ece (web_0.0.3-alpha.3)
"description": "Dokit Web Main Entry",
"keywords": [
"Dokit"
Expand Down Expand Up @@ -34,24 +30,11 @@
"dev": "npx rollup -wc"
},
"dependencies": {
<<<<<<< HEAD
<<<<<<< HEAD
=======
>>>>>>> 4219bdfe (feat: 修改部分一机多控逻辑)
"@dokit/web-core": "file:../core",
"@dokit/web-utils": "file:../utils",
"jsqr": "^1.4.0",
"web-vitals": "^2.1.2",
"moment": "^2.29.1"
<<<<<<< HEAD
=======
"@dokit/web-core": "^0.0.3-alpha.3",
"@dokit/web-utils": "^0.0.1",
"mutation-observer": "^1.0.3",
"web-vitals": "^2.1.2"
>>>>>>> cc153ece (web_0.0.3-alpha.3)
=======
>>>>>>> 4219bdfe (feat: 修改部分一机多控逻辑)
},
"gitHead": "886ea7c19806526668e5da0179da335e7df9d012"
}
213 changes: 213 additions & 0 deletions Web/packages/web/playground/index.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,213 @@
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Dokit For Web</title>
<style>
.asd4 .asd {
color: rgba(241, 9, 9, 0.3);
background: url(https://pt-starimg.didistatic.com/static/starimg/img/UioDkptMhY1635838350336.png);
box-shadow: 10px 10px 5px rgb(122, 222, 222, 0.7);
}

body {
top: 10px;
}

.asd1 {
position: relative;
}

.weatherInfo {
font-size: 13px;
overflow: hidden;
}
</style>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script src="https://unpkg.com/vue@next"></script>
<script src="dokit.js"></script>
<script>
Dokit.startMultiControl('ws://172.23.165.79:8000/proxy/multicontrol/OYZGTSEL', window.location.href.split("?asd=")[1])
// axios({
// url: 'https://thor.weidian.com/skittles/share.getConfig/1.0?wdtoken=4000fcea&_=1649759524263',
// }).then((res) => {
// console.log('axios:',res)
// // changeNode.style.color = "blue"
// weatherInfoNode.innerText = `接口数据:${JSON.stringify(res)}`
// }).catch((err) => {
// console.log(err)
// });
Dokit.setProductId('749a0600b5e48dd77cf8ee680be7b1b7')
</script>
</head>

<body>
<input calss="inputDemo" />
<div>DoKit For Web</div>
<div class="asd1">
<div class="asd2">
<div class="asd3">
<div class="asd4">
<span class="asd" id="qwe" style="padding: 10px 20px 30px 40px;
margin: 10px 20px 30px 40px;
border: 10px solid;
border-width:10px 20px 30px 50px;">Playground</span>
</div>
</div>
</div>
</div>
<div style="height:300px;overflow: scroll;">
<a href="https://hummer.didi.cn/home#/">Hummer</a>
<img src="https://pt-starimg.didistatic.com/static/starimg/img/UioDkptMhY1635838350336.png" />
<h2 class="asd" id="qwe" style="padding: 10px 20px 30px 40px;
margin: 10px 20px 30px 40px;
border: 10px solid;
border-width:10px 20px 30px 50px;">Playground</h2>
<input>
<h2 style="padding: 10px 20px 30px 40px;
margin: 10px 20px 30px 40px;
border: 10px solid;
border-width:10px 20px 30px 50px;">Playground</h2>
<h2 style="padding: 10px 20px 30px 40px;
margin: 10px 20px 30px 40px;
border: 10px solid;
border-width:10px 20px 30px 50px;">Playground</h2>
<h2 style="padding: 10px 20px 30px 40px;
margin: 10px 20px 30px 40px;
border: 10px solid;
border-width:10px 20px 30px 50px;">Playground</h2>
<h2 style="padding: 10px 20px 30px 40px;
margin: 10px 20px 30px 40px;
border: 10px solid;
border-width:10px 20px 30px 50px;">Playground</h2>
<h2 style="padding: 10px 20px 30px 40px;
margin: 10px 20px 30px 40px;
border: 10px solid;
border-width:10px 20px 30px 50px;">Playground</h2>
</div>
<h2 class="weatherInfo">接口数据：</h2>
<h2 style="padding: 10px 20px 30px 40px;
margin: 10px 20px 30px 40px;
border: 10px solid;
border-width:10px 20px 30px 50px;">Playground</h2>
<h2 style="padding: 10px 20px 30px 40px;
margin: 10px 20px 30px 40px;
border: 10px solid;
border-width:10px 20px 30px 50px;">Playground</h2>
<h2 style="padding: 10px 20px 30px 40px;
margin: 10px 20px 30px 40px;
border: 10px solid;
border-width:10px 20px 30px 50px;">Playground</h2>
<div class="asdasd">zepto测试</div>
</body>
<script src="https://cdnjs.gtimg.com/cdnjs/libs/zepto/1.1.4/zepto.js"></script>
<script>
let eventNode = document.getElementsByClassName('asd1')[0]
let changeNode = document.getElementById('qwe')
let weatherInfoNode = document.getElementsByClassName('weatherInfo')[0]
// axios({
// url: 'https://thor.weidian.com/skittles/share.getConfig/1.0?wdtoken=4000fcea&_=1649759524263',
// }).then((res) => {
// console.log('axios:',res)
// // changeNode.style.color = "blue"
// weatherInfoNode.innerText = `接口数据:${JSON.stringify(res)}`
// }).catch((err) => {
// console.log(err)
// });
eventNode.onclick = (e) => {
fetch('https://www.tianqiapi.com/free/week?appid=68852321&appsecret=BgGLDVc7', {})
.then((response) => {
let weatherInfo = response.json();
return weatherInfo;
})
.then((info) => {
console.log('weatherInfo', info)
changeNode.style.color = "blue"
weatherInfoNode.innerText = `接口数据:${JSON.stringify(info)}`
// axios({
// url: 'https://daijia.kuaidadi.com/gateway?api=lj.assign.d.regions&apiVersion=1.0.0&appKey=b4f945fe780140d8a0d19d1f2d021db7&appVersion=6.8.9&mobileType=vivo+NEX+S&osType=2&osVersion=10&sign=f2d04df3510670528a067ae52ded2c49&timestamp=1648180651319&token=Mk_G1OHDSNax7QIHN8j_BmFarMeZA_ORR7yKj831WPYkyDvKw0AMAOG7TC2MtCtrbbV__98hD-fRbCAhlfHdg_E0A99KV5I66KAI3UgTeiGLqo5Cr6QK3Y-NJH__CCcShDNZJvPmc4tWprm6C9cdQ1jIlc_r-74sZGhR24QbaeGtVm9RhTuJmelRIDx2QXiSuv0CAAD__w%3D%3D&ttid=-1&userId=182784&userRole=2',
// }).then((res) => {
// console.log(res)
// }).catch((err) => {
// console.log(err)
// });
});
// for (let index = 0; index < 10; index++) {
// axios({
// url: 'https://daijia.kuaidadi.com/gateway?api=lj.assign.d.regions&apiVersion=1.0.0&appKey=b4f945fe780140d8a0d19d1f2d021db7&appVersion=6.8.9&mobileType=vivo+NEX+S&osType=2&osVersion=10&sign=f2d04df3510670528a067ae52ded2c49&timestamp=1648180651319&token=Mk_G1OHDSNax7QIHN8j_BmFarMeZA_ORR7yKj831WPYkyDvKw0AMAOG7TC2MtCtrbbV__98hD-fRbCAhlfHdg_E0A99KV5I66KAI3UgTeiGLqo5Cr6QK3Y-NJH__CCcShDNZJvPmc4tWprm6C9cdQ1jIlc_r-74sZGhR24QbaeGtVm9RhTuJmelRIDx2QXiSuv0CAAD__w%3D%3D&ttid=-1&userId=182784&userRole=2',
// }).then((res) => {
// console.log(res)
// // alert(res)
// }).catch((err) => {
// console.log(err)
// });
// }

// function reqListener() {
// console.log('asasdasdasdasdasdasdasdqsdasasdasdasdasdasdasdasdqsdasasdasdasdasdasdasdasdqsd', this
// .responseText);
// }
// var oReq = new XMLHttpRequest();
// oReq.addEventListener("load", reqListener);
// oReq.open("post", "https://www.tianqiapi.com/free/week?appid=68852321&appsecret=BgGLDVc7");
// oReq.setRequestHeader('Content-Type', 'text/html; charset=utf-8')
// oReq.setRequestHeader('Access-Control-Allow-Origin', 'http://localhost:3000/playground')
// oReq.setRequestHeader('Access-Control-Allow-Credentials', 'true')
// oReq.send(JSON.stringify({
// a: 1
// }));

// axios({
// url: 'https://www.tianqiapi.com/free/week?appid=68852321&appsecret=BgGLDVc7',
// method: "POST",
// data: {
// firstName: "Fred",
// lastName: "Flintstone"
// }
// }).then((res) => {
// console.log(res)
// }).catch((err) => {
// console.log(err)
// });
}
eventNode.addEventListener('touchstart', (e) => {
console.log(e)
console.log('----------touchstart--------')
}, false)
eventNode.addEventListener('touchmove', () => {
console.log('----------touchmove--------')
}, false)
eventNode.addEventListener('touchend', () => {
console.log('----------touchend--------')
}, false)
$('.asdasd').on('click', function (event) {
console.log('zepto', event);
});
setTimeout(() => {
document.body.appendChild(document.createElement('textarea'))
}, 5000)
// setTimeout(() => {
// var a = {
// b: 1,
// c: 3,
// }
// console.log(a);

// function reqListener() {
// console.log('asasdasdasdasdasdasdasdqsdasasdasdasdasdasdasdasdqsdasasdasdasdasdasdasdasdqsd', this
// .responseText);
// }
// var oReq = new XMLHttpRequest();
// oReq.addEventListener("load", reqListener);
// oReq.open("post", "https://www.tianqiapi.com/free/week?appid=68852321&appsecret=BgGLDVc7");
// oReq.setRequestHeader('Content-Type', 'text/html; charset=utf-8')
// oReq.send(JSON.stringify({
// a: 1
// }));
// }, 5000);
</script>

</html>
1 change: 1 addition & 0 deletions Web/packages/web/rollup.config.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import postcssPlugin from 'rollup-plugin-postcss'
import resolve from 'rollup-plugin-node-resolve'
import commonjs from 'rollup-plugin-commonjs'
import replace from 'rollup-plugin-replace'

import {
terser
} from 'rollup-plugin-terser'
Expand Down
93 changes: 93 additions & 0 deletions Web/packages/web/src/plugins/demo-single-plugin/FPS.vue
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,93 @@
<template>
<div class="hello-independ" v-dragable>
<div style="font-weight: bold; font-size: 30px; font-style: italic">
实时帧率展示
</div>
<div>平均FPS: {{fps}}</div>
<div>最小FPS: {{minFps}}</div>
<div>最大FPS: {{maxFps}}</div>
<div
@click="remove"
style="background-color: red; color: white; margin-top: 10px"
>
点击移除当前独立插件
</div>
</div>
</template>
<script>
import { dragable } from "@dokit/web-utils";
import { removeIndependPlugin } from "@dokit/web-core";
export default {
directives: {
dragable,
},
data() {
return {
fps: 0,
minFps: 60,
maxFps: 60
}
},
mounted() {
console.log('moounted')
this.showFPS()
},
methods: {
remove() {
removeIndependPlugin("test");
},
showFPS() {
this.fps = 60
var rAF = (function () {
return (
window.requestAnimationFrame ||
window.webkitRequestAnimationFrame ||
function (callback) {
window.setTimeout(callback, 1000 / 60);
}
);
})();
var frame = 0;
var allFrameCount = 0;
var lastTime = Date.now();
var lastFameTime = Date.now();
var loop = () => {
var now = Date.now();
var fs = now - lastFameTime;
var fps = Math.round(1000 / fs);
lastFameTime = now;
// 不置 0，在动画的开头及结尾记录此值的差值算出 FPS
allFrameCount++;
frame++;
if (now > 1000 + lastTime) {
var fps = Math.round((frame * 1000) / (now - lastTime));
console.log(`${new Date()} 1S内 FPS：`, fps);
this.fps = fps
this.minFps = this.minFps > fps ? fps : this.minFps
this.maxFps = this.maxFps < fps ? fps : this.maxFps
frame = 0;
lastTime = now;
}
rAF(loop);
};
loop();
},
},
};
</script>
<style scoped>
.hello-independ {
display: inline-block;
width: 200px;
/* padding: 10px; */
text-align: center;
background-color: white;
border-radius: 20px;
box-shadow: 0 8px 12px #ebedf0;
overflow: hidden;
border: 1px solid red;
}
</style>
Loading

0 comments on commit 61f3092

Please sign in to comment.