Merge pull request #94 from martinRenou/add_searching

Add search plugin

Author: martinRenou

examples/searching.ipynb

@@ -0,0 +1,56 @@
+{
+ "cells": [
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {
+    "scrolled": true
+   },
+   "outputs": [],
+   "source": [
+    "import numpy as np\n",
+    "import pandas as pd\n",
+    "from ipysheet import from_dataframe\n",
+    "from ipywidgets import Text, VBox, link\n",
+    "\n",
+    "df = pd.DataFrame({'A': 1.,\n",
+    "                   'B': pd.Timestamp('20130102'),\n",
+    "                   'C': pd.Series(1, index=list(range(4)), dtype='float32'),\n",
+    "                   'D': np.array([False, True, False, False], dtype='bool'),\n",
+    "                   'E': pd.Categorical([\"test\", \"train\", \"test\", \"train\"]),\n",
+    "                   'F': 'foo'})\n",
+    "\n",
+    "df.loc[[0, 2], ['B']] = np.nan\n",
+    "\n",
+    "\n",
+    "s = from_dataframe(df)\n",
+    "\n",
+    "search_box = Text(description='Search:')\n",
+    "link((search_box, 'value'), (s, 'search_token'))\n",
+    "\n",
+    "VBox((search_box, s))"
+   ]
+  }
+ ],
+ "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.1"
+  }
+ },
+ "nbformat": 4,
+ "nbformat_minor": 2
+}

ipysheet/sheet.py

@@ -15,6 +15,7 @@ class Cell(widgets.Widget):
     _model_module = Unicode('ipysheet').tag(sync=True)
     # _view_module_version = Unicode('^0.1.0').tag(sync=True)
     _model_module_version = Unicode(semver_range_frontend).tag(sync=True)
+
     # value = Union([Bool(), Unicode(), Float(), Int()], allow_none=True, default_value=None).tag(sync=True)
     value = Any().tag(sync=True, **create_value_serializer('value'))
     row_start = CInt(3).tag(sync=True)
@@ -85,6 +86,7 @@ class Sheet(widgets.DOMWidget):
     _model_module = Unicode('ipysheet').tag(sync=True)
     _view_module_version = Unicode(semver_range_frontend).tag(sync=True)
     _model_module_version = Unicode(semver_range_frontend).tag(sync=True)
+
     rows = CInt(3).tag(sync=True)
     columns = CInt(4).tag(sync=True)
     cells = Tuple().tag(sync=True, **widgets.widget_serialization)
@@ -95,6 +97,7 @@ class Sheet(widgets.DOMWidget):
     column_width = Union([CInt(), List(CInt())], default_value=None, allow_none=True).tag(sync=True)
     column_resizing = Bool(True).tag(sync=True)
     row_resizing = Bool(True).tag(sync=True)
+    search_token = Unicode('').tag(sync=True)
 
     def __getitem__(self, item):
         '''Gets a previously created cell at row and column

js/src/sheet.ts

@@ -61,7 +61,8 @@ let SheetModel = widgets.DOMWidgetModel.extend({
             stretch_headers: 'all',
             column_width: null,
             column_resizing: true,
-            row_resizing: true
+            row_resizing: true,
+            search_token: ''
         });
     },
     initialize : function () {
@@ -274,6 +275,8 @@ let SheetView = widgets.DOMWidgetView.extend({
             this.model.on('change:column_headers change:row_headers', this._update_hot_settings, this);
             this.model.on('change:stretch_headers change:column_width', this._update_hot_settings, this);
             this.model.on('change:column_resizing change:row_resizing', this._update_hot_settings, this);
+            this.model.on('change:search_token', this._search, this);
+            this._search()
         });
     },
     processPhosphorMessage: function(msg) {
@@ -333,6 +336,7 @@ let SheetView = widgets.DOMWidgetView.extend({
             data: this._get_cell_data(),
             rowHeaders: true,
             colHeaders: true,
+            search: true,
             cells: (...args) => this._cell(...args),
             afterChange: (changes, source) => { this._on_change(changes, source); },
             afterRemoveCol: (changes, source) => { this._on_change_grid(changes, source); },
@@ -352,6 +356,17 @@ let SheetView = widgets.DOMWidgetView.extend({
             manualRowResize: this.model.get('row_resizing')
         };
     },
+    _search: function(render=true, ignore_empty_string=false) {
+        let token = this.model.get('search_token');
+        if (ignore_empty_string && token == '') {
+            return;
+        }
+
+        let res = this.hot.getPlugin('search').query(token);
+        if (render) {
+            this.hot.render();
+        }
+    },
     _get_cell_data: function() {
         return extract2d(this.model.data, 'value');
     },
@@ -434,6 +449,7 @@ let SheetView = widgets.DOMWidgetView.extend({
                 colHeaders: this.model.get('column_headers'),
                 rowHeaders: this.model.get('row_headers')
             });
+            this._search(false, true);
             this.hot.render();
             resolve()
         })

js/src/test/test_sheet.ts

@@ -230,4 +230,32 @@ describe('sheet', function() {
         expect(data[0][2].options.style.backgrouncColor, 'effective backgrouncColor should be blue').to.equal('orange');
         expect(range.get('style').color, 'but the original should not be changed').to.equal('red');
     })
+    it('should search at table creation', async function() {
+        var cell = await make_cell.apply(this, [{value: [['Hello']]}]);
+        this.sheet.set('search_token', 'Hell');
+        var view = await make_view.call(this)
+        await view._table_constructed;
+
+        expect(view.el.querySelector('td[class*="htSearchResult"]')).to.not.equal(null);
+    })
+    it('should search', async function() {
+        var cell = await make_cell.apply(this, [{value: [['Hello']]}]);
+        var view = await make_view.call(this)
+        await view._table_constructed;
+
+        expect(view.el.querySelector('td[class*="htSearchResult"]')).to.equal(null);
+        this.sheet.set('search_token', 'Hell');
+        expect(view.el.querySelector('td[class*="htSearchResult"]')).to.not.equal(null);
+    })
+    it('should search after change', async function() {
+        var cell = await make_cell.apply(this, [{value: [['Yop']]}]);
+        var view = await make_view.call(this)
+        await view._table_constructed;
+
+        this.sheet.set('search_token', 'Hell');
+        expect(view.el.querySelector('td[class*="htSearchResult"]')).to.equal(null);
+        cell.set('value', [['Hello']]);
+        await view._last_data_set;
+        expect(view.el.querySelector('td[class*="htSearchResult"]')).to.not.equal(null);
+    })
 })