Merge branch 'develop' of github.com:matrix-org/synapse into room_config

2 files changed, 92 insertions, 46 deletions

diff --git a/webclient/settings/settings-controller.js b/webclient/settings/settings-controller.js
index f7d5e8eb75..dc680ef075 100644
--- a/webclient/settings/settings-controller.js
+++ b/webclient/settings/settings-controller.js
@@ -22,8 +22,38 @@ angular.module('SettingsController', ['matrixService', 'mFileUpload', 'mFileInpu
     $scope.config = matrixService.config();
 
     $scope.profile = {
-        displayName: $scope.config.displayName,
-        avatarUrl: $scope.config.avatarUrl
+        displayName: "",
+        avatarUrl: ""
+    };
+
+    // The profile as stored on the server
+    $scope.profileOnServer = {
+        displayName: "",
+        avatarUrl: ""
+    };
+
+    $scope.onInit = function() {
+        // Load profile data
+        // Display name
+        matrixService.getDisplayName($scope.config.user_id).then(
+            function(response) {
+                $scope.profile.displayName = response.data.displayname;
+                $scope.profileOnServer.displayName = response.data.displayname;
+            },
+            function(error) {
+                $scope.feedback = "Can't load display name";
+            } 
+        );
+        // Avatar
+        matrixService.getProfilePictureUrl($scope.config.user_id).then(
+            function(response) {
+                $scope.profile.avatarUrl = response.data.avatar_url;
+                $scope.profileOnServer.avatarUrl = response.data.avatar_url;
+            },
+            function(error) {
+                $scope.feedback = "Can't load avatar URL";
+            } 
+        );
     };
 
     $scope.$watch("profile.avatarFile", function(newValue, oldValue) {
@@ -41,10 +71,10 @@ angular.module('SettingsController', ['matrixService', 'mFileUpload', 'mFileInpu
     });
     
     $scope.saveProfile = function() {
-        if ($scope.profile.displayName !== $scope.config.displayName) {
+        if ($scope.profile.displayName !== $scope.profileOnServer.displayName) {
             setDisplayName($scope.profile.displayName);
         }
-        if ($scope.profile.avatarUrl !== $scope.config.avatarUrl) {
+        if ($scope.profile.avatarUrl !== $scope.profileOnServer.avatarUrl) {
             setAvatar($scope.profile.avatarUrl);
         }
     };
@@ -53,11 +83,6 @@ angular.module('SettingsController', ['matrixService', 'mFileUpload', 'mFileInpu
         matrixService.setDisplayName(displayName).then(
             function(response) {
                 $scope.feedback = "Updated display name.";
-                
-                var config = matrixService.config();
-                config.displayName = displayName;
-                matrixService.setConfig(config);
-                matrixService.saveConfig();
             },
             function(error) {
                 $scope.feedback = "Can't update display name: " + error.data;
@@ -71,11 +96,6 @@ angular.module('SettingsController', ['matrixService', 'mFileUpload', 'mFileInpu
             function(response) {
                 console.log("Updated avatar");
                 $scope.feedback = "Updated avatar.";
-                
-                var config = matrixService.config();
-                config.avatarUrl = avatarURL;
-                matrixService.setConfig(config);
-                matrixService.saveConfig();
             },
             function(error) {
                 $scope.feedback = "Can't update avatar: " + error.data;
@@ -143,4 +163,23 @@ angular.module('SettingsController', ['matrixService', 'mFileUpload', 'mFileInpu
             }
         );
     };
+    
+    
+    /*** Desktop notifications section ***/
+    $scope.settings = {
+        notifications: undefined
+    };
+
+    // If the browser supports it, check the desktop notification state
+    if ("Notification" in window) {
+        $scope.settings.notifications = window.Notification.permission;
+    }
+
+    $scope.requestNotifications = function() {
+        console.log("requestNotifications");
+        window.Notification.requestPermission(function (permission) {
+            console.log("   -> User decision: " + permission);
+            $scope.settings.notifications = permission;
+        });
+    };
 }]);
\ No newline at end of file
diff --git a/webclient/settings/settings.html b/webclient/settings/settings.html
index 453a4fc35f..a69a8de300 100644
--- a/webclient/settings/settings.html
+++ b/webclient/settings/settings.html
@@ -1,35 +1,29 @@
-<div ng-controller="SettingsController" class="user">
+<div ng-controller="SettingsController" class="user" data-ng-init="onInit()">
 
-    <div id="page">
     <div id="wrapper">
-        
-        <h3>Me</h3>
-        <div>
+
+        <div id="genericHeading">
+            <a href ng-click="goToPage('/')"><img src="img/logo-small.png" width="100" height="43" alt="[matrix]"/></a>
+        </div>
+
+        <h1>Settings</h1>
+        <div class="section">
             <form>
-                <table>
-                    <tr>
-                        <td>
-                            <div class="profile-avatar">
-                                <img ng-src="{{ profile.avatarUrl || 'img/default-profile.jpg' }}" m-file-input="profile.avatarFile"/>
-                            </div>
-                        </td>
-                        <td>
-                            <div id="user-ids">
-                                <input size="40" ng-model="profile.displayName" placeholder="Your name"/>            
-                            </div>
-                        </td>
-                        <td>
-                            <button ng-disabled="(profile.displayName == config.displayName) && (profile.avatarUrl == config.avatarUrl)"
-                                    ng-click="saveProfile()">Save</button>    
-                        </td>
-                    </tr>
-                </table>
+                <div class="profile-avatar">
+                    <img ng-src="{{ (null !== profile.avatarUrl) ? profile.avatarUrl : 'img/default-profile.png' }}" m-file-input="profile.avatarFile"/>
+                </div>
+                <div id="user-ids">
+                    <input size="40" ng-model="profile.displayName" placeholder="Your display name"/>
+                    <br/>
+                    <button ng-disabled="(profile.displayName == profileOnServer.displayName) && (profile.avatarUrl == profileOnServer.avatarUrl)"
+                            ng-click="saveProfile()">Save</button>    
+                </div>
             </form>
         </div>
         <br/>
 
         <h3>Linked emails</h3>
-        <div>
+        <div class="section">
             <form>
                 <input size="40" ng-model="linkedEmails.linkNewEmail" ng-enter="linkEmail(linkedEmails.linkNewEmail)" />
                 <button ng-disabled="!linkedEmails.linkNewEmail" ng-click="linkEmail(linkedEmails.linkNewEmail)">
@@ -52,22 +46,35 @@
             </table>
         </div>
         <br/>
-
+        
+        <h3>Desktop notifications</h3>
+        <div class="section" ng-switch="settings.notifications">
+            <div ng-switch-when="granted">
+                Notifications are enabled.
+            </div>
+            <div ng-switch-when="denied">
+                You have denied permission for notifications.<br/>
+                To enable it, reset the notification setting for this web site into your browser settings.
+            </div>
+            <div ng-switch-when="default">
+                <button ng-click="requestNotifications()" style="font-size: 14pt">Enable desktop notifications</button>
+            </div>
+            <div ng-switch-default="">
+                Sorry, your browser does not support notifications.
+            </div>
+        </div>
+        <br/>
+        
         <h3>Configuration</h3>
-        <div>
+        <div class="section">
             <div>Home server: {{ config.homeserver }} </div>
+            <div>Identity server: {{ config.identityServer }} </div>
             <div>User ID: {{ config.user_id }} </div>
             <div>Access token: {{ config.access_token }} </div>
         </div>
         <br/>
-        
-        <div>
-            <div><button ng-click="requestNotifications()">Request notifications</button></div>
-        </div>
-        <br/>
 
         {{ feedback }}
 
     </div>    
-    </div>
 </div>