Multi-touch

static/picture-annotation.py

@@ -715,13 +715,14 @@ zoom_offset = (0, 0)

                                
                                
                                
                            
                                
                                    
                                        
                                            715  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            716  
                                            def on_wheel(event):
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            717  
                                                global scale, scale_exponent, translate_x, translate_y
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        718 +
                                            if object_list.matches(":hover"):
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        719 +
                                                return
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            720  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            721  
                                                event.preventDefault()
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            722  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        721 -
                                            # Adjust scale exponent and compute new scale
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        723 +
                                            # Adjust scale exponent and compute new scale.
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            724  
                                                scale_exponent += (-1 if event.deltaY > 0 else 1) / 4
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            725  
                                                new_scale = 2 ** scale_exponent
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        724 -
                                            # Update scale
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            726  
                                                scale = new_scale
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            727  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            728  
                                                update_transform()
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        

@@ -733,12 +734,19 @@ start_y = 0

                                
                                
                                
                            
                                
                                    
                                        
                                            734  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            735  
                                            def on_mouse_down(event):
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            736  
                                                global is_dragging, start_x, start_y
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        736 -
                                            is_dragging = True
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        737 -
                                            start_x = event.clientX
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        738 -
                                            start_y = event.clientY
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        737 +
                                            if object_list.matches(":hover"):
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        738 +
                                                return
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        739 +
                                        
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        740 +
                                            if event.button == 0:
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        741 +
                                                is_dragging = True
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        742 +
                                                start_x = event.clientX
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        743 +
                                                start_y = event.clientY
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            744  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            745  
                                            def on_mouse_move(event):
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            746  
                                                global translate_x, translate_y
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        747 +
                                            if object_list.matches(":hover"):
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        748 +
                                                return
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        749 +
                                        
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            750  
                                                if is_dragging:
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            751  
                                                    translate_x += event.movementX / scale
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            752  
                                                    translate_y += event.movementY / scale
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        

@@ -746,12 +754,53 @@ def on_mouse_move(event):

                                
                                
                                
                            
                                
                                    
                                        
                                            754  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            755  
                                            def on_mouse_up(event):
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            756  
                                                global is_dragging
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        757 +
                                            if object_list.matches(":hover"):
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        758 +
                                                return
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            759  
                                                is_dragging = False
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            760  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        761 +
                                        def on_touch_start(event):
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        762 +
                                            global last_touch_positions
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        763 +
                                        
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        764 +
                                            if event.touches.length == 2:
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        765 +
                                                event.preventDefault()
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        766 +
                                                last_touch_positions = [
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        767 +
                                                    (event.touches[0].clientX, event.touches[0].clientY),
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        768 +
                                                    (event.touches[1].clientX, event.touches[1].clientY)
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        769 +
                                                ]
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        770 +
                                        
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        771 +
                                        def on_touch_move(event):
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        772 +
                                            global translate_x, translate_y, last_touch_positions
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        773 +
                                        
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        774 +
                                            if event.touches.length == 2:
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        775 +
                                                event.preventDefault()
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        776 +
                                        
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        777 +
                                                current_positions = [
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        778 +
                                                    (event.touches[0].clientX, event.touches[0].clientY),
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        779 +
                                                    (event.touches[1].clientX, event.touches[1].clientY)
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        780 +
                                                ]
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        781 +
                                        
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        782 +
                                                delta_x = sum(p[0] - lp[0] for p, lp in zip(current_positions, last_touch_positions)) / 2
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        783 +
                                                delta_y = sum(p[1] - lp[1] for p, lp in zip(current_positions, last_touch_positions)) / 2
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        784 +
                                        
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        785 +
                                                translate_x += delta_x
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        786 +
                                                translate_y += delta_y
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        787 +
                                        
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        788 +
                                                last_touch_positions = current_positions
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        789 +
                                        
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        790 +
                                                update_transform()
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        791 +
                                        
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        792 +
                                        def on_touch_end(event):
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        793 +
                                            global last_touch_positions
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        794 +
                                            if event.touches.length == 0:
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        795 +
                                                last_touch_positions = None
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        796 +
                                        
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            797  
                                            zoom_container.addEventListener("wheel", on_wheel)
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            798  
                                            zoom_container.addEventListener("mousedown", on_mouse_down)
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            799  
                                            document.addEventListener("mousemove", on_mouse_move)
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            800  
                                            document.addEventListener("mouseup", on_mouse_up)
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        801 +
                                        zone.addEventListener("touchstart", on_touch_start)
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        802 +
                                        zone.addEventListener("touchmove", on_touch_move)
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        803 +
                                        zone.addEventListener("touchend", on_touch_end)
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            804  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            805  
                                            # Load existing annotations, if any
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            806  
                                            put_shapes(await load_shapes())