×

Discussion Board

Results 1 to 5 of 5
  1. #1
    Regular Contributor
    Join Date
    Apr 2009
    Posts
    54

    Drag & Drop image supported?

    Is drag & drop images supported in wrt? Have a javascript that works elsewhere, but not in wrt. Perhaps there is another way of doing it that works in wrt?

  2. #2
    Nokia Developer Moderator
    Join Date
    Mar 2003
    Location
    Lempäälä/Finland
    Posts
    29,166

    Re: Drag & Drop image supported?

    you might need to work on the logic a bit, anyway, you should propably visit our wiki and see what is there already, for example this article might interest you: http://wiki.forum.nokia.com/index.ph...nd-drop_in_WRT

  3. #3
    Regular Contributor
    Join Date
    Apr 2009
    Posts
    54

    Re: Drag & Drop image supported?

    Thanks. All I need is to move two images, no other code. And the sample-code was too complex for my limited javascript-skills to extract that functionality alone, and the description on the page you linked to was too general for me to make any sens out of, and did not seem to fit my current code at all.

    Anyway, this is my full html/js-code, and if you can spot what is wrong with it that would be great. Otherwise I think I'll leave that functionality for the future - need to study up on my js first, it seems.

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <head>
    	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    	<script language="javascript" type="text/javascript" src="basic.js"></script>
        	<style type="text/css">
    		@import "basic.css";
        	</style>
    
      <script type="text/javascript">
            var currentId;
            var objects = {};
            var zIndex = 0;
          
            function init() {
                document.addEventListener("touchstart", startmove, false);
                document.addEventListener("touchmove", move, false);
                document.addEventListener("touchend", endmove, false);
    			
    	// Movable images, named "image1" to "image2" in the html-code
                makeObjectMovable(image1);
                makeObjectMovable(image2);
            }
    
            function startmove(event) {
                var touch = event.touches[0];
                var id = touch.identifier;
                currentId = id;
                if (touch.target.className == "movable") {
                    objects[id] = {
                        target: touch.target,
                        beginX: touch.clientX,
                        beginY: touch.clientY,
                        pozX: touch.target.pozXinit,
                        pozY: touch.target.pozYinit
                    }
                    touch.target.style.opacity = 0.5;
                    touch.target.style.zIndex = ++zIndex;
                }
            }
    
            function endmove(event) {
                var touch = event.touches[0];
                var id = currentId;
                if (objects[id] != null) {
                    if (objects[id].target.className == "movable") {
                        objects[id].target.style.opacity = 1;
                    }
                    delete objects[id];
                }
            }
    
            function move(event) {
                var touch = event.touches[0];
                var id = touch.identifier;
                if (objects[id].target.className == "movable") {
                    objects[id].target.pozXinit = objects[id].pozX + touch.clientX - objects[id].beginX;
                    objects[id].target.pozYinit = objects[id].pozY + touch.clientY - objects[id].beginY;
                    objects[id].target.style['-webkit-transform'] = 'translate(' + objects[id].target.pozXinit + 'px,' + objects[id].target.pozYinit + 'px)';
                }
                event.preventDefault();
            }
    
            function makeObjectMovable(obj) {
                obj.className = "movable";
                obj.pozXinit = 0;
                obj.pozYinit = 0;
            }
        </script>
    </head>
    
    <body onload="init();">
    	<img name="image1" id="image1" src="image1.png" />
    	<img name="image2" id="image2" src="image2.png" />
    </body>
    </html>

  4. #4
    Nokia Developer Moderator
    Join Date
    Mar 2003
    Location
    Lempäälä/Finland
    Posts
    29,166

    Re: Drag & Drop image supported?

    Sorry, that example is 10 liner, so even javascript doesn't go too much easier than that.

  5. #5
    Regular Contributor
    Join Date
    Apr 2009
    Posts
    54

    Re: Drag & Drop image supported?

    I was refering to the solitaire-script, which is hardly a 10-liner.

    Do you mean that the 10-liner on the page you linked to is functional as-is? I tried replacing the javascript in the head in the code above, but there I cant move the images.

    Code:
    	 	<script type="text/javascript">
    			if (typeof e == 'undefined') {
     				myEvent = window.event;
     			} 
    			else {
     					myEvent = e;
     			}
     			posX = myEvent.clientX;
     			posY = myEvent.clientY;
    
    	  		document.onkeydown = self.onMouseDown;
     			document.onkeyup   = self.onMouseUp;
    			
    			var object = document.elementFromPoint(posX, posY);
    		</script>

Similar Threads

  1. J2me Supported image formats
    By GattusoMatrazzi in forum Mobile Java Media (Graphics & Sounds)
    Replies: 5
    Last Post: 2007-11-06, 14:02
  2. how to send an image to moblie OR what formats are supported
    By omo_5 in forum Mobile Java Media (Graphics & Sounds)
    Replies: 4
    Last Post: 2006-01-01, 15:38
  3. HELP: Mutable Image to Immutable Image?
    By rj_cybersilver in forum Mobile Java Media (Graphics & Sounds)
    Replies: 1
    Last Post: 2005-03-26, 09:58
  4. Replies: 1
    Last Post: 2001-12-03, 21:40

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
×