https://github.com/francoisschwarzentruber/textmapeditor

A <24kB Web Component Text Editor with Rectangular Selection
https://github.com/francoisschwarzentruber/textmapeditor

ascii-art editor editor-tool rectangle text-editor text-editor-for-web tiny webcomponent

Last synced: 3 months ago
JSON representation

A <24kB Web Component Text Editor with Rectangular Selection

• Host: GitHub
• URL: https://github.com/francoisschwarzentruber/textmapeditor
• Owner: francoisschwarzentruber
• License: gpl-3.0
• Created: 2023-08-18T19:10:24.000Z (almost 2 years ago)
• Default Branch: main
• Last Pushed: 2024-08-02T02:37:52.000Z (11 months ago)
• Last Synced: 2025-02-20T15:39:55.042Z (4 months ago)
• Topics: ascii-art, editor, editor-tool, rectangle, text-editor, text-editor-for-web, tiny, webcomponent
• Language: JavaScript
• Homepage: https://francoisschwarzentruber.github.io/textmapeditor/
• Size: 132 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Text map editor

This text editor is an HTML Web component dedicated for editing texts like **ascii-art**, or a **tile editor**, texts where both rows and colmuns are important (hence the word **map** like a 2D map). The selection is rectangular.

![image](https://github.com/francoisschwarzentruber/textmapeditor/assets/43071857/dc4f0980-b20d-450f-9a4a-68b5fed6b4ee)

## Features

- HTML Web component

- Light

- Implemented with canvas

- Drag drop

- Rectangular selection

- Multiple cursors

- Ctrl + Z, Y: Undo/redo

- Ctrl + L: select line(s)

- Ctrl + M: select column(s)

- Ctrl + X, C, V: Cut/copy/paste

- Retro-style editor

- Cursor column/row guidelines

- UTF-8 characters

## Roadmap

- Customizable (like having pictures etc. instead of text)

## How to use it

- Add ` `

- Add ` `

- Access the text with the properties `editor.text` (the string of the full text) or `editor.lines` (array of lines)