[apps/shared] Add toggle buttons in Graph view

Change-Id: I7548d11fb114b2605ce34d3bda0776277b79ff9d

escher/Makefile

@@ -7,6 +7,7 @@ escher_src += $(addprefix escher/src/,\
   bordered.cpp \
   buffer_text_view.cpp \
   button.cpp \
+  button_state.cpp \
   button_row_controller.cpp \
   chevron_view.cpp \
   clipboard.cpp \
@@ -81,6 +82,8 @@ escher_src += $(addprefix escher/src/,\
   text_view.cpp \
   tiled_view.cpp \
   timer.cpp \
+  toggleable_dot_view.cpp \
+  toggleable_view.cpp \
   toolbox.cpp \
   transparent_view.cpp \
   view.cpp \

escher/include/escher/button.h

@@ -21,13 +21,13 @@ public:
   KDSize minimalSizeForOptimalDisplay() const override;
 protected:
   MessageTextView m_messageTextView;
+  void layoutSubviews(bool force = false) override;
 private:
   constexpr static KDCoordinate k_verticalMargin = 5;
   constexpr static KDCoordinate k_horizontalMarginSmall = 10;
   constexpr static KDCoordinate k_horizontalMarginLarge = 20;
   int numberOfSubviews() const override;
   View * subviewAtIndex(int index) override;
-  void layoutSubviews(bool force = false) override;
   Invocation m_invocation;
   const KDFont * m_font;
 };

escher/include/escher/button_state.h

@@ -0,0 +1,24 @@
+#ifndef ESCHER_BUTTON_STATE_H
+#define ESCHER_BUTTON_STATE_H
+
+#include <escher/button.h>
+#include <escher/toggleable_dot_view.h>
+
+class ButtonState : public Button {
+public:
+  using Button::Button;
+  void setState(bool state) { m_stateView.setState(state); }
+  KDSize minimalSizeForOptimalDisplay() const override;
+  void drawRect(KDContext * ctx, KDRect rect) const override;
+private:
+  // Dot right margin.
+  constexpr static KDCoordinate k_stateMargin = 9;
+  // Dot vertical position offset.
+  constexpr static KDCoordinate k_verticalOffset = 5;
+  int numberOfSubviews() const override { return 2; }
+  View * subviewAtIndex(int index) override;
+  void layoutSubviews(bool force = false) override;
+  ToggleableDotView m_stateView;
+};
+
+#endif

escher/include/escher/switch_view.h

@@ -1,22 +1,21 @@
 #ifndef ESCHER_SWITCH_VIEW_H
 #define ESCHER_SWITCH_VIEW_H
 
-#include <escher/transparent_view.h>
+#include <escher/toggleable_view.h>
+#include <escher/palette.h>
 
-class SwitchView : public TransparentView {
+
+class SwitchView final : public ToggleableView {
 public:
-  SwitchView();
-  bool state();
-  void setState(bool state);
-  void drawRect(KDContext * ctx, KDRect rect) const override;
-  KDSize minimalSizeForOptimalDisplay() const override;
+  using ToggleableView::ToggleableView;
   /* k_switchHeight and k_switchWidth are the dimensions of the switch
    * (including the outline of the switch). */
   constexpr static KDCoordinate k_onOffSize = 12;
   constexpr static KDCoordinate k_switchHeight = 12;
   constexpr static KDCoordinate k_switchWidth = 22;
+  KDSize minimalSizeForOptimalDisplay() const override { return KDSize(k_switchWidth, k_switchHeight); }
 private:
-  bool m_state;
+  void drawRect(KDContext * ctx, KDRect rect) const override;
 };
 
 #endif

escher/include/escher/toggleable_dot_view.h

@@ -0,0 +1,16 @@
+#ifndef ESCHER_TOGGLEABLE_DOT_VIEW_H
+#define ESCHER_TOGGLEABLE_DOT_VIEW_H
+
+#include <escher/toggleable_view.h>
+
+class ToggleableDotView final : public ToggleableView {
+public:
+  using ToggleableView::ToggleableView;
+  /* k_dotSize is the dimensions of the toggle dot */
+  constexpr static KDCoordinate k_dotSize = 8;
+  KDSize minimalSizeForOptimalDisplay() const override { return KDSize(k_dotSize, k_dotSize); }
+private:
+  void drawRect(KDContext * ctx, KDRect rect) const override;
+};
+
+#endif

escher/include/escher/toggleable_view.h

@@ -0,0 +1,15 @@
+#ifndef ESCHER_TOGGLEABLE_VIEW_H
+#define ESCHER_TOGGLEABLE_VIEW_H
+
+#include <escher/transparent_view.h>
+
+class ToggleableView : public TransparentView {
+public:
+  ToggleableView() : m_state(true) {}
+  bool state() { return m_state; }
+  void setState(bool state);
+protected:
+  bool m_state;
+};
+
+#endif

escher/src/button_state.cpp

@@ -0,0 +1,35 @@
+#include <escher/button_state.h>
+#include <assert.h>
+#include <algorithm>
+
+View * ButtonState::subviewAtIndex(int index) {
+  assert(index >= 0 && index < 2);
+  if (index == 0) {
+    return &m_messageTextView;
+  }
+  return &m_stateView;
+}
+
+void ButtonState::layoutSubviews(bool force) {
+  KDSize textSize = Button::minimalSizeForOptimalDisplay();
+  KDRect textRect = KDRect(0, 0, textSize.width(), bounds().height());
+  // State view will be vertically centered and aligned on the left
+  KDSize stateSize = m_stateView.minimalSizeForOptimalDisplay();
+  KDRect stateRect = KDRect(textSize.width(), k_verticalOffset, stateSize.width(), stateSize.height());
+
+  m_messageTextView.setFrame(textRect, force);
+  m_stateView.setFrame(stateRect, force);
+}
+
+void ButtonState::drawRect(KDContext * ctx, KDRect rect) const {
+  KDColor backColor = isHighlighted() ? highlightedBackgroundColor() : KDColorWhite;
+  ctx->fillRect(bounds(), backColor);
+}
+
+KDSize ButtonState::minimalSizeForOptimalDisplay() const {
+  KDSize textSize = Button::minimalSizeForOptimalDisplay();
+  KDSize stateSize = m_stateView.minimalSizeForOptimalDisplay();
+  return KDSize(
+    textSize.width() + stateSize.width() + k_stateMargin,
+    std::max(textSize.height(), stateSize.height()));
+}

escher/src/switch_view.cpp

@@ -1,5 +1,4 @@
 #include <escher/switch_view.h>
-#include <escher/palette.h>
 
 const uint8_t switchMask[SwitchView::k_switchHeight][SwitchView::k_switchWidth] = {
   {0xFF, 0xFF, 0xE1, 0x0C, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x0C, 0xE1, 0xFF, 0xFF},
@@ -32,37 +31,28 @@ const uint8_t onOffMask[SwitchView::k_onOffSize][SwitchView::k_onOffSize] = {
   {0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF},
 };
 
-SwitchView::SwitchView() :
-m_state(true)
-{
-}
-
-bool SwitchView::state() {
-  return m_state;
-}
-
-void SwitchView::setState(bool state) {
-  m_state = state;
-  markRectAsDirty(bounds());
-}
-
 void SwitchView::drawRect(KDContext * ctx, KDRect rect) const {
-  /* Draw the switch aligned on the right of the view and vertically centered.
+  /* Draw the view aligned on the right of the view and vertically centered
    * The heightCenter is the coordinate of the vertical middle of the view. That
-   * way, (heightCenter-switchHalfHeight) indicates the top the switch. */
+   * way, (heightCenter-halfHeight) indicates the top of the StateView. */
   KDCoordinate width = bounds().width();
-  KDCoordinate heightCenter =  bounds().height()/2;
-  KDCoordinate switchHalfHeight = k_switchHeight/2;
-  KDColor switchWorkingBuffer[SwitchView::k_switchWidth*SwitchView::k_switchHeight];
+  KDCoordinate heightCenter =  bounds().height() / 2;
+  KDCoordinate halfHeight = k_switchHeight / 2;
+  KDColor workingBuffer[k_switchWidth * k_switchHeight];
+
+  KDRect frame(width - k_switchWidth, heightCenter - halfHeight, k_switchWidth, k_switchHeight);
+  ctx->blendRectWithMask(
+    frame,
+    m_state ? Palette::YellowDark : Palette::GrayDark,
+    reinterpret_cast<const uint8_t *>(switchMask),
+    workingBuffer);
+
 
-  KDColor mainColor = m_state ? Palette::YellowDark : Palette::GrayDark;
-  KDRect frame(width - k_switchWidth, heightCenter -switchHalfHeight, k_switchWidth, k_switchHeight);
-  ctx->blendRectWithMask(frame, mainColor, (const uint8_t *)switchMask, switchWorkingBuffer);
   KDCoordinate onOffX = width - (m_state ? k_onOffSize : k_switchWidth);
-  KDRect onOffFrame(onOffX, heightCenter -switchHalfHeight, k_onOffSize, k_onOffSize);
-  ctx->blendRectWithMask(onOffFrame, KDColorWhite, (const uint8_t *)onOffMask, switchWorkingBuffer);
-}
-
-KDSize SwitchView::minimalSizeForOptimalDisplay() const {
-  return KDSize(k_switchWidth, k_switchHeight);
-}
+  KDRect onOffFrame(onOffX, heightCenter - halfHeight, k_onOffSize, k_onOffSize);
+  ctx->blendRectWithMask(
+    onOffFrame,
+    KDColorWhite,
+    reinterpret_cast<const uint8_t *>(onOffMask),
+    workingBuffer);
+}

escher/src/toggleable_dot_view.cpp

@@ -0,0 +1,41 @@
+#include <escher/toggleable_dot_view.h>
+#include <escher/palette.h>
+
+const uint8_t MediumDotMask[ToggleableDotView::k_dotSize][ToggleableDotView::k_dotSize] = {
+  {0xFF, 0xDB, 0x53, 0x0F, 0x0F, 0x53, 0xDB, 0xFF},
+  {0xD8, 0x10, 0x00, 0x00, 0x00, 0x00, 0x10, 0xD8},
+  {0x53, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x53},
+  {0x0F, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x0C},
+  {0x0F, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x0C},
+  {0x53, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x53},
+  {0xD7, 0x10, 0x00, 0x00, 0x00, 0x00, 0x10, 0xD7},
+  {0xFF, 0xD8, 0x53, 0x0C, 0x0C, 0x53, 0xD8, 0xFF},
+};
+
+const uint8_t MediumShallowDotMask[ToggleableDotView::k_dotSize][ToggleableDotView::k_dotSize] = {
+  {0xFF, 0xDB, 0x53, 0x0F, 0x0F, 0x53, 0xDB, 0xFF},
+  {0xD8, 0x17, 0x90, 0xEC, 0xEC, 0x90, 0x17, 0xD8},
+  {0x53, 0x90, 0xFF, 0xFF, 0xFF, 0xFF, 0x88, 0x53},
+  {0x0F, 0xEC, 0xFF, 0xFF, 0xFF, 0xFF, 0xEC, 0x0C},
+  {0x0F, 0xEC, 0xFF, 0xFF, 0xFF, 0xFF, 0xEC, 0x0C},
+  {0x53, 0x90, 0xFF, 0xFF, 0xFF, 0xFF, 0x88, 0x53},
+  {0xD7, 0x17, 0x90, 0xEF, 0xEF, 0x90, 0x17, 0xD7},
+  {0xFF, 0xD8, 0x53, 0x0C, 0x0C, 0x53, 0xD8, 0xFF},
+};
+
+void ToggleableDotView::drawRect(KDContext * ctx, KDRect rect) const {
+  /* Draw the view aligned on the right of the view and vertically centered
+   * The heightCenter is the coordinate of the vertical middle of the view. That
+   * way, (heightCenter-halfHeight) indicates the top of the StateView. */
+  KDCoordinate width = bounds().width();
+  KDCoordinate heightCenter =  bounds().height() / 2;
+  KDCoordinate halfHeight = k_dotSize / 2;
+  KDColor workingBuffer[k_dotSize * k_dotSize];
+
+  KDRect frame(width - k_dotSize, heightCenter - halfHeight, k_dotSize, k_dotSize);
+  ctx->blendRectWithMask(
+    frame,
+    m_state ? Palette::YellowDark : Palette::GrayDark,
+    m_state ? reinterpret_cast<const uint8_t *>(MediumDotMask) : reinterpret_cast<const uint8_t *>(MediumShallowDotMask),
+    workingBuffer);
+}

escher/src/toggleable_view.cpp

@@ -0,0 +1,6 @@
+#include <escher/toggleable_view.h>
+
+void ToggleableView::setState(bool state) {
+  m_state = state;
+  markRectAsDirty(bounds());
+}