diff --git a/README.md b/README.md index 13d357e3..e11f177d 100644 --- a/README.md +++ b/README.md @@ -1,16 +1,12 @@ -智龙迷城队伍图制作工具 | Puzzle & Dragons Formation Maker +智龙急速阵型 | P&D Dash Formation ====== -这个工具可以帮助你方便的制作和分享车队阵型或单人队形。易用的编辑界面，电脑、手机上都可以轻松使用。 -This tool can help you easily create and share Swipe Formation or Solo Formation. Easy to use editing interface and use on your PC and Phone. +这是一个智龙迷城队伍图制作工具。 +This is a Puzzle & Dragons Formation Maker. -### 目前支持的语言 | Supported Languages -1. 中文（简体） -1. 中文（繁體） -1. English -1. 日本語 (by Bing Microsoft Translator) -1. 한국어 (by Bing Microsoft Translator) +这个工具可以帮助你方便的制作和分享车队阵型或单人队形。电脑、智能手机上都可以轻松使用。 +This tool can help you easily create and share Swipe Formation or Solo Formation. Easy to use on your PC and Smart Phone. -### 预览 \| Preview +### 预览 | Preview | **单人 \| Solo** | **2人协力 \| 2P** | | :---: | :---: | @@ -18,19 +14,13 @@ This tool can help you easily create and share Swipe Formation or Solo Formation | **3人协力 \| 3P** | **手机 \| Mobile** | | ![3人协力界面预览](document/preview-capture-3p.png) | ![手机端预览](document/preview-mobile.jpg) | - # 如何使用 | HOW TO USE ## 快速使用在线版 | Online Quick Start * (Github Pages) [![](https://www.mozilla.org/media/img/firefox/favicon.ico)Firefox](https://www.mozilla.org/firefox/new/) is recommended on your phone for better performance. Chrome is very slow when searching for a large number of cards -* http://mapaler.gitee.io/paddashformation/ (码云的镜象，国内用这个更快 | Chinese mirror) +* (码云的镜象，国内用这个更快 | Chinese mirror) 手机上使用 [![](https://www.mozilla.org/media/img/firefox/favicon.ico)火狐浏览器](https://www.mozilla.org/firefox/new/) 具有更好的性能，Chrome 卡死了。 -### 示例链接 | Sample Link - * [单人示例](http://mapaler.gitee.io/paddashformation/solo.html?d={"t"%3A"千鸟^ff3600^【7×6版面】^p换队长打里·异形"%2C"d"%3A"%25{m5537}可以换%25{m3524}"%2C"f"%3A[[[[5537%2C110%2C9%2C99%2C[18%2C11%2C11%2C10%2C11]%2C1]%2C[5141%2C110%2C9%2C99%2C[11%2C11%2C11%2C11%2C11%2C10]%2C2]%2C[5004%2C110%2C9%2C99%2C[19%2C19%2C11%2C11]%2C0]%2C[5658%2C110%2C9%2C99%2C[19%2C11%2C11%2C11%2C11]%2C0]%2C[3898%2C110%2C9%2C99%2C[25%2C11%2C11%2C11%2C11]%2C0]%2C[5658%2C110%2C9%2C99%2C[19%2C19%2C11%2C11]%2C2]]%2C[[5573%2C1%2C7%2C99]%2C[5591%2C1%2C6%2C99]%2C[5582%2C1%2C6]%2C[5656%2C1%2C6]%2C[4897%2C99%2C5%2C99]%2C[5420%2C99%2C5%2Cnull%2Cnull%2Cnull%2C1]]]]%2C"b"%3A13}) | [Solo Sample](//mapaler.github.io/PADDashFormation/solo.html?d={"t"%3A"千鸟^ff3600^【7×6版面】^p换队长打里·异形"%2C"d"%3A"%25{m5537}可以换%25{m3524}"%2C"f"%3A[[[[5537%2C110%2C9%2C99%2C[18%2C11%2C11%2C10%2C11]%2C1]%2C[5141%2C110%2C9%2C99%2C[11%2C11%2C11%2C11%2C11%2C10]%2C2]%2C[5004%2C110%2C9%2C99%2C[19%2C19%2C11%2C11]%2C0]%2C[5658%2C110%2C9%2C99%2C[19%2C11%2C11%2C11%2C11]%2C0]%2C[3898%2C110%2C9%2C99%2C[25%2C11%2C11%2C11%2C11]%2C0]%2C[5658%2C110%2C9%2C99%2C[19%2C19%2C11%2C11]%2C2]]%2C[[5573%2C1%2C7%2C99]%2C[5591%2C1%2C6%2C99]%2C[5582%2C1%2C6]%2C[5656%2C1%2C6]%2C[4897%2C99%2C5%2C99]%2C[5420%2C99%2C5%2Cnull%2Cnull%2Cnull%2C1]]]]%2C"b"%3A13}) - * [2P车队示例](http://mapaler.gitee.io/paddashformation/multi.html?d={"t"%3A"我的^2288FF^水^p车队%20|%20My%20^2288FF^Water^p%20Swip%20Formation"%2C"d"%3A"%25{m2186}最好换%25{m4877}\n%25{m4877}%20is%20better%20than%20%25{m2186}"%2C"f"%3A[[[[4691%2C104%2C9%2C99%2C[19%2C19%2C11%2C11]%2C1]%2C[2186%2C101%2C8%2C99%2C[20%2C20%2C20]%2C0]%2C[4877%2C101%2C9%2C99%2C[19%2C19%2C11%2C11]]%2C[4793%2C99%2C7%2C99]%2C[4877%2C101%2C9%2C99%2C[23%2C23%2C11%2C11]]]%2C[[4252%2C38%2C9]%2C[4394%2C1%2C3%2Cnull%2Cnull%2Cnull%2C1]%2C[4394%2C1%2C3%2Cnull%2Cnull%2Cnull%2C1]%2C[4155%2C1%2C7%2Cnull%2Cnull%2Cnull%2C1]%2C[4394%2C1%2C3%2Cnull%2Cnull%2Cnull%2C1]]]%2C[[[4691%2C110%2C9%2C99%2C[19%2C19%2C11%2C11]%2C1]%2C[4877%2C102%2C9%2C99%2C[19%2C19%2C11%2C11]]%2C[4877%2C101%2C9%2C99%2C[23%2C23%2C11%2C11]]%2C[4793%2C99%2C7%2C99%2C[21%2C21%2C21]]%2C[2186%2C101%2C8%2C99%2Cnull%2C0]]%2C[[4394%2C12%2C3%2Cnull%2Cnull%2Cnull%2C1]%2C[4394%2C1%2C3%2Cnull%2Cnull%2Cnull%2C1]%2C[4394%2C1%2C3%2C99%2Cnull%2Cnull%2C1]%2C[4155%2C1%2C7%2Cnull%2Cnull%2Cnull%2C1]%2C[4394%2C1%2C3%2Cnull%2Cnull%2Cnull%2C1]]]]}) | [2P Multi Formation Sample](//mapaler.github.io/PADDashFormation/multi.html?d={"t"%3A"我的^2288FF^水^p车队%20|%20My%20^2288FF^Water^p%20Swip%20Formation"%2C"d"%3A"%25{m2186}最好换%25{m4877}\n%25{m4877}%20is%20better%20than%20%25{m2186}"%2C"f"%3A[[[[4691%2C104%2C9%2C99%2C[19%2C19%2C11%2C11]%2C1]%2C[2186%2C101%2C8%2C99%2C[20%2C20%2C20]%2C0]%2C[4877%2C101%2C9%2C99%2C[19%2C19%2C11%2C11]]%2C[4793%2C99%2C7%2C99]%2C[4877%2C101%2C9%2C99%2C[23%2C23%2C11%2C11]]]%2C[[4252%2C38%2C9]%2C[4394%2C1%2C3%2Cnull%2Cnull%2Cnull%2C1]%2C[4394%2C1%2C3%2Cnull%2Cnull%2Cnull%2C1]%2C[4155%2C1%2C7%2Cnull%2Cnull%2Cnull%2C1]%2C[4394%2C1%2C3%2Cnull%2Cnull%2Cnull%2C1]]]%2C[[[4691%2C110%2C9%2C99%2C[19%2C19%2C11%2C11]%2C1]%2C[4877%2C102%2C9%2C99%2C[19%2C19%2C11%2C11]]%2C[4877%2C101%2C9%2C99%2C[23%2C23%2C11%2C11]]%2C[4793%2C99%2C7%2C99%2C[21%2C21%2C21]]%2C[2186%2C101%2C8%2C99%2Cnull%2C0]]%2C[[4394%2C12%2C3%2Cnull%2Cnull%2Cnull%2C1]%2C[4394%2C1%2C3%2Cnull%2Cnull%2Cnull%2C1]%2C[4394%2C1%2C3%2C99%2Cnull%2Cnull%2C1]%2C[4155%2C1%2C7%2Cnull%2Cnull%2Cnull%2C1]%2C[4394%2C1%2C3%2Cnull%2Cnull%2Cnull%2C1]]]]}) - * [3P协力示例](http://mapaler.gitee.io/paddashformation/triple.html?d={"t"%3A"3P%20Sample"%2C"d"%3A"3P没啥好的例子"%2C"f"%3A[[[[4691%2C104%2C9%2C99%2C[19%2C19%2C11%2C11]%2C1]%2C[2186%2C101%2C8%2C99%2C[20%2C20%2C20]%2C0]%2C[4877%2C101%2C9%2C99%2C[19%2C19%2C11%2C11]]%2C[4793%2C99%2C7%2C99]%2C[5322%2C101%2C9%2C99%2C[20%2C20%2C20]]%2C[4691%2C110%2C9%2C99%2C[19%2C19%2C11%2C11]%2C1]]%2C[[4252%2C38%2C9]%2C[5632%2C1%2C6%2C99]%2C[4394%2C1%2C3%2Cnull%2Cnull%2Cnull%2C1]%2C[4155%2C1%2C7%2Cnull%2Cnull%2Cnull%2C1]%2C[4828%2C5%2C3]%2C[4394%2C12%2C3%2Cnull%2Cnull%2Cnull%2C1]]]%2C[[[4691%2C110%2C9%2C99%2C[19%2C19%2C11%2C11]%2C1]%2C[2186%2C101%2C8%2C99%2Cnull%2C0]%2C[4877%2C102%2C9%2C99%2C[19%2C19%2C11%2C11]]%2C[4793%2C99%2C7%2C99%2C[21%2C21%2C21]]%2C[4877%2C101%2C9%2C99%2C[23%2C23%2C11%2C11]]%2C[4691%2C104%2C9%2C99%2C[19%2C19%2C11%2C11]%2C1]]%2C[[4394%2C12%2C3%2Cnull%2Cnull%2Cnull%2C1]%2C[4394%2C1%2C3%2Cnull%2Cnull%2Cnull%2C1]%2C[4394%2C1%2C3%2Cnull%2Cnull%2Cnull%2C1]%2C[4155%2C1%2C7%2Cnull%2Cnull%2Cnull%2C1]%2C[4394%2C1%2C3%2Cnull%2Cnull%2Cnull%2C1]%2C[4252%2C38%2C9]]]%2C[[[5888%2C110%2C9%2C99%2C[19%2C19%2C11%2C11]]%2C[4877%2C99%2C9%2C99]%2C[4877%2C99%2C9%2C99]%2C[4877%2C99%2C9%2C99]%2C[2540%2C110%2C8%2C99%2C[11%2C11%2C11%2C11%2C11%2C11]%2C0]%2C[5887%2C99%2C9%2Cnull%2C[11%2C11%2C11%2C11%2C11%2C11]]]%2C[[0%2C0%2C0]%2C[0%2C0%2C0]%2C[0%2C0%2C0]%2C[0%2C0%2C0]%2C[0%2C0%2C0]%2C[0%2C0%2C0]]]]}) | [3P Multi Formation Sample](//mapaler.github.io/PADDashFormation/triple.html?d={"t"%3A"3P%20Sample"%2C"d"%3A"3P没啥好的例子"%2C"f"%3A[[[[4691%2C104%2C9%2C99%2C[19%2C19%2C11%2C11]%2C1]%2C[2186%2C101%2C8%2C99%2C[20%2C20%2C20]%2C0]%2C[4877%2C101%2C9%2C99%2C[19%2C19%2C11%2C11]]%2C[4793%2C99%2C7%2C99]%2C[5322%2C101%2C9%2C99%2C[20%2C20%2C20]]%2C[4691%2C110%2C9%2C99%2C[19%2C19%2C11%2C11]%2C1]]%2C[[4252%2C38%2C9]%2C[5632%2C1%2C6%2C99]%2C[4394%2C1%2C3%2Cnull%2Cnull%2Cnull%2C1]%2C[4155%2C1%2C7%2Cnull%2Cnull%2Cnull%2C1]%2C[4828%2C5%2C3]%2C[4394%2C12%2C3%2Cnull%2Cnull%2Cnull%2C1]]]%2C[[[4691%2C110%2C9%2C99%2C[19%2C19%2C11%2C11]%2C1]%2C[2186%2C101%2C8%2C99%2Cnull%2C0]%2C[4877%2C102%2C9%2C99%2C[19%2C19%2C11%2C11]]%2C[4793%2C99%2C7%2C99%2C[21%2C21%2C21]]%2C[4877%2C101%2C9%2C99%2C[23%2C23%2C11%2C11]]%2C[4691%2C104%2C9%2C99%2C[19%2C19%2C11%2C11]%2C1]]%2C[[4394%2C12%2C3%2Cnull%2Cnull%2Cnull%2C1]%2C[4394%2C1%2C3%2Cnull%2Cnull%2Cnull%2C1]%2C[4394%2C1%2C3%2Cnull%2Cnull%2Cnull%2C1]%2C[4155%2C1%2C7%2Cnull%2Cnull%2Cnull%2C1]%2C[4394%2C1%2C3%2Cnull%2Cnull%2Cnull%2C1]%2C[4252%2C38%2C9]]]%2C[[[5888%2C110%2C9%2C99%2C[19%2C19%2C11%2C11]]%2C[4877%2C99%2C9%2C99]%2C[4877%2C99%2C9%2C99]%2C[4877%2C99%2C9%2C99]%2C[2540%2C110%2C8%2C99%2C[11%2C11%2C11%2C11%2C11%2C11]%2C0]%2C[5887%2C99%2C9%2Cnull%2C[11%2C11%2C11%2C11%2C11%2C11]]]%2C[[0%2C0%2C0]%2C[0%2C0%2C0]%2C[0%2C0%2C0]%2C[0%2C0%2C0]%2C[0%2C0%2C0]%2C[0%2C0%2C0]]]]}) - ## 下载后使用本地版 | Use the local version after downloaded [下载压缩包](//gitee.com/mapaler/PADDashFormation/repository/archive/master)或`git clone`后使用浏览器打开`index.html`。 [Download ZIP](//codeload.github.com/Mapaler/PADDashFormation/zip/master) or `git clone`, and open the `index.html` with Browser. @@ -41,7 +31,14 @@ Chrome browser need start with the additional argument `--allow-file-access-from ## [帮助和提示 | Help and Tips](help.md) -# 翻译我 | TRANSLATE ME +# 翻译我 | Translate me +## 目前支持的语言 | Languages currently supported +1. 中文（简体） +1. 中文（繁體） +1. English +1. 日本語 (by Bing Microsoft Translator) +1. 한국어 (by Bing Microsoft Translator) + ## How to **Pull requests** 1. Click **Fork** In the page top right corner. Fork your own copy of this repository to your account. 1. Use Git to clone/pull repository locally for modification (How to modify please see below). diff --git a/document/tips-arrow-change-henshin.webp b/document/tips-arrow-change-henshin.webp new file mode 100644 index 00000000..77bf3520 Binary files /dev/null and b/document/tips-arrow-change-henshin.webp differ diff --git a/help.md b/help.md index 6527eeec..957efa32 100644 --- a/help.md +++ b/help.md @@ -1,19 +1,30 @@ -智龙迷城队伍图制作工具帮助
Help of *Puzzle & Dragons Formation Maker* +智龙迷城队伍图制作工具使用技巧
Tips of *Puzzle & Dragons Formation Maker* ====== -* 直接复制网址即可分享组队或自己添加收藏夹保存。 -Copy the URL directly to share the Formation, or add a Bookmark to archives. +## 目录 | Index +* [分享队伍 | Share your team](#分享--share) +* [队伍编辑技巧 | Convenient tips for edit](#编辑技巧--editing-tips) +* [搜索图鉴 | Search cards](#搜索图鉴--search-cards) +* [文字说明的高级功能 | Advanced of the description](#文字的高级功能--advanced-of-text-detail) +* [其他 | Others](#其他--others) +* [报告BUG | Report BUG](#报告bug--report-bug) + +## 分享 | Share +### 通过网址分享和收藏队伍 | Share and collect teams by URL +直接复制网址即可分享组队或自己添加收藏夹保存。 +Copy the URL directly to share the Formation, or add a Bookmark to collect. ![分享组队](document/tips-share.png) 为了更方便的分享，你可以使用任意第三方*短网址服务*进一步缩短网址。 For easier sharing, you can further shorten your URL using any third-party *Short URL Service*. Like, [bitly](https://bitly.com/). -* 可以使用摄像头读取队伍二维码 +### 二维码分享 | Share by QR Code +可以使用摄像头读取队伍二维码 You can use the camera to read the Formation QR code ![使用摄像头读取二维码](document/tips-qr-read.webp) 读取到的队伍会显示为链接 The read Formation appears as a link ![成功读取到二维码](document/tips-qr-read-found.png) 目前可以读取 | Currently can read: - 1. 本程序格式的二维码 - This program format QR code + 1. 本程序自有格式的二维码 + This program's own format QR code ![PDF二维码](document/tips-qr-pdf.png) 1. 使用浏览器扩展生成本程序组队网址链接的二维码 QR code of this program Formation URL which generated by browser extension. @@ -21,17 +32,26 @@ The read Formation appears as a link 1. PDC 的二维码 PDC format QR code ![PDC二维码](document/tips-qr-pdc.webp) -* 使用后退即可撤销上一次修改。 -Use back to undo the last edit. + +## 编辑技巧 | Editing tips +* 使用**后退**即可撤销上一次修改，需要重做则使用前进。 +Use **Back** to undo the last edit, redo with Forward. ![撤銷修改](document/tips-undo.png) -* 拖拽怪物头像即可快速交换位置或复制怪物，也支持手机触屏。 -Drag monster avatars to quickly swap positions or copy monster, also supports mobile touch screen. -![切换位置](document/tips-interchangeCard.png) +* **拖拽**卡片头像即可快速交换位置，也支持手机触屏。 +**Drag** card avatars to quickly swap member's positions, also supports mobile touch screen. +![切换位置](document/tips-interchangeCard.png) +使用顶部的开关可以切换到复制模式 +Use the switch at the top can switch to copy mode. * 如果你希望使用技能切换队长，使用切换按钮。这样可以保留原始队长强调边框，和76版面图标。 If you want switch leader by skill, use the switch button. This preserves the original leader accent border, and the 76 board icon. ![切换位置](document/tips-switch-leader.png) -* 可以在编辑界面的怪物ID输入**怪物名称**或**标签**来搜索怪物。（键入回车以执行） -You can search for monsters by entering the **Monster Name** or **Tags** in the monster ID of the editing interface.(Type Enter to execute) +* 使用`Ctrl + ←/→`，或小键盘上的`←/→`(需关闭`NumLock`)可以快速切换变身。 +You can using `Ctrl + ←/→` or `←/→` on keypad (turn `NumLock` off) to quickly change Henshin. +![关闭小键盘](document/tips-arrow-change-henshin.webp) + +## 搜索图鉴 | Search cards +* 可以在编辑界面的怪物ID输入**怪物名称**或**标签**来搜索卡片。 +You can search for card by entering the **Monster Name** or **Tags** in the monster ID of the editing interface. ![搜索怪物名称](document/tips-search-name.png) * 点击**技能名称**，可搜索相同主动技能宠物 Click on **Skill Name** to search for the same active skills Cards. @@ -42,18 +62,22 @@ Click the **Series ID** or **Tags** to search for series. * 复制本版本游戏数据的**标签**，可在游戏中搜索系列名称 Copy the **Tag** of this version of the game data can search for the series in the game. ![在游戏中搜索怪物系列](document/tips-search-TagInGame.png) -* 点击编辑界面的怪物头像可以跳转到攻略网站。 -Click on the monster avatar in the editing interface to jump to the Guide. +* 点击编辑界面的卡片头像可以跳转到攻略网站。 +Click on the card avatar in the editing interface to jump to the Guide. ![攻略网站](document/tips-guide.png) 在队伍界面和搜索结果的怪物头像上，点击鼠标中键也可以跳转到攻略网站。在手机上则是长按怪物头像然后选择在新标签页打开。 Or click the middle mouse button on the monster avatar of the formation interface and search results to jump to the Guide. On your phone, you're long-pressing the monster avatar and then selecting to open it in a new tab. ![攻略网站2](document/tips-guide2.png) + +## 文字的高级功能 | Advanced of text detail * 队伍标题与队伍说明可以使用`^16进制颜色代码^内容^p`来改变内容颜色； Formation Title and Detail can use the `^[Hex Color Code]^Content^p` to change the color of the Content. ![文字颜色](document/tips-advanced-color.png) `%{m怪物ID}`可以显示怪物头像。 `%{m[Monster ID]}` can display the monster avatar. ![怪物头像](document/tips-advanced-card.png) + +## 其他 | Others * 2人只显示部分共用的觉醒的统计（不包括超觉醒），单人和三人则全部显示。 The 2P Multi Games Mode shows only several common awoken statistics (excluding super-awakening), but the Solo and 3P Mode shows all. * 内建的截图按钮依靠 [html2canvas](https://github.com/niklasvh/html2canvas/)，会有一些绘制错误，浏览器的截图扩展能够更加还原显示的真实样子。 @@ -62,5 +86,5 @@ Built-in screenshot button relies on [html2canvas](https://github.com/niklasvh/h If you just want to use this program as a simple guide, you can add `guide=1` to the parameters, such as `https://mapaler.github.io/PADDashFormation/solo.html?guide=1`. When you enter the page in guide mode, the monster modification interface opens directly and the background is opaque. ## 报告BUG | Report BUG -如果发现 BUG，请先按 Ctrl+F5 强制刷新后测试，如仍有问题可以在 [Issues](//github.com/Mapaler/PADDashFormation/issues) 报告。 -If a BUG is found, first test again after force refresh by Ctrl-F5, if there is still a problem, you can report it at the [Issues](//github.com/Mapaler/PADDashFormation/issues). \ No newline at end of file +如果发现 BUG，请先按 Ctrl+F5 强制刷新，并点击数据更新时间按钮强制更新数据。如仍存在问题可以在 [Issues](//github.com/Mapaler/PADDashFormation/issues) 报告。 +If a BUG is found, first test again after force refresh by Ctrl-F5, then click the Data Update Time button to force update the data. If there is still a problem, you can report it at the [Issues](//github.com/Mapaler/PADDashFormation/issues). \ No newline at end of file diff --git a/multi.html b/multi.html index 42aee4f3..979b8d8f 100644 --- a/multi.html +++ b/multi.html @@ -64,7 +64,6 @@ var formation = new Formation(teamsCount,5); -
@@ -74,6 +73,9 @@ var formation = new Formation(teamsCount,5);
+
+ +

diff --git a/solo.html b/solo.html index aa34806f..fb3874ba 100644 --- a/solo.html +++ b/solo.html @@ -42,7 +42,6 @@ var formation = new Formation(teamsCount,6); -
@@ -52,6 +51,9 @@ var formation = new Formation(teamsCount,6);
+
+ +

diff --git a/style.css b/style.css index b9e81afa..30491082 100644 --- a/style.css +++ b/style.css @@ -2527,7 +2527,10 @@ icon.inflicts::after content: "🕴️变身"; } */ - +.control-box .lbl-henshin-change button +{ + font-size: 2em; +} .control-box .btn-henshin-back::before{ content: "◀️"; } diff --git a/triple.html b/triple.html index 286e0682..99dadc5b 100644 --- a/triple.html +++ b/triple.html @@ -63,10 +63,12 @@ var formation = new Formation(teamsCount,6); -
+
+ +