From a0bc4d3a39c2b68499db84878cc3e10a7cab3296 Mon Sep 17 00:00:00 2001
From: Harvey Zack <laozhaochaguan@gmail.com>
Date: Thu, 8 Nov 2018 09:09:44 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E5=9B=9E=E8=B0=83?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/artplayer/src/contextmenu/index.js |  8 +++++---
 packages/artplayer/src/controls/index.js    |  5 +++--
 packages/artplayer/src/setting/index.js     | 10 +++++-----
 3 files changed, 13 insertions(+), 10 deletions(-)

diff --git a/packages/artplayer/src/contextmenu/index.js b/packages/artplayer/src/contextmenu/index.js
index dd9e6c4d1..e3ad91e40 100644
--- a/packages/artplayer/src/contextmenu/index.js
+++ b/packages/artplayer/src/contextmenu/index.js
@@ -41,13 +41,14 @@ export default class Contextmenu {
     });
   }
 
-  add(item) {
+  add(item, callback) {
     if (!item.disable) {
       const { refs, events: { proxy } } = this.art;
       id++;
+      const name = item.name || `menu${id}`;
       const menu = typeof item === 'function' ? item(this.art) : item;
       const $menu = document.createElement('div');
-      $menu.setAttribute('class', `art-menu art-menu-${menu.name || id}`);
+      $menu.setAttribute('class', `art-menu art-menu-${name || id}`);
       append($menu, menu.html);
       setStyles($menu, menu.style || {});
       if (menu.click) {
@@ -57,7 +58,8 @@ export default class Contextmenu {
           this.art.emit('contextmenu:click', $menu);
         });
       }
-      this[`$${menu.name || id}`] = $menu;
+      callback && callback($menu);
+      this[name] = $menu;
       insertByIndex(refs.$contextmenu, $menu, menu.index || id);
     }
   }
diff --git a/packages/artplayer/src/controls/index.js b/packages/artplayer/src/controls/index.js
index dd51b90f0..d9a31b37e 100644
--- a/packages/artplayer/src/controls/index.js
+++ b/packages/artplayer/src/controls/index.js
@@ -112,15 +112,16 @@ export default class Controls {
     });
   }
 
-  add(control) {
+  add(control, callback) {
     const { option } = control;
     if (option && !option.disable) {
       id++;
-      const name = option.name || control.constructor.name.toLowerCase() || `control${id}`;
+      const name = option.name || `control${id}`;
       const $control = document.createElement('div');
       $control.setAttribute('class', `art-control art-control-${name}`);
       this.mount(option.position, $control, option.index || id);
       control.apply && control.apply(this.art, $control);
+      callback && callback($control);
       this[name] = control;
     }
   }
diff --git a/packages/artplayer/src/setting/index.js b/packages/artplayer/src/setting/index.js
index 34c79f0e9..5ff46eb1b 100644
--- a/packages/artplayer/src/setting/index.js
+++ b/packages/artplayer/src/setting/index.js
@@ -27,19 +27,19 @@ export default class Setting {
     }));
   }
 
-  add(setting) {
-    const { refs } = this.art;
+  add(setting, callback) {
+    const { refs, i18n } = this.art;
     const { option } = setting;
     if (option && !option.disable) {
       id++;
-      const name = option.name || setting.constructor.name.toLowerCase() || `setting${id}`;
+      const name = option.name || `setting${id}`;
       const title = option.title || name;
       const $setting = document.createElement('div');
       $setting.setAttribute('class', `art-setting art-setting-${name}`);
-      $setting.dataset.settingIndex = option.index || id;
-      append($setting, `<div class="art-setting-header">${this.art.i18n.get(title)}</div>`);
+      append($setting, `<div class="art-setting-header">${i18n.get(title)}</div>`);
       append($setting, '<div class="art-setting-body"></div>');
       setting.apply && setting.apply(this.art, $setting);
+      callback && callback($setting);
       this[name] = $setting;
       insertByIndex(refs.$settingBody, $setting, option.index || id);
     }