Added new embeds

Added 0.3.3 changelog

app/css/app.css

@@ -1293,20 +1293,31 @@ div.im_message_video_thumb {
   background-image: url(../img/icons/IconsetW_1x.png);
 }
 
-.im_message_iframe_video {
+.im_message_media_embed {
-    position: relative;
+  position: relative;
-    padding-bottom: 56.25%; /* 16/9 ratio */
+  height: 0;
-    height: 0;
+  overflow: hidden;
-    overflow: hidden;
+  margin-top: 5px;
-    margin-top: 5px;
 }
-.im_message_iframe_video iframe,
+.im_message_video_embed {
-.im_message_iframe_video webview {
+  padding-bottom: 56.25%; /* 16/9 ratio */
-    position: absolute;
+}
-    top: 0;
+.im_message_insta_embed {
-    left: 0;
+  padding-bottom: 122%;
-    width: 100%;
+}
-    height: 100%;
+.im_message_vine_embed {
+  padding-bottom: 100%;
+}
+.im_message_media_embed iframe,
+.im_message_media_embed webview {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}
+.im_message_twitter_embed > blockquote {
+  visibility: hidden;
 }
 
 .im_message_gif_wrap {

app/js/lib/mtproto_wrapper.js

@@ -251,7 +251,7 @@ angular.module('izhukov.mtproto.wrapper', ['izhukov.utils', 'izhukov.mtproto'])
 
   function downloadCheck(dcID) {
     var downloadPull = downloadPulls[dcID];
-    var downloadLimit = dcID == 'upload' ? 17 : 5;
+    var downloadLimit = dcID == 'upload' ? 11 : 5;
 
     if (downloadActives[dcID] >= downloadLimit || !downloadPull || !downloadPull.length) {
       return false;

app/js/lib/ng_utils.js

@@ -727,6 +727,7 @@ angular.module('izhukov.utils', [])
 
 .service('ExternalResourcesManager', function ($q, $http) {
   var urlPromises = {};
+  var twitterAttached = false;
 
   function downloadImage (url) {
     if (urlPromises[url] !== undefined) {
@@ -740,8 +741,18 @@ angular.module('izhukov.utils', [])
       });
   }
 
+  function attachTwitterScript () {
+    twitterAttached = true;
+
+    $('<script>').appendTo('body')
+    // .on('load', function() {
+    // })
+    .attr('src', '//platform.twitter.com/widgets.js');
+  }
+
   return {
-    downloadImage: downloadImage
+    downloadImage: downloadImage,
+    attachTwitterScript: attachTwitterScript
   }
 })
 

app/js/services.js

@@ -3062,7 +3062,7 @@ angular.module('myApp.services', ['myApp.i18n', 'izhukov.utils'])
   }
 })
 
-.service('RichTextProcessor', function ($sce, $sanitize) {
+.service('RichTextProcessor', function ($sce, $sanitize, ExternalResourcesManager) {
 
   var emojiUtf = [],
       emojiMap = {},
@@ -3105,6 +3105,9 @@ angular.module('myApp.services', ['myApp.i18n', 'izhukov.utils'])
   var regexAlphaNumericChars  = "0-9\.\_" + regexAlphaChars;
   var regExp = new RegExp('((?:(ftp|https?)://|(?:mailto:)?([A-Za-z0-9._%+-]+@))(\\S*\\.\\S*[^\\s.;,(){}<>"\']))|(\\n)|(' + emojiUtf.join('|') + ')|(^|\\s)(#[' + regexAlphaNumericChars + ']{3,20})', 'i');
   var youtubeRegex = /(?:https?:\/\/)?(?:www\.)?youtu(?:|.be|be.com|.b)(?:\/v\/|\/watch\\?v=|e\/|(?:\/\??#)?\/watch(?:.+)v=)(.{11})(?:\&[^\s]*)?/;
+  var instagramRegex = /https?:\/\/(?:instagr\.am\/p\/|instagram\.com\/p\/)([a-zA-Z0-9\-\_]+)/i;
+  var vineRegex = /https?:\/\/vine\.co\/v\/([a-zA-Z0-9\-\_]+)/i;
+  var twitterRegex = /https?:\/\/twitter\.com\/.+?\/status\/\d+/i;
 
   return {
     wrapRichText: wrapRichText,
@@ -3231,15 +3234,30 @@ angular.module('myApp.services', ['myApp.i18n', 'izhukov.utils'])
     }
 
     // console.log(4, text, html);
-    if (!options.noLinks) {
+    if (!options.noLinks && !Config.Navigator.mobile) {
-      var youtubeMatches = text.match(youtubeRegex),
+      var embedUrlMatches,
-          videoID = youtubeMatches && youtubeMatches[1];
+          embedTag = Config.Modes.chrome_packed ? 'webview' : 'iframe';
 
-      if (videoID) {
+      if (embedUrlMatches = text.match(youtubeRegex)) {
-        var tag = Config.Modes.chrome_packed ? 'webview' : 'iframe';
+        var videoID = embedUrlMatches[1]
-        text = text + '<div class="im_message_iframe_video"><' + tag + ' type="text/html" frameborder="0" ' +
+        text = text + '<div class="im_message_media_embed im_message_video_embed"><' + embedTag + ' type="text/html" frameborder="0" ' +
-              'src="http://www.youtube.com/embed/' + videoID +
+              'src="//www.youtube.com/embed/' + videoID +
-              '?autoplay=0&amp;controls=2"></' + tag + '></div>'
+              '?autoplay=0&amp;controls=2"></' + embedTag + '></div>'
+      }
+      else if (embedUrlMatches = text.match(instagramRegex)) {
+        var instaID = embedUrlMatches[1];
+        text = text + '<div class="im_message_media_embed im_message_insta_embed"><' + embedTag + ' type="text/html" frameborder="0" ' +
+              'src="//instagram.com/p/' + instaID +
+              '/embed/"></' + embedTag + '></div>';
+      }
+      else if (embedUrlMatches = text.match(vineRegex)) {
+        var vineID = embedUrlMatches[1];
+        text = text + '<div class="im_message_media_embed im_message_vine_embed"><' + embedTag + ' type="text/html" frameborder="0" ' +
+              'src="//vine.co/v/' + vineID + '/embed/simple"></' + embedTag + '></div>';
+      }
+      else if (embedUrlMatches = !Config.Modes.chrome_packed && text.match(twitterRegex)) {
+        text = text + '<div class="im_message_twitter_embed"><blockquote class="twitter-tweet" lang="en"><a href="' + embedUrlMatches[0] + '"></a></blockquote></div>';
+        onContentLoaded(ExternalResourcesManager.attachTwitterScript);
       }
     }
 

app/partials/desktop/changelog_modal.html

@@ -19,9 +19,24 @@
 
       <div class="modal_section changelog_version_wrap">
         <h3 class="modal_section_header changelog_version_title">
-          Version 0.3.2
+          Version 0.3.3
           <span class="pull-right" my-i18n="changelog_modal_title_current_version"></span>
         </h3>
+        <div class="modal_section_body changelog_version_changes">
+          <ul class="list-unstyled changelog_version_changes_list">
+            <li>Added Native Client module: dramatically improved encryption speed; Download and upload speed is now as high as in native applications.</li>
+            <li>HTTPS. We recommend you to use <a href="https://web.telegram.org" target="_blank">https://web.telegram.org</a>.</li>
+            <li>Added multiple open tabs warning. Please note, that only one tab with Telegram Web will work.</li>
+            <li>Jump to selected spot when playing back audio.</li>
+            <li>Bugfixes</li>
+          </ul>
+        </div>
+      </div>
+
+      <div class="modal_section changelog_version_wrap">
+        <h3 class="modal_section_header changelog_version_title">
+          Version 0.3.2
+        </h3>
         <div class="modal_section_body changelog_version_changes">
           <ul class="list-unstyled changelog_version_changes_list">
             <li>Usernames support: <a href="" ng-click="changeUsername()">Choose a username right now!</a></li>

package.json

@@ -1,7 +1,7 @@
 {
   "name": "Telegram",
   "description": "Telegram Web App.\nMore info & source code here: https://github.com/zhukov/webogram",
-  "version": "0.3.2",
+  "version": "0.3.3",
   "main": "app/index.html",
   "single-instance": true,
   "dom_storage_quota": 40,