Unfollow all friends and pages on Facebook

[danieljvdm]

Nudge currently has domain recognition functions that can be used for this

Subtasks:

• create facebookunfollow.js, facebookunfollow.css
• [ ] Load infoBar (see HTML provided below) onto https://www.facebook.com / https://facebook.com URL when user loads site
• [ ] Function to extract user's user_id and fb_dtsg. user_id = Facebook user_id. fb_dtsg is authentication key needed to successfully perform XHTML requests in the other functions to follow. I will send you the javascript to base this off
• [ ] Function to extract user's friend list including IDs. I will send you the javascript to base this off
• [ ] Function to extract user's page list including IDs. I will send you the javascript to base this off
• [ ] Function to unfollow individual friend / page by ID (or in batches if possible). I will send you the two javascripts to base this off
• [ ] Safety function / feature of the above function to ensure batch unfollowing doesn't trigger Facebook security policies. Suggestions: regular breaks in the function running / randomised gaps. Subject to testing.
• [ ] Implement flow of feature / infoBar messages as detailed below

Flow of feature / infoBar:

1. 'Unfollow all friends and pages' [LINK - hover underline - launches 2.] (why?) [LINK - hover underline - launches HTML page (placeholder for now - LB will design)
2. If 'Unfollow...' clicked - 'Are you sure? This will get rid of your newsfeed. Yes No ['Yes' = LINK - hover underline - launches 3.] ['No' = LINK - takes you back to 1.]
3. 'Extracting friend and page lists...' - runs those two functions as above
4. '[1] of [145] friends unfollowed and [0] of [153] pages unfollowed. X minutes remaining (cancel)' - repeatedly runs function to unfollow friend / page, and updates the figures in square brackets. ['cancel' = LINK - hover underline - aborts whole operation]
5. Needs safety checks so that if operation breaks - e.g. Facebook kicking in with some security feature - shows error message 'Looks like something went wrong. Try again?' ['Try again' = LINK - hover underline - to go to 3]
6. If everything is completed successfully shows 'Well done! You've just got hundreds of hours of your life back"

[louisbarclay]

Here is the HTML and CSS for infoBar at bottom of screen

<div id="nudge_s">
   <div id="s_wrapper">
      <div id="s_container">
         <div id="s_message">
            <div id="s_message_contents">Unfollow all friends and pages <u>(why?)</u></div>
         </div>
      </div>
   </div>
</div>

/* Copyright 2016, Nudge, All rights reserved. */

/* Latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: local('Open Sans'), local('OpenSans'), url('chrome-extension://__MSG_@@extension_id__/resources/fonts/opensans.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}

#nudge_s div,
#nudge_s span,
#nudge_s h1,
#nudge_s h2,
#nudge_s h3,
#nudge_s h4,
#nudge_s h5,
#nudge_s h6,
#nudge_s p,
#nudge_s a,
#nudge_s em,
#nudge_s img,
#nudge_s strong,
#nudge_s ol,
#nudge_s ul,
#nudge_s li {
    margin: 0;
    padding: 0;
    border: 0;
    top: initial;
    bottom: initial;
    left: initial;
    right: initial;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
    box-sizing: initial;
    position: initial;
}

#nudge_s #s_wrapper {
  text-align: center;
}

#nudge_s #s_container {
  position: fixed;
  bottom: 25px;
  background-color: #000000;
  overflow: hidden;
  display: inline-block;
  width: auto;
  min-width: 27px;
  height: 27px;
  opacity: .5;
  z-index: 2147483646;
  transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
  transition: all 0.3s;
  cursor: pointer;
  border-radius: 40px;
  font-family: 'Open Sans', Arial, sans-serif;
  font-style: normal;
}

#nudge_s #s_container:hover {
  opacity: .8;
}

#nudge_s #s_message {
  font-size: 13px;
  -webkit-font-smoothing: antialiased;
  color: #F0F8FF;
  width: auto;
  margin: 0;
  max-width: 1000px;
  height: 100%;
  float: left;
  text-align: center;
  line-height: 24px;
  white-space: nowrap;
  overflow: hidden;
  transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
  transition: all 0.3s;
}

#nudge_s #s_message_contents {
  margin: 1px 25px 0 25px;
}