Added welcome screen, improved mtproto logging

app/css/app.css

@@ -2,7 +2,7 @@
 
 html {
   background: #dee4e9 url(../img/bg_tile.png?1) 0 0 repeat;
-  /*background-size: 300px 468px;*/
+  background-size: 300px 468px;
 
   /*background: #dee4e9 url(../img/bg_full.png) 0 0 no-repeat;*/
   /*background-size: cover;*/
@@ -251,9 +251,33 @@ fieldset[disabled] .btn-tg.active {
 
 
 /* Welcome */
-.jumbotron {
-  background: none;
+
+.welcome_logo {
+  background: url(../img/logo_dogogram.png) 0 0 no-repeat;
+  background-size: 111px 112px;
+  display: block;
+  width: 112px;
+  height: 112px;
+  margin: 100px auto 0;
 }
+.welcome_box_wrap {
+  max-width: 310px;
+  padding: 25px;
+  background: #FFF;
+  margin: 30px auto 0;
+  border-radius: 1px;
+  overflow: hidden;
+
+  -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1);
+  -moz-box-shadow:    0px 1px 2px rgba(0, 0, 0, 0.1);
+  box-shadow:         0px 1px 2px rgba(0, 0, 0, 0.1);
+}
+.welcome_text {
+  color: #999;
+  text-align: center;
+  margin-bottom: 25px;
+}
+
 
 /* Login page */
 .login_form_wrap {
@@ -261,7 +285,7 @@ fieldset[disabled] .btn-tg.active {
   padding: 25px;
   background: #FFF;
   margin: 200px auto 0;
-  border-radius: 3px;
+  border-radius: 1px;
   overflow: hidden;
 
   -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1);

app/index.html

@@ -7,7 +7,7 @@
   <link rel="stylesheet" href="vendor/angular/angular-csp.css"/>
   <link rel="stylesheet" href="vendor/bootstrap/css/bootstrap.css"/>
   <link rel="stylesheet" href="vendor/jquery.nanoscroller/nanoscroller.css"/>
-  <link rel="stylesheet" href="css/app.css?4"/>
+  <link rel="stylesheet" href="css/app.css?6"/>
   <link rel="icon" href="favicon.ico" type="image/x-icon">
 
   <meta property="og:title" content="Webogram">
@@ -37,12 +37,12 @@
 
 
   <script type="text/javascript" src="js/lib/config.js"></script>
-  <script type="text/javascript" src="js/lib/mtproto.js?9"></script>
+  <script type="text/javascript" src="js/lib/mtproto.js?10"></script>
 
   <script type="text/javascript" src="js/util.js"></script>
-  <script type="text/javascript" src="js/app.js?4"></script>
+  <script type="text/javascript" src="js/app.js?5"></script>
   <script type="text/javascript" src="js/services.js?6"></script>
-  <script type="text/javascript" src="js/controllers.js?9"></script>
+  <script type="text/javascript" src="js/controllers.js?10"></script>
   <script type="text/javascript" src="js/filters.js?3"></script>
   <script type="text/javascript" src="js/directives.js?6"></script>
 

app/js/app.js

@@ -7,7 +7,8 @@
 
 'use strict';
 
-// window._testMode = 1;
+window._testMode = location.search.indexOf('test=1') > 0;
+window._debugMode = location.search.indexOf('debug=1') > 0;
 
 
 // Declare app level module which depends on filters, and services
@@ -47,8 +48,8 @@ config(['$locationProvider', '$routeProvider', '$compileProvider', function($loc
 
 
   // $locationProvider.html5Mode(true);
-  $routeProvider.when('/', {templateUrl: 'partials/welcome.html', controller: 'AppWelcomeController'});
-  $routeProvider.when('/login', {templateUrl: 'partials/login.html?1', controller: 'AppLoginController'});
+  $routeProvider.when('/', {templateUrl: 'partials/welcome.html?1', controller: 'AppWelcomeController'});
+  $routeProvider.when('/login', {templateUrl: 'partials/login.html?2', controller: 'AppLoginController'});
   $routeProvider.when('/im', {templateUrl: 'partials/im.html?3', controller: 'AppIMController', reloadOnSearch: false});
   $routeProvider.otherwise({redirectTo: '/'});
 

app/js/controllers.js

@@ -15,8 +15,6 @@ angular.module('myApp.controllers', [])
     MtpApiManager.getUserID().then(function (id) {
       if (id) {
         $location.url('/im');
-      } else {
-        $location.url('/login');
       }
     });
   })

app/js/lib/mtproto.js

@@ -351,7 +351,7 @@ function TLSerialization (options) {
 
   this.createBuffer();
 
-  // this.debug = options.debug !== undefined ? options.debug : true;
+  this.debug = options.debug !== undefined ? options.debug : window._debugMode;
   this.mtproto = options.mtproto || false;
   return this;
 }
@@ -631,7 +631,7 @@ function TLDeserialization (buffer, options) {
   this.intView  = new Uint32Array(this.buffer);
   this.byteView = new Uint8Array(this.buffer);
 
-  // this.debug = options.debug !== undefined ? options.debug : true;
+  this.debug = options.debug !== undefined ? options.debug : window._debugMode;
   this.mtproto = options.mtproto || false;
   return this;
 }
@@ -1575,7 +1575,9 @@ factory('MtpNetworkerFactory', function (MtpDcConfigurator, MtpMessageIdGenerato
       body: serializer.getBytes()
     };
 
-    // dLog('MT call', method, params, messageID, seqNo);
+    if (window._debugMode) {
+      dLog('MT call', method, params, messageID, seqNo);
+    }
 
     return this.pushMessage(message, options);
   };
@@ -1594,7 +1596,9 @@ factory('MtpNetworkerFactory', function (MtpDcConfigurator, MtpMessageIdGenerato
       body: serializer.getBytes()
     };
 
-    // dLog('MT message', object, messageID, seqNo);
+    if (window._debugMode) {
+      dLog('MT message', object, messageID, seqNo);
+    }
 
     return this.pushMessage(message, options);
   };
@@ -1623,8 +1627,11 @@ factory('MtpNetworkerFactory', function (MtpDcConfigurator, MtpMessageIdGenerato
       isAPI: true
     };
 
-    dLog('Api call', method, messageID, seqNo);
-    // dLog('Api call', method, params, messageID, seqNo);
+    if (window._debugMode) {
+      dLog('Api call', method, params, messageID, seqNo)
+    } else {
+      dLog('Api call', method, messageID, seqNo);
+    }
 
     return this.pushMessage(message, options);
   };
@@ -1793,7 +1800,9 @@ factory('MtpNetworkerFactory', function (MtpDcConfigurator, MtpMessageIdGenerato
     var self = this;
     this.sendEncryptedRequest(message).then(function (result) {
       self.parseResponse(result.data).then(function (response) {
-        // dLog('Server response', self.dcID, response);
+        if (window._debugMode) {
+          dLog('Server response', self.dcID, response);
+        }
 
         self.processMessage(response.response, response.messageID, response.sessionID);
 

app/partials/login.html

@@ -5,7 +5,7 @@
   <div class="error" ng-if="error.message">{{ error.message }}</div>
   <form name="mySendCodeForm" ng-if="!credentials.phone_code_hash" ng-submit="sendCode()">
     <h3 class="login_form_head">Sign in</h3>
-    <p class="login_form_lead">Welcome to an experimental web-client of Telegram messenger</p>
+    <p class="login_form_lead">Please enter your full phone number with country code.</p>
 
     <div class="form-group" ng-class="{'has-error': error.field == 'phone'}">
       <label class="control-label" for="phone_number" ng-if="error.field == 'phone'">Incorrect phone number</label>

app/partials/welcome.html

@@ -1,5 +1,13 @@
-<!-- <div class="jumbotron">
-  <h1>Welcome to Telegram!</h1>
-  <p>You are currently not authorized. Would you like to log in?</p>
-  <p><a class="btn btn-primary btn-lg" role="button" href="#/login">Log in</a></p>
-</div> -->
+<div ng-include="'partials/head.html?1'"></div>
+
+<div class="welcome_logo"></div>
+
+<div class="welcome_box_wrap">
+  <div class="welcome_text">
+    <p>Welcome to an unofficial web-client of mobile <strong>Telegram</strong> messenger.</p>
+    <p>Is in alpha, which means it is still not 200% secure and functional.</p>
+    <p>Visit <a target="_blank" href="https://telegram.org/">telegram.org</a> to learn more.</p>
+  </div>
+  <a href="#/login" class="btn btn-tg btn-block">Start Messaging</a>
+  </form>
+</div>