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

Added settings, sound notifications

Browse Source
This commit is contained in:
Igor Zhukov 2014-02-04 20:04:32 +04:00
parent 3ec413ec28
commit 64168144db
10 changed files with 225 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
app/css/app.css
View File

@ -224,16 +224,21 @@ fieldset[disabled] .btn-tg.active {
line-height: 1.4;
}
.modal-close-link {
.modal-close-link,
.modal-save-link {
font-size: 12px;
line-height: 1.4;
float: right;
padding: 0 2px 0;
margin: 6px 2px 0 0;
}
.modal-close-link:hover {
.modal-close-link:hover,
.modal-save-link:hover {
text-decoration: none;
}
.modal-save-link {
margin-right: 15px;
}
@ -1427,3 +1432,38 @@ img.img_fullsize {
}
}
.settings_modal_window .modal-dialog {
max-width: 502px;
}
.settings_profile_edit_form {
margin-bottom: 15px;
}
.settings_profile_first_name,
.settings_profile_last_name {
width: 210px;
float: left;
}
.settings_profile_first_name {
margin-right: 22px;
}
.settings_profile_edit_form input {
font-size: 12px;
line-height: normal;
background: #F2F2F2;
border: 1px solid #F2F2F2;
border-radius: 0;
padding: 6px 6px 6px 6px;
margin-bottom: 0;
margin: 0;
}
.settings_profile_edit_form input:focus,
.settings_profile_edit_form input:active {
background-color: #FFF;
}
.settings_user_phone,
.settings_version {
color: #999;
}

8
app/index.html
View File

@ -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?17"/>
<link rel="stylesheet" href="css/app.css?18"/>
<link rel="icon" href="favicon.ico" type="image/x-icon" />
<meta property="og:title" content="Webogram">
@ -51,9 +51,9 @@
<script type="text/javascript" src="js/lib/mtproto.js?17"></script>
<script type="text/javascript" src="js/util.js"></script>
<script type="text/javascript" src="js/app.js?12"></script>
<script type="text/javascript" src="js/services.js?13"></script>
<script type="text/javascript" src="js/controllers.js?21"></script>
<script type="text/javascript" src="js/app.js?13"></script>
<script type="text/javascript" src="js/services.js?14"></script>
<script type="text/javascript" src="js/controllers.js?22"></script>
<script type="text/javascript" src="js/filters.js?3"></script>
<script type="text/javascript" src="js/directives.js?15"></script>

6
app/js/app.js
View File

@ -55,9 +55,9 @@ config(['$locationProvider', '$routeProvider', '$compileProvider', function($loc
// $locationProvider.html5Mode(true);
$routeProvider.when('/', {templateUrl: 'partials/welcome.html?2', controller: 'AppWelcomeController'});
$routeProvider.when('/login', {templateUrl: 'partials/login.html?3', controller: 'AppLoginController'});
$routeProvider.when('/im', {templateUrl: 'partials/im.html?9', controller: 'AppIMController', reloadOnSearch: false});
$routeProvider.when('/', {templateUrl: 'partials/welcome.html?3', controller: 'AppWelcomeController'});
$routeProvider.when('/login', {templateUrl: 'partials/login.html?4', controller: 'AppLoginController'});
$routeProvider.when('/im', {templateUrl: 'partials/im.html?10', controller: 'AppIMController', reloadOnSearch: false});
$routeProvider.otherwise({redirectTo: '/'});
}]);

81
app/js/controllers.js
View File

@ -145,7 +145,7 @@ angular.module('myApp.controllers', [])
};
})
.controller('AppIMController', function ($scope, $location, $routeParams, MtpApiManager) {
.controller('AppIMController', function ($scope, $location, $routeParams, $modal, $rootScope, MtpApiManager) {
$scope.$on('$routeUpdate', updateCurDialog);
@ -159,10 +159,12 @@ angular.module('myApp.controllers', [])
$scope.isLoggedIn = true;
$scope.logOut = function () {
MtpApiManager.logOut().then(function () {
location.hash = '/login';
location.reload();
$scope.openSettings = function () {
$modal.open({
templateUrl: 'partials/settings_modal.html?1',
controller: 'SettingsModalController',
scope: $rootScope.$new(),
windowClass: 'settings_modal_window'
});
}
@ -569,5 +571,74 @@ angular.module('myApp.controllers', [])
});
})
.controller('SettingsModalController', function ($scope, $timeout, AppUsersManager, AppChatsManager, MtpApiManager, AppConfigManager, NotificationsManager) {
$scope.profile = {};
MtpApiManager.getUserID().then(function (id) {
var user = AppUsersManager.getUser(id);
$scope.profile.first_name = user.first_name;
$scope.profile.last_name = user.last_name;
$scope.phone = user.phone;
});
$scope.notify = {};
AppConfigManager.get(['notify_nodesktop', 'notify_nosound']).then(function (settings) {
$scope.notify.sound = !settings.notify_nosound;
$scope.notify.desktop = !settings.notify_nodesktop;
});
$scope.$watch('notify.sound', function(newValue) {
if (newValue) {
AppConfigManager.remove('notify_nosound');
} else {
AppConfigManager.set({notify_nosound: true});
NotificationsManager.clear();
}
});
$scope.$watch('notify.desktop', function(newValue) {
if (newValue) {
AppConfigManager.remove('notify_nodesktop');
} else {
AppConfigManager.set({notify_nodesktop: true});
}
});
$scope.error = {};
$scope.save = function () {
MtpApiManager.invokeApi('account.updateProfile', {
first_name: $scope.profile.first_name || '',
last_name: $scope.profile.last_name || ''
}).then(function (user) {
$scope.error = {};
AppUsersManager.saveApiUser(user);
}, function (error) {
switch (error.type) {
case 'FIRSTNAME_INVALID':
$scope.error = {field: 'first_name'};
break;
case 'LASTNAME_INVALID':
$scope.error = {field: 'last_name'};
break;
case 'NAME_NOT_MODIFIED':
$scope.error = {};
break;
}
});
}
$scope.logOut = function () {
MtpApiManager.logOut().then(function () {
location.hash = '/login';
location.reload();
});
}
})

61
app/js/services.js
View File

@ -1937,7 +1937,7 @@ angular.module('myApp.services', [])
})
.service('NotificationsManager', function ($rootScope, $window, $timeout, $interval, MtpApiManager, AppPeersManager, IdleManager) {
.service('NotificationsManager', function ($rootScope, $window, $timeout, $interval, MtpApiManager, AppPeersManager, IdleManager, AppConfigManager) {
var notificationsUiSupport = 'Notification' in window;
var notificationsShown = {};
@ -1983,6 +1983,7 @@ angular.module('myApp.services', [])
start: start,
notify: notify,
cancel: notificationCancel,
clear: notificationsClear,
getPeerSettings: getPeerSettings
};
@ -2036,32 +2037,48 @@ angular.module('myApp.services', [])
return false;
}
var idx = ++notificationIndex,
key = data.key || 'k' + idx;
var notification = new Notification(data.title, {
icon: data.image || '',
body: data.message || ''
});
notification.onclick = function () {
notification.close();
window.focus();
notificationsClear();
if (data.onclick) {
data.onclick();
AppConfigManager.get('notify_nosound').then(function (noSound) {
if (!noSound) {
playSound();
}
};
})
notification.onclose = function () {
delete notificationsShown[key];
// lastClosed.push(+new Date());
notificationsClear();
};
AppConfigManager.get('notify_nodesktop').then(function (noShow) {
if (noShow) {
return;
}
var idx = ++notificationIndex,
key = data.key || 'k' + idx;
notificationsShown[key] = notification;
var notification = new Notification(data.title, {
icon: data.image || '',
body: data.message || ''
});
notification.onclick = function () {
notification.close();
window.focus();
notificationsClear();
if (data.onclick) {
data.onclick();
}
};
notification.onclose = function () {
delete notificationsShown[key];
// lastClosed.push(+new Date());
notificationsClear();
};
notificationsShown[key] = notification;
});
};
function playSound () {
var filename = 'img/sound_a.wav';
$('#notify_sound').html('<audio autoplay="autoplay"><source src="' + filename + '" type="audio/mpeg" /><embed hidden="true" autostart="true" loop="false" src="' + filename +'" /></audio>');
}
function notificationCancel (key) {
var notification = notificationsShown[key];
if (notification) {

2
app/partials/head.html
View File

@ -7,7 +7,7 @@
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li><a href="https://github.com/zhukov/webogram" target="_blank">About</a></li>
<li ng-if="isLoggedIn"><a href="" ng-click="logOut()">Log out</a></li>
<li ng-if="isLoggedIn"><a href="" ng-click="openSettings()">Settings</a></li>
</ul>
</div>
</div>

4
app/partials/im.html
View File

@ -1,4 +1,4 @@
<div ng-include="'partials/head.html?1'"></div>
<div ng-include="'partials/head.html?2'"></div>
<div class="im_page_wrap">
@ -147,3 +147,5 @@
<a class="im_page_footer_brand" target="_blank" href="https://github.com/zhukov/webogram">Telegram alpha</a> by izhukov &amp; toberg
</div>
<div id="notify_sound"></div>

2
app/partials/login.html
View File

@ -1,4 +1,4 @@
<div ng-include="'partials/head.html?1'"></div>
<div ng-include="'partials/head.html?2'"></div>
<div class="login_form_wrap">

55
app/partials/settings_modal.html Normal file
View File

@ -0,0 +1,55 @@
<div class="settings_modal_wrap">
<div class="modal-header">
<a class="modal-close-link" ng-click="$close()">Close</a>
<a class="modal-save-link" ng-click="save()">Save</a>
<h4 class="modal-title">Settings</h4>
</div>
<div class="modal-body">
<form class="settings_profile_edit_form clearfix">
<div class="form-group settings_profile_first_name" ng-class="{'has-error': error.field == 'first_name'}">
<label class="control-label" for="first_name">
<span ng-if="error.field == 'first_name'">Invalid First Name</span>
<span ng-if="error.field != 'first_name'">First Name</span>
</label>
<input type="text" class="form-control" name="first_name" ng-model="profile.first_name" required />
</div>
<div class="form-group settings_profile_last_name" ng-class="{'has-error': error.field == 'last_name'}">
<label class="control-label" for="last_name">
<span ng-if="error.field == 'last_name'">Invalid Last Name</span>
<span ng-if="error.field != 'last_name'">Last Name</span>
</label>
<input type="text" class="form-control" name="last_name" ng-model="profile.last_name" />
</div>
</form>
<p>
<strong>Sound: </strong>
<a ng-click="notify.sound = !notify.sound">{{notify.sound ? 'ON' : 'OFF'}}</a>
</p>
<p>
<strong>Desktop Notifications: </strong>
<a ng-click="notify.desktop = !notify.desktop">{{notify.desktop ? 'ON' : 'OFF'}}</a>
</p>
<p>
<strong>User: </strong>
<span class="settings_user_phone">{{phone | phoneNumber}}</span>
</p>
<p>
<strong>Version: </strong>
<span class="settings_version">alpha 0.0.12</span>
</p>
<hr/>
<div class="settings_logout_wrap">
<a href="" ng-click="logOut()">Log out</a>
</div>
</div>
</div>

2
app/partials/welcome.html
View File

@ -1,4 +1,4 @@
<div ng-include="'partials/head.html?1'"></div>
<div ng-include="'partials/head.html?2'"></div>
<div ng-show="showWelcome">