Improve welcome page, add confirms
@ -642,32 +642,85 @@ a.tg_radio_on:hover i.icon-radio {
|
||||
|
||||
|
||||
/* Welcome */
|
||||
|
||||
.welcome_form {
|
||||
background: #FFF;
|
||||
padding: 45px 0 63px;
|
||||
border-bottom: 1px solid #e9e9e9;
|
||||
}
|
||||
.welcome_logo {
|
||||
background: url(../img/logo_dogogram.png) 0 0 no-repeat;
|
||||
background-size: 111px 112px;
|
||||
background: url(../img/decentralization.png) 0 0 no-repeat;
|
||||
background-size: 160px 160px;
|
||||
display: block;
|
||||
width: 112px;
|
||||
height: 112px;
|
||||
width: 160px;
|
||||
height: 160px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.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_header {
|
||||
text-align: center;
|
||||
font-size: 24px;
|
||||
font-weight: normal;
|
||||
margin: 20px 0 25px;
|
||||
}
|
||||
.welcome_text {
|
||||
color: #999;
|
||||
text-align: center;
|
||||
margin-bottom: 25px;
|
||||
margin-bottom: 30px;
|
||||
font-size: 13px;
|
||||
line-height: 16px;
|
||||
}
|
||||
.welcome_btn_wrap {
|
||||
max-width: 206px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.welcome_footer {
|
||||
background: #f8f8f8;
|
||||
padding: 20px 0 65px;
|
||||
}
|
||||
.welcome_cards_wrap {
|
||||
max-width: 870px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.welcome_footer_card_wrap {
|
||||
width: 260px;
|
||||
margin: 45px auto 0;
|
||||
text-align: center;
|
||||
}
|
||||
.welcome_footer_card {
|
||||
background: url(../img/WebIntro2_1x.png) 0 0 no-repeat;
|
||||
background-size: 217px 178px;
|
||||
width: 219px;
|
||||
height: 180px;
|
||||
border: 1px solid #e0e4e9;
|
||||
margin: 0 auto 24px;
|
||||
}
|
||||
|
||||
.welcome_footer_card_messaging {
|
||||
background-image: url(../img/WebIntro1.png);
|
||||
}
|
||||
.is_1x .welcome_footer_card_messaging {
|
||||
background-image: url(../img/WebIntro1_1x.png);
|
||||
}
|
||||
|
||||
.welcome_footer_card_filesharing {
|
||||
background-image: url(../img/WebIntro2.png);
|
||||
}
|
||||
.is_1x .welcome_footer_card_filesharing {
|
||||
background-image: url(../img/WebIntro2_1x.png);
|
||||
}
|
||||
|
||||
.welcome_footer_card_powerful {
|
||||
background-image: url(../img/WebIntro3.png);
|
||||
}
|
||||
.is_1x .welcome_footer_card_powerful {
|
||||
background-image: url(../img/WebIntro3_1x.png);
|
||||
}
|
||||
|
||||
.welcome_footer_card_wrap h4 {
|
||||
font-size: 16px;
|
||||
}
|
||||
.welcome_footer_card_wrap .welcome_footer_card_lead {
|
||||
|
||||
}
|
||||
|
||||
|
||||
@ -2345,6 +2398,11 @@ img.chat_modal_participant_photo {
|
||||
padding: 15px 10px 0;
|
||||
text-align: center;
|
||||
}
|
||||
.confirm_peer {
|
||||
font-weight: bold;
|
||||
padding: 15px 10px 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
BIN
app/img/WebIntro1.png
Normal file
After Width: | Height: | Size: 118 KiB |
BIN
app/img/WebIntro1_1x.png
Normal file
After Width: | Height: | Size: 42 KiB |
BIN
app/img/WebIntro2.png
Normal file
After Width: | Height: | Size: 64 KiB |
BIN
app/img/WebIntro2_1x.png
Normal file
After Width: | Height: | Size: 28 KiB |
BIN
app/img/WebIntro3.png
Normal file
After Width: | Height: | Size: 91 KiB |
BIN
app/img/WebIntro3_1x.png
Normal file
After Width: | Height: | Size: 28 KiB |
BIN
app/img/decentralization.png
Normal file
After Width: | Height: | Size: 91 KiB |
@ -679,7 +679,7 @@ angular.module('myApp.controllers', [])
|
||||
selectedMessageIDs.push(messageID);
|
||||
});
|
||||
|
||||
PeersSelectService.selectPeer().then(function (peerString) {
|
||||
PeersSelectService.selectPeer({confirm_type: 'FORWARD_PEER'}).then(function (peerString) {
|
||||
var peerID = AppPeersManager.getPeerID(peerString);
|
||||
AppMessagesManager.forwardMessages(peerID, selectedMessageIDs).then(function () {
|
||||
selectedCancel();
|
||||
@ -1009,7 +1009,7 @@ angular.module('myApp.controllers', [])
|
||||
|
||||
$scope.forward = function () {
|
||||
var messageID = $scope.messageID;
|
||||
PeersSelectService.selectPeer().then(function (peerString) {
|
||||
PeersSelectService.selectPeer({confirm_type: 'PHOTO_SHARE_PEER'}).then(function (peerString) {
|
||||
var peerID = AppPeersManager.getPeerID(peerString);
|
||||
AppMessagesManager.forwardMessages(peerID, [messageID]).then(function () {
|
||||
$rootScope.$broadcast('history_focus', {peerString: peerString});
|
||||
@ -1058,7 +1058,7 @@ angular.module('myApp.controllers', [])
|
||||
|
||||
$scope.forward = function () {
|
||||
var messageID = $scope.messageID;
|
||||
PeersSelectService.selectPeer().then(function (peerString) {
|
||||
PeersSelectService.selectPeer({confirm_type: 'VIDEO_SHARE_PEER'}).then(function (peerString) {
|
||||
var peerID = AppPeersManager.getPeerID(peerString);
|
||||
AppMessagesManager.forwardMessages(peerID, [messageID]).then(function () {
|
||||
$rootScope.$broadcast('history_focus', {peerString: peerString});
|
||||
@ -1149,7 +1149,7 @@ angular.module('myApp.controllers', [])
|
||||
};
|
||||
|
||||
$scope.shareContact = function () {
|
||||
PeersSelectService.selectPeer().then(function (peerString) {
|
||||
PeersSelectService.selectPeer({confirm_type: 'SHARE_CONTACT_PEER'}).then(function (peerString) {
|
||||
var peerID = AppPeersManager.getPeerID(peerString);
|
||||
|
||||
AppMessagesManager.sendOther(peerID, {
|
||||
@ -1576,12 +1576,25 @@ angular.module('myApp.controllers', [])
|
||||
|
||||
})
|
||||
|
||||
.controller('PeerSelectController', function ($scope, $modalInstance) {
|
||||
.controller('PeerSelectController', function ($scope, $modalInstance, $q, AppPeersManager, ErrorService) {
|
||||
|
||||
$scope.dialogSelect = function (peerString) {
|
||||
$modalInstance.close(peerString);
|
||||
var promise;
|
||||
if ($scope.confirm_type) {
|
||||
var peerID = AppPeersManager.getPeerID(peerString),
|
||||
peerData = AppPeersManager.getPeer(peerID);
|
||||
promise = ErrorService.confirm({
|
||||
type: $scope.confirm_type,
|
||||
peer_id: peerID,
|
||||
peer_data: peerData
|
||||
});
|
||||
} else {
|
||||
promise = $q.when();
|
||||
}
|
||||
promise.then(function () {
|
||||
$modalInstance.close(peerString);
|
||||
});
|
||||
};
|
||||
|
||||
})
|
||||
|
||||
.controller('ChatCreateModalController', function ($scope, $modalInstance, $rootScope, MtpApiManager, AppUsersManager, AppChatsManager, ApiUpdatesManager) {
|
||||
|
@ -3270,9 +3270,11 @@ angular.module('myApp.services', [])
|
||||
|
||||
.service('PeersSelectService', function ($rootScope, $modal) {
|
||||
|
||||
function selectPeer () {
|
||||
function selectPeer (options) {
|
||||
var scope = $rootScope.$new();
|
||||
// angular.extend(scope, params);
|
||||
if (options) {
|
||||
angular.extend(scope, options);
|
||||
}
|
||||
|
||||
return $modal.open({
|
||||
templateUrl: 'partials/peer_select.html',
|
||||
|
@ -20,6 +20,22 @@
|
||||
Is this phone number correct?
|
||||
<div class="confirm_phone_number"> <span ng-bind="country_code"></span> <span ng-bind="phone_number"></span> </div>
|
||||
</div>
|
||||
<span ng-switch-when="FORWARD_PEER">Are you sure to forward message(s) to <span ng-switch="peer_id > 0">
|
||||
<span ng-switch-when="true">user <div class="confirm_peer" ng-bind-html="peer_data.rFullName"></div></span>
|
||||
<span ng-switch-default>group <div class="confirm_peer" ng-bind-html="peer_data.rTitle"></div></span>
|
||||
</span></span>
|
||||
<span ng-switch-when="PHOTO_SHARE_PEER">Are you sure to forward photo to <span ng-switch="peer_id > 0">
|
||||
<span ng-switch-when="true">user <div class="confirm_peer" ng-bind-html="peer_data.rFullName"></div></span>
|
||||
<span ng-switch-default>group <div class="confirm_peer" ng-bind-html="peer_data.rTitle"></div></span>
|
||||
</span></span>
|
||||
<span ng-switch-when="VIDEO_SHARE_PEER">Are you sure to forward video to <span ng-switch="peer_id > 0">
|
||||
<span ng-switch-when="true">user <div class="confirm_peer" ng-bind-html="peer_data.rFullName"></div></span>
|
||||
<span ng-switch-default>group <div class="confirm_peer" ng-bind-html="peer_data.rTitle"></div></span>
|
||||
</span></span>
|
||||
<span ng-switch-when="SHARE_CONTACT_PEER">Are you sure to send contact to <span ng-switch="peer_id > 0">
|
||||
<span ng-switch-when="true">user <div class="confirm_peer" ng-bind-html="peer_data.rFullName"></div></span>
|
||||
<span ng-switch-default>group <div class="confirm_peer" ng-bind-html="peer_data.rTitle"></div></span>
|
||||
</span></span>
|
||||
<span ng-switch-default ng-bind="message || 'Are you sure?'"></span>
|
||||
</div>
|
||||
|
||||
@ -35,7 +51,10 @@
|
||||
<span ng-switch-when="FILES_CLIPBOARD_PASTE">Send</span>
|
||||
<span ng-switch-when="FILE_CLIPBOARD_PASTE">Send</span>
|
||||
<span ng-switch-when="MESSAGE_DELETE">Delete</span>
|
||||
<span ng-switch-when="LOGIN_PHONE_CORRECT">Yes</span>
|
||||
<span ng-switch-when="FORWARD_PEER">Forward message</span>
|
||||
<span ng-switch-when="PHOTO_SHARE_PEER">Forward photo</span>
|
||||
<span ng-switch-when="VIDEO_SHARE_PEER">Forward video</span>
|
||||
<span ng-switch-when="SHARE_CONTACT_PEER">Send contact</span>
|
||||
<span ng-switch-default>OK</span>
|
||||
</button>
|
||||
</div>
|
||||
|
@ -25,6 +25,7 @@
|
||||
<li ng-if="isLoggedIn"><a href="" ng-click="openContacts()">Contacts</a></li>
|
||||
<li ng-if="isLoggedIn"><a href="" ng-click="openSettings()">Settings</a></li>
|
||||
<li ng-if="isLoggedIn"><a href="" ng-click="logOut()">Log Out</a></li>
|
||||
<li ng-if="!isLoggedIn"><a href="https://github.com/zhukov/webogram" target="_blank">About</a></li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
|
@ -24,7 +24,7 @@
|
||||
</form>
|
||||
|
||||
<form name="myLoginForm" ng-if="credentials.phone_code_hash" ng-submit="logIn()">
|
||||
<h3 class="login_form_head">{{ credentials.phone_number | phoneNumber }} <small>(<a ng-click="credentials.phone_code_hash = ''">edit</a>)</small></h3>
|
||||
<h3 class="login_form_head"><span ng-bind="credentials.phone_country"></span> <span ng-bind="credentials.phone_number"></span> <small>(<a ng-click="credentials.phone_code_hash = ''">edit</a>)</small></h3>
|
||||
<p class="login_form_lead">We have sent you a code via SMS.<br/>Please enter it below.</p>
|
||||
|
||||
<p class="login_form_lead">
|
||||
|
@ -3,17 +3,55 @@
|
||||
|
||||
<div ng-if="showWelcome">
|
||||
|
||||
<div my-vertical-position="0.4">
|
||||
<div class="welcome_form">
|
||||
<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>It is an 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-success btn-block">Start Messaging</a>
|
||||
<h3 class="welcome_header"><strong>Telegram</strong> Web</h3>
|
||||
|
||||
<div class="welcome_text">
|
||||
<p>Welcome to an unofficial web-prototype of <strong>Telegram</strong>.</p>
|
||||
<p>It is an <strong>alpha</strong>, so it still may not be 200% reliable.</p>
|
||||
</div>
|
||||
<div class="welcome_btn_wrap">
|
||||
<a href="#/login" class="btn btn-primary btn-block">Start Messaging</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="welcome_footer">
|
||||
<div class="welcome_cards_wrap clearfix">
|
||||
|
||||
<div class="container-fluid">
|
||||
<div class="row">
|
||||
<div class="col-md-4">
|
||||
<div class="welcome_footer_card_wrap row">
|
||||
<div class="welcome_footer_card welcome_footer_card_messaging"></div>
|
||||
<h4>Fast messaging</h4>
|
||||
<div class="welcome_footer_card_lead">Send messages with rich emoji support to your contacts</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4">
|
||||
<div class="welcome_footer_card_wrap">
|
||||
<div class="welcome_footer_card welcome_footer_card_filesharing"></div>
|
||||
<h4>Easy file sharing</h4>
|
||||
<div class="welcome_footer_card_lead">Share and forward any files you want by using attach icon or drag-and-drop</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4">
|
||||
<div class="welcome_footer_card_wrap">
|
||||
<div class="welcome_footer_card welcome_footer_card_powerful"></div>
|
||||
<h4>Powerful tools</h4>
|
||||
<div class="welcome_footer_card_lead">Browse photos in chats, use edit mode and set custom notifications</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|