files addition

This commit is contained in:
abhijithvijayan
2019-01-03 23:50:59 +05:30
commit 05ec9387e6
15 changed files with 7355 additions and 0 deletions

3
.babelrc Normal file
View File

@@ -0,0 +1,3 @@
{
"presets": ["@babel/preset-env"]
}

66
.gitignore vendored Normal file
View File

@@ -0,0 +1,66 @@
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
# Runtime data
pids
*.pid
*.seed
*.pid.lock
# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov
# Coverage directory used by tools like istanbul
coverage
# nyc test coverage
.nyc_output
# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
.grunt
# Bower dependency directory (https://bower.io/)
bower_components
# node-waf configuration
.lock-wscript
# Compiled binary addons (https://nodejs.org/api/addons.html)
build/Release
# Dependency directories
node_modules/
jspm_packages/
# TypeScript v1 declaration files
typings/
# Optional npm cache directory
.npm
# Optional eslint cache
.eslintcache
# Optional REPL history
.node_repl_history
# Output of 'npm pack'
*.tgz
# Yarn Integrity file
.yarn-integrity
# dotenv environment variables file
.env
# next.js build output
.next
.DS_Store
## scripts build
extension/scripts
extension/assets

27
extension/manifest.json Normal file
View File

@@ -0,0 +1,27 @@
{
"name": "Getting Started Example",
"version": "1.0",
"description": "Build an Extension!",
"background": {
"scripts": ["scripts/background.js"],
"persistent": false
},
"permissions": ["activeTab", "declarativeContent", "storage"],
"manifest_version": 2,
"page_action": {
"default_popup": "popup.html",
"default_icon": {
"16": "assets/get_started16.png",
"32": "assets/get_started32.png",
"48": "assets/get_started48.png",
"128": "assets/get_started128.png"
}
},
"options_page": "options.html",
"icons": {
"16": "assets/get_started16.png",
"32": "assets/get_started32.png",
"48": "assets/get_started48.png",
"128": "assets/get_started128.png"
}
}

21
extension/options.html Normal file
View File

@@ -0,0 +1,21 @@
<!DOCTYPE html>
<html>
<head>
<style>
button {
height: 30px;
width: 30px;
outline: none;
margin: 10px;
}
</style>
</head>
<body>
<div id="buttonDiv">
</div>
<div>
<p>Choose a different background color!</p>
</div>
</body>
<script src="scripts/options.js"></script>
</html>

11
extension/popup.html Normal file
View File

@@ -0,0 +1,11 @@
<!doctype html>
<html>
<head>
<title>Test</title>
</head>
<body>
<h1>Hello World!</h1>
<button id="changeColor">Shorten</button>
<script src="scripts/popup.js"></script>
</body>
</html>

7113
package-lock.json generated Normal file

File diff suppressed because it is too large Load Diff

23
package.json Normal file
View File

@@ -0,0 +1,23 @@
{
"name": "kutturl",
"version": "1.0.0",
"description": "",
"main": "background.js",
"scripts": {
"dev": "webpack --mode development",
"build": "webpack --mode production",
"start": "webpack-dev-server --mode development --open"
},
"author": "abhijithvijayan",
"license": "ISC",
"devDependencies": {
"@babel/core": "^7.2.2",
"@babel/preset-env": "^7.2.3",
"babel-loader": "^8.0.4",
"copy-webpack-plugin": "^4.6.0",
"html-loader": "^0.5.5",
"webpack": "^4.28.3",
"webpack-cli": "^3.2.0",
"webpack-dev-server": "^3.1.14"
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 495 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 814 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB

18
src/scripts/background.js Normal file
View File

@@ -0,0 +1,18 @@
'use strict';
chrome.runtime.onInstalled.addListener(function() {
chrome.storage.sync.set({color: '#3aa757'}, function() {
console.log("The color is green.");
});
chrome.declarativeContent.onPageChanged.removeRules(undefined, function() {
chrome.declarativeContent.onPageChanged.addRules([{
conditions: [new chrome.declarativeContent.PageStateMatcher({
pageUrl: {hostEquals: 'github.com'},
})
],
actions: [new chrome.declarativeContent.ShowPageAction()]
}]);
});
});

15
src/scripts/options.js Normal file
View File

@@ -0,0 +1,15 @@
let page = document.getElementById('buttonDiv');
const kButtonColors = ['#3aa757', '#e8453c', '#f9bb2d', '#4688f1'];
function constructOptions(kButtonColors) {
for (let item of kButtonColors) {
let button = document.createElement('button');
button.style.backgroundColor = item;
button.addEventListener('click', function() {
chrome.storage.sync.set({color: item}, function() {
console.log('color is ' + item);
})
});
page.appendChild(button);
}
}
constructOptions(kButtonColors);

15
src/scripts/popup.js Normal file
View File

@@ -0,0 +1,15 @@
let changeColor = document.getElementById('changeColor');
chrome.storage.sync.get('color', function(data) {
changeColor.style.backgroundColor = data.color;
changeColor.setAttribute('value', data.color);
});
changeColor.onclick = function(element) {
let color = element.target.value;
chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
chrome.tabs.executeScript(
tabs[0].id,
{code: 'document.body.style.backgroundColor = "' + color + '";'});
});
};

43
webpack.config.js Normal file
View File

@@ -0,0 +1,43 @@
const path = require("path");
const CopyWebpackPlugin = require('copy-webpack-plugin');
module.exports = {
entry: {
options: "./src/scripts/options.js",
popup: "./src/scripts/popup.js",
background: "./src/scripts/background.js"
},
output: {
path: path.resolve(__dirname, "extension"),
filename: "scripts/[name].js",
publicPath: ""
},
node: {
fs: 'empty'
},
plugins: [
new CopyWebpackPlugin([ { from: 'src/images', to: 'assets' } ])
],
module: {
rules: [
{
test: /\.js$/,
exclude: /(node_modules|bower_components)/,
loader: "babel-loader"
},
{
test: /\.(html)$/,
use: {
loader: "html-loader",
options: {
attrs: [':data-src']
}
}
}
]
},
devServer: {
port: 3000,
contentBase: "./extension"
}
};