Merge pull request #549 from nextcloud/room-info-title

Improve title for 1-to-1 calls.

js/views/callinfoview.js

@@ -222,6 +222,21 @@
 			} else {
 				this._nameEditableTextLabel.disableEdition();
 			}
+
+			// This if-case should be removed when we fix room model for
+			// oneToOne calls. OneToOne calls should not have userId set as room
+			// name by default. We use it now for avatars, but a new attribute
+			// should be added to the room model for displaying room images.
+			// This has to be added below the "enable/disableEdition" calls as
+			// those calls render the view if needed, while the setters expect
+			// the view to be already rendered.
+			if (this.model.get('type') === 1) {
+				this._nameEditableTextLabel.setModelAttribute(undefined);
+				this._nameEditableTextLabel.setLabelPlaceholder(t('spreed', 'Conversation with {name}', {name: this.model.get('displayName')}));
+			} else {
+				this._nameEditableTextLabel.setModelAttribute('name');
+				this._nameEditableTextLabel.setLabelPlaceholder(t('spreed', 'Room name'));
+			}
 		},
 
 		/**

js/views/editabletextlabel.js

@@ -62,6 +62,10 @@
 	 * "extraClassNames", "labelTagName", "labelPlaceholder", "inputMaxLength",
 	 * "inputPlaceholder" and "buttonTitle" can be used to customize some
 	 * elements of the view.
+	 *
+	 * After initialization, and once the view has been rendered, the
+	 * "modelAttribute" and "labelPlaceholder" options can be updated using the
+	 * "setModelAttribute" and "setLabelPlaceholder" methods.
 	 */
 	var EditableTextLabel = Marionette.View.extend({
 
@@ -114,11 +118,38 @@
 		},
 
 		initialize: function(options) {
-			this.mergeOptions(options, ['model', 'modelAttribute', 'modelSaveOptions']);
+			this.mergeOptions(options, ['model', 'modelAttribute', 'modelSaveOptions', 'labelPlaceholder']);
 
 			this._editionEnabled = true;
 		},
 
+		setModelAttribute: function(modelAttribute) {
+			if (this.modelAttribute === modelAttribute) {
+				return;
+			}
+
+			var modelEvents = _.result(this, 'modelEvents');
+			this.unbindEvents(this.model, modelEvents);
+
+			this.modelAttribute = modelAttribute;
+
+			modelEvents = _.result(this, 'modelEvents');
+			this.bindEvents(this.model, modelEvents);
+
+			this.updateText();
+			this.hideInput();
+		},
+
+		setLabelPlaceholder: function(labelPlaceholder) {
+			if (this.labelPlaceholder === labelPlaceholder) {
+				return;
+			}
+
+			this.labelPlaceholder = labelPlaceholder;
+
+			this.updateText();
+		},
+
 		enableEdition: function() {
 			if (this._editionEnabled) {
 				return;
@@ -140,7 +171,7 @@
 		},
 
 		_getText: function() {
-			return this.model.get(this.modelAttribute) || this.getOption('labelPlaceholder') || '';
+			return this.model.get(this.modelAttribute) || this.labelPlaceholder || '';
 		},
 
 		updateText: function() {