SYWEB-12: Add a 'Room Info' button which displays all state content.

Content displayed in a modal dialog. Currently only read-only.

2 files changed, 50 insertions, 0 deletions

diff --git a/webclient/room/room-controller.js b/webclient/room/room-controller.js

index 841b5cccdd..37f51c4e91 100644
--- a/webclient/room/room-controller.js
+++ b/webclient/room/room-controller.js
@@ -1017,6 +1017,15 @@ angular.module('RoomController', ['ngSanitize', 'matrixFilter', 'mFileInput'])
         });
     };
 
+    $scope.openRoomInfo = function() {
+        var modalInstance = $modal.open({
+            templateUrl: 'roomInfoTemplate.html',
+            controller: 'RoomInfoController',
+            size: 'lg',
+            scope: $scope
+        });
+    };
+
 }])
 .controller('EventInfoController', function($scope, $modalInstance) {
     console.log("Displaying modal dialog for >>>> " + JSON.stringify($scope.event_selected));
@@ -1026,4 +1035,14 @@ angular.module('RoomController', ['ngSanitize', 'matrixFilter', 'mFileInput'])
         console.log("Redact event >> " + JSON.stringify($scope.event_selected));
         $modalInstance.close("redact");
     };
+})
+.controller('RoomInfoController', function($scope, $modalInstance, $filter) {
+    console.log("Displaying room info.");
+
+    $scope.submitState = function(eventType, content) {
+        console.log("Submitting " + eventType + " with " + content);
+    }
+
+    $scope.dismiss = $modalInstance.dismiss;
+
 });
diff --git a/webclient/room/room.html b/webclient/room/room.html

index 38b6d591ea..3458e97039 100644
--- a/webclient/room/room.html
+++ b/webclient/room/room.html
@@ -13,6 +13,34 @@
         </div>
     </script>
 
+    <script type="text/ng-template" id="roomInfoTemplate.html">
+        <div class="modal-body">
+            <table id="roomInfoTable">
+                <tr>
+                <th>
+                    Event Type
+                </th>
+                <th>
+                    Content
+                </th>
+                </tr>
+                <tr ng-repeat="(key, event) in events.rooms[room_id] | stateEventsFilter">
+                    <td>
+                        <pre>{{ key }}</pre>
+                    </td>
+                    <td>
+                        <pre>{{ event.content | json }}</pre>
+                    </td>
+                </tr>
+            </table>
+        </div>
+        <div class="modal-footer">
+            <button ng-click="dismiss()" type="button" class="btn">
+                Close
+            </button>
+        </div>
+    </script>
+
     <div id="roomHeader">
         <a href ng-click="goToPage('/')"><img src="img/logo-small.png" width="100" height="43" alt="[matrix]"/></a>
         <div class="roomHeaderInfo">
@@ -216,6 +244,9 @@
                         >
                     Video Call
                 </button>
+                <button ng-click="openRoomInfo()">
+                    Room Info
+                </button>
             </div>
         
             {{ feedback }}