How to insert text into editor after menu button is clicked?
- Dominant language
- JavaScript
- Stars
- 20k
- Forks
- 1.1k
- Avg merge
- 3d 12h
- Merged PRs (30d)
- 13
Description
I want to add custom button to Trix editor that would allow a user to enter url of video (YouTube, Vimeo) and then new element will be inserted at current cursor position. The video ID would be encrypted.
I managed to add a button but I have troubles to use .insertString()
```
Trix.config.textAttributes.zzVideo = {
// style: { color: "red" },
parser: function(element) {
var tEditor = document.querySelector("trix-editor")
console.log(tEditor)
console.log(tEditor.editor)
console.log(element)
console.log(element.editor)
//tEditor.insertString("Hello")
// element.insertString("Hellow")
return //element.style.color === "red"
},
inheritable: true
}
```
https://jsfiddle.net/radek/aL8ochdm/19/
If you also could guide me how to open a modal upon menu button click so user can enter the url it would be great.
Contributor guide
No contributing guide indexed for this repository
Research direction
Start with the linked JSFiddle and the Trix.config.textAttributes.zzVideo/parser and trix-editor entry points. Read the editor API around insertString and the custom menu button flow before deciding how insertion and modal input should work. Done means the requested video element is inserted at the current cursor position with the video ID encrypted, and the URL-entry interaction is defined.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- frontend
- Issue type
- Feature
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 25/100