graph-gen.html (16399B)
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1"> 6 7 <title>Facebook Graph Search Generator by Henk van Ess and Torment Gerhardsen</title> 8 9 <link rel="stylesheet" type="text/css" href="graph-style.css" /> 10 <script type="text/javascript" src="jquery-2.2.3.min.js"></script> 11 </head> 12 <body> 13 14 <main> 15 16 <h1>Facebook Graph Search Generator by Henk van Ess, GUI made by Tormund Gerhardsen </h1> 17 18 <!-- GETTING STARTED --> 19 <section> 20 <h2>1. Getting started</h2> 21 <p> 22 <strong>What is Facebook Graph Search, and why does this page exist?</strong> <br /> 23 Facebook Graph Search is a powerful search engine that lets everyone play around with Facebooks 24 "big data". It only shows you what is already accessible to you (at least that's what Facebook claims), 25 but in a structured and simple way that has been met by a lot of concerns about privacy. 26 Especially since it can reveal things you might not think you had access to. 27 <p> 28 <strong>History</strong><p> 29 When I did a keynote for Nordic Media Conference in Norway early 2016, I asked the public if some one could improve my GUI of http://graph.tips Tormund Gerhardsen came up with the idea to simplify the input. 30 <a target="_blank" href="https://en.wikipedia.org/wiki/Facebook_Graph_Search">Read more on Wikipedia.</a> 31 </p> 32 <p> 33 <strong>Set the language of your Facebook to English (US)</strong> <br /><p> 34 At the moment, Facebook Graph Search is only available for United States with English (US) language 35 selected. However, anyone can change to English (US) by going to "Settings" -> "Language" in the upper 36 right corner on Facebook. And search results will still show up from the entire Facebook database! 37 </p> 38 <p> 39 <strong>Why not just type names directly in the search bar?</strong> <br /> 40 Well, a lot of stuff can have the same name. Everything on Facebook (people, places, events, etc.) 41 have a unique ID, a so called UID. This is simply just a number, but very important to get the 42 search accurate. And to get the UID for a person, use the persons unique username from the URL. 43 </p> 44 </section> 45 46 <!-- ADD & LIST ITEMS --> 47 <section> 48 <h2>2. Add people by username</h2> 49 <p class="input-wrap"> 50 <input type="text" id="input-username-or-uid" name="username-or-uid" placeholder="Username (required)"> 51 <input type="text" id="input-friendlyname" name="friendlyname" placeholder="Real name (optional)"> 52 <span id="btn-add-item" class="button">Add</span> 53 <img id="loading-add-item" class="loading" src="loading.gif" width="24" /> 54 </p> 55 <p class="example"> 56 <em> 57 <strong>Example:</strong> 58 Go to a Facebook profile and look in the address bar and find something like: <br /> 59 "https://www.facebook.com/JohnDoe". The username is simply "JohnDoe". 60 The friendly name can be whatever you want. 61 </em> 62 </p> 63 64 <table id="fb-items" cellpadding="0" cellspacing="2"> 65 <tr> 66 <th>Name</th> 67 <th>Facebook UID</th> 68 <th>Action</th> 69 </tr> 70 </table> 71 </section> 72 73 <!-- SEARCH GENERATED --> 74 <section> 75 <h2>3. Search</h2> 76 77 <!-- PERSON--> 78 <div class="search-type"> 79 <h3>Single person</h3> 80 <p class="input-wrap"> 81 <select onchange="generate_url_personal();" id="select-personal-what"> 82 <option value="stories">Posts with</option> 83 <option value="stories-by">Posts by</option> 84 <option value="stories-commented">Posts commented by</option> 85 <option value="stories-tagged">Posts tagged with</option> 86 <option value="photos-liked">Photos liked by</option> 87 <option value="photos-of">Photos made of</option> 88 <option value="photos-tagged">Photos tagged with</option> 89 <option value="photos-commented">Photos commented by</option> 90 <option value="events">Events invitations for</option> 91 <option value="events-joined">Events joined by</option> 92 <option value="groups">Groups joined by</option> 93 <option value="places-liked">Places liked by</option> 94 <option value="places-visited">Places visited by</option> 95 <option value="places-visited/1436055710025360/places/intersect">Restaurants visited by</option> 96 <option value="places-visited/856947674344242/places/intersect">Bars visited by</option> 97 <option value="places-visited/1585092751741608/places/intersect">Cafes visited by</option> 98 <option value="places-visited/1588881098065695/places/intersect">Nightclubs visited by</option> 99 <option value="places-visited/1631302203768899/places/intersect">Shopping places visited by</option> 100 <option value="places-visited/739776352805342/places/intersect">Hotels visited by</option> 101 <option value="places-visited/440293872820865/places/intersect">Landmarks visited by</option> 102 <option value="places-visited/197817313562497/places/intersect">Museums visited by</option> 103 <option value="pages-liked">Pages liked by</option> 104 <option value="apps-used">Apps used by</option> 105 <option value="videos">Videos with</option> 106 <option value="videos-by">Videos by</option> 107 <option value="videos-liked">Videos liked by</option> 108 <option value="videos-commented">Videos commented by</option> 109 <option value="friends">Friends of</option> 110 <option value="relatives">Relatives of</option> 111 </select> 112 <select onchange="generate_url_personal();" id="select-personal-with-who"> 113 <option value="0">(optional)</option> 114 <option value="friends/">friends of</option> 115 </select> 116 <select onchange="generate_url_personal();" id="select-personal-who" class="select-item"> 117 <option value="0">-- Choose who</option> 118 </select> 119 <a href="#" target="_blank" id="btn-search-personal" class="button">Search</a> 120 </p> 121 <p class="example"> 122 <em> 123 <strong>Example:</strong> 124 <a target="_blank" href="https://www.facebook.com/search/4/photos-tagged"> 125 Photos tagged with <u>Mark Zuckerberg</u> 126 </a> 127 </em> 128 </p> 129 </div> 130 131 <!-- COMMON --> 132 <div class="search-type"> 133 <h3>What do they have in common?</h3> 134 <p class="input-wrap"> 135 <select onchange="generate_url_common();" id="select-common-what"> 136 <option value="places-visited">Places visited by</option> 137 <option value="pages-liked">Pages liked by</option> 138 <option value="photos-liked">Photos liked by</option> 139 <option value="photos-commented">Photos commented by</option> 140 <option value="photos-of">Photos tagged with</option> 141 <option value="stories-commented">Posts commented by</option> 142 <option value="events">Common events among</option> 143 <option value="groups">Common groups among</option> 144 <option value="apps-used">Apps used by</option> 145 </select> 146 <select onchange="generate_url_common();" id="select-common-who1" class="select-item"> 147 <option value="0">-- Choose who</option> 148 </select> 149 <strong>and</strong> 150 <select onchange="generate_url_common();" id="select-common-who2" class="select-item"> 151 <option value="0">-- Choose who</option> 152 </select> 153 <a href="#" target="_blank" id="btn-search-common" class="button">Search</a> 154 </p> 155 <p class="example"> 156 <em> 157 <strong>Example:</strong> 158 <a target="_blank" href="https://www.facebook.com/search/5/places-visited/4/places-visited/intersect/"> 159 Places visited by <u>Mark Zuckerberg</u> and <u>Chris Hughes</u> 160 </a> 161 </em> 162 </p> 163 </div> 164 165 <!-- ALL POSTINGS --> 166 <div class="search-type"> 167 <h3>All wall postings</h3> 168 <p class="input-wrap"> 169 Search all wall postings for 170 " <input onkeyup="generate_url_postings();" type="text" id="input-postings-what" />" 171 made by or with 172 <select onchange="generate_url_postings();" id="select-postings-who" class="select-item"> 173 <option value="0">anyone</option> 174 </select> 175 <a href="#" target="_blank" id="btn-search-postings" class="button">Search</a> 176 </p> 177 <p class="example"> 178 <em> 179 <strong>Example:</strong> 180 <a target="_blank" href="https://www.facebook.com/search/str/A%20walk%20on%20the%20beach/stories-keyword/"> 181 Search all wall postings for <u>"A walk on the beach"</u> 182 </a> 183 </em> 184 </p> 185 </div> 186 187 <!-- LOCATION --> 188 <div class="search-type"> 189 <h3>Who went where?</h3> 190 <p class="input-wrap"> 191 Which people who live in 192 <input onkeyup="generate_url_location();" type="text" id="input-location-from" 193 placeholder="name of country or city"/> 194 visited 195 <input onkeyup="generate_url_location();" type="text" id="input-location-visited" 196 placeholder="name of country or city"/> 197 <a href="#" target="_blank" id="btn-search-location" class="button">Search</a> 198 </p> 199 <p class="example"> 200 <em> 201 <strong>Example:</strong> 202 <a target="_blank" href="https://www.facebook.com/search/str/bergen/pages-named/residents/present/intersect/str/Syria/pages-named/visitors/intersect"> 203 Which people who live in <u>Bergen</u> visited <u>Syria</u>? 204 </a> 205 </em> 206 </p> 207 </div> 208 209 </section> 210 </main> 211 212 213 <!-- FOOTER --> 214 <footer> 215 216 <p> 217 <img src="cc_license.png" /> 218 </p> 219 </footer> 220 221 222 <!-- SCRIPT --> 223 <script> 224 /** 225 * Add item to list 226 */ 227 var $btn_add_item = $('#btn-add-item'); 228 $btn_add_item.click(function() { 229 230 var $input_friendlyname = $('#input-friendlyname'); 231 var $input_username_or_uid = $('#input-username-or-uid'); 232 var $loading_add_item = $('#loading-add-item'); 233 $loading_add_item.show(); 234 $btn_add_item.hide(); 235 236 // Get UID 237 $.get('controller.php', { 238 request: 'add-fb-item', 239 var1: $input_friendlyname.val(), 240 var2: $input_username_or_uid.val() 241 242 }).done(function(data) { 243 var result = jQuery.parseJSON(data); 244 245 // Add to list and dropdown 246 add_fb_item(result.friendlyname, result.fb_uid); 247 248 // Reset form 249 $input_friendlyname.val(''); 250 $input_username_or_uid.val(''); 251 $loading_add_item.hide(); 252 $btn_add_item.show(); 253 }); 254 }); 255 256 257 /** 258 * Add item to list and dropdown 259 */ 260 function add_fb_item(friendlyname, fb_uid) { 261 262 // Add to list 263 $('#fb-items').append( 264 '<tr class="uid-'+fb_uid+'">'+ 265 '<td>'+friendlyname+'</td>'+ 266 '<td>'+fb_uid+'</td>'+ 267 '<td><span class="link-remove" onclick="remove_fb_item('+fb_uid+')">remove</span></td>' + 268 '</tr>' 269 ); 270 // Add to all dropdowns 271 $('.select-item').append( 272 '<option class="uid-'+fb_uid+'" value="'+fb_uid+'">'+friendlyname+'</option>' 273 ); 274 } 275 276 277 /** 278 * Remove item from list, dropdowns and cookie 279 */ 280 function remove_fb_item(fb_uid) { 281 282 $.get('controller.php', { 283 request: 'remove-fb-item', 284 var1: fb_uid 285 286 }).done(function(data) { 287 288 // Remove from list and dropdows 289 $('.uid-'+fb_uid).remove(); 290 }); 291 } 292 293 294 /** 295 * Search: personal 296 */ 297 function generate_url_personal() { 298 299 var what = $('#select-personal-what').val(); 300 var who = $('#select-personal-who').val(); 301 var optional = ''; 302 303 // Add optional? 304 var with_who = $('#select-personal-with-who').val(); 305 if(with_who != '0') { 306 optional = with_who; 307 } 308 309 var go_to_url = 'https://www.facebook.com/search/'+who+'/'+optional+what; 310 $('#btn-search-personal').attr('href', go_to_url); 311 } 312 313 314 /** 315 * Search: common 316 */ 317 function generate_url_common() { 318 319 var what = $('#select-common-what').val(); 320 var who1 = $('#select-common-who1').val(); 321 var who2 = $('#select-common-who2').val(); 322 323 var go_to_url = 'https://www.facebook.com/search/'+who1+'/'+what+'/'+who2+'/'+what+'/intersect'; 324 $('#btn-search-common').attr('href', go_to_url); 325 } 326 327 328 /** 329 * Search: postings 330 */ 331 function generate_url_postings() { 332 333 var what = $('#input-postings-what').val(); 334 var go_to_url = 'https://www.facebook.com/search/str/'+what+'/stories-keyword/'; 335 336 // Everyone or spesific person? 337 var who = $('#select-postings-who').val(); 338 if(who != '0') { 339 go_to_url += who+'/stories/intersect'; 340 } 341 342 $('#btn-search-postings').attr('href', go_to_url); 343 } 344 345 346 /** 347 * Search: location 348 */ 349 function generate_url_location() { 350 351 var from = $('#input-location-from').val(); 352 var visited = $('#input-location-visited').val(); 353 var go_to_url = 354 'https://www.facebook.com/search/str/'+from+ 355 '/pages-named/residents/present/intersect/str/'+visited+ 356 '/pages-named/visitors/intersect'; 357 358 $('#btn-search-location').attr('href', go_to_url); 359 } 360 361 362 /** 363 * Generated by cookie data, and update search parameters to first avaliable 364 */ 365 add_fb_item('elena.bodulenica', 757037685); 366 generate_url_personal(); 367 generate_url_common(); 368 </script> 369 370 </body> 371 </html>