Skip to content
Permalink

Comparing changes

Choose two branches to see what’s changed or to start a new pull request. If you need to, you can also or learn more about diff comparisons.

Open a pull request

Create a new pull request by comparing changes across two branches. If you need to, you can also . Learn more about diff comparisons here.
base repository: geongeorge/Canvas-Txt
Failed to load repositories. Confirm that selected base ref is valid, then try again.
Loading
base: master
Choose a base ref
...
head repository: Roll20/Canvas-Txt
Failed to load repositories. Confirm that selected head ref is valid, then try again.
Loading
compare: master
Choose a head ref
Checking mergeability… Don’t worry, you can still create the pull request.
  • 13 commits
  • 4 files changed
  • 4 contributors

Commits on Oct 13, 2023

  1. Copy the full SHA
    55b199c View commit details
  2. Copy the full SHA
    6c74132 View commit details
  3. Fixes namespace for new private npm package

    Co-authored-by: Ian-Howard-R20 <Ian-Howard-R20@users.noreply.github.com>
    danielxvu and Ian-Howard-R20 committed Oct 13, 2023
    Copy the full SHA
    d65176a View commit details
  4. Copy the full SHA
    593155f View commit details
  5. Copy the full SHA
    0994df1 View commit details
  6. Copy the full SHA
    5e7ed04 View commit details
  7. Copy the full SHA
    583de26 View commit details
  8. Copy the full SHA
    fa7ee5f View commit details
  9. Copy the full SHA
    f212a90 View commit details
  10. Copy the full SHA
    b4e59bc View commit details

Commits on Oct 19, 2023

  1. Copy the full SHA
    b0d11ec View commit details
  2. Bump version

    Ian-Howard-R20 committed Oct 19, 2023
    Copy the full SHA
    c964031 View commit details

Commits on Nov 21, 2023

  1. Copy the full SHA
    bc78d45 View commit details
Showing with 41 additions and 10 deletions.
  1. +14 −6 .github/workflows/build.yml
  2. +4 −0 README.md
  3. +2 −2 package.json
  4. +21 −2 src/canvas-txt/index.ts
20 changes: 14 additions & 6 deletions .github/workflows/build.yml
Original file line number Diff line number Diff line change
@@ -1,6 +1,10 @@
name: Node.js Build
name: Build and publish package

on: [push]
on:
push:
branches:
- master
# - feature/gh-action-for-roll20-registry

jobs:
build:
@@ -11,13 +15,17 @@ jobs:
node-version: [17.x]

steps:
- uses: actions/checkout@v2
- uses: actions/checkout@v4
- name: Use Node.js ${{ matrix.node-version }}
uses: actions/setup-node@v1
uses: actions/setup-node@v3
with:
node-version: ${{ matrix.node-version }}
registry-url: https://npm.pkg.github.com/
# Defaults to the user or organization that owns the workflow file
scope: '@roll20'
- run: yarn install
- run: yarn build
# - run: npm test
- run: yarn publish
env:
NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}
NPM_TOKEN: ${{secrets.NPM_TOKEN}}
CI: true
4 changes: 4 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
@@ -141,6 +141,10 @@ const { drawText, getTextHeight, splitText } = window.canvasTxt
| `fontWeight` | `''` | Font weight, same as css font-weight. Examples: `bold`, `100` |
| `lineHeight` | `null` | Line height of the text, if set to null it tries to auto-detect the value |
| `justify` | `false` | Justify text if `true`, it will insert spaces between words when necessary. |
| `strokeWidth` | `1` | Stroke line width. |
| `strokeColor` | `black` | Stroke color. |
| `shadowBlur` | `0` | Amount of shadow blur. |
| `shadowColor` | `black` | Color of shadow blur. |

## Methods

4 changes: 2 additions & 2 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "canvas-txt",
"version": "4.1.1",
"name": "@roll20/canvas-txt",
"version": "4.2.4",
"description": "Render multiline textboxes in HTML5 canvas with auto line breaks and better alignment system",
"files": [
"dist"
23 changes: 21 additions & 2 deletions src/canvas-txt/index.ts
Original file line number Diff line number Diff line change
@@ -16,6 +16,10 @@ export interface CanvasTextConfig {
font?: string
lineHeight?: number
justify?: boolean
strokeWidth?: number,
strokeColor?: string,
shadowColor?: string,
shadowBlur?: number,
}

const defaultConfig = {
@@ -29,6 +33,9 @@ const defaultConfig = {
font: 'Arial',
lineHeight: null,
justify: false,
strokeWidth: 0,
shadowColor: '#000000',
shadowBlur: 0,
}

function drawText(
@@ -48,7 +55,7 @@ function drawText(
const xEnd = x + width
const yEnd = y + height

const { fontStyle, fontVariant, fontWeight, fontSize, font } = config
const { fontStyle, fontVariant, fontWeight, fontSize, font, strokeColor, strokeWidth, shadowBlur, shadowColor } = config
const style = `${fontStyle} ${fontVariant} ${fontWeight} ${fontSize}px ${font}`
ctx.font = style

@@ -95,10 +102,22 @@ function drawText(
debugY = y + height / 2
txtY -= negOffset
}
if (strokeColor && strokeWidth) {
ctx.strokeStyle = strokeColor;
ctx.lineWidth = strokeWidth;
}

if (shadowBlur && shadowColor) {
ctx.shadowBlur = shadowBlur;
ctx.shadowColor = shadowColor;
}

//print all lines of text
textArray.forEach((txtline) => {
txtline = txtline.trim()
ctx.fillText(txtline, textAnchor, txtY)
if (strokeColor && strokeWidth) {
ctx.strokeText(txtline, textAnchor, txtY)
}
txtY += charHeight
})