search

BoostIO / BoostNote-App

Boost Note is a document driven project management tool that maximizes remote DevOps team velocity.
https://boostnote.io
Other
3.8k stars 372 forks source link

Embed 3rd party service like Youtube, Tweet, Gist... #206

Open shashank-k opened 4 years ago

shashank-k commented 4 years ago

Issuehunt badges

I am trying to embed github gists into the notes.

If something like this exists, it will be excellent.

IssueHunt Summary ### Backers (Total: $7.00) - [ritikchhipa5 ritikchhipa5](https://issuehunt.io/u/ritikchhipa5) ($2.00) - $5.00 have been anonymously funded. #### [Become a backer now!](https://issuehunt.io/r/BoostIO/BoostNote.next/issues/206) #### [Or submit a pull request to get the deposits!](https://issuehunt.io/r/BoostIO/BoostNote.next/issues/206) ### Tips - Checkout the [Issuehunt explorer](https://issuehunt.io/r/BoostIO/BoostNote.next/) to discover more funded issues. - Need some help from other developers? [Add your repositories](https://issuehunt.io/r/new) on IssueHunt to raise funds.
Flexo013 commented 4 years ago

This is not possible at the moment, but sounds like a useful feature.

Rokt33r commented 4 years ago

Sounds good to me. We could exploit ImageReference syntax, ![{description}]({url}), for this.(or introduce other syntax, like [$gist:{gistId}]).

And I found this issue. https://github.com/remarkjs/ideas/issues/9 Although gist doesn't support oembed.

Rokt33r commented 4 years ago

https://github.com/djm/remark-shortcodes looks quite promising. So I guess we could do make it like [[gist id=1234]].

issuehunt-oss[bot] commented 4 years ago

An anonymous user has funded $5.00 to this issue.

Erprincekumarojha commented 4 years ago

You contact me I will try

Flexo013 commented 4 years ago

@Erprincekumarojha Feel free to pick up this issue and submit a PR for it. When your PR gets merged you will receive the funding for this issue!

themagiulio commented 4 years ago

Hi, I'm trying to implement this by using remark-shortcodes as suggested by @Rokt33r

I archived to create shortcuts for strings, but I can't put <a></a>.

I wrote these lines of code which are meant to put in the MarkdownPreviewer an <a></a> which points to the given url.

  const shortcodeTransformer = () => {
    return (tree: any, file: any) => {
      visit(tree, 'shortcode', function(node) {
        let attrs = node.attributes;

        node.type = 'a';
        node.href = 'https://boostnote.io';
        node.children = [{type: 'text', value: 'https://boostnote.io'}];
      });
    }
  };

Unfortunately it shows only a block with the string 'https://boostnote.io' as a children...

Can someone explain me how does render work?

Flexo013 commented 4 years ago

@themagiulio Please join our Slack and DM Rokt33r directly. He'll be able to help you out.

issuehunt-oss[bot] commented 3 years ago

@ritikchhipa5 has funded $2.00 to this issue.