A Firefox Add-on (WebExtension) to copy selected web page into Org-mode formatted text!
See the code* 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.
109 commits
TypeScript
79.1%
CSS
10.1%
JavaScript
5.4%
Pug
4.9%
A Firefox Add-on (WebExtension) to copy selected web page into Org-mode formatted text!
See the code* 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.
109 commits
TypeScript
79.1%
CSS
10.1%
JavaScript
5.4%
Pug
4.9%