Merge branch 'zj-create-mattermost-team' into 'master'

Create Mattermost Team from GitLab

Closes #23964

See merge request !8746

4 files changed, 56 insertions, 3 deletions

diff --git a/app/assets/javascripts/behaviors/bind_in_out.js b/app/assets/javascripts/behaviors/bind_in_out.js
new file mode 100644
index 00000000000..886f127b06b
--- /dev/null
+++ b/app/assets/javascripts/behaviors/bind_in_out.js
@@ -0,0 +1,47 @@
+class BindInOut {
+  constructor(bindIn, bindOut) {
+    this.in = bindIn;
+    this.out = bindOut;
+
+    this.eventWrapper = {};
+    this.eventType = /(INPUT|TEXTAREA)/.test(bindIn.tagName) ? 'keyup' : 'change';
+  }
+
+  addEvents() {
+    this.eventWrapper.updateOut = this.updateOut.bind(this);
+
+    this.in.addEventListener(this.eventType, this.eventWrapper.updateOut);
+
+    return this;
+  }
+
+  updateOut() {
+    this.out.textContent = this.in.value;
+
+    return this;
+  }
+
+  removeEvents() {
+    this.in.removeEventListener(this.eventType, this.eventWrapper.updateOut);
+
+    return this;
+  }
+
+  static initAll() {
+    const ins = document.querySelectorAll('*[data-bind-in]');
+
+    return [].map.call(ins, anIn => BindInOut.init(anIn));
+  }
+
+  static init(anIn, anOut) {
+    const out = anOut || document.querySelector(`*[data-bind-out="${anIn.dataset.bindIn}"]`);
+
+    if (!out) return null;
+
+    const bindInOut = new BindInOut(anIn, out);
+
+    return bindInOut.addEvents().updateOut();
+  }
+}
+
+export default BindInOut;
diff --git a/app/assets/javascripts/behaviors/toggler_behavior.js b/app/assets/javascripts/behaviors/toggler_behavior.js
index a7181904ac9..0726c6c9636 100644
--- a/app/assets/javascripts/behaviors/toggler_behavior.js
+++ b/app/assets/javascripts/behaviors/toggler_behavior.js
@@ -21,8 +21,7 @@
     //   %a.js-toggle-button
     //   %div.js-toggle-content
     //
-    $('body').on('click', '.js-toggle-button', function(e) {
-      e.preventDefault();
+    $('body').on('click', '.js-toggle-button', function() {
       toggleContainer($(this).closest('.js-toggle-container'));
     });
 
diff --git a/app/assets/javascripts/dispatcher.js b/app/assets/javascripts/dispatcher.js
index ef5785b5532..31f10f89245 100644
--- a/app/assets/javascripts/dispatcher.js
+++ b/app/assets/javascripts/dispatcher.js
@@ -35,6 +35,7 @@
 /* global Labels */
 /* global Shortcuts */
 
+import BindInOut from './behaviors/bind_in_out';
 import GroupsList from './groups_list';
 import ProjectsList from './projects_list';
 
@@ -229,9 +230,14 @@ const UserCallout = require('./user_callout');
           new UsersSelect();
           break;
         case 'groups:new':
+        case 'admin:groups:new':
+        case 'groups:create':
+        case 'admin:groups:create':
+          BindInOut.initAll();
+        case 'groups:new':
+        case 'admin:groups:new':
         case 'groups:edit':
         case 'admin:groups:edit':
-        case 'admin:groups:new':
           new GroupAvatar();
           break;
         case 'projects:tree:show':
diff --git a/app/assets/javascripts/main.js b/app/assets/javascripts/main.js
index 798553c16ac..6ac659fd290 100644
--- a/app/assets/javascripts/main.js
+++ b/app/assets/javascripts/main.js
@@ -41,6 +41,7 @@ require('./behaviors/details_behavior');
 require('./behaviors/quick_submit');
 require('./behaviors/requires_input');
 require('./behaviors/toggler_behavior');
+require('./behaviors/bind_in_out');
 
 // blob
 require('./blob/blob_ci_yaml');