Code Monkey home page Code Monkey logo

tabattack's Introduction

TabAttack Browser Extension

Save browser memory by exporting your tabs as Markdown. The extension allows you to edit the document in a text editor before you save it.

Later, you can import these Markdown documents and restore all windows exactly like they were before.

Installation

Get the extension from the Chrome Web Store.

Features

The extension adds a tab counter to the toolbar:

Tab counter

When you click it, you will see an overview of all tabs (organized by window) that you have open:

Exported tabs

You can now edit the document as you wish. After that you can:

  • Download the current state of the editor as a *.md file

  • Close all tabs (except the current one)

  • Open a file that you saved earlier (drag and drop on top of the editor also works)

  • Re-open all links as individial tabs that are currently in the editor. This will restore each unordered list in its own window. This whole acion only works if all links are inside of an unordered list, though.

There are keyboard shortcuts for these actions:

Action OS X Windows
Download ⌘S Ctrl+S
Close all tabs ⌘Q Ctrl+Q
Open a file ⌘O Ctrl+O
Open all links ⇧⌘O Ctrl+Shift+O
Copy the whole document ⌘C Ctrl+C

Furthermore, there are many keyboard shortcuts for text editing inside the Ace editor.

Tab management keyboard shortcuts

This extension also adds a few useful, general tab management keyboard shortcuts. Most of them have to be set manually by going to “Keyboard shortcuts” at the bottom of chrome://extensions/.

Keyboard shortcut overview

Building

Clone the repository:

git clone https://github.com/JannesMeyer/TabAttack.git

Install the dependencies:

cd TabAttack/
npm install

Build and watch for changes (you need to have webpack installed globally):

webpack -w

Contributing

Pull requests and bug reports are welcome. If you submit a pull request, please try to match the code formatting of the rest of the project. Some examples:

  • Tabs for indentation
  • Spaces before the parentheses of control structures (e.g. if (true) instead of if(true))
  • Curly braces on the same line
  • etc.

Acknowledgments

Icon shape based on Diamond by Catia Marsh Mallow from the Noun Project

Special thanks to these projects:

Icons from Firefox (MPL v2):

  • /icons/firefox/extension.svg
  • /icons/firefox/tab.svg
  • /icons/firefox/tab-audio-muted.svg
  • /icons/firefox/tab-audio-playing.svg
  • /icons/firefox/tab-loading.png
  • /icons/firefox/[email protected]

License

Affero GPL v3

Todo

  • Tab move, tab discard
  • Fix keyboard selection
    • Use keybinding library
    • Add popup with keyboard shortcuts
  • Figure out why discarding resets the TabId
  • Style indicator for: audio, muted, ...
  • "open links" doesn't work with file:, moz-extension:, about:, chrome:
  • Add "ignore protocols" option
  • "1 Tab" instead of "1 Tabs" in tab list
  • Find icons for:
    • Search
      • URL view (settings)
      • Export
      • Import
      • Help

tabattack's People

Contributors

jannesmeyer avatar trenton42 avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

tabattack's Issues

Test on ChromeOS

I haven't tested this extension on ChromeOS yet, because I don't have a Chromebook, but it would be awesome to know if there is any way to improve this extension for Chromebook users.

How to trigger option to only export the current window

As the title says, I think it would be useful to be able to optionally export only the tabs in the current window. The code for this is easy enough, but I'm searching for a way to activate it. Sadly it seems chrome extensions can't neither add entries to the right-click menu of their icon nor react to key-click combinations on it (I was thinking CTRL-iconClick to trigger it).

Options I see:

  • key kombination only
  • add a popup menu (which means all actions take 2 clicks...)
  • add it to the menu in the overview (additional button that says "just this window" or something like it)

Comments? Further ideas? Preferences?

Export as pretty JSON.

Would be pretty amazing to have an option to export them as a pretty JSON array.

i.e.

[
  {
    "title" : "GitHub",
    "url" : "https://github.com/"
  }
]

Doesn't stack well with great suspender

I have Great Suspender plugin installed, which automatically puts inactive tabs to sleep. Unfortunately it seems like sleeping tabs are ignored. Is it possible to include them? The TabAttack counter on the icon does see them, but the markdown does not. Without being able to see all tabs at once, it's hard for me to curate the list to the tabs I care about when exporting them.

Render retina (2x) version of the icon

I don't have a Retina MacBook or any other machine with high-dpi screen to test this. But if anyone wants to pick this up, pull requests are welcome.

Ideally this wouldn't incur rendering the retina version for users who will never see it and vice-versa. Unfortunately it looks like chrome.browserAction.setIcon only accepts both sizes (19 square and 38 square) at the same time for everybody.

Attacked tabs are lost after a browser crash.

I'm not sure but maybe some strategy using localstorage could help. You should be able to persist the content inside each TabAttack environment onload and onchange so it's possible to somehow recover the content from a browser crash.

Contribution process?

Hi!

I'm thinking about modifying TabAttack for my own needs, but some of the changes might be of general interest. Do you have any preferences how you'd like to discuss and receive changes? If yes, it might be a good idea to add that to the README as well

Tool Bar Icon Barely Visible

I use TabAttack with a dark theme- Oceanic, and the tool bar icon is hardly visible on the dark background. screen:

TabAttack 1 6 - 2020-09-24 - 004

So I would like to suggest a new option in extension options to use an alternative icon (brighter) which would be better visible on dark themes.

If this extension is not abandoned (I hope that it is not as I find TabAttack very useful) I might suggest some more enhancements.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.