r4sas/webogram-i2p
1
0
Fork 0
Code Issues Releases Wiki Activity

Implemented registration

Browse Source 
Closes #42
This commit is contained in:
Igor Zhukov 2014-06-06 19:02:12 +04:00
parent a09e5b329f
commit e9c950b724
7 changed files with 156 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
app/css/app.css
View File

@ -154,14 +154,20 @@ input[type="number"] {
background: #7999b3;
border-color: #7999b3;
}
.btn-primary:focus {
outline: none;
}
.btn-link {
color: #3a6d99;
text-decoration: none !important;
border-radius: 3px;
overflow: hidden;
}
.btn-link:hover {
text-decoration: none;
background: #f2f6fa;
}
.tg_page_head .navbar {
@ -758,8 +764,13 @@ a.tg_radio_on:hover i.icon-radio {
.login_form_head {
color: #222222;
margin-top: 0;
margin-bottom: 7px;
text-align: center;
}
.login_edit_phone {
text-align: center;
margin-bottom: 3px;
}
.login_form_lead {
color: #959595;
text-align: center;
@ -801,6 +812,9 @@ a.tg_radio_on:hover i.icon-radio {
.login_phone_number {
width: 198px;
}
.login_first_name_wrap {
margin-bottom: 11px;
}
/* IM page start */
@ -852,6 +866,20 @@ a.tg_radio_on:hover i.icon-radio {
/* Dialogs list */
.im_dialogs_empty_wrap {
margin: 60px 50px;
text-align: center;
}
.im_dialogs_empty_header {
font-size: 15px;
color: #808080;
margin: 0 0 15px;
}
.im_dialogs_empty_lead {
color: #808080;
margin-bottom: 18px;
}
.im_dialogs_col {
margin-right: -7px;
}
@ -1197,6 +1225,22 @@ a.im_dialog_selected .im_dialog_date {
}
.im_history_no_dialogs_wrap {
margin: 122px 170px 60px;
text-align: center;
}
.im_dialogs_empty_header {
font-size: 15px;
color: #808080;
margin: 0 0 15px;
}
.im_dialogs_empty_lead {
color: #808080;
margin-bottom: 18px;
}
.im_history_wrap {
overflow: hidden;
/*overflow-y: scroll;*/

BIN
app/img/screenshot1.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 450 KiB

After

Width:  |  Height:  |  Size: 446 KiB

95
app/js/controllers.js
View File

@ -114,46 +114,24 @@ angular.module('myApp.controllers', [])
phone_number: $scope.credentials.phone_number
}).then(function () {
$scope.progress.enabled = true;
MtpApiManager.invokeApi('auth.checkPhone', {
phone_number: $scope.credentials.phone_full
}, options).then(function (result) {
MtpApiManager.invokeApi('auth.sendCode', {
phone_number: $scope.credentials.phone_full,
sms_type: 0,
api_id: Config.App.id,
api_hash: Config.App.hash
}, options).then(function (sentCode) {
$scope.progress.enabled = false;
if (!result.phone_registered) {
ErrorService.show({
error: {code: 400, type: 'ACCOUNT_REQUIRED'},
phone: $scope.credentials.phone_full
});
return false;
}
$scope.progress.enabled = true;
MtpApiManager.invokeApi('auth.sendCode', {
phone_number: $scope.credentials.phone_full,
sms_type: 0,
api_id: Config.App.id,
api_hash: Config.App.hash
}, options).then(function (sentCode) {
$scope.progress.enabled = false;
$scope.credentials.phone_code_hash = sentCode.phone_code_hash;
$scope.credentials.phone_occupied = sentCode.phone_registered;
$scope.error = {};
$scope.credentials.phone_code_hash = sentCode.phone_code_hash;
$scope.credentials.phone_occupied = sentCode.phone_registered;
$scope.error = {};
$scope.callPending.remaining = sentCode.send_call_timeout || 60;
callCheck();
$scope.callPending.remaining = sentCode.send_call_timeout || 60;
callCheck();
}, function (error) {
$scope.progress.enabled = false;
console.log('sendCode error', error);
switch (error.type) {
case 'PHONE_NUMBER_INVALID':
$scope.error = {field: 'phone'};
error.handled = true;
break;
}
});
}, function (error) {
$scope.progress.enabled = false;
console.log('sendCode error', error);
switch (error.type) {
case 'NETWORK_BAD_REQUEST':
if (location.protocol == 'https:') {
@ -178,7 +156,8 @@ angular.module('myApp.controllers', [])
$timeout.cancel(callTimeout);
delete $scope.credentials.phone_code_hash;
delete $scope.credentials.phone_occupied;
delete $scope.credentials.phone_unoccupied;
delete $scope.credentials.phone_code_valid;
delete $scope.callPending.remaining;
delete $scope.callPending.success;
}
@ -202,7 +181,9 @@ angular.module('myApp.controllers', [])
$scope.progress.enabled = false;
if (error.code == 400 && error.type == 'PHONE_NUMBER_UNOCCUPIED') {
error.handled = true;
return $scope.logIn(true);
$scope.credentials.phone_code_valid = true;
$scope.credentials.phone_unoccupied = true;
return;
} else if (error.code == 400 && error.type == 'PHONE_NUMBER_OCCUPIED') {
error.handled = true;
return $scope.logIn(false);
@ -220,6 +201,7 @@ angular.module('myApp.controllers', [])
break;
case 'PHONE_CODE_INVALID':
$scope.error = {field: 'phone_code'};
delete $scope.credentials.phone_code_valid;
error.handled = true;
break;
}
@ -243,6 +225,8 @@ angular.module('myApp.controllers', [])
$scope.isLoggedIn = true;
$scope.isEmpty = {};
$scope.openSettings = function () {
$modal.open({
templateUrl: 'partials/settings_modal.html',
@ -308,6 +292,7 @@ angular.module('myApp.controllers', [])
$scope.dialogs = [];
$scope.contacts = [];
$scope.search = {};
$scope.contactsLoaded = false;
var offset = 0,
maxID = 0,
@ -361,6 +346,14 @@ angular.module('myApp.controllers', [])
$scope.$watch('search.query', loadDialogs);
$scope.importContact = function () {
AppUsersManager.openImportContact().then(function () {
if (contactsShown) {
loadDialogs();
}
});
};
function loadDialogs () {
offset = 0;
maxID = 0;
@ -382,12 +375,16 @@ angular.module('myApp.controllers', [])
peersInDialogs[dialog.peerID] = true;
$scope.dialogs.push(AppMessagesManager.wrapForDialog(dialog.top_message, dialog.unread_count));
});
delete $scope.isEmpty.dialogs;
}
$scope.$broadcast('ui_dialogs_change');
if (!$scope.search.query) {
AppMessagesManager.getDialogs('', maxID, 100);
if (!dialogsResult.dialogs.length) {
$scope.isEmpty.dialogs = true;
}
} else {
showMoreDialogs();
}
@ -416,7 +413,7 @@ angular.module('myApp.controllers', [])
return;
}
if (!hasMore && $scope.search.query) {
if (!hasMore && ($scope.search.query || !$scope.dialogs.length)) {
contactsShown = true;
AppUsersManager.getContacts($scope.search.query).then(function (contactsList) {
@ -431,6 +428,12 @@ angular.module('myApp.controllers', [])
});
}
});
if (contactsList.length) {
delete $scope.isEmpty.contacts;
} else if (!$scope.search.query) {
$scope.isEmpty.contacts = true;
}
});
$scope.$broadcast('ui_dialogs_append');
return;
@ -1815,18 +1818,8 @@ angular.module('myApp.controllers', [])
}
$scope.importContact = function () {
$modal.open({
templateUrl: 'partials/import_contact_modal.html',
controller: 'ImportContactModalController',
windowClass: 'import_contact_modal_window'
}).result.then(function (foundUserID) {
if (foundUserID) {
updateContacts($scope.search && $scope.search.query || '');
} else {
ErrorService.show({
error: {code: 404, type: 'USER_NOT_USING_TELEGRAM'}
});
}
AppUsersManager.openImportContact().then(function () {
updateContacts($scope.search && $scope.search.query || '');
});
};
@ -1937,8 +1930,8 @@ angular.module('myApp.controllers', [])
$scope.progress = {enabled: true};
AppUsersManager.importContact(
$scope.importContact.phone,
$scope.importContact.first_name,
$scope.importContact.last_name
$scope.importContact.first_name || '',
$scope.importContact.last_name || ''
).then(function (foundUserID) {
$modalInstance.close(foundUserID);
})['finally'](function () {

21
app/js/services.js
View File

@ -130,7 +130,7 @@ angular.module('myApp.services', [])
};
})
.service('AppUsersManager', function ($rootScope, $modal, $modalStack, $filter, MtpApiFileManager, MtpApiManager, RichTextProcessor, SearchIndexManager) {
.service('AppUsersManager', function ($rootScope, $modal, $modalStack, $filter, $q, MtpApiFileManager, MtpApiManager, RichTextProcessor, SearchIndexManager) {
var users = {},
cachedPhotoLocations = {},
contactsFillPromise,
@ -341,6 +341,22 @@ angular.module('myApp.services', [])
}
}
function openImportContact () {
return $modal.open({
templateUrl: 'partials/import_contact_modal.html',
controller: 'ImportContactModalController',
windowClass: 'import_contact_modal_window'
}).result.then(function (foundUserID) {
if (!foundUserID) {
ErrorService.show({
error: {code: 404, type: 'USER_NOT_USING_TELEGRAM'}
});
return $q.reject();
}
return foundUserID;
});
};
$rootScope.$on('apiUpdate', function (e, update) {
// console.log('on apiUpdate', update);
@ -388,7 +404,8 @@ angular.module('myApp.services', [])
importContact: importContact,
deleteContacts: deleteContacts,
wrapForFull: wrapForFull,
openUser: openUser
openUser: openUser,
openImportContact: openImportContact
}
})

2
app/partials/head.html
View File

@ -22,7 +22,7 @@
</ul>
<ul ng-switch-default class="nav navbar-nav navbar-right">
<li ng-if="isLoggedIn"><a href="" ng-click="openContacts()">Contacts</a></li>
<li ng-if="isLoggedIn &amp;&amp; !isEmpty.contacts"><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>

26
app/partials/im.html
View File

@ -13,9 +13,9 @@
<span class="icon-bar"></span>
</a>
<ul class="dropdown-menu">
<li><a href="" ng-click="openGroup()">New Group</a></li>
<li><a href="" ng-click="openContacts()">Contacts</a></li>
<li><a href="" ng-click="openSettings()">Settings</a></li>
<li><a ng-click="openGroup()">New Group</a></li>
<li><a ng-click="openContacts()">Contacts</a></li>
<li><a ng-click="openSettings()">Settings</a></li>
</ul>
</div>
<div class="im_dialogs_search">
@ -26,9 +26,17 @@
<div my-dialogs-list class="im_dialogs_col">
<div class="im_dialogs_wrap nano">
<div class="im_dialogs_scrollable_wrap content">
<div class="im_dialogs_empty_wrap" ng-if="isEmpty.contacts">
<h3 class="im_dialogs_empty_header">No contacts yet</h3>
<p class="im_dialogs_empty_lead">Get started by adding a contact to chat with</p>
<button type="button" class="btn btn-primary btn-sm" ng-click="importContact()">Add contact</button>
</div>
<ul class="nav nav-pills nav-stacked">
<li class="im_dialog_wrap" my-dialog dialog-message="dialogMessage" ng-repeat="dialogMessage in dialogs track by dialogMessage.peerID" ng-class="{active: curDialog.peerID == dialogMessage.peerID}"></li>
</ul>
<div class="im_dialogs_contacts_wrap" ng-show="contacts.length > 0">
<h5>Contacts</h5>
<ul class="nav nav-pills nav-stacked">
@ -53,14 +61,22 @@
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class="im_history_col_wrap" ng-controller="AppImHistoryController">
<div ng-show="state.notSelected" class="im_history_not_selected" my-vertical-position="0.35">
Please select a chat to start messaging
<div ng-show="state.notSelected" ng-switch="isEmpty.contacts &amp;&amp; isEmpty.dialogs">
<div ng-switch-when="true" class="im_history_no_dialogs_wrap">
<h3 class="im_dialogs_empty_header">Get started</h3>
<p class="im_dialogs_empty_lead">Welcome to Telegram Web. You can always set your profile photo and change your name in Settings.</p>
<button type="button" class="btn btn-primary btn-sm" ng-click="openSettings()">Open Settings</button>
</div>
<div ng-switch-default class="im_history_not_selected" my-vertical-position="0.35">
Please select a chat to start messaging
</div>
</div>
<div ng-show="!state.notSelected &amp;&amp; !state.loaded" class="im_history_not_selected" my-vertical-position="0.35">
Loading history<span my-loading-dots></span>

29
app/partials/login.html
View File

@ -2,7 +2,8 @@
<div class="login_form_wrap" my-vertical-position="0.4">
<div class="error" ng-if="error.message">{{ error.message }}</div>
<div class="error" ng-if="error.message" ng-bind="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">Please choose your country and enter your full phone number.</p>
@ -25,8 +26,9 @@
</button>
</form>
<form name="myLoginForm" ng-if="credentials.phone_code_hash" ng-submit="logIn()">
<h3 class="login_form_head"><span ng-bind="credentials.phone_country"></span> <span ng-bind="credentials.phone_number"></span> <small>(<a ng-click="editPhone()">edit</a>)</small></h3>
<form name="myLoginForm" ng-if="credentials.phone_code_hash &amp;&amp; !credentials.phone_code_valid" ng-submit="logIn()">
<h3 class="login_form_head"><span ng-bind="credentials.phone_country"></span> <span ng-bind="credentials.phone_number"></span></h3>
<div class="login_edit_phone"><a ng-click="editPhone()">Edit phone number</a></div>
<p class="login_form_lead">We have sent you a code via SMS.<br/>Please enter it below.</p>
<p class="login_form_lead">
@ -45,4 +47,25 @@
<span ng-switch-default>Next</span>
</button>
</form>
<form name="myFullNameForm" ng-if="credentials.phone_code_valid &amp;&amp; credentials.phone_unoccupied" ng-submit="logIn(true)">
<h3 class="login_form_head">Your info</h3>
<p class="login_form_lead">Please enter your full name to set up a Telegram account.</p>
<div class="form-group login_first_name_wrap" ng-class="{'has-error': error.field == 'first_name'}">
<label class="control-label" for="first_name" ng-if="error.field == 'first_name'">Incorrect first name</label>
<input my-focused class="form-control" name="first_name" ng-model="credentials.first_name" placeholder="First name" autocomplete="off" required>
</div>
<div class="form-group" ng-class="{'has-error': error.field == 'last_name'}">
<label class="control-label" for="last_name" ng-if="error.field == 'last_name'">Incorrect last name</label>
<input class="form-control" name="last_name" ng-model="credentials.last_name" placeholder="Last name" autocomplete="off">
</div>
<button class="btn btn-primary btn-block" ng-class="{disabled: progress.enabled}" ng-disabled="progress.enabled" type="submit" ng-switch="progress.enabled">
<span ng-switch-when="true">Signing in<span my-loading-dots></span></span>
<span ng-switch-default>Sign up</span>
</button>
</form>
</div>