-
Notifications
You must be signed in to change notification settings - Fork 149
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
0 parents
commit 47afef1
Showing
7 changed files
with
206 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,7 @@ | ||
Copyright 2016 Adam Geitgey | ||
|
||
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: | ||
|
||
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. | ||
|
||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,68 @@ | ||
# Show Facebook Computer Vision Tags Chrome Extension | ||
|
||
![](https://cloud.githubusercontent.com/assets/896692/21574672/fa4cecb4-ceab-11e6-896c-101025c68dc3.png) | ||
|
||
Since April 2016, Facebook has been [automatically adding `alt` tags](https://code.facebook.com/posts/457605107772545/under-the-hood-building-accessibility-tools-for-the-visually-impaired-on-facebook/) to images | ||
you upload that are populated with keywords representing the content of your images: | ||
|
||
```html | ||
<img csrc="https://facebook.com/some-url.jpg" | ||
alt="Image may contain: golf, grass, outdoor and nature" | ||
width="316" height="237"> | ||
``` | ||
|
||
They are labeling your images using a [Deep ConvNet](https://medium.com/@ageitgey/machine-learning-is-fun-part-3-deep-learning-and-convolutional-neural-networks-f40359318721#.luqjma59e) | ||
built by Facebook's | ||
[FAIR team](https://research.fb.com/category/facebook-ai-research-fair/). | ||
|
||
On one hand, this is really great. It improves accessibility for blind users | ||
who depend on screen readers which are only capable of processing text. | ||
|
||
But I think a lot of internet users don't realize the amount of information that is now routinely extracted from photographs. Facebook (and Google, Apple, Amazon, etc) can easily tell from your photographs if you have a pet dog, if you collect cameras, if you play golf, if you have children, or if you are just really into sunglasses. There's nothing stopping them from using this information to show you relevant ads just based on photos of you - even if another user uploaded the photo and didn't even directly tag you! | ||
|
||
This is a very simple Chrome Extension that I hacked together in a few minutes to make it easy to see the tags that Facebook is automatically applying to you and your friends' photos. Once you install it, all the photos you see on your Facebook timeline will automatically be overlaid with their tags, like this: | ||
|
||
<img width="524" src="https://cloud.githubusercontent.com/assets/896692/21574687/3443b268-ceac-11e6-85ee-45f59408f9bb.png"> | ||
|
||
The goal is simply to make everyone aware of the kind of information that is routinely extracted from your own images today. This isn't some technology that is 'coming soon', but this is something in *wide-spread production use now by every major internet company*. You can even [learn how to implement this kind of system yourself](https://medium.com/@ageitgey/machine-learning-is-fun-part-3-deep-learning-and-convolutional-neural-networks-f40359318721) using widely available open-source software. | ||
|
||
Here's some examples of the kinds of things that Facebook detects in your photos: | ||
|
||
### Objects in your photos | ||
|
||
It's possible to tell what kinds of objects are in your photos and identify your interests based on that. | ||
|
||
![](https://cloud.githubusercontent.com/assets/896692/21574712/aa1fd34a-ceac-11e6-98b0-b0b7a6a5d9fb.png) | ||
|
||
### Activities you are doing | ||
|
||
Whether you are eating, running, or playing golf, it's possible for an algorithm to tell what you are doing in your photographs. | ||
|
||
<img width="523" alt="" src="https://cloud.githubusercontent.com/assets/896692/21574724/f5055da8-ceac-11e6-9ec0-14629f42deca.png"> | ||
|
||
### When and where a photo was taken | ||
|
||
You can tell if a photo was taken inside or outside, what the time of day was, what physical landmarks (mountains, trees, water, etc) were around, and so on. | ||
|
||
<img width="623" alt="screen shot 2016-12-30 at 4 30 36 pm" src="https://cloud.githubusercontent.com/assets/896692/21574743/5de83548-cead-11e6-9211-3e75a588523d.png"> | ||
|
||
### Events you are attending | ||
|
||
It's even possible to tell which kind of sporting event you are attending. | ||
|
||
<img width="949" alt="screen shot 2016-12-30 at 4 35 31 pm" src="https://cloud.githubusercontent.com/assets/896692/21574780/24767440-ceae-11e6-9ee1-b5e065f89c93.png"> | ||
|
||
These are just a few examples. See what kinds of things Facebook has found in your own photos! | ||
|
||
# Installing this Chrome Extension | ||
|
||
1. Clone this repo so you have a copy in a folder locally. | ||
1. Open `chrome://extensions` in the location or go to `Tools` > `Extensions` | ||
1. Enable `Developer mode` by checking the checkbox in the upper-right corner. | ||
1. Click on the button labelled `Load unpacked extension...`. | ||
1. Select the directory where you cloned this repo to. | ||
1. Visit Facebook! | ||
|
||
Caveats: | ||
|
||
1. This only works for English-speaking Facebook users. I made no attempt to make this work for any other language. Sorry! But you could easily fork this and make it work for a different language. There's not a lot to this. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,109 @@ | ||
const emoji_map = { | ||
"1 person": "👤", | ||
"2 people": "👥", | ||
"3 people": "👥", | ||
"4 people": "👥", | ||
"5 people": "👥", | ||
"6 people": "👥", | ||
"7 people": "👥", | ||
"baby": "🍼", | ||
"beach": "🏖", | ||
"beard": "👴", | ||
"bicycle": "🚲", | ||
"camera": "📷", | ||
"car": "🚗", | ||
"child": "👦", | ||
"christmas tree": "🎄", | ||
"closeup": "👀", | ||
"cloud": "☁️", | ||
"crowd": "👥", | ||
"dog": "🐶", | ||
"drink": "🍹", | ||
"eating": "🍽", | ||
"eyeglasses": "👓", | ||
"flower": "🌻", | ||
"food": "🍎", | ||
"golf": "🏌️", | ||
"grass": "🍃", | ||
"hat": "👒", | ||
"indoor": "🏠", | ||
"living room": "🏠", | ||
"meme": "👍", | ||
"mountain": "🌋", | ||
"nature": "🏞", | ||
"night": "🌃", | ||
"ocean": "🌊", | ||
"office": "💼", | ||
"one or more people": "👥", | ||
"outdoor": "🚵", | ||
"people eating": "🍽", | ||
"people sitting": "⑁", | ||
"people smiling": "😂", | ||
"people standing": "🕴", | ||
"phone": "📱", | ||
"plant": "🌿", | ||
"selfie": "🤳", | ||
"shoes": "👡", | ||
"sitting": "⑁", | ||
"sky": "☀️", | ||
"skyscraper": "🏙", | ||
"sleeping": "😴", | ||
"smiling": "😋", | ||
"snow": "❄️", | ||
"standing": "🕴", | ||
"stripes": "📶", | ||
"suit": "🕴", | ||
"sunglasses": "🕶", | ||
"swimming": "🏊", | ||
"table": "🍽", | ||
"text": "🔠", | ||
"tree": "🌴", | ||
"twilight": "🌃", | ||
"water": "💧" | ||
} | ||
|
||
const show_facebook_cv_tags = function() { | ||
const TAG_PREFIX = "Image may contain: "; | ||
const images = [...document.getElementsByTagName('img')]; | ||
|
||
images.forEach(function(el) { | ||
if (el.hasAttribute("data-prev-alt") && el.getAttribute("data-prev-alt") === el.getAttribute("alt")) | ||
return; | ||
|
||
el.setAttribute("data-prev-alt", el.alt); | ||
|
||
const altText = el.alt; | ||
const isCVTag = altText.startsWith(TAG_PREFIX); | ||
|
||
if (isCVTag) { | ||
const tags = altText.slice(TAG_PREFIX.length).split(/, | and /); | ||
let html = "<ul style='position:absolute;top:10px;right:10px;padding:5px;font-size:12px;line-height:1.8;background-color:rgba(0,0,0,0.7);color:#fff;border-radius:5px'>"; | ||
|
||
tags.forEach(function(tag){ | ||
let prefix = "∙"; | ||
|
||
if (tag in emoji_map) | ||
prefix = emoji_map[tag]; | ||
|
||
html += `<li>${prefix} ${tag}</li>`; | ||
}); | ||
|
||
html += "</ul>"; | ||
|
||
el.style.position = 'relative'; | ||
el.insertAdjacentHTML('afterend', html); | ||
} | ||
}); | ||
}; | ||
|
||
const observer = new MutationObserver(function(mutations) { | ||
mutations.forEach(function(mutation) { | ||
show_facebook_cv_tags(); | ||
}); | ||
}); | ||
|
||
const config = { attributes: true, childList: true, characterData: false } | ||
|
||
observer.observe(document.body, config); | ||
|
||
show_facebook_cv_tags(); |
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,22 @@ | ||
{ | ||
"name": "Show Facebook Computer Vision Tags", | ||
"version": "0.0.1", | ||
"manifest_version": 2, | ||
"description": "Shows what Facebook thinks your pictures contain", | ||
"permissions": [ | ||
"http://www.facebook.com/*", "https://www.facebook.com/*" | ||
], | ||
"icons": { | ||
"128": "logo128.png", | ||
"16": "logo16.png", | ||
"48": "logo48.png" | ||
}, | ||
"content_scripts": [ | ||
{ | ||
"matches": ["http://www.facebook.com/*", "https://www.facebook.com/*"], | ||
"js" : ["facebook.js"], | ||
"run_at" : "document_idle", | ||
"all_frames" : false | ||
} | ||
] | ||
} |