blind mode init

src/AppAssets.php

@@ -17,9 +17,11 @@ class AppAssets extends AssetBundle
 
     public $js = [
         'js/jquery-3.1.0.min.js' => \CClientScript::POS_HEAD,
+        'js/jquery.cookie.min.js',
         'https://cdnjs.cloudflare.com/ajax/libs/fotorama/4.6.4/fotorama.js',
         'https://api-maps.yandex.ru/2.1/?lang=ru_RU',
         'https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.0.0-beta.2/js/swiper.js',
+        'js/blind.js',
         'js/script.js',
     ];
 

src/files/css/main.css

@@ -9972,6 +9972,116 @@ footer .copyright .logo {
     font-size: 12px;
     color: #929292; }
 
+.wrapper--blind {
+  padding: 20px;
+  display: -webkit-flex;
+  display: -ms-flex;
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between; }
+
+.blind {
+  width: 100%;
+  background: #fff;
+  display: -webkit-flex;
+  display: -ms-flex;
+  display: flex;
+  flex-direction: row;
+  display: none;
+  line-height: 20px;
+  padding: 0;
+  margin: 0;
+  font-size: 20px !important;
+  padding-bottom: 30px;
+  font-family: "open_sansregular";
+  justify-content: flex-start;
+  align-items: flex-start;
+  align-content: flex-start; }
+  .blind__item {
+    display: -webkit-flex;
+    display: -ms-flex;
+    display: flex;
+    flex-direction: column;
+    padding: 0;
+    margin: 0;
+    font-weight: bold;
+    justify-content: space-between;
+    min-height: 100px; }
+  .blind__buttons {
+    display: -webkit-flex;
+    display: -ms-flex;
+    display: flex;
+    flex-direction: row;
+    justify-content: flex-start;
+    align-items: flex-start;
+    align-content: flex-start; }
+  .blind__link {
+    padding: 0;
+    margin: 0;
+    height: 30px;
+    border: 1px solid #000000;
+    border-radius: 3px;
+    line-height: 30px;
+    overflow: hidden;
+    padding: 0 8px;
+    text-decoration: none !important;
+    color: #000000; }
+    .blind__link--fontsize100 {
+      font-size: 14px; }
+    .blind__link--fontsize102 {
+      font-size: 17px; }
+    .blind__link--fontsize104 {
+      font-size: 20px; }
+    .blind__link--fontsize106 {
+      font-size: 23px; }
+    .blind__link--fontsize108 {
+      font-size: 26px; }
+    .blind__link--fontsize110 {
+      font-size: 29px; }
+  .blind__buttons {
+    padding: 0;
+    margin: 0; }
+
+.imgoff {
+  display: none !important; }
+
+.font100 {
+  font-size: 100%; }
+
+.font102 {
+  font-size: 102%; }
+
+.font104 {
+  font-size: 104%; }
+
+.font106 {
+  font-size: 106%; }
+
+.font108 {
+  font-size: 108%; }
+
+.font110 {
+  font-size: 110%; }
+
+.whiteblack,
+.whiteblack:hover {
+  background-image: none;
+  background: #ffffff;
+  color: #000000; }
+
+.blackwhite,
+.blackwhite:hover {
+  background-image: none;
+  background: #000000;
+  color: #ffffff; }
+  .blackwhite .blind__link,
+  .blackwhite:hover .blind__link {
+    border-color: #ffffff; }
+
+.blackwhite:hover a,
+.whiteblack:hover a {
+  text-decoration: underline; }
+
 .contacts-container .center-content .to-doctors .personal-doctor .doctor-image,
 .control-org-unit .personal-doctor .doctor-image {
   border-radius: 50%;

src/files/js/blind.js

@@ -0,0 +1,125 @@
+$(document).ready(function () {
+
+    var blind = $.cookie('blind');
+    if (blind == 'on') {
+        $(".blind").show(0);
+    }
+
+    var blindImg = $.cookie('blind_image');
+    if (blindImg == 'off') {
+        $("*:not(.sp_ignored) img").addClass('imgoff');
+    }
+
+    if (blindImg == 'on') {
+        $("*:not(.sp_ignored) img").removeClass('imgoff');
+    }
+
+    var blindFont = $.cookie('blind_font');
+    if (blindFont == '100') {
+        $("*:not(.sp_ignored)").removeClass('font100').removeClass('font102').removeClass('font104').removeClass('font106').removeClass('font108').removeClass('font110');
+    }
+
+    if (blindFont == '102') {
+        $("*:not(.sp_ignored)").removeClass('font100').removeClass('font104').removeClass('font106').removeClass('font108').removeClass('font110').addClass('font102');
+    }
+
+    if (blindFont == '104') {
+        $("*:not(.sp_ignored)").removeClass('font100').removeClass('font102').removeClass('font106').removeClass('font108').removeClass('font110').addClass('font104');
+    }
+
+    if (blindFont == '106') {
+        $("*:not(.sp_ignored)").removeClass('font100').removeClass('font102').removeClass('font104').removeClass('font108').removeClass('font110').addClass('font106');
+    }
+
+    if (blindFont == '108') {
+        $("*:not(.sp_ignored)").removeClass('font100').removeClass('font102').removeClass('font104').removeClass('font106').removeClass('font110').addClass('font108');
+    }
+
+    if (blindFont == '110') {
+        $("*:not(.sp_ignored)").removeClass('font100').removeClass('font102').removeClass('font104').removeClass('font106').removeClass('font108').addClass('font110');
+    }
+
+    var blindColor = $.cookie('blind_color');
+    if (blindColor == 'default') {
+        $("*").removeClass('blackwhite').removeClass('whiteblack').addClass('default');
+    }
+
+    if (blindColor == 'whiteblack') {
+        $("*").removeClass('default').removeClass('blackwhite').addClass('whiteblack');
+    }
+
+    if (blindColor == 'blackwhite') {
+        $("*").removeClass('default').removeClass('whiteblack').addClass('blackwhite');
+    }
+
+    $(".special__link").click(function () {
+        $(".blind").show(0);
+        $.cookie('blind', 'on', {expires: 7, path: '/'});
+    });
+
+    $(".blind__link--blindoff").click(function (e) {
+        $("*").removeClass('imgoff').removeClass('font100').removeClass('font102').removeClass('font104').removeClass('font106').removeClass('font108').removeClass('font110').removeClass('whiteblack').removeClass('blackwhite').removeClass('default');
+        $(".blind").hide(0);
+        $.cookie('blind', null);
+        $.cookie('blind_image', null);
+        $.cookie('blind_font', null);
+        $.cookie('blind_color', null);
+        e.preventDefault();
+    });
+    $(".blind__link--imgoff").click(function (e) {
+        $("*:not(.sp_ignored) img").addClass('imgoff');
+        $.cookie('blind_image', 'off', {expires: 7, path: '/'});
+        e.preventDefault();
+    });
+    $(".blind__link--imgon").click(function (e) {
+        $("*:not(.sp_ignored) img").removeClass('imgoff');
+        $.cookie('blind_image', 'on', {expires: 7, path: '/'});
+        e.preventDefault();
+    });
+    $(".blind__link--fontsize100").click(function (e) {
+        $("*:not(.sp_ignored)").removeClass('font100').removeClass('font102').removeClass('font104').removeClass('font106').removeClass('font108').removeClass('font110');
+        $.cookie('blind_font', '100', {expires: 7, path: '/'});
+        e.preventDefault();
+    });
+    $(".blind__link--fontsize102").click(function (e) {
+        $("*:not(.sp_ignored)").removeClass('font100').removeClass('font104').removeClass('font106').removeClass('font108').removeClass('font110').addClass('font102');
+        $.cookie('blind_font', '102', {expires: 7, path: '/'});
+        e.preventDefault();
+    });
+    $(".blind__link--fontsize104").click(function (e) {
+        $("*:not(.sp_ignored)").removeClass('font100').removeClass('font102').removeClass('font106').removeClass('font108').removeClass('font110').addClass('font104');
+        $.cookie('blind_font', '104', {expires: 7, path: '/'});
+        e.preventDefault();
+    });
+    $(".blind__link--fontsize106").click(function (e) {
+        $("*:not(.sp_ignored)").removeClass('font100').removeClass('font102').removeClass('font104').removeClass('font108').removeClass('font110').addClass('font106');
+        $.cookie('blind_font', '106', {expires: 7, path: '/'});
+        e.preventDefault();
+    });
+    $(".blind__link--fontsize108").click(function (e) {
+        $("*:not(.sp_ignored)").removeClass('font100').removeClass('font102').removeClass('font104').removeClass('font106').removeClass('font110').addClass('font108');
+        $.cookie('blind_font', '108', {expires: 7, path: '/'});
+        e.preventDefault();
+    });
+    $(".blind__link--fontsize110").click(function (e) {
+        $("*:not(.sp_ignored)").removeClass('font100').removeClass('font102').removeClass('font104').removeClass('font106').removeClass('font108').addClass('font110');
+        $.cookie('blind_font', '110', {expires: 7, path: '/'});
+        e.preventDefault();
+    });
+    $(".blind__link--default").click(function (e) {
+        $("*").removeClass('blackwhite').removeClass('whiteblack').addClass('default');
+        $.cookie('blind_color', 'default', {expires: 7, path: '/'});
+        e.preventDefault();
+    });
+    $(".blind__link--whiteblack").click(function (e) {
+        $("*").removeClass('default').removeClass('blackwhite').addClass('whiteblack');
+        $.cookie('blind_color', 'whiteblack', {expires: 7, path: '/'});
+        e.preventDefault();
+    });
+    $(".blind__link--blackwhite").click(function (e) {
+        $("*").removeClass('default').removeClass('whiteblack').addClass('blackwhite');
+        $.cookie('blind_color', 'blackwhite', {expires: 7, path: '/'});
+        e.preventDefault();
+    });
+
+});

src/files/js/jquery.cookie.min.js

@@ -0,0 +1,8 @@
+/*!
+ * jQuery Cookie Plugin v1.4.1
+ * https://github.com/carhartl/jquery-cookie
+ *
+ * Copyright 2013 Klaus Hartl
+ * Released under the MIT license
+ */
+(function(a){if(typeof define==="function"&&define.amd){define(["jquery"],a)}else{if(typeof exports==="object"){a(require("jquery"))}else{a(jQuery)}}}(function(f){var a=/\+/g;function d(i){return b.raw?i:encodeURIComponent(i)}function g(i){return b.raw?i:decodeURIComponent(i)}function h(i){return d(b.json?JSON.stringify(i):String(i))}function c(i){if(i.indexOf('"')===0){i=i.slice(1,-1).replace(/\\"/g,'"').replace(/\\\\/g,"\\")}try{i=decodeURIComponent(i.replace(a," "));return b.json?JSON.parse(i):i}catch(j){}}function e(j,i){var k=b.raw?j:c(j);return f.isFunction(i)?i(k):k}var b=f.cookie=function(q,p,v){if(p!==undefined&&!f.isFunction(p)){v=f.extend({},b.defaults,v);if(typeof v.expires==="number"){var r=v.expires,u=v.expires=new Date();u.setTime(+u+r*86400000)}return(document.cookie=[d(q),"=",h(p),v.expires?"; expires="+v.expires.toUTCString():"",v.path?"; path="+v.path:"",v.domain?"; domain="+v.domain:"",v.secure?"; secure":""].join(""))}var w=q?undefined:{};var s=document.cookie?document.cookie.split("; "):[];for(var o=0,m=s.length;o<m;o++){var n=s[o].split("=");var j=g(n.shift());var k=n.join("=");if(q&&q===j){w=e(k,p);break}if(!q&&(k=e(k))!==undefined){w[j]=k}}return w};b.defaults={};f.removeCookie=function(j,i){if(f.cookie(j)===undefined){return false}f.cookie(j,"",f.extend({},i,{expires:-1}));return !f.cookie(j)}}));

src/files/scss/_blind.scss

@@ -0,0 +1,137 @@
+.wrapper--blind {
+    padding: 20px;
+    display: -webkit-flex;
+    display: -ms-flex;
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+}
+
+.blind {
+    width: 100%;
+    background: #fff;
+    display: -webkit-flex;
+    display: -ms-flex;
+    display: flex;
+    flex-direction: row;
+    display: none;
+    line-height: 20px;
+    padding: 0;
+    margin: 0;
+    font-size: 20px !important;
+    padding-bottom: 30px;
+    font-family: "open_sansregular";
+    justify-content: flex-start;
+    align-items: flex-start;
+    align-content: flex-start;
+
+    &__item {
+        display: -webkit-flex;
+        display: -ms-flex;
+        display: flex;
+        flex-direction: column;
+        padding: 0;
+        margin: 0;
+        font-weight: bold;
+        justify-content: space-between;
+        min-height: 100px;
+    }
+    &__buttons {
+        display: -webkit-flex;
+        display: -ms-flex;
+        display: flex;
+        flex-direction: row;
+        justify-content: flex-start;
+        align-items: flex-start;
+        align-content: flex-start;
+    }
+    &__link {
+        padding: 0;
+        margin: 0;
+        height: 30px;
+        border: 1px solid #000000;
+        border-radius: 3px;
+        line-height: 30px;
+        overflow: hidden;
+        padding: 0 8px;
+        text-decoration: none !important;
+        color: #000000;
+
+        &--fontsize100 {
+            font-size: 14px;
+        }
+        &--fontsize102 {
+            font-size: 17px;
+        }
+        &--fontsize104 {
+            font-size: 20px;
+        }
+        &--fontsize106 {
+            font-size: 23px;
+        }
+        &--fontsize108 {
+            font-size: 26px;
+        }
+        &--fontsize110 {
+            font-size: 29px;
+        }
+    }
+    &__buttons {
+        padding: 0;
+        margin: 0;
+    }
+}
+
+.imgoff {
+    display: none !important;
+}
+
+.font100 {
+    font-size: 100%;
+}
+
+.font102 {
+    font-size: 102%;
+}
+
+.font104 {
+    font-size: 104%;
+}
+
+.font106 {
+    font-size: 106%;
+}
+
+.font108 {
+    font-size: 108%;
+}
+
+.font110 {
+    font-size: 110%;
+}
+
+.default {
+}
+
+.whiteblack,
+.whiteblack:hover {
+    background-image: none;
+    background: #ffffff;
+    color: #000000;
+}
+
+.blackwhite,
+.blackwhite:hover {
+    background-image: none;
+    background: #000000;
+    color: #ffffff;
+
+    .blind__link {
+        border-color: #ffffff;
+    }
+}
+
+.blackwhite:hover a,
+.whiteblack:hover a {
+    text-decoration: underline;
+}

src/files/scss/main.scss

@@ -16,6 +16,7 @@
 @import "about";
 @import "additional-info-blocks";
 @import "feedback-form";
+@import "blind";
 
 .contacts-container .center-content .to-doctors .personal-doctor .doctor-image,
 .control-org-unit .personal-doctor .doctor-image {