Skip to content

Latest commit

 

History

History
172 lines (145 loc) · 7.01 KB

README.md

File metadata and controls

172 lines (145 loc) · 7.01 KB
Raw

CC Search Browser Extension

Firefox | Chrome | Opera

A Cross-Browser Extension which lets you search and filter content in the public domain and under Creative Commons licenses.

MIT License platforms prs welcome

Install

Firefox addon store Chrome web store Opera addon store

Features

Feature Firefox Chrome Opera
Search and filter CC Licensed content. Yes Yes Yes
One click attribution. Yes Yes Yes
Download images (and attribution). Yes Yes Yes
Bookmark images. Yes Yes Yes
Export and import bookmarks. Yes Yes Yes
Sync your custom setting and bookmarks across devices. Yes Yes No
Options-UI for custom settings. Yes Yes Yes
Dark Mode. Yes Yes Yes

Installation from source

You can install the extension directly from the source. Follow the following steps:

  1. Clone the repo: git clone https://github.com/creativecommons/ccsearch-browser-extension.git.

  2. Run: npm install.

  3. Run: npm run dev. This would compile SASS to CSS and bundle JS. The compiled version will be in dist folder.

  4. Load the extension to the browser:

    • Mozilla Firefox
      • Navigate to about:debugging.
      • Click on "Load Temporary Add-on" button.
      • From the file explorer, choose ccsearch-browser-extension/dist/firefox/manifest.json.
    • Google Chrome
      • Navigate to chrome://extensions.
      • Click on "Load Unpacked" button (make sure you have enabled the Developer mode).
      • From the file explorer, choose ccsearch-browser-extension/dist/chrome.
    • Opera
      • Navigate to about://extensions.
      • Click on "Load Unpacked" button (make sure you have enabled the Developer mode).
      • From the file explorer, choose ccsearch-browser-extension/dist/opera.

Debugging in Development Mode

  • Mozilla Firefox
    • Navigate to about:debugging and from sidebar select This Firefox.
    • Click on "Load Temporary Add-on" button.

    • From the file explorer, choose ccsearch-browser-extension/dist/firefox/manifest.json.
    • You will be now able to see CC search browser extension. Now click on the Inspect button.

    • A new tab will open with firefox debugger. Now first, click on the three dots and select "Disable Popup Auto-Hide".

    • Now click on the browser extension from top right corner and the DOM will be loaded with the content to debug.

  • Google Chrome
    • Navigate to chrome://extensions.
    • Make sure that Developer mode is toggled on.
    • Click on "Load Unpacked" button.

    • From the file explorer, choose ccsearch-browser-extension/dist/chrome.
    • Now the extension will be loaded. Click on the extension from the top right corner.
    • Right click in extension area and select "Inspect element".

    • Developer tool will now open loaded with the content to debug.

  • Opera
    • Navigate to about://extensions.
    • Make sure that Developer mode is toggled on.
    • Click on "Load Unpacked" button.

    • From the file explorer, choose ccsearch-browser-extension/dist/opera.
    • Now the extension will be loaded. Click on the extension from the top right corner.
    • Right click in extension area and select "Inspect element".

    • Dev tool will now open loaded with the content to debug.

Troubleshooting build failures

  1. If you get following error:
'TARGET' is not recognized as an internal or external command

then most likely webpack-cli is not installed on your dev machine.

  • Here are the few things you can try:
    • Try deleting the folder node_modules and reinstalling webpack-cli
  npm install --save-dev webpack-cli
  • if reinstalling node modules do not solve the issue then run following to install webpack-cli globally.
npm install -g webpack-cli

Contribution

Checkout CONTRIBUTING.md for general guidelines for contributing code to CC Open Source.

For contribution guidelines and development instructions specific to this particular project, please checkout INSTRUCTIONS.md.

License

See LICENSE.