How to blur images and videos in google chrome? - google-chrome

How can I blur images and videos in google chrome and to manage the websites that will be affected from this extenstion?
I saw this extension: https://chrome.google.com/webstore/detail/blur-the-image-and-video/aikjogmpaoaookmacnkbenekcnkjlkmi/related
But there is only two options in this extension: TURN ON or TURN OFF (to all the websites, but I want to be able to decide which sites not to run it on ("white list")).
Someone meet some extension that can do it ?

This extension blurs images and videos on sites that exclude exclude_matches.
manifest.json
{
"name": "hoge",
"version": "1.0",
"manifest_version": 3,
"content_scripts": [
{
"matches": [
"<all_urls>"
],
"exclude_matches": ["*://hoge.com/*"],
"css": [
"matches.css"
]
}
]
}
matches.css
img, video {
filter: blur(4px);
}

Related

Why does it show "Visit Website" and not Add extension?

I would like publish a website (web app) on our intranet as chrome app in the google web store.
I want to publish this app to all Computers in my domain, I've seen that I can do this with the GPO of Google and it works with every extension but not with mine.
So the problem I ran into is that if I publish my app in the chrome web store you can't download it. It only says "Visit Website". As shown in the picture here: Visit Website Button in the web store
This is how my manifest.json looks like:
{
"manifest_version": 2,
"name": "Support-Ticket",
"version": "1.0",
"icons": {
"128": "128.png"
},
"app": {
"urls": [
"https://intranet.*.com/example"
],
"launch": {
"web_url": "https://intranet.*.com/example"
}
},
"permissions": [
"notifications"
]
}
I've tested it with another little app where the manifest looks like this:
{
"name": "Support Test",
"version": "1.0",
"icons": {
"128":"128.png"
},
"manifest_version": 2,
"browser_action": {},
"permissions":[
"tabs"
],
"background":{
"scripts": ["background.js"],
"persistent": false
}
}
And the .js like this:
chrome.browserAction.onClicked.addListener(function(tab) {
chrome.tabs.create({'url': chrome.extension.getURL('index.html')}, function(tab) {
// Tab opened.
});
});
I would like to have this website as chrome app and than install it on all computers in my domain with a shortcut in the Start Menu or Desktop.
Update:
I managed to create the app and display the intranet on the app with the html tag "webview".
Now it looks like this:
Window Frame
Does anyone know how I can change the color of the window frame to a darker grey?

Chrome Extension: Show Images Only (No Text) on Page

Is it possible to write a Chrome extension that shows images ONLY on a page (hides all text), when the plugin is enabled?
There are plugins available that hide all images. I need the opposite: a page with just the images, and all text hidden.
Ideally, this behavior should also be restricted to some location on the page (e.g., inside a particular DIV), but that's not a requirement.
If you want to hide all html tags but img then, yes, it's possible and is very easy to do. You can do this using a content style that overwrites the CSS of the target page and hide everything except images tags.
Here is how you can do it:
manifest.json:
{
"name": "Test extension",
"version": "0.0.1",
"manifest_version": 2,
"description": "Some description",
"icons": {
"16": "images/icon-16.png",
"128": "images/icon-128.png"
},
"default_locale": "en",
"content_scripts": [
{
"matches": [
"http://*/*",
"https://*/*"
],
"css" : [
"styles/contentstyle.css"
],
"run_at": "document_end"
}
]
}
scripts/contentstyle.css
body {
visibility: hidden;
}
* img {
visibility: visible;
}
Note that this CRX won't show images set as a background-image through CSS, only the img tags.

Accessing the Cast API from within an extension page

I was working on a chromecast app, and I wanted to incorporate it into a chrome extension. I'm also using knockout.js in order to help with some of the UI. I have two pages, one is unsandboxed (http://jsfiddle.net/AuJaX/3/), and the other is sandboxed (http://jsfiddle.net/V2dJc/1/). None of the console.log's ever get called. My manifest is below:
{
"manifest_version": 2,
"name": "__MSG_app_title__",
"description": "__MSG_app_description__",
"version": "0.1",
"content_scripts": [
{
"matches": ["<all_urls>"],
"js": ["js/content/content.js"]
}
],
"background": {
"scripts": ["js/back/background.js"],
"persistent": false
},
"permissions": [
"tabs",
"contextMenus"
],
"page_action": {
"default_title": "__MSG_app_title__",
"default_icon": {
"19": "images/icon-19.png"
}
},
"sandbox": {
"pages": ["sandboxed.html"]
},
"icons": { "48": "images/icon.png" },
"default_locale": "en"
}
Is there anything that I'm doing wrong, or is this something that's not supported (yet??)?
Did you whitelist the domain you are trying to use the extension on? Currently to have the Cast API injected into the page you need two things:
<html data-cast-api-enabled="true">
and you need to follow the steps at the bottom of this page (whitelisting in the extension, not the same as the Google Cast device whitelisting):
https://developers.google.com/cast/whitelisting#whitelist-chrome
That said, I doubt this is going to work. The instructions are for getting the Cast API injected into a regular web page. However, if I'm not mistaken you want the API injected into your Chrome extension page. I don't know if it will be made available there, since I don't think two different extensions are allowed to interact.

Chromium extension: javascript not executed

Making a simple plugin , which executes javascript when a page is loaded , and I want to execute different javascript on different page
But the following code wasn't working as expected , no "alert" was triggered:
background.html:
<html><body>
<script>
chrome.webRequest.onCompleted.addListener(
function(details) {
alert (details.url);
},
{
urls: ["*"],
types: ["main_frame"]
},
[]
);
</script>
</body></html>
manifest.json:
{
"name": "JS",
"background_page": "background.html",
"permissions": [
"webRequest",
"*"
],
"version":"0.10"
}
Alerts and console.log made from the background page of an extension simply aren't visible on the general pages.
If you want to see them, you have to open the background page : Go to the extensions settings page (menu tools/extensions) and click the "background.html" link below the name of your extension.
In your case it may be better, during development phase, to simply add the console.log and alerts in the content scripts (i.e. not the background page). So you can read them without opening the background page.
EDIT : as requested, an extension that will simply alert the location :
main.js :
alert(document.location.href);
manifest.json :
{
"name": "Any name",
"version": "3.3",
"background_page": "background.html",
"content_scripts": [
{
"matches": ["http://*/*"],
"all_frames" : true,
"run_at" : "document_end",
"js": [
"main.js"
]
}
]
}
Yes I tested it. And yes it's as painful as it sounds. You should use console.log instead of alert during your dev.

Setting up content scripts for different sites in google-chrome

I looked at the google-chrome-extension labs page and I don't see any example where you can use different content scripts for different sites. They have a page showing how to have multiple content scripts on one site, but not the reverse. Is there any way to have different content scripts for different sites?
{
"name": "My extension",
...
"content_scripts": [
{
"matches": ["http://www.google.com/*"],
"js": ["script1.js"]
},{
"matches": ["http://www.yahoo.com/*"],
"js": ["script2.js"]
}
],
...
}