# interesting-code

**Repository Path**: lin_peng118/interesting-code

## Basic Information

- **Project Name**: interesting-code
- **Description**: 用来存放一些有趣好玩的代码：videoToCanvas，drawRectangle，audioRecord，photoRecord，videoRecord等
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 5
- **Forks**: 0
- **Created**: 2022-09-26
- **Last Updated**: 2025-10-16

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# interesting-code

#### 有趣项目介绍
用来存放一些有趣好玩的代码
00. web主页 home
0. Utils 基础算法集合
1. videoToCanvas 视频转canvas/视频字符流显示化（已接入lve.js）（开发结束）
2. drawRectangle 对矩形的绘制/拖动/缩放（支持八个角的缩放及边界范围限制）（已接入lve.js）（开发结束）
3. imageColorSelect 图片颜色选择器（已接入lve.js）（开发结束）
4. colorTransfer 获取canvas画布上主色调，然后对主色调去反色差的颜色(里面包含了完整的hex和rgba互转方法)（开发结束）
5. audioRecord 录音相关（开始/暂停/继续/结束/播放/上传 录音）（开发结束）
6. photoRecord 拍照并将照片绘制成canvas（开发结束）
7. promise 手撕Promise（开发结束）
8. chatServer 局域网聊天室（开发结束）
9. postMessage postMessage跨页面通信
10. colorPicker 调色盘（偏移问题待解决）
11. videoRecord 浏览器屏幕录制(textToVideoRecord 文本格式录屏)
12. interestingCss 有趣的css合集
13. LveRecord 库新增（基于videoRecord 浏览器屏幕录制(textToVideoRecord 文本格式录屏) 单独提出来成为库）
14. imageCut 图片截取, 包含图片插入后的截图生成/清除/导出（开发结束）
15. love 表白代码
16. LveVideoJs 视频播放器(由videoToCanvas开发而来)(开发中)
17. attachmentProblem 针对canvas的连线题
18. birthday 生日祝福
19. loadingBall 跳动的小球（加载效果）
20. requestAnimationFrame兼容写法(/Utils/requestAnimationFrame.js)
21. ballRotate 小球围绕大球旋转
22. browserCoordinate 浏览器坐标系属性讲解
23. lddyStockCalendar 收益日历
24. blueSkyGreenGrass 蓝天白云青草css
25. draggable 原生实现列表拖拽
26. IntersectionObserver-rootMargin
27. catComputerSvg 小猫敲击电脑的svg动画
28. wordsToAudio 文字转语音
29. yanhua 浪漫烟花css效果
30. imgToVideo （开发中）
31. vue2Tree vue2 + element-ui 树组件(包含修改、删除、新增同级/子级组件)
32. locateMap 地图定位

#### lve.js
core 核心文件，后续每个有趣项目都会用这个简易版vue（注意：本项目中的lvejs相关不是最新的了，最新的lvejs请到下面链接处进入）
[LveJs仓库](https://gitee.com/lin_peng118/lve-js)


#### lveRecord.js
浏览器屏幕录制(textToVideoRecord 文本格式录屏)（注意：本项目中的lveRecordjs相关不是最新的了，最新的lveRecordJs请到下面链接处进入）
[LveRecordJs仓库](https://gitee.com/lin_peng118/lve-record-js)

#### lveVideo.js
视频播放器（注意：本项目中的lveVideoJs相关不是最新的了，最新的lveVideoJs请到下面链接处进入）
[LveVideoJs仓库](https://gitee.com/lin_peng118/lve-video-js)

#### lveRectangle.js
LveRectangleJs V1.0.0
矩形绘制 + 矩形类 用于在对应dom上绘制出一个矩形框，并获取相关坐标信息
[预览地址](https://www.linyannova.top/drawRectangle)
[LveRectangleJs仓库](https://gitee.com/lin_peng118/lve-rectangle-js)
#### 超实用推荐项目
0. drawRectangle 绘制矩形框(正在封装矩形类)(已单独封装抽离为 LveRectangleJs)

#### 目前遗留问题

core：
1. 数组相关（待开发）
2. 文档注释dom元素不支持
3. class样式不支持
4. v-if 支持初始化, 不能动态更改
5. VNode虚拟dom类
6. Error异常类
7. computed（待开发）
8. {{}}内放置变量或函数响应式 正在开发中
9. 动态style 正在开发中
10. 动态class 正在开发中
11. :model 兼容input开发 正在开发中

#### 目前已支持

1. :model双向绑定各种基本/引用类型已经支持（v-model）
2. 绑定style支持
3. 绑定方法支持
4. watch方法支持（监听深层对象和监听基本类型一致）
5. template双括号支持
6. input事件支持
7. 支持null, undefined 数据类型
8. 支持created、mounted、destroyed生命周期
9. data 深层对象已经支持了
10. :show支持（v-show）
11. :if支持初始化（v-if）

#### 链接

1.  [林大大哟唯一博客](https://blog.csdn.net/qq_39404437?type=blog)
2.  [林大大哟gitee地址](https://gitee.com/lin_peng118)