diff --git a/.eslintrc.js b/.eslintrc.js new file mode 100644 index 0000000..115cc02 --- /dev/null +++ b/.eslintrc.js @@ -0,0 +1,31 @@ +/* + * Eslint config file + * Documentation: https://eslint.org/docs/user-guide/configuring/ + * Install the Eslint extension before using this feature. + */ +module.exports = { + env: { + es6: true, + browser: true, + node: true, + }, + ecmaFeatures: { + modules: true, + }, + parserOptions: { + ecmaVersion: 2018, + sourceType: 'module', + }, + globals: { + wx: true, + App: true, + Page: true, + getCurrentPages: true, + getApp: true, + Component: true, + requirePlugin: true, + requireMiniProgram: true, + }, + // extends: 'eslint:recommended', + rules: {}, +} diff --git a/README.md b/README.md index b77dccb..aa0dbf3 100644 --- a/README.md +++ b/README.md @@ -1,2 +1 @@ -# Tim-1 - +![](time.png) diff --git a/app.js b/app.js new file mode 100644 index 0000000..1ed57c4 --- /dev/null +++ b/app.js @@ -0,0 +1,19 @@ +// app.js +App({ + onLaunch() { + // 展示本地存储能力 + const logs = wx.getStorageSync('logs') || [] + logs.unshift(Date.now()) + wx.setStorageSync('logs', logs) + + // 登录 + wx.login({ + success: res => { + // 发送 res.code 到后台换取 openId, sessionKey, unionId + } + }) + }, + globalData: { + userInfo: null + } +}) diff --git a/app.json b/app.json new file mode 100644 index 0000000..3d7616f --- /dev/null +++ b/app.json @@ -0,0 +1,14 @@ +{ + "pages":[ + "pages/index/index", + "pages/logs/logs" + ], + "window":{ + "backgroundTextStyle":"light", + "navigationBarBackgroundColor": "#fff", + "navigationBarTitleText": "Weixin", + "navigationBarTextStyle":"black" + }, + "style": "v2", + "sitemapLocation": "sitemap.json" +} diff --git a/app.wxss b/app.wxss new file mode 100644 index 0000000..06c6fc9 --- /dev/null +++ b/app.wxss @@ -0,0 +1,10 @@ +/**app.wxss**/ +.container { + height: 100%; + display: flex; + flex-direction: column; + align-items: center; + justify-content: space-between; + padding: 200rpx 0; + box-sizing: border-box; +} diff --git a/pages/index/index.js b/pages/index/index.js new file mode 100644 index 0000000..bcc2ce9 --- /dev/null +++ b/pages/index/index.js @@ -0,0 +1,136 @@ +Page({ + width: 0, //窗口宽度 + height: 0, //窗口高度 + onLoad: function () { + // 获取系统信息 + wx.getSystemInfo({ + // 获取系统信息成功，保存获取到的系统窗口的宽高 + success: res => { + // console.log(res) + this.width = res.windowWidth + this.height = res.windowHeight + } + }) + }, + timer: null, //定时器 + onReady: function(){ + //创建ctx实例 + var ctx = wx.createCanvasContext('myCanvas') + //将角度转换为弧度，方便在后面使用 + //计算公式：弧度 = 角度*Math.PI / 180 + const D6 = 6 * Math.PI / 180 + const D30 = 30 * Math.PI / 180 + const D90 = 90 * Math.PI / 180 + // 获取宽和高值 + var width = this.width, height = this.height + // 计算表盘半径，留出 30px 外边距 + var radius = width / 2 -30 + // 每秒绘制一次 + draw() + this.timer = setInterval(draw, 1000) + // 绘制函数 + function draw(){ + // 设置坐标轴原点为窗口的中心点 + ctx.translate(width / 2, height / 2) + // 绘制表盘 + drawClock(ctx,radius) + // 绘制指针 + drawHand(ctx, radius) + //执行绘制 + ctx.draw() + } + + // 绘制表盘部分 + function drawClock(ctx, radius){ + // 绘制大圆 + // 大圆的半径 radius 线条粗细为2px + ctx.setLineWidth(2) //设置线条粗细 + ctx.beginPath() //开始一个新路径 + ctx.arc(0, 0, radius, 0, 2 * Math.PI, true) + ctx.stroke() //画线 + // 绘制同心圆 + // 中心圆的半径为8px 线条粗细为1px + ctx.setLineWidth(1) //设置线条粗细 + ctx.beginPath() //开始一个新路径 + ctx.arc(0, 0, 8, 0, 2 * Math.PI, true) + ctx.stroke() //画线 + // 绘制大刻度盘 线条粗细为5px + ctx.setLineWidth(5) + for (var i = 0; i < 12; ++i){ + // 以原点为中心顺时针(多次调用旋转的角度会叠加) + // 大刻度盘需要绘制12个线条，表示12个小时，每次旋转30度 + ctx.rotate(D30) // 360 / 12 = 30 + ctx.beginPath() + ctx.moveTo(radius, 0) + ctx.moveTo(radius - 15, 0) //大刻度长度15px + ctx.stroke() + } + // 绘制小刻度盘，线条粗细为1px + ctx.setLineWidth(1) + for(var i = 0; i < 60; ++i){ + // 小刻度盘需要绘制60个线条，表示60分钟或60秒，每次旋转6度 + ctx.rotate(D6) + ctx.beginPath() + ctx.moveTo(radius, 0) + ctx.lineTo(radius - 10, 0) //小刻度盘长度10px + ctx.stroke() + } + //绘制文本 + ctx.setFontSize(20) //字号 + ctx.textBaseline = 'middle' // 文本垂直居中 + // 计算文本距离表盘中心点的半径r + var r = radius - 30 + for(var i = 1; i <= 12; ++i){ + // 利用三角函数计算文本坐标 + var x = r * Math.cos(D30 * i - D90) + var y = r * Math.sin(D30 * i - D90) + if(i > 10){ // 调整11 和12位置 + // 在画布上绘制文本 fillText(文本，左上角x坐标，左上角y坐标) + ctx.fillText(i, x - 12, y) + } else { + ctx.fillText(i, x-6, y) + } + } + } + //绘制指针部分 + function drawHand(ctx, radius){ + var t = new Date() // 获取当前时间 + var h = t.getHours() //小时 + var m = t.getMinutes() //分 + var s = t.getSeconds() // 秒 + h = h > 12 ? h -12 :h //将24小时制转换为12小时制 + //时间从三点开始，逆时针旋转90度，指向12点 + ctx.rotate(-D90) + //绘制时针 + ctx.save() //记录旋转状态 + // 计算时针指向的刻度 + // 通过 30度 * h 可以计算每个整点的旋转角度 + // 如果时间不是整点，需要使用h + m / 60 + s / 3600 计算准确的偏移度 + ctx.rotate(D30 * (h + m / 60 + s / 3600)) + ctx.setLineWidth(6) + ctx.beginPath() + ctx.moveTo(-20, 0) + ctx.lineTo(radius / 2.6, 0) + ctx.stroke() + ctx.restore() + // 绘制分针 + ctx.save() + ctx.rotate(D6 * (m + s / 60)) + ctx.setLineWidth(4) + ctx.beginPath() + ctx.moveTo(-20, 0) + ctx.lineTo(radius / 1.8, 0) + ctx.stroke() + ctx.restore() + //绘制秒针 + ctx.save() + ctx.rotate(D6 * s) + ctx.setLineWidth(2) + ctx.beginPath() + ctx.moveTo(-20, 0) + ctx.lineTo(radius / 1.6, 0) + ctx.stroke() + ctx.restore() + } + } +}) \ No newline at end of file diff --git a/pages/index/index.json b/pages/index/index.json new file mode 100644 index 0000000..8835af0 --- /dev/null +++ b/pages/index/index.json @@ -0,0 +1,3 @@ +{ + "usingComponents": {} +} \ No newline at end of file diff --git a/pages/index/index.wxml b/pages/index/index.wxml new file mode 100644 index 0000000..3f5fc59 --- /dev/null +++ b/pages/index/index.wxml @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/pages/index/index.wxss b/pages/index/index.wxss new file mode 100644 index 0000000..fd98127 --- /dev/null +++ b/pages/index/index.wxss @@ -0,0 +1,6 @@ +/**index.wxss**/ +.mycanvas { + width: 100%; + height: 100%; + position: fixed; +} \ No newline at end of file diff --git a/pages/logs/logs.js b/pages/logs/logs.js new file mode 100644 index 0000000..85f6aac --- /dev/null +++ b/pages/logs/logs.js @@ -0,0 +1,18 @@ +// logs.js +const util = require('../../utils/util.js') + +Page({ + data: { + logs: [] + }, + onLoad() { + this.setData({ + logs: (wx.getStorageSync('logs') || []).map(log => { + return { + date: util.formatTime(new Date(log)), + timeStamp: log + } + }) + }) + } +}) diff --git a/pages/logs/logs.json b/pages/logs/logs.json new file mode 100644 index 0000000..3ee76c1 --- /dev/null +++ b/pages/logs/logs.json @@ -0,0 +1,4 @@ +{ + "navigationBarTitleText": "查看启动日志", + "usingComponents": {} +} \ No newline at end of file diff --git a/pages/logs/logs.wxml b/pages/logs/logs.wxml new file mode 100644 index 0000000..0b6b645 --- /dev/null +++ b/pages/logs/logs.wxml @@ -0,0 +1,6 @@ + + + + {{index + 1}}. {{log.date}} + + diff --git a/pages/logs/logs.wxss b/pages/logs/logs.wxss new file mode 100644 index 0000000..94d4b88 --- /dev/null +++ b/pages/logs/logs.wxss @@ -0,0 +1,8 @@ +.log-list { + display: flex; + flex-direction: column; + padding: 40rpx; +} +.log-item { + margin: 10rpx; +} diff --git a/project.config.json b/project.config.json new file mode 100644 index 0000000..eab6809 --- /dev/null +++ b/project.config.json @@ -0,0 +1,52 @@ +{ + "description": "项目配置文件", + "packOptions": { + "ignore": [], + "include": [] + }, + "setting": { + "bundle": false, + "userConfirmedBundleSwitch": false, + "urlCheck": true, + "scopeDataCheck": false, + "coverView": true, + "es6": true, + "postcss": true, + "compileHotReLoad": false, + "lazyloadPlaceholderEnable": false, + "preloadBackgroundData": false, + "minified": true, + "autoAudits": false, + "newFeature": false, + "uglifyFileName": false, + "uploadWithSourceMap": true, + "useIsolateContext": true, + "nodeModules": false, + "enhance": true, + "useMultiFrameRuntime": true, + "useApiHook": true, + "useApiHostProcess": true, + "showShadowRootInWxmlPanel": true, + "packNpmManually": false, + "enableEngineNative": false, + "packNpmRelationList": [], + "minifyWXSS": true, + "showES6CompileOption": false, + "minifyWXML": true, + "babelSetting": { + "ignore": [], + "disablePlugins": [], + "outputPath": "" + }, + "condition": false + }, + "compileType": "miniprogram", + "libVersion": "2.19.4", + "appid": "wx04c517846836da71", + "projectname": "miniprogram-92", + "condition": {}, + "editorSetting": { + "tabIndent": "insertSpaces", + "tabSize": 2 + } +} \ No newline at end of file diff --git a/project.private.config.json b/project.private.config.json new file mode 100644 index 0000000..85245bc --- /dev/null +++ b/project.private.config.json @@ -0,0 +1,7 @@ +{ + "description": "项目私有配置文件。此文件中的内容将覆盖 project.config.json 中的相同字段。项目的改动优先同步到此文件中。详见文档：https://developers.weixin.qq.com/miniprogram/dev/devtools/projectconfig.html", + "projectname": "miniprogram-1", + "setting": { + "compileHotReLoad": true + } +} \ No newline at end of file diff --git a/sitemap.json b/sitemap.json new file mode 100644 index 0000000..ca02add --- /dev/null +++ b/sitemap.json @@ -0,0 +1,7 @@ +{ + "desc": "关于本文件的更多信息，请参考文档 https://developers.weixin.qq.com/miniprogram/dev/framework/sitemap.html", + "rules": [{ + "action": "allow", + "page": "*" + }] +} \ No newline at end of file diff --git a/time.png b/time.png new file mode 100644 index 0000000..5d655ae Binary files /dev/null and b/time.png differ diff --git a/utils/util.js b/utils/util.js new file mode 100644 index 0000000..764bc2c --- /dev/null +++ b/utils/util.js @@ -0,0 +1,19 @@ +const formatTime = date => { + const year = date.getFullYear() + const month = date.getMonth() + 1 + const day = date.getDate() + const hour = date.getHours() + const minute = date.getMinutes() + const second = date.getSeconds() + + return `${[year, month, day].map(formatNumber).join('/')} ${[hour, minute, second].map(formatNumber).join(':')}` +} + +const formatNumber = n => { + n = n.toString() + return n[1] ? n : `0${n}` +} + +module.exports = { + formatTime +}