// ==UserScript==
// @name           Blur NSFW Flickr Images
// @version        1.0.2
// @description    Blurs images on your user's feed & photostream by default, with an option to toggle the blur on/off.
// @author         Bruce Bentley <brucebentley@me.com> (https://brucebentley.io)
// @copyright      2020, Bruce Bentley (https://github.com/brucebentley)
// @license        MIT; https://opensource.org/licenses/MIT
// @namespace      https://github.com/brucebentley
// @include        https://*.flickr.com/*
// @icon           https://combo.staticflickr.com/pw/images/favicons/favicon-32.png
// @match          https://*.flickr.com/*
// @match          https://*.staticflickr.com/*
// @run-at         document-idle
// @noframes
// @grant          GM_registerMenuCommand
// @grant          GM_getValue
// @grant          GM_setValue
// @grant          GM_addStyle
// @downloadURL https://update.greasyfork.icu/scripts/380585/Blur%20NSFW%20Flickr%20Images.user.js
// @updateURL https://update.greasyfork.icu/scripts/380585/Blur%20NSFW%20Flickr%20Images.meta.js
// ==/UserScript==

(() => {
  'use strict';

  const D = document;
  const H = D.head;
  const s = D.createElement('style');
  s.setAttribute('type', 'text/css');
  s.appendChild(
    D.createTextNode(
      '.photo-card-view .photo-card.active, .photo-list-photo-view.awake { filter: none; }' +
        '.photo-card-view .photo-card.active.blurred, .photo-list-photo-view.awake.blurred { filter: blur(20px) opacity(50%); }' +
        '.button__toggle-blur { background-color: rgba(248, 75, 75, 1); color: rgba(255, 255, 255, 1); font-family: Proxima Nova, helvetica neue, helvetica, arial, sans-serif; font-size: 14px; font-weight: normal; padding: 10px 15px !important; line-height: 1; outline: none !important; text-decoration: none !important; }'
    )
  );
  H.appendChild(s);

  const b = D.createElement('li');
  const a = D.createElement('a');
  const c = D.createTextNode('Toggle Image Blur');
  a.appendChild(c);
  b.appendChild(a);
  a.setAttribute('class', 'gn-title button__toggle-blur');
  a.setAttribute('id', 'buttonToggleImageBlur');
  D.querySelector('.global-nav-container .nav-menu').appendChild(b);

  function toggleBlur() {
    const feedImages = document.querySelectorAll('.photo-card-view .photo-card.active');
    const listImages = document.querySelectorAll('.photo-list-photo-view.awake');
    // const images = document.querySelectorAll('.photo-card-view .photo-card.active, ');

    if (feedImages.length > 0) {
      for (let i = 0; i < feedImages.length; i++) {
        feedImages[i].classList.toggle('blurred');
      }
    }
    if (listImages.length > 0) {
      for (let i = 0; i < listImages.length; i++) {
        listImages[i].classList.toggle('blurred');
      }
    }

    // for (let i = 0; i < images.length; i++) {
    //   images[i].classList.toggle('unblurred');
    // }
  }

  a.addEventListener(
    'click',
    function (event) {
      // eslint-disable-line no-unused-vars
      toggleBlur();
    },
    false
  );
})();