A new method 'update_style' to let the user change the look and feel without modifying the structure.

Author: Zerline

examples/TossingDominos.ipynb

@@ -154,6 +154,7 @@
    "source": [
     "%%html\n",
     "<style>\n",
+    ".b0 {}\n",
     ".b1 {background-color: green}\n",
     ".b2 {background-color: blue}\n",
     ".b3 {background-color: red}\n",
@@ -186,7 +187,9 @@
     "ORDER = 12\n",
     "g, m, md = figure(ORDER)\n",
     "w = GridViewWidget(g, cell_layout=smallblyt, \n",
-    "                   cell_widget_classes=[Button0, Button1, Button2, Button3, Button4], \n",
+    "                   cell_widget_classes=[Button0, Button1, Button2, Button3, Button4],\n",
+    "                   css_classes=['b0', 'b1', 'b2', 'b3', 'b4'],\n",
+    "                   css_class_index=make_cell_widget_class_index(md, ORDER),\n",
     "                   cell_widget_class_index=make_cell_widget_class_index(md, ORDER), \n",
     "                   blank_widget_class=BlankButton)\n",
     "w"
@@ -202,7 +205,7 @@
    "source": [
     "for i in range(2,ORDER+1):\n",
     "    md = tossing(g, ORDER, i, md)\n",
-    "    w.draw(cell_widget_class_index=make_cell_widget_class_index(md, i))"
+    "    w.update_style(css_class_index=make_cell_widget_class_index(md, i))"
    ]
   }
  ],

sage_combinat_widgets/grid_view_editor.py

@@ -23,6 +23,7 @@
 """
 import re, traitlets
 from six import add_metaclass
+from abc import abstractmethod
 from copy import copy
 from sage.misc.bindable_class import BindableClass
 from sage.all import SageObject
@@ -316,12 +317,20 @@ def reset_links(self):
             lnk.unlink()
         self.links = []
 
+    @abstractmethod
+    def update_style(self):
+        """
+        Update look and feel.
+        """
+        return
+
+    @abstractmethod
     def draw(self, cast=None):
         r"""
         Build the visual representation
         and cdlink objects -- with cast function `cast`.
         """
-        pass
+        return
 
     def get_value(self):
         r"""

sage_combinat_widgets/grid_view_widget.py

@@ -116,9 +116,10 @@ class BlankCell(TextSingleton):
     """
     displaytype = text_type
 
-    def __init__(self, layout=textcell_layout, **kws):
+    def __init__(self, position=None, layout=textcell_layout, **kws):
         super(BlankCell, self).__init__()
         self.value = ''
+        self.position = position
         self.layout = layout
         self.disabled = True
         self.add_class('blankcell')
@@ -265,9 +266,9 @@ class StyledPushButton(ButtonSingleton):
     disable = None
     css_class = None
     def __init__(self, content=None, position=None, layout=buttoncell_smaller_layout, description='', placeholder=None):
-        super(StyledPushButton, self).__init__()
-        self.layout=layout
-        self.description=description
+        super(StyledPushButton, self).__init__(layout=layout, description=description, placeholder=placeholder)
+        self.content = content
+        self.position = position
         if self.disable:
             self.disabled = True
         self.add_class('gridbutton')
@@ -318,6 +319,7 @@ class GridViewWidget(GridViewEditor, VBox, ValueWidget):
 
     def __init__(self, obj, adapter=None, display_convention='en', cell_layout=None,
                  cell_widget_classes=[TextCell], cell_widget_class_index=lambda x:0,
+                 css_classes = [], css_class_index=None,
                  blank_widget_class=BlankCell, addable_widget_class=AddableTextCell):
         r"""
         Grid View Widget initialization.
@@ -365,6 +367,8 @@ def __init__(self, obj, adapter=None, display_convention='en', cell_layout=None,
         self.cell_layout = cell_layout
         self.cell_widget_classes = cell_widget_classes
         self.cell_widget_class_index = cell_widget_class_index
+        self.css_classes = css_classes
+        self.css_class_index = css_class_index or cell_widget_class_index or (lambda x:0)
         try:
             self.displaytype = cell_widget_classes[0].displaytype
         except:
@@ -449,6 +453,35 @@ def add_links(self):
             if child and hasattr(child, 'value') and traitname in self.traits():
                 self.links.append(cdlink((child, 'value'), (self, traitname), self.cast))
 
+    def update_style(self, css_classes=None, css_class_index=None):
+        r"""
+        Update look and fell -- ie CSS classes.
+        Therefore avoid redrawing if overall shape is unchanged.
+
+        TESTS ::
+
+            sage: from sage_combinat_widgets.grid_view_widget import *
+            sage: from sage.graphs.generators.families import AztecDiamondGraph
+            sage: az = AztecDiamondGraph(4)
+            sage: w = GridViewWidget(az, cell_widget_classes=[ButtonCell], blank_widget_class=BlankButton)
+            sage: w.children[1].children[3]._dom_classes
+            ('gridbutton',)
+            sage: w.update_style(css_classes=['cl0', 'cl1', 'cl2', 'cl3'], css_class_index=lambda x:x[0]%4)
+            sage: w.children[1].children[3]._dom_classes
+            ('gridbutton', 'cl1')
+        """
+        if not css_classes:
+            css_classes = self.css_classes
+        if not css_class_index:
+            css_class_index = self.cell_widget_class_index
+        for row in self.children:
+            for cell in row.children:
+                if not hasattr(cell, 'position'):
+                    continue # Do we want to change blank cells' style?
+                for cl in css_classes:
+                    cell.remove_class(cl)
+                cell.add_class(css_classes[css_class_index(cell.position)])
+
     def draw(self, cell_widget_classes=None, cell_widget_class_index=None,
              addable_widget_class=None, blank_widget_class=None):
         r"""

tests/test_update_style.ipynb

@@ -0,0 +1,71 @@
+{
+ "cells": [
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "from sage_combinat_widgets.grid_view_widget import *\n",
+    "from sage.graphs.generators.families import AztecDiamondGraph\n",
+    "az = AztecDiamondGraph(4) "
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "w = GridViewWidget(az, cell_widget_classes=[ButtonCell], blank_widget_class=BlankButton)\n",
+    "w"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "%%html\n",
+    "<style>\n",
+    ".b0 {}\n",
+    ".b1 {background-color: green}\n",
+    ".b2 {background-color: blue}\n",
+    ".b3 {background-color: red}\n",
+    ".b4 {background-color: yellow}\n",
+    "</style>"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "w.update_style(css_classes=['b0', 'b1', 'b2', 'b3', 'b4'], css_class_index=lambda x:(x[0]+x[1])%5)"
+   ]
+  }
+ ],
+ "metadata": {
+  "kernelspec": {
+   "display_name": "Python 3",
+   "language": "python",
+   "name": "python3"
+  },
+  "language_info": {
+   "codemirror_mode": {
+    "name": "ipython",
+    "version": 3
+   },
+   "file_extension": ".py",
+   "mimetype": "text/x-python",
+   "name": "python",
+   "nbconvert_exporter": "python",
+   "pygments_lexer": "ipython3",
+   "version": "3.7.3"
+  }
+ },
+ "nbformat": 4,
+ "nbformat_minor": 2
+}