react 实现div缩放、旋转、拖拽的9个控制点

发表于 2020-12-22 更新于 2021-03-05 评论数： 0
本文字数： 9.8k 阅读时长 ≈ 9 分钟

react 实现div缩放、旋转、拖拽的9个控制点

这段时间一个canvas 库所实现的元素拖拽控制，觉得很不错。于是自己用js + div 来实现一个。用了react 框架，练练手。

思路

在被控制的元素的四条边和四个角添加8个控制点控制点。拖拽控制点时判断拖拽的方向，计算偏移量。修改元素的top、left、width、height。
旋转功能是通过三角函数计算鼠标拖动后的角度。动态修改元素的rotate

阅读全文 »

职教云-云课堂刷课脚本-免费开源

发表于 2020-10-13 更新于 2020-11-27 评论数： 0
本文字数： 251 阅读时长 ≈ 1 分钟

职教云

智慧职教-云课堂刷课脚本

之前帮人写了一个职教云课堂的刷课脚本，现在也用不着了。在这里分享出来。
用nodejs 写的脚本。调用网页接口，无需打开浏览器。
在这里插入图片描述

阅读全文 »

CSS一键设置页面暗黑模式、哀悼模式

发表于 2020-10-12 更新于 2020-11-27 评论数： 0
本文字数： 818 阅读时长 ≈ 1 分钟

一键暗黑模式

1
2
3

html[theme='dark-mode'] {
    filter: invert(1) hue-rotate(180deg);
}

阅读全文 »

nodejs 保存上传文件

发表于 2020-10-12 更新于 2020-11-25 评论数： 0
本文字数： 1.3k 阅读时长 ≈ 1 分钟

nodejs 保存上传文件

我用的是thinkjs搭建的项目。功能实现是一样的。

import {think} from "thinkjs";
import fs from 'fs';
import * as path from 'path';

/**
 * 保存文件
 * @param filename  // 文件名
 * @param tempPath  // 上传的临时文件路径
 * @param base64    // base64 字符串
 * @param prefix - 文件夹前缀
 */
export async function saveFile(filename: string, tempPath: string, base64?: string, prefix: string = 'static/upload') {
       // 将 fs.rename promise 化
    const renameFile = think.promisify(fs.rename, fs);
       // 文件保存目录
    const savePath = think.config('UPLOAD_PATH');
       // 创建文件夹 // fs.mkdir
    think.mkdir(savePath);
       // 文件后缀
    const suffix = filename.split('.').pop();

    // 对文件名进行过滤
    const name = filename.split('.').shift().replace(/[\s\\\/,.*@#$%^&\|""“”：:]/gi, '');
    const newname = `${name}_${Date.now()}.${suffix}`;
    // 如果是base64 文件的话 进行转buffer保存
    if (base64) {
        base64 = base64.replace(/^data:\w+\/\w+;base64,/, '');
        const buffer = new Buffer(base64, 'base64');
        fs.writeFileSync(path.join(savePath, newname), buffer);
    } else {
        // 直接移动文件保存
        await renameFile(tempPath, path.join(savePath, newname));
    }
    // 返回文件资源链接
    return `${think.config('BASE_URL')}/${prefix}/${newname}`;
}