Code Monkey home page Code Monkey logo

linky's Introduction

Linky

Introduction

Linky - Firefox add-on that simplifies browsing performing redundant tasks in multiple containers. With Linky, you can easily open the current tab's URL in all available containers with just one click.

Containers are a powerful feature of Firefox that enable you to separate your online activity into different contexts, allowing you to manage your privacy, security, and productivity more effectively. However, it can be tedious to manually copy and paste URLs between containers when you want to switch contexts.

Linky eliminates this hassle by providing a convenient button in the Firefox toolbar that allows you to quickly open the current tab's URL in other available containers. This means that you can effortlessly switch between different contexts and continue browsing with ease.

With Linky, you can take full advantage of the powerful container feature in Firefox and enhance your browsing experience.

How to use

Run extension by click on extension icon

Click on extension icon

You can see the result of working web extension

Run extension by click on Context menu of Active tab

Call context menu on active tab URL, and click -> 'Open site into containers'

You can see the result of working web extension

Deploying the extension

You can test the extension in FF by following these steps:

Download the code from Github

git clone https://github.com/Scandltd/linky.git
cd linky
npm install

Run in the root folder extension the command

npm start

linky's People

Contributors

aachernyakevich-sc avatar achernyakevich-sc avatar svrublevskaya-sc avatar

Watchers

 avatar

linky's Issues

Opening in searched and selected Containers

Overview

When the number of containers a user has is too large, the user may need to open the active tab not in all existing containers, but only in individually selected ones.

The idea is to allow the user to select containers (groups of containers) in which to open the active tab.

Implementation details

Clicking on the extension icon open a popup that contains:

  • link 'Open in available containers'. By clicking on this link, the current tab opens in all existing containers.
  • button 'Select containers from the list', by clicking on which the following settings are shown:
    • an input field [filter containers by name_____] that filters containers by name from the entire available list
    • a list of checkboxes with all existing containers
    • button 'Open in selected container', becomes active when at least one container from the list is selected. By clicking on this button, the popup closes and the current tab opens in the selected containers.
  • section 'Open in available presets' (displays only if user has Containers Group presets (Issue #9)), displays list of links 'Preset name'. Clicking on this link, the popup closes and the current tab opens in the containers from chosen preset

Opening of Containers Group presets

Overview

Allow the user to create presets (groups of containers) in which it is necessary to open the active tab

Implementation details

Options page -> Settings tab

Settings tab of Options page should have add a special section Containers Group presets. This sections will have the following settings:

  • 'Presets list' section
    • the 'Preset name' with Edit Delete buttons
      • below list of containers that include in this preset
  • if there are no presets yet, the message is displayed - "You don't have any preset"
  • Add preset button

When click on Add preset or Edit button ->

  • input field [name of preset_____] (required);
  • input field [filter containers by name_____] that filters containers by name from the entire available list;
  • list of checkboxes with all existing containers (should choose at least one container);
  • Save button (becomes active when at least one container from the list is selected) and Cancel button.

After clicking by Save button new preset should display at the beginning of the list of 'Presets list' sections and should be available in 'Open in available presets' tab in popup that appears by clicking on the extension icon (Issue #8 )

Options - implement as separate page

Overview

Currently Options is implemented as the section of Linky Add-on's page. This would be inconvenient for future because it could contain many configuration settings and quite complicated UI to manage it. So it would be more reasonable to have it implemented as separate page. The Options page of Simple Translate Add-on could be used as a sample.

Options page should have two vertical areas (split by vertical ruler):

  • Tabs Switcher (width: 20%; non-scrollable)
  • Content Area (vertically scrollable)

Tabs Switcher

It should contain:

  • Add-on's logo (center aligned).
  • Add-on's name (center aligned).
  • links to switch Content Area to:
    • Setting section
    • Shortcuts section
    • About section

Content Area

Content Area should contain section name and horizontal ruler. Below corresponding UI to manage settings should be presented.

Setting should be updated on blur() event of the corresponding editing element.

Settings

This section will contain a list of fieldsets with all possible extension settings grouped by purpose.

Shortcuts

Should contain:

  • Section title "Keyboard shortcuts".
  • Fieldset "Set keyboard shortcuts".
  • The keyboard shortcut setting area should contain a list of keyboard shortcuts available for customization, each element of this list will consist of the following elements:
    • a brief description of the purpose of the keyboard shortcut.
    • an input field for entering a keyboard shortcut (by default, it displays the default combination of keyboard shortcut if it is set, i.e. it may be absent).
    • after the input field a Reset button (return shortcut to default) and a Clear button (clear shortcut definition).

Keyboard shortcuts combinations should be updated on keyup() event of the corresponding input field.

At the moment, one keyboard shortcut will be available for customization:

  • brief description - "Opens the currently active tab in all available containers"
  • default combination of keyboard shortcut - Ctrl + Alt + L

About

Should contain:

  • Add-on's Name
  • Version
  • Author - Scand (represented by link to the company's web site)
  • License
  • Feedback - [email protected]

Delay for opening containers

Overview

When the number of containers a user has is too large, a resource blocking situation may occur due to multiple simultaneous access to the resource from many different containers (looks like DDoS attack). To avoid these situations, it is necessary to have a way to control containers opening flow via special configuration.

Idea is to open Container Tabs by groups. Every next tab in the group will be open with configurable delay. Every next group of tabs will be open with configurable delay. Number of tabs in group will be configurable too.

Implementation details

Options page -> Settings tab

Settings tab of Options page should have add a special section Container Tabs Opening Control. This sections will have the following settings (see mockup):

Open new containers by groups of              [3____] container(s).
Open new containers in groups at intervals of [100__] milliseconds.
Open containers' groups at intervals of       [1500_] milliseconds.

Default values for this configuration settings are 3 container per group, open groups with delay of 1000 milliseconds, open containers in a group with delay of 500 milliseconds.

Setting should be updated on leaving of an editable field. Empty value should be replaced to the default value. Invalid input data should be replaced by previous value.

Opening flow

Logic for opening Container Tabs should be updated correspondingly and honor configuration settings.

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.