kuanyui/copy-as-org-mode

A Firefox Add-on (WebExtension) to copy selected web page into Org-mode formatted text!

TypeScript

221

109 commits

updated Dec 24, 2022

See the code

README

* Copy as Org-Mode
A WebExtension to copy selected web page into Org-mode formatted text!

#+begin_html
<blockquote>
<p>I develop and release <b>all</b> my open-source software projects <b>for free</b>, and are ALL licensed under <b><code>WTFPL</code>, <code>GPL</code>, <code>MIT</code>, or <code>MPL</code>. however, my "free time" is not free actually</b>. If my works are usable to you or make you happy, please consider to donate to <b>reduce my business hours to <i>make more free and open-source projects for you and this world</i></b>.</p>

Attention: Donate <b>only if you feel happy</b>; it is totally voluntary, I would never force you to do this. I always try as possible as I can to make good project because I need, and wish my work could also be helpful to others. If you donate, I will be glad and grateful, <b>but I cannot provide any gurantee or warranty for this project even if you do this.</b>
<ul>
  <li><a href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=G4F7NM38ADPEC&source=url"> <img width="24" height="24" src="https://raw.githubusercontent.com/kuanyui/kuanyui/main/img/paypal.svg"/>PayPal</a></li>
  <li><a href="https://liberapay.com/onoono"> <img width="24" height="24" src="https://raw.githubusercontent.com/kuanyui/kuanyui/main/img/liberapay.svg"/>LiberaPay</a></li>
  <li><a href="https://www.patreon.com/onoono"> <img width="24" height="24" src="https://raw.githubusercontent.com/kuanyui/kuanyui/main/img/patreon.svg"/>Patreon</a></li>
</ul>
Thanks for your contribution!
</blockquote>
#+end_html

* Install
- [[https://addons.mozilla.org/en-US/firefox/addon/copy-as-org-mode/][Mozilla Add-ons]]

* Screenshot
[[https://addons.mozilla.org/user-media/previews/full/261/261819.png]]
[[https://addons.mozilla.org/user-media/previews/full/261/261939.png]]
[[https://addons.mozilla.org/user-media/previews/full/261/261818.png]]

* Supported Browser
- Firefox for Desktop >= 92

* Requirements for Development
- Node
- web-ext
- GNU Make

* All Support Syntax
- =* Outline=, =1. ordered list=, =- unordered list=, =- [ ] GitHub style todo list=
- =| Table | Can | Be | Copied! |=
- Paragraph =<p>=, Horizontal splitter  =--------=
- Quoteblock =#+begin_quote= , Codeblock (=: one line code...= or =#+begin_src= + auto guess language ID. e.g. =js=, =c=, =shell=)
- =*bold*=, =/italic/=, =_underline_=, =+strike+=, ~=verbatim=~, =~code~=, =_{sub}=, =^{sup}=
- =[[link url][link title]]=, =[[a.href][img.src]]= (Notice: multiple =<img>= elements + other elements wrapped in =<a>= element is not supported by org-mode syntax. I have serveral plans as workaround for this but haven't decided which one is better, hence not implemented this yet..)
- =[[imgSrc]]= (Notice: I haven't decide how to deal with HTML =title= and =alt= attribute)

* Known Issues (Plegase feel free to open PR to fix them)
- It's *IMPOSSIBLE* to use this add-on under some special pages or domains like https://addons.mozilla.org/ . This is the restriction of Firefox browser itself.
- Nested mark (e.g. ~*=bold and=* /=italic code=/~) may has some issues for org-mode renderer. This is a common usage in HTML, but may mess up the org-mode renderer. *This is the limitation of org-mode's syntax & renderer, I cannot do anything for it*.
- Some block elements in =<a>= (e.g. =<img>=) may cannot be handled properly. *This is the limitation of org-mode's syntax*. *I've not decided which workaround should I use currently.*
  #+begin_quote
  For example, ~<a> inner text 1 <img src="..."> another text 2 <img src="..."> another text 3 </a>~
    - One of the workarounds I can think up so far is to split each Node and make each of them an independent links, but looks disgusting... Like =[[url][inner text 1]] [[url][imgsrc]] [[url][another text 2]] [[url][imgsrc]] [[url][another text 3]]=....
    - Or use ~#+HTML: <a href="url">~ and ~#+HTML:</a>~ to wrap the children contents and elements. However, this will make the =<a>= to a block element and create unneeded inevitable new lines.
  #+end_quote
- =<pre>= may lost newlines in some page (e.g. https://kuanyui.github.io/2017/08/16/macros-for-qproperty/). Should be fixed now but I cannot sure.
- Notification may freeze the whole Firefox *when using on Linux* (Test on Firefox 92, Ubuntu & Manjaro), but such issue seems not occurs on Firefox for Windows. So I make this feature an optional setting, you can enable it manually.

* Permissions

  #+begin_quote
  This software is created by a paranoid^{TM} free-software & open-source enthusiast, would never collect your any data. Feel free to review the whold code base if doubt.
  #+end_quote

| Permission (in ~manifest.json~) | Description                                        | Will show a permission warning when install? |
|---------------------------------+----------------------------------------------------+----------------------------------------------|
| ~activeTab~                     | Insert HTML parser to current active tab.          | No                                           |
| ~menus~                         | Add items to context menu.                         | No                                           |
| ~clipboardWrite~                | Copy org-mode text into clipboard.                 | Yes                                          |
| ~notifications~                 | Show notification via OS when copy (optional).     | Yes                                          |
| ~storage~                       | Store preferences in ~sync~ (Mozilla Sync account) | No                                           |

* Development
** Prepare
#+BEGIN_SRC sh
npm i
#+END_SRC

** Run for development (Watch)
#+BEGIN_SRC sh
make dev
web-ext run --verbose --firefox-profile ~/.mozilla/firefox/PROFILE_DIR_NAME
#+END_SRC
#+BEGIN_QUOTE
If webpack watch exit immediately without any error, please try [[https://github.com/guard/listen/wiki/Increasing-the-amount-of-inotify-watchers]]
#+END_QUOTE

** Run Firefox for developing WebExtension
#+BEGIN_SRC sh
web-ext run --verbose --firefox-profile ~/.mozilla/firefox/XXXXXXX.NAME
#+END_SRC

** Deploy (Build .xpi file & run a HTTP server for download)
#+BEGIN_SRC sh
make xpi-server
#+END_SRC

** Zip this repository for uploading to addons.mozilla.org
#+BEGIN_SRC sh
make zip-repo
#+END_SRC

* Acknowedgement
  This project referred, forked, or used some parts of the codes from the other projects:

| Project URL                                                                             | Usage                                               | Licenses of Used Parts |
|-----------------------------------------------------------------------------------------+-----------------------------------------------------+------------------------|
| [[https://github.com/0x6b/copy-selection-as-markdown][0x6b/copy-selection-as-markdown]] | Main project structure; copy and selection handling | MIT                    |
| [[https://github.com/mixmark-io/turndown][mixmark-io/turndown]]                         | Forked as HTML to Org-Mode converter                | MIT                    |
| [[https://github.com/piroor/treestyletab/][piroor/treestyletab]]                        | The CSS for ~options_ui~ (settings page)            | MPL 2.0; MIT           |


* TODOs
- Customizable keyboard shortcuts.
- Image to data URL?

* License
MPL-2.0.

See LICENSE for more information.

Not written in Markdown, so it's shown here as plain text — view it formatted on GitHub.

emacs
firefox-addon
org-mode
webextension

Contributors

kuanyui

109 commits

kuanyui/copy-as-org-mode

A Firefox Add-on (WebExtension) to copy selected web page into Org-mode formatted text!

TypeScript

221

109 commits

updated Dec 24, 2022

See the code

README

* Copy as Org-Mode
A WebExtension to copy selected web page into Org-mode formatted text!

#+begin_html
<blockquote>
<p>I develop and release <b>all</b> my open-source software projects <b>for free</b>, and are ALL licensed under <b><code>WTFPL</code>, <code>GPL</code>, <code>MIT</code>, or <code>MPL</code>. however, my "free time" is not free actually</b>. If my works are usable to you or make you happy, please consider to donate to <b>reduce my business hours to <i>make more free and open-source projects for you and this world</i></b>.</p>

Attention: Donate <b>only if you feel happy</b>; it is totally voluntary, I would never force you to do this. I always try as possible as I can to make good project because I need, and wish my work could also be helpful to others. If you donate, I will be glad and grateful, <b>but I cannot provide any gurantee or warranty for this project even if you do this.</b>
<ul>
  <li><a href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=G4F7NM38ADPEC&source=url"> <img width="24" height="24" src="https://raw.githubusercontent.com/kuanyui/kuanyui/main/img/paypal.svg"/>PayPal</a></li>
  <li><a href="https://liberapay.com/onoono"> <img width="24" height="24" src="https://raw.githubusercontent.com/kuanyui/kuanyui/main/img/liberapay.svg"/>LiberaPay</a></li>
  <li><a href="https://www.patreon.com/onoono"> <img width="24" height="24" src="https://raw.githubusercontent.com/kuanyui/kuanyui/main/img/patreon.svg"/>Patreon</a></li>
</ul>
Thanks for your contribution!
</blockquote>
#+end_html

* Install
- [[https://addons.mozilla.org/en-US/firefox/addon/copy-as-org-mode/][Mozilla Add-ons]]

* Screenshot
[[https://addons.mozilla.org/user-media/previews/full/261/261819.png]]
[[https://addons.mozilla.org/user-media/previews/full/261/261939.png]]
[[https://addons.mozilla.org/user-media/previews/full/261/261818.png]]

* Supported Browser
- Firefox for Desktop >= 92

* Requirements for Development
- Node
- web-ext
- GNU Make

* All Support Syntax
- =* Outline=, =1. ordered list=, =- unordered list=, =- [ ] GitHub style todo list=
- =| Table | Can | Be | Copied! |=
- Paragraph =<p>=, Horizontal splitter  =--------=
- Quoteblock =#+begin_quote= , Codeblock (=: one line code...= or =#+begin_src= + auto guess language ID. e.g. =js=, =c=, =shell=)
- =*bold*=, =/italic/=, =_underline_=, =+strike+=, ~=verbatim=~, =~code~=, =_{sub}=, =^{sup}=
- =[[link url][link title]]=, =[[a.href][img.src]]= (Notice: multiple =<img>= elements + other elements wrapped in =<a>= element is not supported by org-mode syntax. I have serveral plans as workaround for this but haven't decided which one is better, hence not implemented this yet..)
- =[[imgSrc]]= (Notice: I haven't decide how to deal with HTML =title= and =alt= attribute)

* Known Issues (Plegase feel free to open PR to fix them)
- It's *IMPOSSIBLE* to use this add-on under some special pages or domains like https://addons.mozilla.org/ . This is the restriction of Firefox browser itself.
- Nested mark (e.g. ~*=bold and=* /=italic code=/~) may has some issues for org-mode renderer. This is a common usage in HTML, but may mess up the org-mode renderer. *This is the limitation of org-mode's syntax & renderer, I cannot do anything for it*.
- Some block elements in =<a>= (e.g. =<img>=) may cannot be handled properly. *This is the limitation of org-mode's syntax*. *I've not decided which workaround should I use currently.*
  #+begin_quote
  For example, ~<a> inner text 1 <img src="..."> another text 2 <img src="..."> another text 3 </a>~
    - One of the workarounds I can think up so far is to split each Node and make each of them an independent links, but looks disgusting... Like =[[url][inner text 1]] [[url][imgsrc]] [[url][another text 2]] [[url][imgsrc]] [[url][another text 3]]=....
    - Or use ~#+HTML: <a href="url">~ and ~#+HTML:</a>~ to wrap the children contents and elements. However, this will make the =<a>= to a block element and create unneeded inevitable new lines.
  #+end_quote
- =<pre>= may lost newlines in some page (e.g. https://kuanyui.github.io/2017/08/16/macros-for-qproperty/). Should be fixed now but I cannot sure.
- Notification may freeze the whole Firefox *when using on Linux* (Test on Firefox 92, Ubuntu & Manjaro), but such issue seems not occurs on Firefox for Windows. So I make this feature an optional setting, you can enable it manually.

* Permissions

  #+begin_quote
  This software is created by a paranoid^{TM} free-software & open-source enthusiast, would never collect your any data. Feel free to review the whold code base if doubt.
  #+end_quote

| Permission (in ~manifest.json~) | Description                                        | Will show a permission warning when install? |
|---------------------------------+----------------------------------------------------+----------------------------------------------|
| ~activeTab~                     | Insert HTML parser to current active tab.          | No                                           |
| ~menus~                         | Add items to context menu.                         | No                                           |
| ~clipboardWrite~                | Copy org-mode text into clipboard.                 | Yes                                          |
| ~notifications~                 | Show notification via OS when copy (optional).     | Yes                                          |
| ~storage~                       | Store preferences in ~sync~ (Mozilla Sync account) | No                                           |

* Development
** Prepare
#+BEGIN_SRC sh
npm i
#+END_SRC

** Run for development (Watch)
#+BEGIN_SRC sh
make dev
web-ext run --verbose --firefox-profile ~/.mozilla/firefox/PROFILE_DIR_NAME
#+END_SRC
#+BEGIN_QUOTE
If webpack watch exit immediately without any error, please try [[https://github.com/guard/listen/wiki/Increasing-the-amount-of-inotify-watchers]]
#+END_QUOTE

** Run Firefox for developing WebExtension
#+BEGIN_SRC sh
web-ext run --verbose --firefox-profile ~/.mozilla/firefox/XXXXXXX.NAME
#+END_SRC

** Deploy (Build .xpi file & run a HTTP server for download)
#+BEGIN_SRC sh
make xpi-server
#+END_SRC

** Zip this repository for uploading to addons.mozilla.org
#+BEGIN_SRC sh
make zip-repo
#+END_SRC

* Acknowedgement
  This project referred, forked, or used some parts of the codes from the other projects:

| Project URL                                                                             | Usage                                               | Licenses of Used Parts |
|-----------------------------------------------------------------------------------------+-----------------------------------------------------+------------------------|
| [[https://github.com/0x6b/copy-selection-as-markdown][0x6b/copy-selection-as-markdown]] | Main project structure; copy and selection handling | MIT                    |
| [[https://github.com/mixmark-io/turndown][mixmark-io/turndown]]                         | Forked as HTML to Org-Mode converter                | MIT                    |
| [[https://github.com/piroor/treestyletab/][piroor/treestyletab]]                        | The CSS for ~options_ui~ (settings page)            | MPL 2.0; MIT           |


* TODOs
- Customizable keyboard shortcuts.
- Image to data URL?

* License
MPL-2.0.

See LICENSE for more information.

Not written in Markdown, so it's shown here as plain text — view it formatted on GitHub.

emacs
firefox-addon
org-mode
webextension

Contributors

kuanyui

109 commits

Languages

TypeScript

79.1%

CSS

10.1%

JavaScript

5.4%

Pug

4.9%