# video

**Repository Path**: zsp042/video

## Basic Information

- **Project Name**: video
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2022-01-16
- **Last Updated**: 2022-05-10

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 项目概述

请把ci放到和项目同一级的目录，如

* ./ci 自动构建 https://izhenxiang.coding.net/p/desk/d/ci/git
* ./desk 桌面端 https://izhenxiang.coding.net/p/desk/d/desk/git

以下都是命令行中的流程

## 安装

需要 nodejs v17.6.0 和 python 3.9.10 、 pip

国内最好配置下镜像加速:

```
pip3 config set global.index-url https://pypi.tuna.tsinghua.edu.cn/simple
```

修改 ~/.yarnrc 如下

```
registry "https://registry.npm.taobao.org"
electron_mirror "https://npm.taobao.org/mirrors/electron/"
```

然后安装 [direnv](https://direnv.net)

windows 下开发，装`git bash`，不要用 `direnv`，其他一样

然后进入两个目录，都 `direnv allow` 一下

## 开发调试

开发一般运行 `./kill.sh;./dev.sh`


想调试打包之后的版本，可以这样

cd /Users/z/git/rv/ci/dist/darwin-x64
/Users/z/git/rv/desk/node_modules/electron/cli.js m.js

## 目录结构

* file vue中引用的静态文件
* public 文件名不变的静态文件
* src 代码
  * main electron 主进程
    * m.coffee 入口文件
  * preload [electron preload](https://www.youtube.com/watch?v=RuNnmDwgXCQ)
    * p.coffee 入口文件
  * web/src 网页代码
    * page 页面
      * page/main.vue 主窗体
      * page/main/index.vue 首页
    * vue 组件
    * store 多页面同步的持久化变量，可以被vue watch
    * worker 视频剪裁线程，用于区域录制（目录下的sh脚本用来开发调试，可以监控改动编译）
    * lib 可以复用的脚本库
* misc 小工具
  * filename_min.coffee
    压缩打包后文件的文件名，dist脚中会调用
  * node_import.sh
  如果有二进制调用（比如ffmpge），打包后需要用这个脚本把node动态库抽出来放到asar目录下。目前没用到。
  * rgb2hex.coffee
    压缩vue和styl中的rgb颜色为十六进制表示，有需要的时候手工运行
  * tray.ico.xsh
    从`file/svg/ico.svg`生成托盘图标
  * svg-compress.sh
    压缩svg文件，手工运行
* script 打包构建相关的脚本
  * watch.mjs 开发时候监控文件改动重启进程的脚本
  * dist.xsh
    dist.dev.sh 和 dist.ol.sh 公用代码
  * electron.coffee & electron.cjs :
    build.sh脚本中会调用，生成 ./config/ver.mjs , 摇树优化的时候需要知道 electron 的版本号
  * script/config.ci.sh 用来打包时候切换配置文件（是用线上版的打包配置 还是 用开发测试的配置打包）
  * script/config.sh 切换配置文件到开发模式

这两个文件夹的区别是

* misc 下面的脚本是可以独立运行的
* script 下面的脚本是不独立运行，被其他脚本调用依赖的

窗口之间通讯可以用类似下面的方式

```import broadcast from '~/lib/broadcast.coffee'```

```import ON from '~/lib/broadcast/on.coffee'```

调用主进程代码类似 ```import ipc from '~/lib/ipc.coffee'```

主进程暴露的函数见 `main/ipc.coffee`

平台相关的代码引用 ~/config/platform.mjs 然后做条件判断，这是编译期间的，摇树优化的时候会删除与当前平台无关的代码。

## 手动构建

`./desk/build.sh` 是打包文件到 ci 目录

`ci/pkg/pkg.xsh` 的打包应用 ，会输出到 `ci/release` 目录。

## 自动构建

`./desk/dist.ol.sh` 和 `./desk/dist.dev.sh` 可以打包并触发正式版和开发版的自动构建。

需要在ci/ver目录下创建相应版本的md文件（dist脚本运行失败会提示下个版本号）

自动构建在 [github action](https://github.com/izhenxiang/ci/actions/workflows/build.yml) 上进行

可以手动触发，如下图

![](https://raw.githubusercontent.com/gcxfd/img/gh-pages/C4k12f.png)

## 其他

一些细节请参见 [开发笔记](./note.md)

## 案例

0. [工具条复用音量动态背景样式](https://izhenxiang.coding.net/p/desk/d/desk/git/commit/dc0f45e30aabe732851e2fd7dc6ab075d90a6b8b)
0. [手工实现windows下拖拽以屏蔽右键](https://izhenxiang.coding.net/p/desk/d/desk/git/commit/f39661b5dc6524b0e4f498476139289437442968)
0. [打包构建自动更新区分操作系统](https://izhenxiang.coding.net/p/desk/d/desk/git/commit/731f09619d02b5d85c859dfc138b03d5bc89dee5)