More examples #46
Comments
+1 |
+1. For custom blocks, having rich link preview could be another option. For selection tracking, fixed static or even air toolbar examples would be swell.
|
Wouldn't the markdown stuff be pretty simple using something along the tweet example? I've created a little (incomplete) gist that would use marked.js: https://gist.github.com/bkniffler/ba6a95d82f2c5c06f77b |
Do you mean generating markdown output? I mentioned in http://facebook.github.io/draft-js/docs/api-reference-data-conversion.html that we aren't providing a ContentState-to-markdown conversion tool with the framework since we don't have a production use for markdown at Facebook, but I expect that someone will create such a utility very soon. Certainly using decorators could be one way to style the contents immediately when markdown is applied, if that's your objective. |
+1 headache for the document no effect at _onBoldClick function , nothing changed, and this is es5
|
+1 this is great |
I'd love to see an example on how the toolbar works as seen in facebook notes. e.g. when you have a block selected, to the far left there's a couple of icons to alter your formatting or insert an image. Is this done by rendering the content block which has focus differently? EDIT: Related to #45 |
I put together a demo repo that functions more like facebook notes if anyone needs. |
You seem to have similar goals like me, maybe we should join forces on this one instead of working on different repos. What do you think? https://github.com/bkniffler/draft-wysiwyg |
@bkniffler Sure, nice work, I just took a look at your repo and what you've got so far looks pretty good |
Summary:Looks like people were interested in seeing an example using media (#46). I created an example that shows how to use Custom Block Components to attach audio, image, and video into the editor. Side note: The docs (http://facebook.github.io/draft-js/docs/advanced-topics-block-components.html) led me to believe it's much simpler to render custom blocks. However, more steps (see `insertMedia(...)`) were needed to wrap around the media for it to work well. The `tex` example (https://github.com/facebook/draft-js/blob/master/examples/tex/js/modifiers/insertTeXBlock.js) has the same code to handle this. Can we provide this as a utility function? Closes #67 Reviewed By: hellendag Differential Revision: D2989709 fb-gh-sync-id: 76c11119760c61d9935e4dd14030fb85485355d2 fbshipit-source-id: 76c11119760c61d9935e4dd14030fb85485355d2
@hellendag : If you don't use the markdown, then how you convert the contentState to HTML format in facebook notes? |
@satyadeeproat, apologies for the late reply. To answer your question, we don't generate HTML for Facebook notes. We use the state to build the react tree. Looks like some of the demo's asked for are now in the examples folder. If there are other examples people would like, please fee free to reopen and ask, or even better would be to submit a PR for one. |
@bkniffler I report a bug in your gist. |
Why draft-js doesn't have a way to visualize your content without rendering the editor as The text is saved as blocksMap array as json string and I don't know how to visualize this content. This is no make sense! |
Summary:Looks like people were interested in seeing an example using media (facebookarchive/draft-js#46). I created an example that shows how to use Custom Block Components to attach audio, image, and video into the editor. Side note: The docs (http://facebook.github.io/draft-js/docs/advanced-topics-block-components.html) led me to believe it's much simpler to render custom blocks. However, more steps (see `insertMedia(...)`) were needed to wrap around the media for it to work well. The `tex` example (https://github.com/facebook/draft-js/blob/master/examples/tex/js/modifiers/insertTeXBlock.js) has the same code to handle this. Can we provide this as a utility function? Closes facebookarchive/draft-js#67 Reviewed By: hellendag Differential Revision: D2989709 fb-gh-sync-id: 76c11119760c61d9935e4dd14030fb85485355d2 fbshipit-source-id: 76c11119760c61d9935e4dd14030fb85485355d2
I'd love to see a few more examples of usage:
The text was updated successfully, but these errors were encountered: