diff --git a/static/js/directives/roombar.js b/static/js/directives/roombar.js
index 3bad229f..87c3dc20 100644
--- a/static/js/directives/roombar.js
+++ b/static/js/directives/roombar.js
@@ -26,8 +26,10 @@ define(['underscore', 'angular', 'text!partials/roombar.html'], function(_, angu
 	return ["$window", "rooms", function($window, rooms) {
 
 		var link = function($scope, $element) {
-			var clearRoomName = function(ev) {
-				$scope.currentRoomName = $scope.newRoomName = "";
+
+			var clearRoomName = function() {
+				$scope.currentRoomName = null;
+				$scope.newRoomName = "";
 			};
 
 			//console.log("roomBar directive link", arguments);
diff --git a/static/partials/roombar.html b/static/partials/roombar.html
index 3a488fc7..ca8e94b9 100644
--- a/static/partials/roombar.html
+++ b/static/partials/roombar.html
@@ -1,4 +1,4 @@
-<div class="roombar overlaybar form-horizontal" ng-class="{notvisible: !layout.roombar}">
+<div class="roombar overlaybar form-horizontal" ng-hide="currentRoomName===null" ng-class="{notvisible: !layout.roombar}">
 	<a class="overlaybar-button" ng-model="layout.roombar" btn-checkbox btn-checkbox-true="true" btn-checkbox-false="false" title="{{_('Change room')}}"><i class="fa fa-pencil-square-o"></i></a>
 	<form name="roombarform" class="overlaybar-content form-group">
 		<label class="pull-left control-label hidden-xs">{{_('Room')}}</label>