Loading ...
Sorry, an error occurred while loading the content.

batik: disable text selection

Expand Messages
  • bardoczistvn
    Is there a way to disable text selection? - I want to use events, so pointer-events cannot set to none - I need the default mouse cursor over text elements
    Message 1 of 3 , May 31 8:15 AM
    • 0 Attachment
      Is there a way to disable text selection?
      - I want to use events, so 'pointer-events' cannot set to none
      - I need the default mouse cursor over text elements

      thanx
      István
    • heldermagalhaes
      ... Yes, probably there are more than one way to accomplish this. For example, I made a sample (available below) where text selection is disabled by overlaying
      Message 2 of 3 , Jun 1, 2007
      • 0 Attachment
        > Is there a way to disable text selection?
        > - I want to use events, so 'pointer-events' cannot set to none
        > - I need the default mouse cursor over text elements

        Yes, probably there are more than one way to accomplish this. For
        example, I made a sample (available below) where text selection is
        disabled by overlaying text elements with invisible rectangles, which
        catch the pointer events and therefore disable the feature, while
        allowing the events to propagate to the SVG document root (uncomment
        the 'alert' to verify).

        Nevertheless I guess you should ask yourself if you really want to do
        that: text selection is seen as a good thing, although I admit text
        selection is currently faulty in most implementations, mixing up
        pointer events, catching events when not expected, etc.. I think
        disabling the feature can be a smart way to temporarily overcome these
        limitations while implementations don't catch up with developer/user
        needs.

        References:
        http://www.w3.org/TR/SVG11/text.html#TextSelection
        (although it's referred that «A text selection operation starts
        [...] no links or events have been assigned to the 'text' [element]»,
        any of the tested implementations seem to respect this)

        http://osdir.com/ml/web.svg/2004-11/msg00053.html
        (somehow old as the SVG 1.2 specification was redesigned and the
        link referred doesn't work, but the concept is there and will probably
        be in the standard some day)

        I provide a sample test describing the proposed behavior. Note that it
        works in Batik 100% but the dynamic text bounding box is unstable in
        ASV6 beta 1 (sometimes shows it, sometimes not - weirdly - that's why
        I didn't made the rectangle completely invisible in this case). Also,
        Renesis (and other SVG implementations) don't implement the bounding
        box feature (and it crashes eSVG) so use with care.

        If using the Yahoo! Groups Web interface to view this, it shows much
        better if fixed width font is used (right menu "Show Message Option",
        "Use Variable Width Font"):

        <?xml version="1.0" encoding="UTF-8" standalone="no"?>
        <svg xmlns:xlink="http://www.w3.org/1999/xlink"
        xmlns="http://www.w3.org/2000/svg"
        contentScriptType="text/ecmascript" contentStyleType="text/css"
        version="1.2" baseProfile="tiny"
        width="800" height="600" viewBox="0 0 800 600"
        preserveAspectRatio="xMidYMid meet"
        onload="init(evt)" onmouseup="handler(evt)">

        <title>Text selection test</title>

        <script type="text/ecmascript"> <![CDATA[
        var svgNS = "http://www.w3.org/2000/svg";

        var init = function(evt){
        //fetch the text element
        var textEle = document.getElementById("dynamic-text");

        //compute its bouding box
        var theBB = textEle.getBBox();

        //create an invisible rectangle
        var bbox = document.createElementNS(svgNS, "rect");
        bbox.setAttributeNS(null, "x", theBB.x);
        bbox.setAttributeNS(null, "y", theBB.y);
        bbox.setAttributeNS(null, "width", theBB.width);
        bbox.setAttributeNS(null, "height", theBB.height);
        bbox.setAttributeNS(null, "fill", "black");
        bbox.setAttributeNS(null, "fill-opacity", "0.1");
        bbox.setAttributeNS(null, "stroke", "none");
        bbox.setAttributeNS(null, "stroke-width", "0");

        //insert into the document
        document.documentElement.appendChild(bbox);
        }

        var handler = function(evt){
        //uncomment to verify event propagation
        //alert("mouseup");
        }

        var nullHandler = function(evt){
        }
        ]]> </script>

        <text x="50" y="100" font-size="50">usual text pointer</text>
        <text x="50" y="200" font-size="50" style="cursor:default">default
        pointer</text>

        <!-- standard way to do it (although apparently I doesn't work) -->
        <text x="50" y="300" font-size="50"
        onclick="nullHandler(evt)">standard unselectable text</text>

        <text x="50" y="400" font-size="50">static unselectable text</text>
        <!-- an invisible rectangle covers text, disabling selection -->
        <rect x="50" y="350" width="550" height="50"
        fill="white" fill-opacity="0" stroke="none" stroke-width="0" />

        <text x="50" y="500" font-size="50" id="dynamic-text">dynamic
        unselectable text</text>

        </svg>
      • thomas.deweese@kodak.com
        Hi Istavan, ... When you construct the JSVGCanvas you can use the following constructor: /** * Creates a new JSVGCanvas. * * @param ua a SVGUserAgent instance
        Message 3 of 3 , Jun 2, 2007
        • 0 Attachment
          Hi Istavan,

          svg-developers@yahoogroups.com wrote on 05/31/2007 11:15:31 AM:

          > Is there a way to disable text selection?
          > - I want to use events, so 'pointer-events' cannot set to none
          > - I need the default mouse cursor over text elements

          When you construct the JSVGCanvas you can use the following
          constructor:

          /**
          * Creates a new JSVGCanvas.
          *
          * @param ua a SVGUserAgent instance or null.
          * @param eventsEnabled Whether the GVT tree should be reactive to
          mouse
          * and key events.
          * @param selectableText Whether the text should be selectable.
          */
          public JSVGCanvas(SVGUserAgent ua,
          boolean eventsEnabled,
          boolean selectableText)

          You can pass 'null' for the 'ua' and Batik will provide one
          (although the UserAgent allows for a lot of useful customization).

          BTW the batik-users mail-list will likely get you quicker
          answers on Batik specific questions like this.


          >
          > thanx
          > István

          >
        Your message has been successfully submitted and would be delivered to recipients shortly.