- changes class name for minimal effects to minEffects

- hides nsfw content when effects are set to minimal
- when you look at your own nsfw page or product, and your account is set to hide nsfw material, the warning modal now shows up so you can unhide your own content
- fixes un-updated border on the page navigation menu when effects are set to minimal
- Closes #1651

Author: jjeffryes

css/obBase.css

@@ -6131,18 +6131,18 @@ input[type="checkbox"].fieldItem:checked + label .togLabelOff {
 
 /* turn off animations and transitions with this style */
 
-#ov1.notFancy,
-#ov1.notFancy *,
-#ov1.notFancy #userPage,
-#ov1.notFancy #userPage *,
-#ov1.notFancy #obContainer,
-#ov1.notFancy #obContainer *,
-#ov1.notFancy #overlay,
-#ov1.notFancy #sideBar,
-#ov1.notFancy #pageNav,
-#ov1.notFancy #modalHolder,
-#ov1.notFancy #messageModal,
-#ov1.notFancy #statusBar {
+#ov1.minEffects,
+#ov1.minEffects *,
+#ov1.minEffects #userPage,
+#ov1.minEffects #userPage *,
+#ov1.minEffects #obContainer,
+#ov1.minEffects #obContainer *,
+#ov1.minEffects #overlay,
+#ov1.minEffects #sideBar,
+#ov1.minEffects #pageNav,
+#ov1.minEffects #modalHolder,
+#ov1.minEffects #messageModal,
+#ov1.minEffects #statusBar {
   transition: none !important;
   -webkit-filter: none !important;
   opacity: 1 !important;
@@ -6152,139 +6152,143 @@ input[type="checkbox"].fieldItem:checked + label .togLabelOff {
   text-shadow: none !important;
 }
 
-#ov1.notFancy #pageNav .popMenu.popMenu-navBar.popMenu-opened {
+#ov1.minEffects #pageNav .popMenu-navBarSubMenu {
   border-left: 1px solid #444;
   border-right: 1px solid #444;
   border-bottom: 1px solid #444;
 }
 
-#ov1.notFancy .fadeOut,
-#ov1.notFancy .statusBar.fadeOut,
-#ov1.notFancy #pageNav .statusBar.fadeOut,
-#ov1.notFancy #userPage .fadeOut,
-#ov1.notFancy #userPage #pageNav .fadeOut,
-#ov1.notFancy #userPage #pageNav .statusBar.fadeOut,
-#ov1.notFancy #userPage #obContainer #content .statusBar.fadeOut {
+#ov1.minEffects .fadeOut,
+#ov1.minEffects .statusBar.fadeOut,
+#ov1.minEffects #pageNav .statusBar.fadeOut,
+#ov1.minEffects #userPage .fadeOut,
+#ov1.minEffects #userPage #pageNav .fadeOut,
+#ov1.minEffects #userPage #pageNav .statusBar.fadeOut,
+#ov1.minEffects #userPage #obContainer #content .statusBar.fadeOut {
   opacity: 0 !important;
 }
 
-#ov1.notFancy #sideBar .sideBarSlidShow {
+#ov1.minEffects #sideBar .sideBarSlidShow {
   display: none;
 }
 
-#ov1.notFancy #sideBar.sideBarSlid .sideBarSlidShow {
+#ov1.minEffects #sideBar.sideBarSlid .sideBarSlidShow {
   display: block;
 }
 
-#ov1.notFancy #sideBar .chatConversation textarea,
-#ov1.notFancy #sideBar .chatConversation textarea::-webkit-input-placeholder,
-#ov1.notFancy #sideBar .chatConversation input,
-#ov1.notFancy #sideBar .chatConversation input::-webkit-input-placeholder {
+#ov1.minEffects #sideBar .chatConversation textarea,
+#ov1.minEffects #sideBar .chatConversation textarea::-webkit-input-placeholder,
+#ov1.minEffects #sideBar .chatConversation input,
+#ov1.minEffects #sideBar .chatConversation input::-webkit-input-placeholder {
   color: #fff;
 }
 
-#ov1.notFancy .gridItemControls {
+#ov1.minEffects .gridItemControls {
   display: none;
 }
 
-#ov1.notFancy .gridItemControls .btn-gridItemControl:hover,
-#ov1.notFancy .userPage-subViews .gridItem:hover .gridItemControls,
-#ov1.notFancy .homeView .gridItem:hover .gridItemControls {
+#ov1.minEffects .gridItemControls .btn-gridItemControl:hover,
+#ov1.minEffects .userPage-subViews .gridItem:hover .gridItemControls,
+#ov1.minEffects .homeView .gridItem:hover .gridItemControls {
   display: block;
 }
 
-#ov1.notFancy .btn .postConfirm {
+#ov1.minEffects .btn .postConfirm {
   display: none;
 }
 
-#ov1.notFancy .confirm.btn .preConfirm {
+#ov1.minEffects .confirm.btn .preConfirm {
   display: none;
 }
 
-#ov1.notFancy .confirm.btn .postConfirm {
+#ov1.minEffects .confirm.btn .postConfirm {
   display: inline-block;
 }
 
-#ov1.notFancy #userPage #obContainer #content .labelWrap.fade {
+#ov1.minEffects #userPage #obContainer #content .labelWrap.fade {
   opacity: 0 !important;
 }
 
-#ov1.notFancy #userPage #obContainer #content .labelWrap.fadeIn {
+#ov1.minEffects #userPage #obContainer #content .labelWrap.fadeIn {
   opacity: 1;
 }
 
-#ov1.notFancy #obContainer .taggle_placeholder,
-#ov1.notFancy #userPage #obContainer .taggle_placeholder {
+#ov1.minEffects #obContainer .taggle_placeholder,
+#ov1.minEffects #userPage #obContainer .taggle_placeholder {
   display: none !important;
 }
 
-#ov1.notFancy #obContainer .unfilled,
-#ov1.notFancy #userPage .unfilled {
+#ov1.minEffects #obContainer .unfilled,
+#ov1.minEffects #userPage .unfilled {
   opacity: 0.35 !important;
 }
 
-#ov1.notFancy .notFancyDarkBackground,
-#ov1.notFancy #obContainer .notFancyDarkBackground {
+#ov1.minEffects .minEffectsDarkBackground,
+#ov1.minEffects #obContainer .minEffectsDarkBackground {
   background: #262626 !important;
 }
 
-#ov1.notFancy .addressFormOpened .buyWizardMap .blurMore {
+#ov1.minEffects .addressFormOpened .buyWizardMap .blurMore {
   display: none;
 }
 
-#ov1.notFancy .user-page-header-slim {
+#ov1.minEffects .user-page-header-slim {
   display: none;
 }
 
-#ov1.notFancy .user-page-header-slim.scrolledIntoView {
+#ov1.minEffects .user-page-header-slim.scrolledIntoView {
   display: block;
 }
 
-#ov1.notFancy .disabled,
-#ov1.notFancy #userPage .disabled,
-#ov1.notFancy #obContainer .disabled,
-#ov1.notFancy #overlay .disabled,
-#ov1.notFancy #sideBar .disabled,
-#ov1.notFancy #pageNav .disabled,
-#ov1.notFancy #modalHolder .disabled,
-#ov1.notFancy #messageModal .disabled,
-#ov1.notFancy #statusBar .disabled {
+#ov1.minEffects .disabled,
+#ov1.minEffects #userPage .disabled,
+#ov1.minEffects #obContainer .disabled,
+#ov1.minEffects #overlay .disabled,
+#ov1.minEffects #sideBar .disabled,
+#ov1.minEffects #pageNav .disabled,
+#ov1.minEffects #modalHolder .disabled,
+#ov1.minEffects #messageModal .disabled,
+#ov1.minEffects #statusBar .disabled {
   opacity: 0.2 !important;
 }
 
-#ov1.notFancy .disabled2,
-#ov1.notFancy #userPage .disabled2,
-#ov1.notFancy #obContainer .disabled2,
-#ov1.notFancy #overlay .disabled2,
-#ov1.notFancy #sideBar .disabled2,
-#ov1.notFancy #pageNav .disabled2,
-#ov1.notFancy #modalHolder .disabled2,
-#ov1.notFancy #messageModal .disabled2,
-#ov1.notFancy #statusBar .disabled2 {
+#ov1.minEffects .disabled2,
+#ov1.minEffects #userPage .disabled2,
+#ov1.minEffects #obContainer .disabled2,
+#ov1.minEffects #overlay .disabled2,
+#ov1.minEffects #sideBar .disabled2,
+#ov1.minEffects #pageNav .disabled2,
+#ov1.minEffects #modalHolder .disabled2,
+#ov1.minEffects #messageModal .disabled2,
+#ov1.minEffects #statusBar .disabled2 {
   opacity: 0.7 !important;
 }
 
+#ov1.minEffects .nsfw {
+  background: #000 !important;
+}
+
 /* add a shadow and a glow, so modal close buttons are still barely visible if the user picks a bad color */
 #ov1 .js-closeIndexModal [class *= "ion-"]:before,
 #ov1 #userPage .js-closeIndexModal [class *= "ion-"]:before,
 #ov1 #obContainer .js-closeIndexModal [class *= "ion-"]:before,
 #ov1 #modalHolder .js-closeIndexModal [class *= "ion-"]:before,
 #ov1 #messageModal .js-closeIndexModal [class *= "ion-"]:before,
-#ov1.notFancy .js-closeIndexModal [class *= "ion-"]:before,
-#ov1.notFancy #userPage .js-closeIndexModal [class *= "ion-"]:before,
-#ov1.notFancy #obContainer .js-closeIndexModal [class *= "ion-"]:before,
-#ov1.notFancy #modalHolder .js-closeIndexModal [class *= "ion-"]:before,
-#ov1.notFancy #messageModal .js-closeIndexModal [class *= "ion-"]:before,
+#ov1.minEffects .js-closeIndexModal [class *= "ion-"]:before,
+#ov1.minEffects #userPage .js-closeIndexModal [class *= "ion-"]:before,
+#ov1.minEffects #obContainer .js-closeIndexModal [class *= "ion-"]:before,
+#ov1.minEffects #modalHolder .js-closeIndexModal [class *= "ion-"]:before,
+#ov1.minEffects #messageModal .js-closeIndexModal [class *= "ion-"]:before,
 #ov1 .js-modal-close [class *= "ion-"]:before,
 #ov1 #userPage .js-modal-close [class *= "ion-"]:before,
 #ov1 #obContainer .js-modal-close [class *= "ion-"]:before,
 #ov1 #modalHolder .js-modal-close [class *= "ion-"]:before,
 #ov1 #messageModal .js-modal-close [class *= "ion-"]:before,
-#ov1.notFancy .js-modal-close [class *= "ion-"]:before,
-#ov1.notFancy #userPage .js-modal-close [class *= "ion-"]:before,
-#ov1.notFancy #obContainer .js-modal-close [class *= "ion-"]:before,
-#ov1.notFancy #modalHolder .js-modal-close [class *= "ion-"]:before,
-#ov1.notFancy #messageModal .js-modal-close [class *= "ion-"]:before,
+#ov1.minEffects .js-modal-close [class *= "ion-"]:before,
+#ov1.minEffects #userPage .js-modal-close [class *= "ion-"]:before,
+#ov1.minEffects #obContainer .js-modal-close [class *= "ion-"]:before,
+#ov1.minEffects #modalHolder .js-modal-close [class *= "ion-"]:before,
+#ov1.minEffects #messageModal .js-modal-close [class *= "ion-"]:before,
 #ov1 #modalHolder .js-closeBuyWizardModal [class *= "ion-"]:before {
   text-shadow: 0 0 1px rgba(0,0,0,1), 0 0 2px rgba(255,255,255, 1) !important;
 }

js/start.js

@@ -256,8 +256,8 @@ $(window).bind('hashchange', function(){
 });
 
 //set fancy styles class
-if (localStorage.getItem('notFancy') == "true"){
-  $html.addClass('notFancy');
+if (localStorage.getItem('minEffects') == "true"){
+  $html.addClass('minEffects');
 }
 
 //prevent dragging a file to the window from loading that file

js/templates/settings.html

@@ -1181,9 +1181,9 @@ <h3 class="padding15 margin0 fontWeight500"><%= polyglot.t('Advanced') %></h3>
                 <div class="fieldItem flexRow">
                   <div class="flexRow">
                     <div class="flexCol-4">
-                      <input type="radio" class="fieldItem" id="fancyStylesYes" name="notFancy" value="true" />
+                      <input type="radio" class="fieldItem" id="fancyStylesYes" name="minEffects" value="true" />
                       <label for="fancyStylesYes" class="radioLabel"><%= polyglot.t('Yes') %></label>
-                      <input type="radio" class="fieldItem" id="fancyStylesNo" name="notFancy" value="false" checked/>
+                      <input type="radio" class="fieldItem" id="fancyStylesNo" name="minEffects" value="false" checked/>
                       <label for="fancyStylesNo" class="radioLabel"><%= polyglot.t('No') %></label>
                     </div>
                     <div class="flexCol-8">

js/templates/transactionModal.html

@@ -18,7 +18,7 @@ <h2 class="ion-android-close clickable"></h2>
         <h3 class="txt-bright"><%= polyglot.t('CheckExchanges') %> </h3>
       </div>
     </div>
-    <div class="colorWhiteForce positionBottom width100 padding12 notFancyDarkBackground">
+    <div class="colorWhiteForce positionBottom width100 padding12 minEffectsDarkBackground">
       <div class="fontSize16">Order #<%- ob.orderID %></div>
       <div class="fontSize14 textOpacity75 marginTop2">
         <%= polyglot.t('transactions.OrderStatus'+ob.status) %>

js/templates/userPage.html

@@ -62,7 +62,7 @@ <h1 class="page-userNameLarge floatLeft fancy-heading fontSize20 colorWhiteForce
   </div>
 
   <div class="shadow-inner1 user-page-header js-userPageHeader">
-    <div class="rowItem positionBottom width100 padding0 paddingLeft20 notFancyDarkBackground">
+    <div class="rowItem positionBottom width100 padding0 paddingLeft20 minEffectsDarkBackground">
       <div class="table">
         <div>
           <div class="thumbnail thumbnail-large js-userPageAvatar"

js/views/settingsVw.js

@@ -57,7 +57,7 @@ module.exports = pageVw.extend({
     'click #moderatorNo': 'hideModeratorFeeHolder',
     'click .js-shutDownServer': 'shutdownServer',
     'keyup #moderatorFeeInput': 'keypressFeeInput',
-    'click #advancedForm input[name="notFancy"]': 'toggleFancyStyles',
+    'click #advancedForm input[name="minEffects"]': 'toggleFancyStyles',
     'click #advancedForm input[name="useTestnet"]': 'toggleTestnet',
     'change #advancedForm input[name="appBarStyle"]': 'changeAppBarStyle',
     'blur input': 'validateInput',
@@ -437,14 +437,14 @@ module.exports = pageVw.extend({
         notifications = user.notifications,
         moderatorStatus = this.model.get('page').profile.moderator,
         vendorStatus = this.model.get('page').profile.vendor,
-        fancyStatus = window.localStorage.getItem('notFancy'),
+        fancyStatus = window.localStorage.getItem('minEffects'),
         smtp_notifications = user.smtp_notifications == 1;
 
     this.$("#pageForm").find("input[name=nsfw]").val([String(pageNSFW)]);
     generalForm.find("input[name=nsfw][value=" + localStorage.getItem('NSFWFilter') + "]").prop('checked', true);
     generalForm.find("input[name=notifications][value=" + notifications + "]").prop('checked', true);
     this.$("#storeForm").find("input[name=vendor][value=" + vendorStatus + "]").prop('checked', true);
-    advancedForm.find("input[name=notFancy][value=" + fancyStatus + "]").prop('checked', true);
+    advancedForm.find("input[name=minEffects][value=" + fancyStatus + "]").prop('checked', true);
     advancedForm.find("input[name=additionalPaymentData][value=" + localStorage.getItem('AdditionalPaymentData') + "]").prop('checked', true);
     advancedForm.find("input[name=smtp_notifications][value=" + smtp_notifications + "]").prop('checked', true);
     advancedForm.find("input[name=smtp_notifications][value=" + smtp_notifications + "]").prop('checked', true);
@@ -1113,12 +1113,12 @@ module.exports = pageVw.extend({
   toggleFancyStyles: function(){
     var $html = $('html');
 
-    if ($('#advancedForm').find('input[name="notFancy"]').prop('checked')){
-      $html.addClass('notFancy');
-      localStorage.setItem('notFancy', "true");
+    if ($('#advancedForm').find('input[name="minEffects"]').prop('checked')){
+      $html.addClass('minEffects');
+      localStorage.setItem('minEffects', "true");
     } else {
-      $html.removeClass('notFancy');
-      localStorage.setItem('notFancy', "false");
+      $html.removeClass('minEffects');
+      localStorage.setItem('minEffects', "false");
     }
   },
 

js/views/userPageVw.js

@@ -390,11 +390,11 @@ UserPageVw = pageVw.extend({
         self.$backToTop = self.$('.backToTop');
 
         //check if user is blocked
-        if(!self.options.ownPage && isBlocked) {
+        if (!self.options.ownPage && isBlocked) {
           self.hideThisUser("blocked");
         }
 
-        if(!self.options.ownPage && !self.skipNSFWmodal && self.model.get('page').profile.nsfw && !self.showNSFW){
+        if (!self.skipNSFWmodal && self.model.get('page').profile.nsfw && !self.showNSFW){
           self.hideThisUser("nsfw");
         }