Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Native Development

Reply
Developer
Posts: 402
Registered: ‎04-04-2012
My Device: BlackBerry Z30/Z10/Z10LE/Q10/PlayBook

SVG and WebView - onmousedown / onmouseup

Hi,

 

  I am trying to use an interactive SVG file in a WebView. It doesn't seem that the onmousedown and onmouseup works. Any ideas?

 

Developer
Posts: 402
Registered: ‎04-04-2012
My Device: BlackBerry Z30/Z10/Z10LE/Q10/PlayBook

Re: SVG and WebView - onmousedown / onmouseup

Here is the example svg file. The clicks are working, but it is more like a long click and I can't get onmouseover and onmouseout to respond as expected.

 

<?xml version="1.0" encoding="ISO-8859-1" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
    "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg onload="init(evt)" xmlns="http://www.w3.org/2000/svg"
     xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve"
         width="720" height="720"
         viewBox="0 0 720 720"  >
	
	<!-- Matthew Bystedt http://apike.ca 2012 -->

    <script type="text/ecmascript"><![CDATA[

    function init(evt) {
        if ( window.svgDocument == null )
            svgDocument = evt.target.ownerDocument;
    }

    var click       = 0;
    var mouseDown   = 0;
    var mouseUp     = 0;
    var mouseOver   = 0;
    var mouseMove   = 0;
    var mouseOut    = 0;
    
    function updateStats() {
        svgDocument.getElementById("clicks").firstChild.data = "onclick = " + click;
        svgDocument.getElementById("mousedowns").firstChild.data = "onmousedown = " + mouseDown;
        svgDocument.getElementById("mouseups").firstChild.data = "onmouseup = " + mouseUp;
        svgDocument.getElementById("mouseovers").firstChild.data = "onmouseover = " + mouseOver;
        svgDocument.getElementById("mousemoves").firstChild.data = "onmousemove = " + mouseMove;
        svgDocument.getElementById("mouseouts").firstChild.data = "onmouseout = " + mouseOut;
    }
    
    function msClick (evt) {
        click++;
        updateStats();
    }

    function msDown (evt) {
        mouseDown++;
        updateStats();
    }
    
    function msUp (evt) {
        mouseUp++;
        updateStats();
    }
    
    function msOver (evt) {
        mouseOver++;
        updateStats();
    }
    
    function msMove (evt) {
        mouseMove++;
        updateStats();
    }

    function msOut (evt) {
        mouseOut++;
        updateStats();
    }

    ]]></script>
	
	<!-- Pattern Definition -->
	<defs>
		<pattern id="checkerPattern" patternUnits="userSpaceOnUse"
				x="0" y="0" width="10" height="10"
				viewBox="0 0 10 10" >
				
			<rect x="0" y="0" width="5" height="5" fill="lightblue" />
			<rect x="5" y="5" width="5" height="5" fill="lightblue" />
		</pattern> 
	</defs>

	<!-- Background -->
	<rect x="0" y="0" width="100%" height="100%" fill="url(#checkerPattern)" />

	<!-- Javascript Example -->

    <circle cx="50%" cy="25%" r="51" fill="lightyellow" stroke-width="1" stroke="black"
        onclick="msClick()"
        onmousedown="msDown()"
        onmouseup="msUp()"
        onmouseover="msOver()"
        onmousemove="msMove()"
        onmouseout="msOut()"
        />

    <rect x="5" y="95" width="140" height="95" fill="white" stroke="grey" stroke-width="2" rx="10" ry="10" opacity="0.5" />

    <text x="10" y="110" id="clicks">onclick = 0</text>
    <text x="10" y="125" id="mousedowns">onmousedown = 0</text>
    <text x="10" y="140" id="mouseups">onmouseup = 0</text>
    <text x="10" y="155" id="mouseovers">onmouseover = 0</text>
    <text x="10" y="170" id="mousemoves">onmousemove = 0</text>
    <text x="10" y="185" id="mouseouts">onmouseout = 0</text>    

</svg>

 

Developer
Posts: 402
Registered: ‎04-04-2012
My Device: BlackBerry Z30/Z10/Z10LE/Q10/PlayBook

Re: SVG and WebView - onmousedown / onmouseup

Since this example works on other browsers, I created a bug report.

 

https://www.blackberry.com/jira/browse/BBTEN-1454