Merge pull request #186 from mathoudebine/feature/allow-drawing-over-theme-editor

Allow drawing zones and click to get coordinates for the theme

Author: mathoudebine

theme-editor.py

@@ -52,6 +52,7 @@
 from PIL import ImageTk
 
 import library.log
+
 library.log.logger.setLevel(logging.NOTSET)  # Disable system monitor logging for the editor
 
 # Create a logger for the editor
@@ -60,12 +61,15 @@
 
 # Hardcode specific configuration for theme editor
 from library import config
+
 config.CONFIG_DATA["display"]["REVISION"] = "SIMU"  # For theme editor, always use simulated LCD
 config.CONFIG_DATA["config"]["HW_SENSORS"] = "STATIC"  # For theme editor always use stub data
 config.CONFIG_DATA["config"]["THEME"] = sys.argv[1]  # Theme is given as argument
 
 from library.display import display  # Only import display after hardcoded config is set
 
+RGB_LED_MARGIN = 12
+
 
 def refresh_theme():
     config.load_theme()
@@ -92,6 +96,20 @@ def refresh_theme():
     stats.Date.stats()
 
 
+def get_width(self) -> int:
+    if config.THEME_DATA["display"]["DISPLAY_ORIENTATION"] == 'portrait':
+        return config.CONFIG_DATA["display"]["DISPLAY_WIDTH"]
+    else:
+        return config.CONFIG_DATA["display"]["DISPLAY_HEIGHT"]
+
+
+def get_height(self) -> int:
+    if config.THEME_DATA["display"]["DISPLAY_ORIENTATION"] == 'portrait':
+        return config.CONFIG_DATA["display"]["DISPLAY_HEIGHT"]
+    else:
+        return config.CONFIG_DATA["display"]["DISPLAY_WIDTH"]
+
+
 if __name__ == "__main__":
     def on_closing():
         logger.debug("Exit Theme Editor...")
@@ -101,6 +119,78 @@ def on_closing():
             os._exit(0)
 
 
+    x0 = 0
+    y0 = 0
+
+
+    def draw_zone(x0, y0, x1, y1):
+        x = min(x0, x1)
+        y = min(y0, y1)
+        width = max(x0, x1) - min(x0, x1)
+        height = max(y0, y1) - min(y0, y1)
+        if width > 0 and height > 0:
+            label_zone.place(x=x + RGB_LED_MARGIN, y=y + RGB_LED_MARGIN, width=width, height=height)
+        else:
+            label_zone.place_forget()
+
+
+    def on_button1_press(event):
+        global x0, y0
+        x0, y0 = event.x, event.y
+        label_zone.place_forget()
+
+
+    def on_button1_press_and_drag(event):
+        global x0, y0
+        x1, y1 = event.x, event.y
+
+        # Do not draw zone outside of theme preview
+        if x1 < 0:
+            x1 = 0
+        elif x1 >= display.lcd.get_width():
+            x1 = display.lcd.get_width() - 1
+        if y1 < 0:
+            y1 = 0
+        elif y1 >= display.lcd.get_height():
+            y1 = display.lcd.get_height() - 1
+
+        label_coord.config(text='Drawing zone from [{},{}] to [{},{}]'.format(x0, y0, x1, y1))
+        draw_zone(x0, y0, x1, y1)
+
+
+    def on_button1_release(event):
+        global x0, y0
+        x1, y1 = event.x, event.y
+        if x1 != x0 or y1 != y0:
+            # Do not draw zone outside of theme preview
+            if x1 < 0:
+                x1 = 0
+            elif x1 >= display.lcd.get_width():
+                x1 = display.lcd.get_width() - 1
+            if y1 < 0:
+                y1 = 0
+            elif y1 >= display.lcd.get_height():
+                y1 = display.lcd.get_height() - 1
+
+            # Display drawn zone and coordinates
+            draw_zone(x0, y0, x1, y1)
+
+            # Display relative zone coordinates, to set in theme
+            x = min(x0, x1)
+            y = min(y0, y1)
+            width = max(x0, x1) - min(x0, x1)
+            height = max(y0, y1) - min(y0, y1)
+            label_coord.config(text='Zone: X={}, Y={}, width={} height={}'.format(x, y, width, height))
+        else:
+            # Display click coordinates
+            label_coord.config(
+                text='X={}, Y={} (click and drag to draw a zone)'.format(x0, y0, abs(x1 - x0), abs(y1 - y0)))
+
+
+    def on_zone_click(event):
+        label_zone.place_forget()
+
+
     # Apply system locale to this program
     locale.setlocale(locale.LC_ALL, '')
 
@@ -129,9 +219,11 @@ def on_closing():
     viewer = tkinter.Tk()
     viewer.title("Turing SysMon Theme Editor")
     viewer.iconphoto(True, tkinter.PhotoImage(file="res/icons/monitor-icon-17865/64.png"))
-    viewer.geometry(str(display.lcd.get_width() + 24) + "x" + str(display.lcd.get_height() + 44))
+    viewer.geometry(str(display.lcd.get_width() + 2 * RGB_LED_MARGIN) + "x" + str(
+        display.lcd.get_height() + 2 * RGB_LED_MARGIN + 40))
     viewer.protocol("WM_DELETE_WINDOW", on_closing)
     viewer.call('wm', 'attributes', '.', '-topmost', '1')  # Preview window always on top
+    viewer.config(cursor="cross")
 
     # Display RGB backplate LEDs color as background color
     led_color = config.THEME_DATA['display'].get("DISPLAY_RGB_LED", (255, 255, 255))
@@ -141,12 +233,24 @@ def on_closing():
 
     # Display preview in the window
     display_image = ImageTk.PhotoImage(display.lcd.screen_image)
-    viewer_picture = tkinter.Label(viewer, image=display_image)
-    viewer_picture.place(x=10, y=10)
+    viewer_picture = tkinter.Label(viewer, image=display_image, borderwidth=0)
+    viewer_picture.place(x=RGB_LED_MARGIN, y=RGB_LED_MARGIN)
+
+    # Allow to click on preview to show coordinates and draw zones
+    viewer_picture.bind("<ButtonPress-1>", on_button1_press)
+    viewer_picture.bind("<B1-Motion>", on_button1_press_and_drag)
+    viewer_picture.bind("<ButtonRelease-1>", on_button1_release)
+
+    label_coord = tkinter.Label(viewer, text="Click or draw a zone to show coordinates")
+    label_coord.place(x=0, y=display.lcd.get_height() + 2 * RGB_LED_MARGIN,
+                      width=display.lcd.get_width() + 2 * RGB_LED_MARGIN)
 
-    label = tkinter.Label(viewer, text="This preview will reload when theme file is updated")
-    label.place(x=0, y=display.lcd.get_height() + 24, width=display.lcd.get_width() + 24)
+    label_info = tkinter.Label(viewer, text="This preview will reload when theme file is updated")
+    label_info.place(x=0, y=display.lcd.get_height() + 2 * RGB_LED_MARGIN + 20,
+                     width=display.lcd.get_width() + 2 * RGB_LED_MARGIN)
 
+    label_zone = tkinter.Label(viewer, bg='#%02x%02x%02x' % tuple(map(lambda x: 255 - x, led_color)))
+    label_zone.bind("<ButtonRelease-1>", on_zone_click)
     viewer.update()
 
     logger.debug("You can now edit the theme file in the editor. When you save your changes, the preview window will "
@@ -170,6 +274,7 @@ def on_closing():
             if isinstance(led_color, str):
                 led_color = tuple(map(int, led_color.split(', ')))
             viewer.configure(bg='#%02x%02x%02x' % led_color)
+            label_zone.configure(bg='#%02x%02x%02x' % tuple(map(lambda x: 255 - x, led_color)))
 
         # Regularly update the viewer window even if content unchanged
         viewer.update()