f.weber/homebrewery
0
0
Fork 0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2025-12-24 18:32:41 +00:00
Code Wiki Activity

Add migrate nav item to pages and update migrate document

Browse Source
This commit is contained in:
Charlie Humphreys
2021-12-15 23:57:52 -06:00
parent f1c4910993
commit fd23396b95
10 changed files with 233 additions and 193 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
client/homebrew/navbar/migrate.navitem.jsx Normal file
View File

@@ -0,0 +1,13 @@
const React = require('react');
const Nav = require('naturalcrit/nav/nav.jsx');
module.exports = function(props){
return <Nav.item
className='migrate'
newTab={false}
href='/migrate'
color='blue'
icon='fas fa-route'>
migrate
</Nav.item>;
};

7
client/homebrew/navbar/navbar.less
View File

@@ -1,5 +1,5 @@
@navbarHeight : 28px;
@keyframes coloring {
@keyframes pinkColoring {
//from {color: white;}
//to {color: red;}
0% {color: pink;}
@@ -62,11 +62,14 @@
}
i{
.animate(color);
animation-name: coloring;
animation-name: pinkColoring;
animation-duration: 2s;
color: pink;
}
}
.migrate.navItem{
border-right : 1px solid #666;
}
.recent.navItem{
position : relative;
.dropdown{

2
client/homebrew/pages/editPage/editPage.jsx
View File

@@ -23,6 +23,7 @@ const Markdown = require('naturalcrit/markdown.js');
const googleDriveActive = require('../../googleDrive.png');
const googleDriveInactive = require('../../googleDriveMono.png');
const MigrateNavItem = require("../../navbar/migrate.navitem.jsx");
const SAVE_TIMEOUT = 3000;
@@ -433,6 +434,7 @@ const EditPage = createClass({
{this.renderGoogleDriveIcon()}
{this.renderSaveButton()}
<NewBrew />
<MigrateNavItem />
<ReportIssue />
<Nav.dropdown>
<Nav.item color='teal' icon='fas fa-share-alt'>

2
client/homebrew/pages/errorPage/errorPage.jsx
View File

@@ -11,6 +11,7 @@ const IssueNavItem = require('../../navbar/issue.navitem.jsx');
const RecentNavItem = require('../../navbar/recent.navitem.jsx').both;
const BrewRenderer = require('../../brewRenderer/brewRenderer.jsx');
const MigrateNavItem = require("../../navbar/migrate.navitem.jsx");
const ErrorPage = createClass({
getDefaultProps : function() {
@@ -33,6 +34,7 @@ const ErrorPage = createClass({
<Nav.section>
<PatreonNavItem />
<MigrateNavItem />
<IssueNavItem />
<RecentNavItem />
</Nav.section>

2
client/homebrew/pages/homePage/homePage.jsx
View File

@@ -10,6 +10,7 @@ const Nav = require('naturalcrit/nav/nav.jsx');
const Navbar = require('../../navbar/navbar.jsx');
const NewBrewItem = require('../../navbar/newbrew.navitem.jsx');
const IssueNavItem = require('../../navbar/issue.navitem.jsx');
const MigrateNavItem = require('../../navbar/migrate.navitem.jsx');
const RecentNavItem = require('../../navbar/recent.navitem.jsx').both;
const AccountNavItem = require('../../navbar/account.navitem.jsx');
@@ -58,6 +59,7 @@ const HomePage = createClass({
return <Navbar ver={this.props.ver}>
<Nav.section>
<NewBrewItem />
<MigrateNavItem />
<IssueNavItem />
<RecentNavItem />
<AccountNavItem />

202
client/homebrew/pages/homePage/migrate.md Normal file
View File

@@ -0,0 +1,202 @@
# How to Convert a Legacy Document to v3
Here you will find a number of steps to guide you through converting a Legacy document into a Homebrewery v3 document.
**The first thing you'll want to do is switch the editor's rendering engine from `Legacy` to `v3`.** This will be the renderer we design features for moving forward.
There are some examples of Legacy code in the code pane if you need more context behind some of the changes.
**This document will evolve as users like yourself inform us of issues with it, or areas of conversion that it does not cover. _Please_ reach out if you have any suggestions for this document.**
## Simple Replacements
To make your life a little easier with this section, a text editor like [VSCode](https://code.visualstudio.com/) or Notepad will help a lot.
The following table describes Legacy and other document elements and their Homebrewery counterparts. A simple find/replace should get these in working order.
| Legacy / Other | Homebrewery |
|:----------------|:-----------------------------|
| `\pagebreak` | `\page` |
| `======` | `\page` |
| `\pagebreaknum` | `{{pageNumber,auto}}\n\page` |
| `@=====` | `{{pageNumber,auto}}\n\page` |
| `\columnbreak` | `\column` |
| `.phb` | `.page` |
## Classed or Styled Divs
Anything that relies on the following syntax can be changed to the new Homebrewery v3 curly brace syntax:
```
<div class="classTable wide">
...
</div>
```
:
The above example is equivalent to the following in v3 syntax.
```
{{classTable,wide
...
}}
```
:
Some examples of this include class tables (as shown above), descriptive blocks, notes, and spell lists.
\column
## Margins and Padding
Any manual margins and padding to push text down the page will likely need to be updated. Colons can be used on lines by themselves to push things down the page vertically if you'd rather not set pixel-perfect margins or padding.
## Notes
In Legacy, notes are denoted using markdown blockquote syntax. In Homebrewery v3, this is replaced by the curly brace syntax.
<!--
> ##### Catchy Title
> Useful Information
-->
{{note
##### Title
Information
}}
## Split Tables
Split tables also use the curly brace syntax, as the new renderer can handle style values separately from class names.
<!--
<div style='column-count:2'>
| d8 | Loot |
|:---:|:-----------:|
| 1 | 100gp |
| 2 | 200gp |
| 3 | 300gp |
| 4 | 400gp |
| d8 | Loot |
|:---:|:-----------:|
| 5 | 500gp |
| 6 | 600gp |
| 7 | 700gp |
| 8 | 1000gp |
</div>
-->
##### Typical Difficulty Classes
{{column-count:2
| Task Difficulty | DC |
|:----------------|:--:|
| Very easy | 5 |
| Easy | 10 |
| Medium | 15 |
| Task Difficulty | DC |
|:------------------|:--:|
| Hard | 20 |
| Very hard | 25 |
| Nearly impossible | 30 |
}}
## Blockquotes
Blockquotes are denoted by the `>` character at the beginning of the line. In Homebrewery's v3 renderer, they hold virtually no meaning and have no CSS styling. You are free to use blockquotes when styling your document or creating themes without needing to worry about your CSS affecting other parts of the document.
{{pageNumber,auto}}
\page
## Stat Blocks
There are pretty significant differences between stat blocks on the Legacy renderer and Homebrewery v3. This section contains a list of changes that will need to be made to update the stat block.
### Initial Changes
You will want to **remove all leading** `___` that started the stat block in Legacy, and replace that with `{{monster` before the stat block, and `}}` after it.
**If you want a frame** around the stat block, you can add `,frame` to the curly brace definition.
**If the stat block was wide**, make sure to add `,wide` to the curly brace definition.
### Blockquotes
The key difference is the lack of blockquotes. Legacy documents use the `>` symbol at the start of the line for each line in the stat block, and the v3 renderer does not. **You will want to remove all `>` characters at the beginning of all lines, and delete any leading spaces.**
### Lists
The basic characteristics and advanced characteristics sections are not list elements in Homebrewery. You will want to **remove all `-` or `*` characters from the beginning of lines.**
### Spacing
In order to have the correct spacing after removing the list elements, you will want to **add two colons between the name of each basic/advanced characteristic and its value.** _(see example in the code pane)_
Additionally, in the special traits and actions sections, you will want to add a colon at the beginning of each line that separates a trait/action from another, as seen below. **Any empty lines between special traits and actions should contain only a colon.** _(see example in the code pane)_
\column
{{margin-top:102px}}
<!--
### Legacy/Other Document Example:
___
> ## Centaur
> *Large Monstrosity, neutral good*
>___
> - **Armor Class** 12
> - **Hit Points** 45(6d10 + 12)
> - **Speed** 50ft.
>___
>|STR|DEX|CON|INT|WIS|CHA|
>|:---:|:---:|:---:|:---:|:---:|:---:|
>|18 (+4)|14 (+2)|14 (+2)|9 (-1)|13 (+1)|11 (+0)|
>___
> - **Skills** Athletics +6, Perception +3, Survival +3
> - **Senses** passive Perception 13
> - **Languages** Elvish, Sylvan
> - **Challenge** 2 (450 XP)
> ___
> ***Charge.*** If the centaur moves at least 30 feet straight toward a target and then hits it with a pike attack on the same turn, the target takes an extra 10 (3d6) piercing damage.
>
> ***Second Thing*** More details.
>
> ### Actions
> ***Multiattack.*** The centaur makes two attacks: one with its pike and one with its hooves or two with its longbow.
>
> ***Pike.*** *Melee Weapon Attack:* +6 to hit, reach 10 ft., one target. *Hit:* 9 (1d10 + 4) piercing damage.
>
> ***Hooves.*** *Melee Weapon Attack:* +6 to hit, reach 5 ft., one target. *Hit:* 11 (2d6 + 4) bludgeoning damage.
>
> ***Longbow.*** *Ranged Weapon Attack:* +4 to hit, range 150/600 ft., one target. *Hit:* 6 (1d8 + 2) piercing damage.
-->
### Homebrewery example:
{{monster
## Centaur
*Large monstrosity, neutral good*
___
**Armor Class** :: 12
**Hit Points** :: 45(6d10 + 12)
**Speed** :: 50ft.
___
| STR | DEX | CON | INT | WIS | CHA |
|:-----:|:-----:|:-----:|:-----:|:-----:|:-----:|
|18 (+4)|14 (+2)|14 (+2)|9 (-1) |13 (+1)|11 (+0)|
___
**Skills** :: Athletics +6, Perception +3, Survival +3
**Senses** :: passive Perception 13
**Languages** :: Elvish, Sylvan
**Challenge** :: 2 (450 XP)
___
***Charge.*** If the centaur moves at least 30 feet straight toward a target and then hits it with a pike attack on the same turn, the target takes an extra 10 (3d6) piercing damage.
:
***Second Thing*** More details.
### Actions
***Multiattack.*** The centaur makes two attacks: one with its pike and one with its hooves or two with its longbow.
:
***Pike.*** *Melee Weapon Attack:* +6 to hit, reach 10 ft., one target. *Hit:* 9 (1d10 + 4) piercing damage.
:
***Hooves.*** *Melee Weapon Attack:* +6 to hit, reach 5 ft., one target. *Hit:* 11 (2d6 + 4) bludgeoning damage.
:
***Longbow.*** *Ranged Weapon Attack:* +4 to hit, range 150/600 ft., one target. *Hit:* 6 (1d8 + 2) piercing damage.
}}
{{pageNumber,auto}}

169
client/homebrew/pages/homePage/migrate_gmb.md
View File

@@ -1,169 +0,0 @@
# How to Convert a GMBinder Document to Homebrewery
Here you will find a number of steps to guide you through converting a GMBinder document into a Homebrewery document.
**This document will evolve as users like yourself inform us of issues with it, or areas of conversion that it does not cover. _Please_ reach out if you have any suggestions for this document.**
The first thing you'll want to do is switch the editor's rendering engine from `Legacy` to `v3`. This will be the renderer we design features for moving forward.
### Simple Text Replacements
To make your life a little easier with this section, we recommend using a text editor like [VSCode](https://code.visualstudio.com/) or Notepad.
The following table describes GMBinder elements and their Homebrewery counterparts. A simple find/replace should get these in working order.
| GMBinder | Homebrewery |
|:----------------|:---|
| `\pagebreak` | `\page` |
| `======` | `\page` |
| `\pagebreaknum` | `{{pageNumber,auto}}\n\page` |
| `@=====` | `{{pageNumber,auto}}\n\page` |
| `\columnbreak` | `\column` |
| `.phb` | `.page` |
### Margins and Padding
Any manual margins and padding to push text down the page will likely need to be updated. Something to note is immediately after a column break
\page
## Stat Blocks
{{wide
There are pretty significant differences between stat blocks on GMBinder and Homebrewery. In this section we will describe a list of find/replace commands you can run against your GMB stat block to help make migrating them easier.
}}
### GMBinder Example:
```
___
> ## Centaur
> *Large Monstrosity, neutral good*
>___
> - **Armor Class** 12
> - **Hit Points** 45(6d10 + 12)
> - **Speed** 50ft.
>___
>|STR|DEX|CON|INT|WIS|CHA|
>|:---:|:---:|:---:|:---:|:---:|:---:|
>|18 (+4)|14 (+2)|14 (+2)|9 (-1)|13 (+1)|11 (+0)|
>___
> - **Skills** Athletics +6, Perception +3, Survival +3
> - **Senses** passive Perception 13
> - **Languages** Elvish, Sylvan
> - **Challenge** 2 (450 XP)
> ___
> ***Charge.*** If the centaur moves at least 30 feet straight toward a target and then hits it with a pike attack on the same turn, the target takes an extra 10 (3d6) piercing damage.
>
> ***Second Thing*** More details.
>
> ### Actions
> ***Multiattack.*** The centaur makes two attacks: one with its pike and one with its hooves or two with its longbow.
>
> ***Pike.*** *Melee Weapon Attack:* +6 to hit, reach 10 ft., one target. *Hit:* 9 (1d10 + 4) piercing damage.
>
> ***Hooves.*** *Melee Weapon Attack:* +6 to hit, reach 5 ft., one target. *Hit:* 11 (2d6 + 4) bludgeoning damage.
>
> ***Longbow.*** *Ranged Weapon Attack:* +4 to hit, range 150/600 ft., one target. *Hit:* 6 (1d8 + 2) piercing damage.
```
\column
### Homebrewery example:
```
{{monster
## Centaur
*Large monstrosity, neutral good*
___
**Armor Class** :: 12
**Hit Points** :: 45(6d10 + 12)
**Speed** :: 50ft.
___
| STR | DEX | CON | INT | WIS | CHA |
|:-----:|:-----:|:-----:|:-----:|:-----:|:-----:|
|18 (+4)|14 (+2)|14 (+2)|9 (-1) |13 (+1)|11 (+0)|
___
**Skills** :: Athletics +6, Perception +3, Survival +3
**Senses** :: passive Perception 13
**Languages** :: Elvish, Sylvan
**Challenge** :: 2 (450 XP)
___
***Charge.*** If the centaur moves at least 30 feet straight toward a target and then hits it with a pike attack on the same turn, the target takes an extra 10 (3d6) piercing damage.
:
***Second Thing*** More details.
### Actions
***Multiattack.*** The centaur makes two attacks: one with its pike and one with its hooves or two with its longbow.
:
***Pike.*** *Melee Weapon Attack:* +6 to hit, reach 10 ft., one target. *Hit:* 9 (1d10 + 4) piercing damage.
:
***Hooves.*** *Melee Weapon Attack:* +6 to hit, reach 5 ft., one target. *Hit:* 11 (2d6 + 4) bludgeoning damage.
:
***Longbow.*** *Ranged Weapon Attack:* +4 to hit, range 150/600 ft., one target. *Hit:* 6 (1d8 + 2) piercing damage.
}}
```
\page
{{monster
## Centaur
*Large monstrosity, neutral good*
___
**Armor Class** :: 12
**Hit Points** :: 45(6d10 + 12)
**Speed** :: 50ft.
___
| STR | DEX | CON | INT | WIS | CHA |
|:-----:|:-----:|:-----:|:-----:|:-----:|:-----:|
|18 (+4)|14 (+2)|14 (+2)|9 (-1) |13 (+1)|11 (+0)|
___
**Skills** :: Athletics +6, Perception +3, Survival +3
**Senses** :: passive Perception 13
**Languages** :: Elvish, Sylvan
**Challenge** :: 2 (450 XP)
___
***Charge.*** If the centaur moves at least 30 feet straight toward a target and then hits it with a pike attack on the same turn, the target takes an extra 10 (3d6) piercing damage.
:
***Second Thing*** More details.
### Actions
***Multiattack.*** The centaur makes two attacks: one with its pike and one with its hooves or two with its longbow.
:
***Pike.*** *Melee Weapon Attack:* +6 to hit, reach 10 ft., one target. *Hit:* 9 (1d10 + 4) piercing damage.
:
***Hooves.*** *Melee Weapon Attack:* +6 to hit, reach 5 ft., one target. *Hit:* 11 (2d6 + 4) bludgeoning damage.
:
***Longbow.*** *Ranged Weapon Attack:* +4 to hit, range 150/600 ft., one target. *Hit:* 6 (1d8 + 2) piercing damage.
}}
\column
**Use these find/replace commands in the order listed for the best result.**
#### Blockquotes
The key difference is the lack of blockquotes. GMBinder uses the `>` symbol at the start of the line for each line in the stat block, and Homebrewery's v3 renderer does not. **You will want to remove all `>` characters at the beginning of all lines, and delete any leading spaces.**
#### Lists
The basic characteristics and advanced characteristics sections are not list elements in Homebrewery. **You will want to remove all `-` or `*` characters from the beginning of lines.**
#### Spacing
In order to have the correct spacing after removing the list elements, **you will want to add two colons (`::`) between the name of each basic/advanced characteristic and its value.** i.e:
```
**Skills** :: Athletics +6
```
:
Additionally, in the special traits and actions sections, you will want to add a colon at the beginning of each line that separates a trait/action from another, as seen below. **Any empty lines between special traits and actions should contain only a colon.**
```
### Actions
***Multiattack.*** The centaur makes two attacks: one with its pike and one with its hooves or two with its longbow.
:
***Pike.*** *Melee Weapon Attack:* +6 to hit, reach 10 ft., one target. *Hit:* 9 (1d10 + 4) piercing damage.
```
:
#### Final Notes
Lastly you will want to remove the leading `___` that started the stat block in GMBinder, and replace that with `{{monster` before the stat block, and `}}` after it. If you want a frame around the stat block, you can use `{{monster,frame` instead.

2
client/homebrew/pages/newPage/newPage.jsx
View File

@@ -16,6 +16,7 @@ const IssueNavItem = require('../../navbar/issue.navitem.jsx');
const SplitPane = require('naturalcrit/splitPane/splitPane.jsx');
const Editor = require('../../editor/editor.jsx');
const BrewRenderer = require('../../brewRenderer/brewRenderer.jsx');
const MigrateNavItem = require("../../navbar/migrate.navitem.jsx");
const BREWKEY = 'homebrewery-new';
const STYLEKEY = 'homebrewery-new-style';
@@ -290,6 +291,7 @@ const NewPage = createClass({
<Nav.section>
{this.renderSaveButton()}
{this.renderLocalPrintButton()}
<MigrateNavItem />
<IssueNavItem />
<RecentNavItem />
<AccountNavItem />

8
server.js
View File

@@ -103,7 +103,7 @@ app.use(require('./server/admin.api.js'));
const HomebrewModel = require('./server/homebrew.model.js').model;
const welcomeText = require('fs').readFileSync('./client/homebrew/pages/homePage/welcome_msg.md', 'utf8');
const welcomeTextV3 = require('fs').readFileSync('./client/homebrew/pages/homePage/welcome_msg_v3.md', 'utf8');
const migrateGMBText = require('fs').readFileSync('./client/homebrew/pages/homePage/migrate_gmb.md', 'utf8');
const migrateText = require('fs').readFileSync('./client/homebrew/pages/homePage/migrate.md', 'utf8');
const changelogText = require('fs').readFileSync('./changelog.md', 'utf8');
const faqText = require('fs').readFileSync('./faq.md', 'utf8');
@@ -134,10 +134,10 @@ app.get('/v3_preview', async (req, res, next)=>{
return next();
});
//GMBinder Migration Guide
app.get('/migrate-from-gmb', async (req, res, next)=>{
//Legacy/Other Document -> v3 Migration Guide
app.get('/migrate', async (req, res, next)=>{
const brew = {
text : migrateGMBText,
text : migrateText,
renderer : 'V3'
};
splitTextAndStyle(brew);

19
shared/naturalcrit/markdown.js
View File

@@ -535,24 +535,7 @@ module.exports = {
marked : Markdown,
render : (rawBrewText)=>{
rawBrewText = rawBrewText.replace(/^\\column$/gm, `\n<div class='columnSplit'></div>\n`)
.replace(/^(:+)$/gm, (match, _, i)=>{
let test, matches=[];
const codeBlock = /`/gm, inlineCodeBlock = /[^`]`[^`]/g;
while (test = codeBlock.exec(rawBrewText)) {
matches.push(test);
}
// console.log(match, m, i, indexes);
if(matches.filter((m)=>m.index < i).length % 2 !== 0) return match;
// matches = [];
// while (test = inlineCodeBlock.exec(rawBrewText)) {
// matches.push(test);
// }
// console.log(matches, match, i);
// if(matches.filter((m)=>m.index < i).length % 2 !== 0) return match;
return `${`<div class='blank'></div>`.repeat(match.length)}\n`;
});
.replace(/^(:+)$/gm, (match)=>`${`<div class='blank'></div>`.repeat(match.length)}\n`);
return Markdown(
sanatizeScriptTags(rawBrewText),
{ renderer: renderer }