Fix annotation bugs

static/picture-annotation.py

@@ -250,7 +250,6 @@ def cancel_bbox(event):

                                
                                
                                
                            
                                
                                    
                                        
                                            250  
                                                if new_shape is not None and event is not None:
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            251  
                                                    # Require event so the shape is kept when it ends normally
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            252  
                                                    new_shape.remove()
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        253 -
                                                new_shape = None
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            253  
                                                zone.removeEventListener("click", make_bbox_proxy)
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            254  
                                                document.removeEventListener("keydown", cancel_bbox_proxy)
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            255  
                                                cancel_button.removeEventListener("click", cancel_bbox_proxy)
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        

@@ -263,6 +262,7 @@ def cancel_bbox(event):

                                
                                
                                
                            
                                
                                    
                                        
                                            262  
                                                zone.style.cursor = "auto"
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            263  
                                                cancel_button.style.display = "none"
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            264  
                                                helper_message.innerText = "Select a shape type then click on the image to begin defining it"
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        265 +
                                            new_shape = None
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            266  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            267  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            268  
                                            def make_bbox(event):
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        

@@ -286,6 +286,13 @@ def make_bbox(event):

                                
                                
                                
                            
                                
                                    
                                        
                                            286  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            287  
                                                    rectangle = document.createElementNS("http://www.w3.org/2000/svg", "rect")
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            288  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        289 +
                                                new_shape = document.createElementNS("http://www.w3.org/2000/svg", "svg")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        290 +
                                                new_shape.setAttribute("width", "100%")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        291 +
                                                new_shape.setAttribute("height", "100%")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        292 +
                                                zone_rect = zone.getBoundingClientRect()
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        293 +
                                                new_shape.setAttribute("viewBox", f"0 0 {image.naturalWidth} {image.naturalHeight}")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        294 +
                                                new_shape.classList.add("shape-container")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        295 +
                                        
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            296  
                                                    new_shape.appendChild(rectangle)
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            297  
                                                    zone.appendChild(new_shape)
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            298  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        

@@ -315,7 +322,6 @@ polygon_points = []

                                
                                
                                
                            
                                
                                    
                                        
                                            322  
                                            def make_polygon(event):
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            323  
                                                global new_shape, polygon_points
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            324  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        318 -
                                            print(new_shape.outerHTML)
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            325  
                                                polygon = new_shape.children[0]
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            326  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            327  
                                                zone_rect = zone.getBoundingClientRect()
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        

@@ -330,6 +336,8 @@ def make_polygon(event):

                                
                                
                                
                            
                                
                                    
                                        
                                            336  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            337  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            338  
                                            def reset_polygon():
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        339 +
                                            global new_shape, polygon_points
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        340 +
                                        
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            341  
                                                zone.removeEventListener("click", make_polygon_proxy)
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            342  
                                                document.removeEventListener("keydown", close_polygon_proxy)
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            343  
                                                document.removeEventListener("keydown", cancel_polygon_proxy)
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        

@@ -343,6 +351,7 @@ def reset_polygon():

                                
                                
                                
                            
                                
                                    
                                        
                                            351  
                                                polygon_points.clear()
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            352  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            353  
                                                zone.style.cursor = "auto"
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        354 +
                                            new_shape = None
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            355  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            356  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            357  
                                            def close_polygon(event):
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        

@@ -382,13 +391,6 @@ def open_shape(event):

                                
                                
                                
                            
                                
                                    
                                        
                                            391  
                                                if bbox_pos or shape_type == "select":
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            392  
                                                    return
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            393  
                                                print("Creating a new shape of type:", shape_type)
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        385 -
                                            if not polygon_points:
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        386 -
                                                new_shape = document.createElementNS("http://www.w3.org/2000/svg", "svg")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        387 -
                                                new_shape.setAttribute("width", "100%")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        388 -
                                                new_shape.setAttribute("height", "100%")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        389 -
                                                zone_rect = zone.getBoundingClientRect()
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        390 -
                                                new_shape.setAttribute("viewBox", f"0 0 {image.naturalWidth} {image.naturalHeight}")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        391 -
                                                new_shape.classList.add("shape-container")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            394  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            395  
                                                if shape_type == "shape-bbox":
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            396  
                                                    helper_message.innerText = ("Define the first point at the intersection of the lines "
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        

@@ -407,7 +409,16 @@ def open_shape(event):

                                
                                
                                
                            
                                
                                    
                                        
                                            409  
                                                                                "press escape to cancel, enter to close, or backspace to "
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            410  
                                                                                "remove the last point")
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            411  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        410 -
                                                if not polygon_points:
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        412 +
                                                if not polygon_points and not new_shape:
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        413 +
                                                    new_shape = document.createElementNS("http://www.w3.org/2000/svg", "svg")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        414 +
                                                    new_shape.setAttribute("width", "100%")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        415 +
                                                    new_shape.setAttribute("height", "100%")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        416 +
                                                    zone_rect = zone.getBoundingClientRect()
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        417 +
                                                    new_shape.setAttribute("viewBox", f"0 0 {image.naturalWidth} {image.naturalHeight}")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        418 +
                                                    new_shape.classList.add("shape-container")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        419 +
                                        
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        420 +
                                                if not polygon_points and int(len(new_shape.children)) == 0:
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        421 +
                                                    print(len(new_shape.children), "children found")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            422  
                                                        zone.addEventListener("click", make_polygon_proxy)
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            423  
                                                        document.addEventListener("keydown", close_polygon_proxy)
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            424  
                                                        document.addEventListener("keydown", cancel_polygon_proxy)