Points (but drawing is buggy)

static/picture-annotation.py

@@ -221,6 +221,8 @@ def switch_shape(event):

                                
                                
                                
                            
                                
                                    
                                        
                                            221  
                                                            cancel_bbox(None)
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            222  
                                                        case "shape-polygon":
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            223  
                                                            cancel_polygon(None)
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        224 +
                                                    case "shape-polyline":
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        225 +
                                                        cancel_polygon(None)
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            226  
                                                else:
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            227  
                                                    # Remove event listeners for selection
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            228  
                                                    for shape in document.getElementsByClassName("shape"):
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        

@@ -392,30 +394,72 @@ def open_shape(event):

                                
                                
                                
                            
                                
                                    
                                        
                                            394  
                                                    return
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            395  
                                                print("Creating a new shape of type:", shape_type)
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            396  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        395 -
                                            if shape_type == "shape-bbox":
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        396 -
                                                helper_message.innerText = ("Define the first point at the intersection of the lines "
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        397 -
                                                                            "by clicking on the image, or click the cross to cancel")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        398 -
                                        
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        399 -
                                                cancel_button.addEventListener("click", cancel_bbox_proxy)
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        400 -
                                                document.addEventListener("keydown", cancel_bbox_proxy)
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        401 -
                                                cancel_button.style.display = "block"
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        402 -
                                                bbox_pos = None
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        403 -
                                                zone.addEventListener("click", make_bbox_proxy)
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        404 -
                                                vertical_ruler.style.display = "block"
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        405 -
                                                horizontal_ruler.style.display = "block"
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        406 -
                                                zone.style.cursor = "crosshair"
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        407 -
                                            elif shape_type == "shape-polygon" or shape_type == "shape-polyline":
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        408 -
                                                match shape_type:
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        409 -
                                                    case "shape-polygon":
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        410 -
                                                        helper_message.innerText = ("Click on the image to define the points of the polygon, "
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        411 -
                                                                                    "press escape to cancel, enter to close, or backspace to "
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        412 -
                                                                                    "remove the last point")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        413 -
                                                    case "shape-polyline":
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        414 -
                                                        helper_message.innerText = ("Click on the image to define the points of the polyline, "
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        415 -
                                                                                    "press escape to cancel, enter to finish, or backspace to "
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        416 -
                                                                                    "remove the last point")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        397 +
                                            match shape_type:
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        398 +
                                                case "shape-bbox":
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        399 +
                                                    helper_message.innerText = ("Define the first point at the intersection of the lines "
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        400 +
                                                                                "by clicking on the image, or click the cross to cancel")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        401 +
                                        
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        402 +
                                                    cancel_button.addEventListener("click", cancel_bbox_proxy)
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        403 +
                                                    document.addEventListener("keydown", cancel_bbox_proxy)
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        404 +
                                                    cancel_button.style.display = "block"
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        405 +
                                                    bbox_pos = None
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        406 +
                                                    zone.addEventListener("click", make_bbox_proxy)
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        407 +
                                                    vertical_ruler.style.display = "block"
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        408 +
                                                    horizontal_ruler.style.display = "block"
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        409 +
                                                    zone.style.cursor = "crosshair"
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        410 +
                                                case "shape-polygon" | "shape-polyline":
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        411 +
                                                    match shape_type:
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        412 +
                                                        case "shape-polygon":
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        413 +
                                                            helper_message.innerText = ("Click on the image to define the points of the polygon, "
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        414 +
                                                                                        "press escape to cancel, enter to close, or backspace to "
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        415 +
                                                                                        "remove the last point")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        416 +
                                                        case "shape-polyline":
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        417 +
                                                            helper_message.innerText = ("Click on the image to define the points of the polyline, "
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        418 +
                                                                                        "press escape to cancel, enter to finish, or backspace to "
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        419 +
                                                                                        "remove the last point")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        420 +
                                        
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        421 +
                                                    if not polygon_points and not new_shape:
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        422 +
                                                        new_shape = document.createElementNS("http://www.w3.org/2000/svg", "svg")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        423 +
                                                        new_shape.setAttribute("width", "100%")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        424 +
                                                        new_shape.setAttribute("height", "100%")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        425 +
                                                        zone_rect = zone.getBoundingClientRect()
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        426 +
                                                        new_shape.setAttribute("viewBox", f"0 0 {image.naturalWidth} {image.naturalHeight}")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        427 +
                                                        new_shape.classList.add("shape-container")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        428 +
                                        
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        429 +
                                                    if not polygon_points and int(len(new_shape.children)) == 0:
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        430 +
                                                        zone.addEventListener("click", make_polygon_proxy)
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        431 +
                                                        document.addEventListener("keydown", close_polygon_proxy)
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        432 +
                                                        document.addEventListener("keydown", cancel_polygon_proxy)
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        433 +
                                                        document.addEventListener("keydown", backspace_polygon_proxy)
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        434 +
                                                        cancel_button.addEventListener("click", cancel_polygon_proxy)
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        435 +
                                                        cancel_button.style.display = "block"
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        436 +
                                                        confirm_button.addEventListener("click", close_polygon_proxy)
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        437 +
                                                        confirm_button.style.display = "block"
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        438 +
                                                        backspace_button.addEventListener("click", backspace_polygon_proxy)
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        439 +
                                                        backspace_button.style.display = "block"
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        440 +
                                                        match shape_type:
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        441 +
                                                            case "shape-polygon":
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        442 +
                                                                polygon = document.createElementNS("http://www.w3.org/2000/svg", "polygon")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        443 +
                                                                polygon.classList.add("shape-polygon")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        444 +
                                                            case "shape-polyline":
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        445 +
                                                                polygon = document.createElementNS("http://www.w3.org/2000/svg", "polyline")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        446 +
                                                                polygon.classList.add("shape-polyline")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        447 +
                                                        polygon.setAttribute("fill", "none")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        448 +
                                                        polygon.setAttribute("data-object-type", "")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        449 +
                                                        polygon.classList.add("shape")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        450 +
                                                        new_shape.appendChild(polygon)
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        451 +
                                                        zone.appendChild(new_shape)
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        452 +
                                                        zone.style.cursor = "crosshair"
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        453 +
                                                case "shape-point":
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        454 +
                                                    point = document.createElementNS("http://www.w3.org/2000/svg", "circle")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        455 +
                                                    zone_rect = zone.getBoundingClientRect()
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        456 +
                                                    point.setAttribute("cx", str((event.clientX - zone_rect.left) / zone_rect.width * image.naturalWidth))
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        457 +
                                                    point.setAttribute("cy", str((event.clientY - zone_rect.top) / zone_rect.height * image.naturalHeight))
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        458 +
                                                    point.setAttribute("r", "0")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        459 +
                                                    point.classList.add("shape-point")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        460 +
                                                    point.classList.add("shape")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        461 +
                                                    point.setAttribute("data-object-type", "")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            462  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        418 -
                                                if not polygon_points and not new_shape:
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            463  
                                                        new_shape = document.createElementNS("http://www.w3.org/2000/svg", "svg")
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            464  
                                                        new_shape.setAttribute("width", "100%")
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            465  
                                                        new_shape.setAttribute("height", "100%")
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        

@@ -423,30 +467,11 @@ def open_shape(event):

                                
                                
                                
                            
                                
                                    
                                        
                                            467  
                                                        new_shape.setAttribute("viewBox", f"0 0 {image.naturalWidth} {image.naturalHeight}")
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            468  
                                                        new_shape.classList.add("shape-container")
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            469  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        426 -
                                                if not polygon_points and int(len(new_shape.children)) == 0:
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        427 -
                                                    zone.addEventListener("click", make_polygon_proxy)
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        428 -
                                                    document.addEventListener("keydown", close_polygon_proxy)
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        429 -
                                                    document.addEventListener("keydown", cancel_polygon_proxy)
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        430 -
                                                    document.addEventListener("keydown", backspace_polygon_proxy)
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        431 -
                                                    cancel_button.addEventListener("click", cancel_polygon_proxy)
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        432 -
                                                    cancel_button.style.display = "block"
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        433 -
                                                    confirm_button.addEventListener("click", close_polygon_proxy)
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        434 -
                                                    confirm_button.style.display = "block"
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        435 -
                                                    backspace_button.addEventListener("click", backspace_polygon_proxy)
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        436 -
                                                    backspace_button.style.display = "block"
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        437 -
                                                    match shape_type:
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        438 -
                                                        case "shape-polygon":
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        439 -
                                                            polygon = document.createElementNS("http://www.w3.org/2000/svg", "polygon")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        440 -
                                                            polygon.classList.add("shape-polygon")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        441 -
                                                        case "shape-polyline":
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        442 -
                                                            polygon = document.createElementNS("http://www.w3.org/2000/svg", "polyline")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        443 -
                                                            polygon.classList.add("shape-polyline")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        444 -
                                                    polygon.setAttribute("fill", "none")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        445 -
                                                    polygon.setAttribute("data-object-type", "")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        446 -
                                                    polygon.classList.add("shape")
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        447 -
                                                    new_shape.appendChild(polygon)
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        470 +
                                                    new_shape.appendChild(point)
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            471  
                                                        zone.appendChild(new_shape)
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        449 -
                                                    zone.style.cursor = "crosshair"
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        472 +
                                        
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        473 +
                                                    new_shape = None
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        474 +
                                        
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            475  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            476  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            477  
                                            for button in list(document.getElementById("shape-selector").children):
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                            
                                

static/style.css

@@ -24,6 +24,12 @@ iconify-icon {

                                
                                
                                
                            
                                
                                    
                                        
                                            24  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            25  
                                            #annotation-zone {
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            26  
                                                position: relative;
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        27 +
                                            user-select: none;
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        28 +
                                        }
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        29 +
                                        
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        30 +
                                        #annotation-image {
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        31 +
                                            user-drag: none;
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        32 +
                                            -webkit-user-drag: none;
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            33  
                                            }
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            34  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            35  
                                            #annotation-zone > svg {
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        

@@ -67,9 +73,21 @@ iconify-icon {

                                
                                
                                
                            
                                
                                    
                                        
                                            73  
                                                fill: none;
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            74  
                                            }
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            75  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        76 +
                                        .shape-point {
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        77 +
                                            stroke: var(--color-accent);
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        78 +
                                            stroke-width: 32px;
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        79 +
                                            r: 0.1;
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        80 +
                                        }
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        81 +
                                        
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            82  
                                            .shape.selected {
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            83  
                                                fill-opacity: 0.2;
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            84  
                                                stroke-width: 4px;
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        85 +
                                            filter: drop-shadow(0 0 2px var(--text-soft));
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        86 +
                                        }
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        87 +
                                        
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        88 +
                                        .shape-point.selected {
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        89 +
                                            fill-opacity: 1;
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        90 +
                                            r: 4px;
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            91  
                                            }
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            92  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            93  
                                            .shape-container {