🐛 Remove transparent and use hideTitleBar

.github/workflows/pake-cli.yaml

@@ -28,8 +28,8 @@ on:
         description: '[Height, Optional]'
         required: false
         default: '780'
-      transparent:
-        description: '[Transparent, Optional, MacOS only]'
+      hide_title_bar:
+        description: '[Hide TitleBar, Optional, MacOS only]'
         required: false
         type: boolean
         default: false
@@ -124,7 +124,7 @@ jobs:
           ICON: ${{ inputs.icon }}
           HEIGHT: ${{ inputs.height }}
           WIDTH: ${{ inputs.width }}
-          TRANSPARENT: ${{ inputs.transparent }}
+          HIDE_TITLE_BAR: ${{ inputs.hide_title_bar }}
           FULLSCREEN: ${{ inputs.fullscreen }}
           RESIZE: ${{ inputs.resize }}
           MULTI_ARCH: ${{ inputs.multi_arch }}

README.md

@@ -171,7 +171,7 @@ npm install -g pake-cli
 pake url [OPTIONS]...
 
 # Feel free to play with Pake! It might take a while to prepare the environment the first time you launch Pake.
-pake https://weekly.tw93.fun --name Weekly --transparent
+pake https://weekly.tw93.fun --name Weekly --hide-title-bar
 ```
 
 If you are new to the command line, you can compile packages online with _GitHub Actions_. See the [Tutorial](<https://github.com/tw93/Pake/wiki/Online-Compilation-(used-by-ordinary-users)>) for more information.
@@ -197,7 +197,7 @@ npm run build
 
 1. You can refer to the [codebase structure](https://github.com/tw93/Pake/wiki/Description-of-Pake's-code-structure) before working on Pake, which will help you much in development.
 2. Modify the `url` and `productName` fields in the `pake.json` file under the src-tauri directory, the "domain" field in the `tauri.config.json` file needs to be modified synchronously, as well as the `icon` and `identifier` fields in the `tauri.xxx.conf.json` file. You can select an `icon` from the `icons` directory or download one from [macOSicons](https://macosicons.com/#/) to match your product needs.
-3. For configurations on window properties, you can modify the `pake.json` file to change the value of `width`, `height`, `fullscreen` (or not), `resizable` (or not) of the `windows` property. To adapt to the immersive header on Mac, change `transparent` to `true`, look for the `Header` element, and add the `padding-top` property.
+3. For configurations on window properties, you can modify the `pake.json` file to change the value of `width`, `height`, `fullscreen` (or not), `resizable` (or not) of the `windows` property. To adapt to the immersive header on Mac, change `hideTitleBar` to `true`, look for the `Header` element, and add the `padding-top` property.
 4. For advanced usages such as style rewriting, advertisement removal, JS injection, container message communication, and user-defined shortcut keys, see [Advanced Usage of Pake](https://github.com/tw93/Pake/wiki/Advanced-Usage-of-Pake).
 
 ## Developers

README_CN.md

@@ -174,7 +174,7 @@ npm install -g pake-cli
 pake url [OPTIONS]...
 
 # 随便玩玩，首次由于安装环境会有些慢，后面就快了
-pake https://weekly.tw93.fun --name Weekly --transparent
+pake https://weekly.tw93.fun --name Weekly --hide-title-bar
 ```
 
 假如你不太会使用命令行，或许使用 **GitHub Actions 在线编译多系统版本** 是一个不错的选择，可查看 [文档](https://github.com/tw93/Pake/wiki/%E5%9C%A8%E7%BA%BF%E7%BC%96%E8%AF%91%EF%BC%88%E6%99%AE%E9%80%9A%E7%94%A8%E6%88%B7%E4%BD%BF%E7%94%A8%EF%BC%89)。
@@ -199,7 +199,7 @@ npm run build
 
 1. 代码结构可参考 [文档](https://github.com/tw93/Pake/wiki/Pake-%E7%9A%84%E4%BB%A3%E7%A0%81%E7%BB%93%E6%9E%84%E8%AF%B4%E6%98%8E)，便于你在开发前了解更多。
 2. 修改 src-tauri 目录下 `pake.json` 中的 `url` 和 `productName` 字段，需同步修改下 `tauri.config.json` 中的 `domain` 字段，以及 `tauri.xxx.conf.json` 中的 `icon` 和 `identifier` 字段，其中 `icon` 可以从 icons 目录选择一个，也可以去 [macOSicons](https://macosicons.com/#/) 下载符合效果的。
-3. 关于窗口属性设置，可以在 `pake.json` 修改 windows 属性对应的 `width/height`，fullscreen 是否全屏，resizable 是否可以调整大小，假如想适配 Mac 沉浸式头部，可以将 transparent 设置成 `true`，找到 Header 元素加一个 padding-top 样式即可，不想适配改成 `false` 也行。
+3. 关于窗口属性设置，可以在 `pake.json` 修改 windows 属性对应的 `width/height`，fullscreen 是否全屏，resizable 是否可以调整大小，假如想适配 Mac 沉浸式头部，可以将 hideTitleBar 设置成 `true`，找到 Header 元素加一个 padding-top 样式即可，不想适配改成 `false` 也行。
 4. 此外样式改写、屏蔽广告、逻辑代码注入、容器消息通信、自定义快捷键可见 [高级用法](https://github.com/tw93/Pake/wiki/Pake-%E7%9A%84%E9%AB%98%E7%BA%A7%E7%94%A8%E6%B3%95)。
 
 ## 开发者

bin/builders/BaseBuilder.ts

@@ -107,7 +107,8 @@ export default abstract class BaseBuilder {
   }
 
   protected getBasePath(): string {
-    return 'src-tauri/target/release/bundle/';
+    const basePath = this.options.debug ? 'debug' : 'release';
+    return `src-tauri/target/${basePath}/bundle/`;
   }
 
   protected getBuildAppPath(npmDirectory: string, fileName: string, fileType: string): string {

bin/cli.ts

@@ -30,7 +30,7 @@ program
   .option('--width <number>', 'Window width', validateNumberInput, DEFAULT.width)
   .option('--height <number>', 'Window height', validateNumberInput, DEFAULT.height)
   .option('--fullscreen', 'Start in full screen', DEFAULT.fullscreen)
-  .option('--hide-title-bar', 'Only for Mac, hide title bar', DEFAULT.transparent)
+  .option('--hide-title-bar', 'Only for Mac, hide title bar', DEFAULT.hideTitleBar)
   .option('--activation-shortcut <string>', 'Shortcut key to active App', DEFAULT.activationShortcut)
   .option('--multi-arch', 'Only for Mac, supports both Intel and M1', DEFAULT.multiArch)
   .option('--inject [injects...]', 'Injection of .js or .css Files', DEFAULT.inject)
@@ -42,7 +42,6 @@ program
   .addOption(new Option('--disabled-web-shortcuts', 'Disabled webPage shortcuts').default(DEFAULT.disabledWebShortcuts).hideHelp())
   .addOption(new Option('--show-system-tray', 'Show system tray in app').default(DEFAULT.showSystemTray).hideHelp())
   .addOption(new Option('--system-tray-icon <string>', 'Custom system tray icon').default(DEFAULT.systemTrayIcon).hideHelp())
-  .addOption(new Option('--transparent', 'Only for Mac, hide title bar').default(DEFAULT.transparent).hideHelp())
   .version(packageJson.version, '-v, --version', 'Output the current version')
   .action(async (url: string, options: PakeCliOptions) => {
     await checkUpdateTips();

bin/defaults.ts

@@ -6,7 +6,7 @@ export const DEFAULT_PAKE_OPTIONS: PakeCliOptions = {
   width: 1200,
   fullscreen: false,
   resizable: true,
-  transparent: false,
+  hideTitleBar: false,
   alwaysOnTop: false,
   disabledWebShortcuts: false,
   activationShortcut: '',
@@ -22,10 +22,10 @@ export const DEFAULT_PAKE_OPTIONS: PakeCliOptions = {
 };
 
 // Just for cli development
-export const DEFAULT_DEV_PAKE_OPTIONS: PakeCliOptions & {url: string} = {
+export const DEFAULT_DEV_PAKE_OPTIONS: PakeCliOptions & { url: string } = {
   ...DEFAULT_PAKE_OPTIONS,
   url: 'https://weread.qq.com',
   name: 'WeRead',
-  safeDomain:['weread.qq.com'],
-  transparent: true,
-}
+  safeDomain: ['weread.qq.com'],
+  hideTitleBar: true,
+};

bin/helpers/merge.ts

@@ -12,9 +12,10 @@ export async function mergeConfig(url: string, options: PakeAppOptions, tauriCon
     width,
     height,
     fullscreen,
-    transparent,
+    hideTitleBar,
     alwaysOnTop,
     disabledWebShortcuts,
+    activationShortcut,
     userAgent,
     showSystemTray,
     systemTrayIcon,
@@ -33,10 +34,11 @@ export async function mergeConfig(url: string, options: PakeAppOptions, tauriCon
     width,
     height,
     fullscreen,
-    transparent,
-    alwaysOnTop,
-    disabledWebShortcuts,
     resizable,
+    hide_title_bar: hideTitleBar,
+    activation_shortcut: activationShortcut,
+    always_on_top: alwaysOnTop,
+    disabled_web_shortcuts: disabledWebShortcuts,
   };
   Object.assign(tauriConf.pake.windows[0], { url, ...tauriConfWindowOptions });
 

bin/types.ts

@@ -21,8 +21,8 @@ export interface PakeCliOptions {
   // Whether the window can be fullscreen, default false
   fullscreen: boolean;
 
-  // Enable immersive header, default false
-  transparent: boolean;
+  // Enable immersive header, default false.
+  hideTitleBar: boolean;
 
   // Enable windows always on top, default false
   alwaysOnTop: boolean;

dist/cli.js

@@ -1,5 +1,5 @@
 import chalk from 'chalk';
-import { InvalidArgumentError, program } from 'commander';
+import { InvalidArgumentError, program, Option } from 'commander';
 import log from 'loglevel';
 import path from 'path';
 import fsExtra from 'fs-extra';
@@ -20,7 +20,7 @@ import psl from 'psl';
 import isUrl from 'is-url';
 
 var name = "pake-cli";
-var version = "2.3.8";
+var version = "2.4.0-beta1";
 var description = "🤱🏻 Turn any webpage into a desktop app with Rust. 🤱🏻 利用 Rust 轻松构建轻量级多端桌面应用。";
 var engines = {
 	node: ">=16.0.0"
@@ -126,12 +126,15 @@ var packageJson = {
 var windows = [
 	{
 		url: "https://weread.qq.com",
-		transparent: true,
+		url_type: "web",
+		hide_title_bar: true,
 		fullscreen: false,
 		width: 1200,
 		height: 780,
 		resizable: true,
-		url_type: "web"
+		always_on_top: false,
+		activation_shortcut: "",
+		disabled_web_shortcuts: false
 	}
 ];
 var user_agent = {
@@ -471,15 +474,18 @@ async function combineFiles(files, output) {
 }
 
 async function mergeConfig(url, options, tauriConf) {
-    const { width, height, fullscreen, transparent, userAgent, showSystemTray, systemTrayIcon, iterCopyFile, identifier, name, resizable = true, inject, safeDomain, } = options;
+    const { width, height, fullscreen, hideTitleBar, alwaysOnTop, disabledWebShortcuts, activationShortcut, userAgent, showSystemTray, systemTrayIcon, iterCopyFile, identifier, name, resizable = true, inject, safeDomain, } = options;
     const { platform } = process;
     // Set Windows parameters.
     const tauriConfWindowOptions = {
         width,
         height,
         fullscreen,
-        transparent,
         resizable,
+        hide_title_bar: hideTitleBar,
+        activation_shortcut: activationShortcut,
+        always_on_top: alwaysOnTop,
+        disabled_web_shortcuts: disabledWebShortcuts,
     };
     Object.assign(tauriConf.pake.windows[0], { url, ...tauriConfWindowOptions });
     tauriConf.package.productName = name;
@@ -682,7 +688,7 @@ class BaseBuilder {
         const isChina = await isChinaDomain('www.npmjs.com');
         const spinner = getSpinner('Installing package...');
         const rustProjectDir = path.join(tauriSrcPath, '.cargo');
-        const projectConf = path.join(rustProjectDir, 'config');
+        const projectConf = path.join(rustProjectDir, 'config.toml');
         await fsExtra.ensureDir(rustProjectDir);
         if (isChina) {
             logger.info('✺ Located in China, using npm/rsProxy CN mirror.');
@@ -729,7 +735,8 @@ class BaseBuilder {
         return this.options.debug ? 'npm run build:debug' : 'npm run build';
     }
     getBasePath() {
-        return 'src-tauri/target/release/bundle/';
+        const basePath = this.options.debug ? 'debug' : 'release';
+        return `src-tauri/target/${basePath}/bundle/`;
     }
     getBuildAppPath(npmDirectory, fileName, fileType) {
         return path.join(npmDirectory, this.getBasePath(), fileType.toLowerCase(), `${fileName}.${fileType}`);
@@ -823,7 +830,10 @@ const DEFAULT_PAKE_OPTIONS = {
     width: 1200,
     fullscreen: false,
     resizable: true,
-    transparent: false,
+    hideTitleBar: false,
+    alwaysOnTop: false,
+    disabledWebShortcuts: false,
+    activationShortcut: '',
     userAgent: '',
     showSystemTray: false,
     multiArch: false,
@@ -1014,17 +1024,19 @@ program
     .option('--icon <string>', 'Application icon', DEFAULT_PAKE_OPTIONS.icon)
     .option('--width <number>', 'Window width', validateNumberInput, DEFAULT_PAKE_OPTIONS.width)
     .option('--height <number>', 'Window height', validateNumberInput, DEFAULT_PAKE_OPTIONS.height)
-    .option('--transparent', 'Only for Mac, hide title bar', DEFAULT_PAKE_OPTIONS.transparent)
     .option('--fullscreen', 'Start in full screen', DEFAULT_PAKE_OPTIONS.fullscreen)
-    .option('--user-agent <string>', 'Custom user agent', DEFAULT_PAKE_OPTIONS.userAgent)
-    .option('--show-system-tray', 'Show system tray in app', DEFAULT_PAKE_OPTIONS.showSystemTray)
-    .option('--system-tray-icon <string>', 'Custom system tray icon', DEFAULT_PAKE_OPTIONS.systemTrayIcon)
-    .option('--iter-copy-file', 'Copy files when URL is a local file', DEFAULT_PAKE_OPTIONS.iterCopyFile)
+    .option('--hide-title-bar', 'Only for Mac, hide title bar', DEFAULT_PAKE_OPTIONS.hideTitleBar)
+    .option('--activation-shortcut <string>', 'Shortcut key to active App', DEFAULT_PAKE_OPTIONS.activationShortcut)
     .option('--multi-arch', 'Only for Mac, supports both Intel and M1', DEFAULT_PAKE_OPTIONS.multiArch)
-    .option('--targets <string>', 'Only for Linux, option "deb" or "appimage"', DEFAULT_PAKE_OPTIONS.targets)
     .option('--inject [injects...]', 'Injection of .js or .css Files', DEFAULT_PAKE_OPTIONS.inject)
     .option('--safe-domain [domains...]', 'Domains that Require Security Configuration"', DEFAULT_PAKE_OPTIONS.safeDomain)
-    .option('--debug', 'Debug mode', DEFAULT_PAKE_OPTIONS.debug)
+    .option('--debug', 'Debug build and more output', DEFAULT_PAKE_OPTIONS.debug)
+    .addOption(new Option('--user-agent <string>', 'Custom user agent').default(DEFAULT_PAKE_OPTIONS.userAgent).hideHelp())
+    .addOption(new Option('--targets <string>', 'Only for Linux, option "deb" or "appimage"').default(DEFAULT_PAKE_OPTIONS.targets).hideHelp())
+    .addOption(new Option('--always-on-top', 'Always on the top level').default(DEFAULT_PAKE_OPTIONS.alwaysOnTop).hideHelp())
+    .addOption(new Option('--disabled-web-shortcuts', 'Disabled webPage shortcuts').default(DEFAULT_PAKE_OPTIONS.disabledWebShortcuts).hideHelp())
+    .addOption(new Option('--show-system-tray', 'Show system tray in app').default(DEFAULT_PAKE_OPTIONS.showSystemTray).hideHelp())
+    .addOption(new Option('--system-tray-icon <string>', 'Custom system tray icon').default(DEFAULT_PAKE_OPTIONS.systemTrayIcon).hideHelp())
     .version(packageJson.version, '-v, --version', 'Output the current version')
     .action(async (url, options) => {
     await checkUpdateTips();

package.json

@@ -1,6 +1,6 @@
 {
   "name": "pake-cli",
-  "version": "2.3.8",
+  "version": "2.4.0",
   "description": "🤱🏻 Turn any webpage into a desktop app with Rust. 🤱🏻 利用 Rust 轻松构建轻量级多端桌面应用。",
   "engines": {
     "node": ">=16.0.0"

script/build_with_pake_cli.js

@@ -13,7 +13,7 @@ console.log('name: ', process.env.NAME);
 console.log('icon: ', process.env.ICON);
 console.log('height: ', process.env.HEIGHT);
 console.log('width: ', process.env.WIDTH);
-console.log('transparent: ', process.env.TRANSPARENT);
+console.log('hide-title-bar: ', process.env.HIDE_TITLE_BAR);
 console.log('resize: ', process.env.RESIZE);
 console.log('is multi arch? only for Mac: ', process.env.MULTI_ARCH);
 console.log('targets type? only for Linux: ', process.env.TARGETS);
@@ -22,8 +22,8 @@ console.log('===========================\n');
 cd('node_modules/pake-cli');
 let params = `node cli.js ${process.env.URL} --name ${process.env.NAME} --height ${process.env.HEIGHT} --width ${process.env.WIDTH}`;
 
-if (process.env.TRANSPARENT === 'true') {
-  params = `${params} --transparent`;
+if (process.env.HIDE_TITLE_BAR === 'true') {
+  params = `${params} --hide-title-bar`;
 }
 
 if (process.env.FULLSCREEN === 'true') {

src-tauri/pake.json

@@ -3,7 +3,7 @@
     {
       "url": "https://weread.qq.com",
       "url_type": "web",
-      "transparent": true,
+      "hide_title_bar": true,
       "fullscreen": false,
       "width": 1200,
       "height": 780,

src-tauri/src/app/config.rs

@@ -3,7 +3,7 @@ use serde::{Deserialize, Serialize};
 #[derive(Debug, Serialize, Deserialize)]
 pub struct WindowConfig {
     pub url: String,
-    pub transparent: bool,
+    pub hide_title_bar: bool,
     pub fullscreen: bool,
     pub width: f64,
     pub height: f64,

src-tauri/src/app/window.rs

@@ -42,7 +42,7 @@ pub fn get_window(app: &mut App, config: PakeConfig, _data_dir: PathBuf) -> Wind
 
     #[cfg(target_os = "macos")]
     {
-        let title_bar_style = if window_config.transparent {
+        let title_bar_style = if window_config.hide_title_bar {
             TitleBarStyle::Overlay
         } else {
             TitleBarStyle::Visible

src-tauri/src/inject/style.js

@@ -412,7 +412,7 @@ window.addEventListener('DOMContentLoaded', _event => {
     }
   `;
   const isMac = navigator.platform.toUpperCase().indexOf('MAC') >= 0;
-  if (window['pakeConfig']?.transparent && isMac) {
+  if (window['pakeConfig']?.hide_title_bar && isMac) {
     const topPaddingStyleElement = document.createElement('style');
     topPaddingStyleElement.innerHTML = topPaddingCSS;
     document.head.appendChild(topPaddingStyleElement);