commit 99f8bdb3f0acb1d02e8b8f47ddc4cd9212485008 · cduck.me/drawsvg

+35 -6

drawSvg/widgets/drawing_javascript.py

···

       11
        
                   this.model.on('change:_image', this.image_changed, this);

     

       12
        
                   this.model.on('change:_mousemove_blocked', this.block_changed,

     

       13
        
                                 this);

     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       14
        
               },

     

       15
        
               image_changed: function() {

     

       16
        
                   this.container.innerHTML = this.model.get('_image');

     
···

       19
        
                   this.register_events();

     

       20
        
               },

     

       21
        
               last_move: null,

     

       0
        
       
     

       0
        
       
     

       22
        
               block_changed: function() {

     

       23
        
                   var widget = this;

     

       24
        
                   window.setTimeout(function() {

     

       25
       -
                       if (!widget.model.get('_mousemove_blocked') && widget.last_move) {

     

       0
        
       
     

       26
        
                           widget.send_mouse_event('mousemove', widget.last_move);

     

       27
        
                       }

     

       28
        
                   }, 0);

     
···

       31
        
                   this.last_move = null;

     

       32
        
                   if (this.model.get('disable')) {

     

       33
        
                       return;

     

       34
       -
                   }

     

       35
       -
                   if (this.model.get('throttle')) {

     

       36
       -
                       this.model.set('_mousemove_blocked', true);

     

       37
       -
                       this.model.save_changes();

     

       38
        
                   }

     

       39
        
       

     

       40
        
                   this.cursor_point.x = e.clientX;

     
···

       63
        
                       relatedTargetId: e.relatedTarget ? e.relatedTarget.id : null,

     

       64
        
                   });

     

       65
        
               },

     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       66
        
               register_events: function() {

     

       67
        
                   var widget = this;

     

       68
        
                   this.svg_view.addEventListener('mousedown', function(e) {

     
···

       71
        
                   });

     

       72
        
                   this.svg_view.addEventListener('mousemove', function(e) {

     

       73
        
                       e.preventDefault();

     

       74
       -
                       if (widget.model.get('_mousemove_blocked')) {

     

       0
        
       
     

       75
        
                           widget.last_move = e;

     

       76
        
                       } else {

     

       77
        
                           widget.send_mouse_event('mousemove', e);

···

       11
        
                   this.model.on('change:_image', this.image_changed, this);

     

       12
        
                   this.model.on('change:_mousemove_blocked', this.block_changed,

     

       13
        
                                 this);

     

       14
       +
                   this.model.on('change:frame_delay', this.delay_changed,

     

       15
       +
                                 this);

     

       16
       +
                   this.model.on('change:_frame_blocked', this.delay_changed,

     

       17
       +
                                 this);

     

       18
       +
                   this.model.on('change:disable', this.delay_changed,

     

       19
       +
                                 this);

     

       20
       +
                   this.delay_changed();

     

       21
        
               },

     

       22
        
               image_changed: function() {

     

       23
        
                   this.container.innerHTML = this.model.get('_image');

     
···

       26
        
                   this.register_events();

     

       27
        
               },

     

       28
        
               last_move: null,

     

       29
       +
               last_mousemove_blocked: null,

     

       30
       +
               last_timer: null,

     

       31
        
               block_changed: function() {

     

       32
        
                   var widget = this;

     

       33
        
                   window.setTimeout(function() {

     

       34
       +
                       if (widget.model.get('_mousemove_blocked')

     

       35
       +
                               != widget.last_mousemove_blocked && widget.last_move) {

     

       36
        
                           widget.send_mouse_event('mousemove', widget.last_move);

     

       37
        
                       }

     

       38
        
                   }, 0);

     
···

       41
        
                   this.last_move = null;

     

       42
        
                   if (this.model.get('disable')) {

     

       43
        
                       return;

     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       44
        
                   }

     

       45
        
       

     

       46
        
                   this.cursor_point.x = e.clientX;

     
···

       69
        
                       relatedTargetId: e.relatedTarget ? e.relatedTarget.id : null,

     

       70
        
                   });

     

       71
        
               },

     

       72
       +
               delay_changed: function() {

     

       73
       +
                   var widget = this;

     

       74
       +
                   window.clearTimeout(widget.last_timer);

     

       75
       +
                   if (widget.model.get('disable')) {

     

       76
       +
                       return;

     

       77
       +
                   }

     

       78
       +
                   var delay = widget.model.get('frame_delay');

     

       79
       +
                   if (delay > 0) {

     

       80
       +
                       widget.last_timer = window.setTimeout(function() {

     

       81
       +
                           widget.send_timed_event('timed');

     

       82
       +
                       }, delay);

     

       83
       +
                   }

     

       84
       +
               },

     

       85
       +
               send_timed_event: function(name) {

     

       86
       +
                   if (this.model.get('disable')) {

     

       87
       +
                       return;

     

       88
       +
                   }

     

       89
       +
       

     

       90
       +
                   this.send({

     

       91
       +
                       name: name,

     

       92
       +
                   });

     

       93
       +
               },

     

       94
        
               register_events: function() {

     

       95
        
                   var widget = this;

     

       96
        
                   this.svg_view.addEventListener('mousedown', function(e) {

     
···

       99
        
                   });

     

       100
        
                   this.svg_view.addEventListener('mousemove', function(e) {

     

       101
        
                       e.preventDefault();

     

       102
       +
                       if (widget.model.get('_mousemove_blocked')

     

       103
       +
                               == widget.last_mousemove_blocked) {

     

       104
        
                           widget.last_move = e;

     

       105
        
                       } else {

     

       106
        
                           widget.send_mouse_event('mousemove', e);

+32 -7

drawSvg/widgets/drawing_widget.py

···

       1
        
       from ipywidgets import widgets

     

       2
       -
       from traitlets import Unicode, Bool

     

       3
        
       

     

       4
        
       

     

       5
        
       # Register front end javascript

     
···

       14
        
           _view_module = Unicode('drawingview').tag(sync=True)

     

       15
        
           _view_module_version = Unicode('0.1.0').tag(sync=True)

     

       16
        
           _image = Unicode().tag(sync=True)

     

       17
       -
           _mousemove_blocked = Bool(False).tag(sync=True)

     

       0
        
       
     

       18
        
           throttle = Bool(True).tag(sync=True)

     

       19
        
           disable = Bool(False).tag(sync=True)

     

       0
        
       
     

       20
        
       

     

       21
       -
           def __init__(self, drawing, throttle=True, disable=False):

     

       22
        
               '''

     

       23
        
               DrawingWidget is an interactive Jupyter notebook widget.  It works

     

       24
        
               similarly to displaying a Drawing as a cell output but DrawingWidget

     
···

       31
        
                   throttle: If True, limit the rate of mousemove events.  For drawings

     

       32
        
                       with many elements, this will significantly reduce lag.

     

       33
        
                   disable: While True, mouse events will be disabled.

     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       34
        
               '''

     

       35
        
               super().__init__()

     

       36
        
               self.throttle = throttle

     

       37
        
               self.disable = disable

     

       0
        
       
     

       38
        
               self.drawing = drawing

     

       39
        
               self.mousedown_callbacks = []

     

       40
        
               self.mousemove_callbacks = []

     

       41
        
               self.mouseup_callbacks = []

     

       0
        
       
     

       42
        
       

     

       43
        
               self.on_msg(self._receive_msg)

     

       44
        
       

     
···

       60
        
           def _receive_msg(self, _, content, buffers):

     

       61
        
               if not isinstance(content, dict):

     

       62
        
                   return

     

       0
        
       
     

       63
        
               callbacks = {

     

       64
        
                   'mousedown': self.mousedown_callbacks,

     

       65
        
                   'mousemove': self.mousemove_callbacks,

     

       66
        
                   'mouseup': self.mouseup_callbacks,

     

       67
       -
               }.get(content.get('name'), ())

     

       0
        
       
     

       68
        
               try:

     

       69
        
                   if callbacks:

     

       70
       -
                       self._call_handlers(callbacks, content.get('x'),

     

       71
       -
                                           content.get('y'), content)

     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       72
        
               finally:

     

       73
       -
                   self._mousemove_blocked = False

     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       74
        
       

     

       75
        
       

     

       76
        
           def mousedown(self, handler, remove=False):

     
···

       103
        
               '''

     

       104
        
               self._register_handler(

     

       105
        
                   self.mouseup_callbacks, handler, remove=remove)

     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       106
        
       

     

       107
        
           def _register_handler(self, callback_list, handler, remove=False):

     

       108
        
               if remove:

···

       1
        
       from ipywidgets import widgets

     

       2
       +
       from traitlets import Unicode, Bool, Int

     

       3
        
       

     

       4
        
       

     

       5
        
       # Register front end javascript

     
···

       14
        
           _view_module = Unicode('drawingview').tag(sync=True)

     

       15
        
           _view_module_version = Unicode('0.1.0').tag(sync=True)

     

       16
        
           _image = Unicode().tag(sync=True)

     

       17
       +
           _mousemove_blocked = Int(0).tag(sync=True)

     

       18
       +
           _frame_blocked = Int(0).tag(sync=True)

     

       19
        
           throttle = Bool(True).tag(sync=True)

     

       20
        
           disable = Bool(False).tag(sync=True)

     

       21
       +
           frame_delay = Int(-1).tag(sync=True)

     

       22
        
       

     

       23
       +
           def __init__(self, drawing, throttle=True, disable=False, frame_delay=-1):

     

       24
        
               '''

     

       25
        
               DrawingWidget is an interactive Jupyter notebook widget.  It works

     

       26
        
               similarly to displaying a Drawing as a cell output but DrawingWidget

     
···

       33
        
                   throttle: If True, limit the rate of mousemove events.  For drawings

     

       34
        
                       with many elements, this will significantly reduce lag.

     

       35
        
                   disable: While True, mouse events will be disabled.

     

       36
       +
                   frame_delay: If greater than or equal to zero, a timed callback will

     

       37
       +
                       occur frame_delay milliseconds after the previous drawing

     

       38
       +
                       update.

     

       39
        
               '''

     

       40
        
               super().__init__()

     

       41
        
               self.throttle = throttle

     

       42
        
               self.disable = disable

     

       43
       +
               self.frame_delay = frame_delay

     

       44
        
               self.drawing = drawing

     

       45
        
               self.mousedown_callbacks = []

     

       46
        
               self.mousemove_callbacks = []

     

       47
        
               self.mouseup_callbacks = []

     

       48
       +
               self.timed_callbacks = []

     

       49
        
       

     

       50
        
               self.on_msg(self._receive_msg)

     

       51
        
       

     
···

       67
        
           def _receive_msg(self, _, content, buffers):

     

       68
        
               if not isinstance(content, dict):

     

       69
        
                   return

     

       70
       +
               name = content.get('name')

     

       71
        
               callbacks = {

     

       72
        
                   'mousedown': self.mousedown_callbacks,

     

       73
        
                   'mousemove': self.mousemove_callbacks,

     

       74
        
                   'mouseup': self.mouseup_callbacks,

     

       75
       +
                   'timed': self.timed_callbacks,

     

       76
       +
               }.get(name, ())

     

       77
        
               try:

     

       78
        
                   if callbacks:

     

       79
       +
                       if name == 'timed':

     

       80
       +
                           self._call_handlers(callbacks, content)

     

       81
       +
                       else:

     

       82
       +
                           self._call_handlers(callbacks, content.get('x'),

     

       83
       +
                                               content.get('y'), content)

     

       84
        
               finally:

     

       85
       +
                   if name == 'timed':

     

       86
       +
                       self._frame_blocked += 1

     

       87
       +
                   else:

     

       88
       +
                       self._mousemove_blocked += 1

     

       89
        
       

     

       90
        
       

     

       91
        
           def mousedown(self, handler, remove=False):

     
···

       118
        
               '''

     

       119
        
               self._register_handler(

     

       120
        
                   self.mouseup_callbacks, handler, remove=remove)

     

       121
       +
       

     

       122
       +
           def timed(self, handler, remove=False):

     

       123
       +
               '''

     

       124
       +
               Register (or unregister) a handler for the timed event.

     

       125
       +
       

     

       126
       +
               Arguments:

     

       127
       +
                   remove: If True, unregister, otherwise register.

     

       128
       +
               '''

     

       129
       +
               self._register_handler(

     

       130
       +
                   self.timed_callbacks, handler, remove=remove)

     

       131
        
       

     

       132
        
           def _register_handler(self, callback_list, handler, remove=False):

     

       133
        
               if remove: