Update content of files

data/promote.telegram.org.html

@@ -18,7 +18,7 @@
     <link href="/css/bootstrap.min.css?3" rel="stylesheet">
     <link href="/css/bootstrap-extra.css?2" rel="stylesheet">
     <link href="/css/telegram.css?215" rel="stylesheet">
-    <link href="/css/widget-frame.css?50" rel="stylesheet">
+    <link href="/css/widget-frame.css?51" rel="stylesheet">
 <link href="/css/promote.css?54" rel="stylesheet">
 <link href="/css/jquery-ui.min.css?1" rel="stylesheet">
 <link href="/css/tchart.min.css?10" rel="stylesheet">
@@ -102,14 +102,14 @@
     <script src="/js/jquery.min.js?1"></script>
     <script src="/js/bootstrap.min.js"></script>
     <script src="/js/main-aj.js?56"></script>
-    <script src="/js/widget-frame.js?53"></script>
+    <script src="/js/widget-frame.js?54"></script>
 <script src="/js/promote.js?47"></script>
 <script src="/js/jquery-ui.min.js?1"></script>
 <script src="/js/jquery-ex.js?6"></script>
 <script src="/js/tchart.min.js?18"></script>
 <script src="/js/health.js?15"></script>
 
-    <script>ajInit({"version":532,"apiUrl":"\/api?hash=telegram-crawler","unauth":true});</script>
+    <script>ajInit({"version":534,"apiUrl":"\/api?hash=telegram-crawler","unauth":true});</script>
     <script id="aj_script">l.add({"WEB_AB_WARNING_HEADER":"Turn off ad blocker","WEB_POPUP_CLOSE_BTN":"Close","WEB_AB_WARNING_TEXT":"You appear to be using an ad blocker that may prevent pages on the Telegram Ad Platform from working as expected.<br\/><br\/>Please turn off your ad blocker or add <a href=\"http:\/\/promote.telegram.org\/\">promote.telegram.org<\/a> as an exception to manage your promoted messages."});
 window.enableInlineVideo&&$('video').each(function(){enableInlineVideo(this)});
 Ads.init();

data/promote.telegram.org/auth.html

@@ -18,7 +18,7 @@
     <link href="/css/bootstrap.min.css?3" rel="stylesheet">
     <link href="/css/bootstrap-extra.css?2" rel="stylesheet">
     <link href="/css/telegram.css?215" rel="stylesheet">
-    <link href="/css/widget-frame.css?50" rel="stylesheet">
+    <link href="/css/widget-frame.css?51" rel="stylesheet">
 <link href="/css/promote.css?54" rel="stylesheet">
 <link href="/css/jquery-ui.min.css?1" rel="stylesheet">
 <link href="/css/tchart.min.css?10" rel="stylesheet">
@@ -102,14 +102,14 @@
     <script src="/js/jquery.min.js?1"></script>
     <script src="/js/bootstrap.min.js"></script>
     <script src="/js/main-aj.js?56"></script>
-    <script src="/js/widget-frame.js?53"></script>
+    <script src="/js/widget-frame.js?54"></script>
 <script src="/js/promote.js?47"></script>
 <script src="/js/jquery-ui.min.js?1"></script>
 <script src="/js/jquery-ex.js?6"></script>
 <script src="/js/tchart.min.js?18"></script>
 <script src="/js/health.js?15"></script>
 
-    <script>ajInit({"version":532,"apiUrl":"\/api?hash=telegram-crawler","unauth":true});</script>
+    <script>ajInit({"version":534,"apiUrl":"\/api?hash=telegram-crawler","unauth":true});</script>
     <script id="aj_script">l.add({"WEB_AB_WARNING_HEADER":"Turn off ad blocker","WEB_POPUP_CLOSE_BTN":"Close","WEB_AB_WARNING_TEXT":"You appear to be using an ad blocker that may prevent pages on the Telegram Ad Platform from working as expected.<br\/><br\/>Please turn off your ad blocker or add <a href=\"http:\/\/promote.telegram.org\/\">promote.telegram.org<\/a> as an exception to manage your promoted messages."});
 openPopup('#login-popup-container');
 window.enableInlineVideo&&$('video').each(function(){enableInlineVideo(this)});

data/promote.telegram.org/basics.html

@@ -18,7 +18,7 @@
     <link href="/css/bootstrap.min.css?3" rel="stylesheet">
     <link href="/css/bootstrap-extra.css?2" rel="stylesheet">
     <link href="/css/telegram.css?215" rel="stylesheet">
-    <link href="/css/widget-frame.css?50" rel="stylesheet">
+    <link href="/css/widget-frame.css?51" rel="stylesheet">
 <link href="/css/promote.css?54" rel="stylesheet">
 <link href="/css/jquery-ui.min.css?1" rel="stylesheet">
 <link href="/css/tchart.min.css?10" rel="stylesheet">
@@ -102,14 +102,14 @@
     <script src="/js/jquery.min.js?1"></script>
     <script src="/js/bootstrap.min.js"></script>
     <script src="/js/main-aj.js?56"></script>
-    <script src="/js/widget-frame.js?53"></script>
+    <script src="/js/widget-frame.js?54"></script>
 <script src="/js/promote.js?47"></script>
 <script src="/js/jquery-ui.min.js?1"></script>
 <script src="/js/jquery-ex.js?6"></script>
 <script src="/js/tchart.min.js?18"></script>
 <script src="/js/health.js?15"></script>
 
-    <script>ajInit({"version":532,"apiUrl":"\/api?hash=telegram-crawler","unauth":true});</script>
+    <script>ajInit({"version":534,"apiUrl":"\/api?hash=telegram-crawler","unauth":true});</script>
     <script id="aj_script">l.add({"WEB_AB_WARNING_HEADER":"Turn off ad blocker","WEB_POPUP_CLOSE_BTN":"Close","WEB_AB_WARNING_TEXT":"You appear to be using an ad blocker that may prevent pages on the Telegram Ad Platform from working as expected.<br\/><br\/>Please turn off your ad blocker or add <a href=\"http:\/\/promote.telegram.org\/\">promote.telegram.org<\/a> as an exception to manage your promoted messages."});
 window.enableInlineVideo&&$('video').each(function(){enableInlineVideo(this)});
 Ads.init();

data/promote.telegram.org/css/widget-frame.css

@@ -11,9 +11,6 @@ body.widget_frame_base {
 .widget_frame_base a:hover {
   text-decoration: underline;
 }
-.widget_frame_base a:hover * {
-  text-decoration: inherit;
-}
 body.rtl {
   direction: rtl;
 }
@@ -75,23 +72,49 @@ mark.label span.hidden {
   letter-spacing: 12em;
   pointer-events: none;
 }
+
 span.tg-spoiler {
-  --bg-transition: .1s ease;
-  --anim: .6s .1s ease;
   padding: 1px 0;
   border-radius: 1px;
 }
-.spoilers_animate span.tg-spoiler {
-  animation: blurred var(--anim);
-  transition: color var(--anim), background var(--bg-transition);
-}
 .spoilers_hidden span.tg-spoiler {
-  background: #ddd;
+  background: #e3e5e8;
-  color: transparent;
   cursor: pointer;
 }
-.widget_frame_base .spoilers_animate span.tg-spoiler a {
+.spoilers_hidden span.tg-spoiler-text {
-  transition: color var(--anim);
+  color: transparent;
+}
+body.dark .spoilers_hidden span.tg-spoiler {
+  background: #373e4e;
+}
+.spoilers_hidden.decorated-text s,
+.spoilers_hidden.decorated-text u,
+.spoilers_hidden.decorated-text a:hover {
+  text-decoration: none;
+}
+.spoilers_hidden.decorated-text span.tg-spoiler {
+  text-decoration: none !important;
+}
+.spoilers_hidden.decorated-text s span.d-text {
+  text-decoration: line-through;
+}
+.spoilers_hidden.decorated-text u span.d-text {
+  text-decoration: underline;
+}
+.spoilers_hidden.decorated-text s u span.d-text,
+.spoilers_hidden.decorated-text u s span.d-text {
+  text-decoration: underline line-through;
+}
+.widget_frame_base .spoilers_hidden.decorated-text a:hover span.d-text {
+  text-decoration: underline;
+}
+.widget_frame_base .spoilers_hidden.decorated-text a:hover s span.d-text,
+.widget_frame_base .spoilers_hidden.decorated-text s a:hover span.d-text {
+  text-decoration: underline line-through;
+}
+.widget_frame_base .spoilers_hidden span.tg-spoiler a {
+  color: transparent;
+  pointer-events: none;
 }
 span.tg-spoiler .emoji {
   position: relative;
@@ -110,23 +133,66 @@ span.tg-spoiler .emoji:before {
   background-position-y: calc(50% - 1px);
   opacity: 1;
 }
-.widget_frame_base .spoilers_hidden span.tg-spoiler a {
-  color: transparent;
-  pointer-events: none;
-}
-.emoji_image .spoilers_animate span.tg-spoiler .emoji:before {
-  transition: opacity var(--anim);
-}
 .emoji_image .spoilers_hidden span.tg-spoiler .emoji:before {
   opacity: 0;
 }
-@-webkit-keyframes blurred {
+
-  from { filter: blur(2px); }
+@supports (--var:1) {
-  to   { filter: blur(0); }
+  span.tg-spoiler {
-}
+    --anim-dur: .45s;
-@keyframes blurred {
+    --anim: var(--anim-dur) ease;
-  from { filter: blur(2px); }
+    --anim-fn: text-show;
-  to   { filter: blur(0); }
+    --bg-anim-fn: bg-hide;
+    --bg-color: #e3e5e8;
+  }
+  body.dark span.tg-spoiler {
+    --bg-color: #373e4e;
+  }
+  .spoilers_hidden span.tg-spoiler {
+    --anim-fn: text-hide;
+    --bg-anim-fn: bg-show;
+  }
+  .spoilers_animate span.tg-spoiler {
+    animation: var(--bg-anim-fn) var(--anim);
+  }
+  .spoilers_animate span.tg-spoiler-text {
+    animation: var(--anim-fn) var(--anim);
+    transition: color var(--anim);
+  }
+  .widget_frame_base .spoilers_animate span.tg-spoiler a {
+    transition: color var(--anim);
+  }
+  .emoji_image .spoilers_animate span.tg-spoiler .emoji:before {
+    transition: opacity var(--anim);
+  }
+  @keyframes text-show {
+    from { filter: blur(6px); }
+    to   { filter: blur(0); }
+  }
+  @keyframes text-hide {
+    from { filter: blur(0); }
+    to   { filter: blur(3px); }
+  }
+  @keyframes bg-hide {
+    from {
+      background: var(--bg-color);
+      box-shadow: 0 0 var(--bg-color);
+    }
+    to {
+      background: none;
+      box-shadow: 0 0 60px 60px transparent;
+    }
+  }
+  @keyframes bg-show {
+    from {
+      background: none;
+      box-shadow: 0 0 30px 30px transparent;
+    }
+    to {
+      background: var(--bg-color);
+      box-shadow: 0 0 var(--bg-color);
+    }
+  }
 }
 
 .flex_ellipsis,

data/promote.telegram.org/getting-started.html

@@ -19,7 +19,7 @@
     <link href="/css/bootstrap.min.css?3" rel="stylesheet">
     <link href="/css/bootstrap-extra.css?2" rel="stylesheet">
     <link href="/css/telegram.css?215" rel="stylesheet">
-    <link href="/css/widget-frame.css?50" rel="stylesheet">
+    <link href="/css/widget-frame.css?51" rel="stylesheet">
 <link href="/css/promote.css?54" rel="stylesheet">
 <link href="/css/jquery-ui.min.css?1" rel="stylesheet">
 <link href="/css/tchart.min.css?10" rel="stylesheet">
@@ -218,14 +218,14 @@
     <script src="/js/jquery.min.js?1"></script>
     <script src="/js/bootstrap.min.js"></script>
     <script src="/js/main-aj.js?56"></script>
-    <script src="/js/widget-frame.js?53"></script>
+    <script src="/js/widget-frame.js?54"></script>
 <script src="/js/promote.js?47"></script>
 <script src="/js/jquery-ui.min.js?1"></script>
 <script src="/js/jquery-ex.js?6"></script>
 <script src="/js/tchart.min.js?18"></script>
 <script src="/js/health.js?15"></script>
 
-    <script>ajInit({"version":532,"apiUrl":"\/api?hash=telegram-crawler","unauth":true});</script>
+    <script>ajInit({"version":534,"apiUrl":"\/api?hash=telegram-crawler","unauth":true});</script>
     <script id="aj_script">l.add({"WEB_AB_WARNING_HEADER":"Turn off ad blocker","WEB_POPUP_CLOSE_BTN":"Close","WEB_AB_WARNING_TEXT":"You appear to be using an ad blocker that may prevent pages on the Telegram Ad Platform from working as expected.<br\/><br\/>Please turn off your ad blocker or add <a href=\"http:\/\/promote.telegram.org\/\">promote.telegram.org<\/a> as an exception to manage your promoted messages."});
 window.enableInlineVideo&&$('video').each(function(){enableInlineVideo(this)});
 Ads.init();

data/promote.telegram.org/guidelines.html

@@ -18,7 +18,7 @@
     <link href="/css/bootstrap.min.css?3" rel="stylesheet">
     <link href="/css/bootstrap-extra.css?2" rel="stylesheet">
     <link href="/css/telegram.css?215" rel="stylesheet">
-    <link href="/css/widget-frame.css?50" rel="stylesheet">
+    <link href="/css/widget-frame.css?51" rel="stylesheet">
 <link href="/css/promote.css?54" rel="stylesheet">
 <link href="/css/jquery-ui.min.css?1" rel="stylesheet">
 <link href="/css/tchart.min.css?10" rel="stylesheet">
@@ -210,14 +210,14 @@
     <script src="/js/jquery.min.js?1"></script>
     <script src="/js/bootstrap.min.js"></script>
     <script src="/js/main-aj.js?56"></script>
-    <script src="/js/widget-frame.js?53"></script>
+    <script src="/js/widget-frame.js?54"></script>
 <script src="/js/promote.js?47"></script>
 <script src="/js/jquery-ui.min.js?1"></script>
 <script src="/js/jquery-ex.js?6"></script>
 <script src="/js/tchart.min.js?18"></script>
 <script src="/js/health.js?15"></script>
 
-    <script>ajInit({"version":532,"apiUrl":"\/api?hash=telegram-crawler","unauth":true});</script>
+    <script>ajInit({"version":534,"apiUrl":"\/api?hash=telegram-crawler","unauth":true});</script>
     <script id="aj_script">l.add({"WEB_AB_WARNING_HEADER":"Turn off ad blocker","WEB_POPUP_CLOSE_BTN":"Close","WEB_AB_WARNING_TEXT":"You appear to be using an ad blocker that may prevent pages on the Telegram Ad Platform from working as expected.<br\/><br\/>Please turn off your ad blocker or add <a href=\"http:\/\/promote.telegram.org\/\">promote.telegram.org<\/a> as an exception to manage your promoted messages."});
 window.enableInlineVideo&&$('video').each(function(){enableInlineVideo(this)});
 Ads.init();

data/promote.telegram.org/js/widget-frame.js

@@ -434,6 +434,8 @@ function ge(el, context) {
     list = (ge1(context) || document).querySelectorAll(el);
   } else if (el instanceof Node || el instanceof Window) {
     list = [el];
+  } else if (el instanceof NodeList) {
+    list = el;
   } else if (Array.isArray(el)) {
     list = el;
   } else if (el) {
@@ -1285,11 +1287,7 @@ function checkFrameSize() {
         }
       }, postEl);
       gec('.js-message_text', function() {
-        var spoilers = ge('span.tg-spoiler', this);
+        TPost.initSpoilers(this);
-        if (spoilers.length) {
-          addClass(this, 'spoilers_hidden');
-          addEvent(spoilers, 'click', TPost.eSpoilerShow);
-        }
       }, postEl);
       gec('.js-message_footer.compact', function() {
         var timeEl = ge1('time[datetime]', this)
@@ -1365,17 +1363,60 @@ function checkFrameSize() {
         xhr.send(null);
       }
     },
+    initSpoilers: function(text_el) {
+      var spoilers = ge('span.tg-spoiler', text_el);
+      if (spoilers.length) {
+        TPost.wrapSpoilers(spoilers);
+        TPost.wrapTextNodes(text_el);
+        addClass(text_el, 'decorated-text');
+      }
+      TPost.hideSpoilers(text_el, spoilers);
+    },
+    wrapSpoilers: function(spoilers) {
+      gec(spoilers, function() {
+        this.className = 'tg-spoiler-text';
+        var wrap = newEl('span', 'tg-spoiler');
+        this.parentNode.insertBefore(wrap, this);
+        wrap.appendChild(this);
+      });
+    },
+    wrapTextNodes: function(el) {
+      gec(el.childNodes, function() {
+        if (this.nodeType == this.TEXT_NODE) {
+          var text = newEl('span', 'd-text');
+          this.parentNode.insertBefore(text, this);
+          text.appendChild(this);
+        } else if (!this.classList.contains('tg-spoiler') && this.childNodes) {
+          TPost.wrapTextNodes(this);
+        }
+      });
+    },
+    hideSpoilers: function(text_el, spoilers) {
+      if (!spoilers) {
+        spoilers = ge('span.tg-spoiler', text_el);
+      }
+      if (spoilers.length) {
+        addEvent(spoilers, 'click', TPost.eSpoilerShow);
+        addClass(text_el, 'spoilers_hidden');
+      }
+    },
     eSpoilerShow: function(e) {
       var text_el = gpeByClass(this, 'js-message_text');
-      if (!text_el) {
+      if (!text_el) return false;
-        return false;
-      }
       e.preventDefault();
       e.stopImmediatePropagation();
       addClass(text_el, 'spoilers_animate');
       removeClass(text_el, 'spoilers_hidden');
-      var spoilers = ge('span.tg-spoiler', text_el);
+      var delay = 0;
-      removeEvent(spoilers, 'click', TPost.eSpoilerShow);
+      gec('span.tg-spoiler', function() {
+        removeEvent(this, 'click', TPost.eSpoilerShow);
+        delay += this.innerText.length * 40;
+      }, text_el);
+      if (delay < 4000) delay = 4000;
+      if (delay > 45000) delay = 45000;
+      setTimeout(function() {
+        TPost.hideSpoilers(text_el);
+      }, delay);
     }
   };
 

data/promote.telegram.org/tos.html

@@ -19,7 +19,7 @@
     <link href="/css/bootstrap.min.css?3" rel="stylesheet">
     <link href="/css/bootstrap-extra.css?2" rel="stylesheet">
     <link href="/css/telegram.css?215" rel="stylesheet">
-    <link href="/css/widget-frame.css?50" rel="stylesheet">
+    <link href="/css/widget-frame.css?51" rel="stylesheet">
 <link href="/css/promote.css?54" rel="stylesheet">
 <link href="/css/jquery-ui.min.css?1" rel="stylesheet">
 <link href="/css/tchart.min.css?10" rel="stylesheet">
@@ -150,14 +150,14 @@
     <script src="/js/jquery.min.js?1"></script>
     <script src="/js/bootstrap.min.js"></script>
     <script src="/js/main-aj.js?56"></script>
-    <script src="/js/widget-frame.js?53"></script>
+    <script src="/js/widget-frame.js?54"></script>
 <script src="/js/promote.js?47"></script>
 <script src="/js/jquery-ui.min.js?1"></script>
 <script src="/js/jquery-ex.js?6"></script>
 <script src="/js/tchart.min.js?18"></script>
 <script src="/js/health.js?15"></script>
 
-    <script>ajInit({"version":532,"apiUrl":"\/api?hash=telegram-crawler","unauth":true});</script>
+    <script>ajInit({"version":534,"apiUrl":"\/api?hash=telegram-crawler","unauth":true});</script>
     <script id="aj_script">l.add({"WEB_AB_WARNING_HEADER":"Turn off ad blocker","WEB_POPUP_CLOSE_BTN":"Close","WEB_AB_WARNING_TEXT":"You appear to be using an ad blocker that may prevent pages on the Telegram Ad Platform from working as expected.<br\/><br\/>Please turn off your ad blocker or add <a href=\"http:\/\/promote.telegram.org\/\">promote.telegram.org<\/a> as an exception to manage your promoted messages."});
 window.enableInlineVideo&&$('video').each(function(){enableInlineVideo(this)});
 Ads.init();