WebExtension example of some windows API functions. (#123)

This commit is contained in:
Flávio da Silva Rodrigues Almeida
2016-10-31 19:16:39 -02:00
committed by wbamberg
parent 81c4b3381c
commit c42a263968
9 changed files with 132 additions and 0 deletions

View File

@@ -0,0 +1,11 @@
# Window manipulator
## What it does
This extension includes a browser action with a popup specified as "window.html".
The popup lets the user perform various simple operations using the windows API.
# What it shows
Demonstration of various windows API functions.

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 683 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.7 KiB

View File

@@ -0,0 +1,20 @@
{
"browser_action": {
"browser_style": true,
"default_title": "Window manipulator",
"default_popup": "window.html",
"default_icon": {
"19": "icons/window19.png",
"38": "icons/window38.png"
}
},
"icons": {
"48": "icons/window.png",
"96": "icons/window@2x.png"
},
"description": "A list of methods you can perform on a window.",
"homepage_url": "https://github.com/mdn/webextensions-examples/tree/master/window-manipulator",
"manifest_version": 2,
"name": "Window manipulator",
"version": "1.0"
}

View File

@@ -0,0 +1,12 @@
html, body {
width: 350px;
}
a {
margin: 10px;
display: inline-block;
}
.panel {
margin: 5px;
}

View File

@@ -0,0 +1,31 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="window.css"/>
</head>
<body>
<div class="panel">
<div class="panel-section panel-section-header">
<div class="text-section-header">Window manipulator</div>
</div>
<a href="#" id="window-update-size_768">Resize window to 768x1024</a><br>
<a href="#" id="window-update-minimize">Minimize</a><br>
<div class="panel-section-separator"></div>
<a href="#" id="window-create-incognito">Create new incognito window</a><br>
<a href="#" id="window-remove">Remove active window</a><br>
<div class="panel-section-separator"></div>
<a href="#" id="window-resize-all">Resize all windows to 1024x768</a><br>
</div>
<script src="window.js"></script>
</body>
</html>

View File

@@ -0,0 +1,58 @@
document.addEventListener("click", (e) => {
function callOnCurrentWindow(callback){
chrome.windows.getCurrent((currentWindow) => {
callback(currentWindow);
});
}
if (e.target.id === "window-update-size_768") {
callOnCurrentWindow((currentWindow) => {
var updateInfo = {
width: 768,
height: 1024
};
chrome.windows.update(currentWindow.id, updateInfo);
});
}
if (e.target.id === "window-update-minimize") {
callOnCurrentWindow((currentWindow) => {
var updateInfo = {
state: "minimized"
};
chrome.windows.update(currentWindow.id, updateInfo);
});
}
else if (e.target.id === "window-create-incognito") {
var createData = {
incognito: true,
};
chrome.windows.create(createData, () => {
console.log("The incognito window has been created");
});
}
else if (e.target.id === "window-remove") {
callOnCurrentWindow((currentWindow) => {
chrome.windows.remove(currentWindow.id);
});
}
else if (e.target.id === "window-resize-all") {
chrome.windows.getAll((windows) => {
var updateInfo = {
width: 1024,
height: 768
};
for (var item of windows) {
chrome.windows.update(item.id, updateInfo);
}
});
}
e.preventDefault();
});