Make label and colorpicker types work

atom/browser/api/atom_api_window.cc

@@ -282,8 +282,8 @@ void Window::OnExecuteWindowsCommand(const std::string& command_name) {
   Emit("app-command", command_name);
 }
 
-void Window::OnTouchBarItemResult(const std::string& item_type, const std::string& item_id) {
+void Window::OnTouchBarItemResult(const std::string& item_type, const std::vector<std::string>& args) {
-  Emit("-touch-bar-interaction", item_type, item_id);
+  Emit("-touch-bar-interaction", item_type, args);
 }
 
 #if defined(OS_WIN)

atom/browser/api/atom_api_window.h

@@ -85,7 +85,7 @@ class Window : public mate::TrackableObject<Window>,
   void OnRendererUnresponsive() override;
   void OnRendererResponsive() override;
   void OnExecuteWindowsCommand(const std::string& command_name) override;
-  void OnTouchBarItemResult(const std::string& item_type, const std::string& item_id) override;
+  void OnTouchBarItemResult(const std::string& item_type, const std::vector<std::string>& args) override;
 
   #if defined(OS_WIN)
   void OnWindowMessage(UINT message, WPARAM w_param, LPARAM l_param) override;

atom/browser/native_window.cc

@@ -574,9 +574,9 @@ void NativeWindow::NotifyWindowExecuteWindowsCommand(
 
 void NativeWindow::NotifyTouchBarItemInteraction(
   const std::string& type,
-  const std::string& item_id) {
+  const std::vector<std::string>& args) {
     FOR_EACH_OBSERVER(NativeWindowObserver, observers_,
-                      OnTouchBarItemResult(type, item_id));
+                      OnTouchBarItemResult(type, args));
   }
 
 #if defined(OS_WIN)

atom/browser/native_window.h

@@ -233,7 +233,7 @@ class NativeWindow : public base::SupportsUserData,
   void NotifyWindowEnterHtmlFullScreen();
   void NotifyWindowLeaveHtmlFullScreen();
   void NotifyWindowExecuteWindowsCommand(const std::string& command);
-  void NotifyTouchBarItemInteraction(const std::string& item_type, const std::string& item_id);
+  void NotifyTouchBarItemInteraction(const std::string& item_type, const std::vector<std::string>& args);
 
   #if defined(OS_WIN)
   void NotifyWindowMessage(UINT message, WPARAM w_param, LPARAM l_param);

atom/browser/native_window_mac.mm

@@ -361,7 +361,7 @@ bool ScopedDisableResize::disable_resize_ = false;
 
 @implementation AtomNSWindow
   NSMutableArray<NSTouchBarItemIdentifier>* bar_items_ = [[NSMutableArray alloc] init];
-  std::map<std::string, std::string> button_labels;
+  std::map<std::string, std::string> item_labels;
 
 - (void)setShell:(atom::NativeWindowMac*)shell {
   shell_ = shell;
@@ -380,8 +380,8 @@ bool ScopedDisableResize::disable_resize_ = false;
 - (void)reloadTouchBar {
   bar_items_ = [[NSMutableArray alloc] init];
   std::vector<mate::Dictionary> items = shell_->GetTouchBarItems();
-  std::map<std::string, std::string> new_button_labels;
+  std::map<std::string, std::string> new_labels;
-  button_labels = new_button_labels;
+  item_labels = new_labels;
 
   NSLog(@"reload");
   for (mate::Dictionary &item : items ) {
@@ -395,8 +395,16 @@ bool ScopedDisableResize::disable_resize_ = false;
         std::string label;
         if (item.Get("label", &label)) {
           [bar_items_ addObject:[NSString stringWithFormat:@"%@%@", ButtonIdentifier, [NSString stringWithUTF8String:item_id.c_str()]]];
-          button_labels.insert(make_pair(item_id, label));
+          item_labels.insert(make_pair(item_id, label));
         }
+      } else if (type == "label") {
+        std::string label;
+        if (item.Get("label", &label)) {
+          [bar_items_ addObject:[NSString stringWithFormat:@"%@%@", LabelIdentifier, [NSString stringWithUTF8String:item_id.c_str()]]];
+          item_labels.insert(make_pair(item_id, label));
+        }
+      } else if (type == "colorpicker") {
+        [bar_items_ addObject:[NSString stringWithFormat:@"%@%@", ColorPickerIdentifier, [NSString stringWithUTF8String:item_id.c_str()]]];
       }
     }
   }
@@ -424,13 +432,17 @@ bool ScopedDisableResize::disable_resize_ = false;
 - (void)buttonAction:(id)sender {
     NSString* item_id = [NSString stringWithFormat:@"com.electron.tb.button.%d", (int)((NSButton *)sender).tag];
     NSLog(@"Button with ID: '%@' was pressed", item_id);
-    shell_->NotifyTouchBarItemInteraction("button", std::string([item_id UTF8String]));
+    shell_->NotifyTouchBarItemInteraction("button", { std::string([item_id UTF8String]) });
 }
 
 - (void)colorPickerAction:(id)sender {
     NSString* item_id = ((NSColorPickerTouchBarItem *)sender).identifier;
-    NSLog(@"ColorPicker with ID: '%@' was updated with color '%@'", item_id, ((NSColorPickerTouchBarItem *)sender).color);
+    NSColor* color = ((NSColorPickerTouchBarItem *)sender).color;
-    shell_->NotifyTouchBarItemInteraction("color_picker", std::string([item_id UTF8String]));
+    NSString* colorHexString = [NSString stringWithFormat:@"#%02X%02X%02X",
+      (int) (color.redComponent * 0xFF), (int) (color.greenComponent * 0xFF),
+      (int) (color.blueComponent * 0xFF)];
+    NSLog(@"ColorPicker with ID: '%@' was updated with color '%@'", item_id, colorHexString);
+    shell_->NotifyTouchBarItemInteraction("color_picker", { std::string([item_id UTF8String]), std::string([colorHexString UTF8String]) });
 }
 
 static NSTouchBarItemIdentifier ButtonIdentifier = @"com.electron.tb.button.";
@@ -439,19 +451,31 @@ static NSTouchBarItemIdentifier ColorPickerIdentifier = @"com.electron.tb.colorp
 static NSTouchBarItemIdentifier LabelIdentifier = @"com.electron.tb.label.";
 // static NSTouchBarItemIdentifier SliderIdentifier = @"com.electron.tb.slider.";
 
+- (NSString*)idFromIdentifier:(NSString*)identifier withPrefix:(NSString*)prefix {
+  NSString *idCopy = [identifier copy];
+  idCopy = [identifier substringFromIndex:[prefix length]];
+  return idCopy;
+}
+
+- (bool)hasLabel:(NSString*)id {
+  return item_labels.find(std::string([id UTF8String])) != item_labels.end();
+}
+
 - (nullable NSTouchBarItem *)touchBar:(NSTouchBar *)touchBar makeItemForIdentifier:(NSTouchBarItemIdentifier)identifier {
   if ([identifier hasPrefix:ButtonIdentifier]) {
-    NSString *idCopy = [identifier copy];
+    NSString* id = [self idFromIdentifier:identifier withPrefix:ButtonIdentifier];
-    idCopy = [identifier substringFromIndex:[ButtonIdentifier length]];
+    if (![self hasLabel:id]) return nil;
-    NSButton *theButton = [NSButton buttonWithTitle:[NSString stringWithUTF8String:button_labels[std::string([idCopy UTF8String])].c_str()] target:self action:@selector(buttonAction:)];
+    NSButton *theButton = [NSButton buttonWithTitle:[NSString stringWithUTF8String:item_labels[std::string([id UTF8String])].c_str()] target:self action:@selector(buttonAction:)];
-    theButton.tag = [idCopy floatValue];
+    theButton.tag = [id floatValue];
 
     NSCustomTouchBarItem *customItem = [[NSCustomTouchBarItem alloc] initWithIdentifier:identifier];
     customItem.view = theButton;
 
     return customItem;
   } else if ([identifier hasPrefix:LabelIdentifier]) {
-    NSTextField *theLabel = [NSTextField labelWithString:@"Hello From Electron"];
+    NSString* id = [self idFromIdentifier:identifier withPrefix:LabelIdentifier];
+    if (![self hasLabel:id]) return nil;
+    NSTextField *theLabel = [NSTextField labelWithString:[NSString stringWithUTF8String:item_labels[std::string([id UTF8String])].c_str()]];
 
     NSCustomTouchBarItem *customItem = [[NSCustomTouchBarItem alloc] initWithIdentifier:identifier];
     customItem.view = theLabel;

atom/browser/native_window_observer.h

@@ -70,7 +70,7 @@ class NativeWindowObserver {
   virtual void OnWindowLeaveFullScreen() {}
   virtual void OnWindowEnterHtmlFullScreen() {}
   virtual void OnWindowLeaveHtmlFullScreen() {}
-  virtual void OnTouchBarItemResult(const std::string& item_type, const std::string& item_id) {}
+  virtual void OnTouchBarItemResult(const std::string& item_type, const std::vector<std::string>& args) {}
 
   // Called when window message received
   #if defined(OS_WIN)

default_app/default_app.js

@@ -31,6 +31,14 @@ exports.load = (appUrl) => {
         click: () => {
           console.log('Hello World Clicked')
         }
+      }),
+      new (TouchBar.Label)({
+        label: 'This is a Label'
+      }),
+      new (TouchBar.ColorPicker)({
+        change: (...args) => {
+          console.log('Color was changed', ...args)
+        }
       })
     ]))
   })

lib/browser/api/touch-bar.js

@@ -23,8 +23,9 @@ class TouchBar {
 let item_id_incrementor = 1
 const item_event_handlers = {}
 
-TouchBar._event = (id, ...args) => {
+TouchBar._event = (eventArgs) => {
-  const id_parts = id.split('.')
+  const args = eventArgs.slice(1)
+  const id_parts = eventArgs[0].split('.')
   const item_id = id_parts[id_parts.length - 1]
   if (item_event_handlers[item_id]) item_event_handlers[item_id](...args)
 }
@@ -39,7 +40,6 @@ class TouchBarItem {
       get: () => mConfig
     })
     this.config.id = `${this.config.id || this.id}`;
-    this.config.type = 'button';
     if (typeof this.config !== 'object' || this.config === null) {
       throw new Error('Provided config must be a non-null object')
     }
@@ -53,7 +53,7 @@ class TouchBarItem {
 TouchBar.Button = class TouchBarButton extends TouchBarItem {
   constructor (config) {
     super(config)
-    this.config.type = 'button';
+    this.config.type = 'button'
     const click = config.click
     if (typeof click === 'function') {
       item_event_handlers[`${this.id}`] = click
@@ -64,22 +64,27 @@ TouchBar.Button = class TouchBarButton extends TouchBarItem {
 TouchBar.ColorPicker = class TouchBarColorPicker extends TouchBarItem {
   constructor (config) {
     super(config)
-    this.config.type = 'colorpicker';
+    this.config.type = 'colorpicker'
-    const change = config.change
+    const change = this.config.change
     if (typeof change === 'function') {
       item_event_handlers[`${this.id}`] = change
     }
   }
 }
 
-TouchBar.Label = class TouchBarLabel extends TouchBarItem {}
+TouchBar.Label = class TouchBarLabel extends TouchBarItem {
+  constructor (config) {
+    super(config)
+    this.config.type = 'label'
+  }
+}
 
 TouchBar.List = class TouchBarList extends TouchBarItem {}
 
 TouchBar.Slider = class TouchBarSlider extends TouchBarItem {
   constructor (config) {
     super(config)
-    const change = config.change
+    const change = this.config.change
     if (typeof change === 'function') {
       item_event_handlers[this.id] = change
     }