Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium


IMPOSSIBLE? Compositing Images into One Image

Posted on 2005-02-25
Medium Priority
Last Modified: 2010-04-06
For the longest time I've been trying to create my own Remote Desktop Assistance tool using Internet Explorer 5.5 or higher on a Windows XP  system.  I have already created a tool for the remote user to run (95KB) which acts as a server to translate my webbrowser requests into full system interactivity.  The tool will then return the new imagery to the remote client web browser window.  I've taken this approach because my work, where I'd like to use the web client tool, is heavily restricted so using many ActiveX tools, Java, Flash, etc are limited to non-existant.  Basically i can use HTML, CSS, IE, and Javascript.  And i cannot be a server on my end.  Though i have been able to use ActiveXObject("XMLHTTP") successfully.

The remote server and web browser client interface using DHTML communicate with one another well and it does work.  The problem Im experiencing is the returned JPG images which can be full screen 1024x768 pics to small partial images of 5x5 pixels are being "overlayed" on top of one another to give the illusion of a changing desktop in the web browser client interface.  It works but the memory it chews up is phenomenal.  I've looked at Task Manager and have gotten the IEXPLORE.EXE process up to 160MB.  When i dump all the images i am back down to 19MB.  Ouch.

I'm looking for an overlay approach that is more efficient with received JPG images.  Preferably I want the images "composited"  overtop the other and then the image object dropped as i dont care much about it as the imagery has been pasted/painted on screen anyway, and so releasing the image object memory is beneficial.  Perhaps an ActiveXObject/DirectX solution is out there to actually draw the images overtop one another.  Basically instead of retrieving and overlaying hundreds of images one on top of the other I want to simply paint overtiop of the same canvas image retaining the same memory usage.

Is there some kind of technique out there regardless of complexity which i could use under the web browser to give me such control?  The closest I've found are CSS filters but again these retain objects rather than painting overtop of one another.

Thanks for anything.
Question by:barkin

Accepted Solution

fatalXception earned 272 total points
ID: 13411359
Off the top of my head I can think of one potential solution although I am not sure it will fit your needs.
Re-write the Client application to act as a very tiny web server (minmal functionality) and when taking the screen grabs, save them as a jpeg in some directory or other on the client computer.
Then on your "server side" browser, have an img tag which points to the remote image as in
<img src = "client computer/RemoteAssistance/screen.jpg>

and just refresh this at the desired intervals. So rather than the client "pushing" a jpg to you every second or whatever, you are "pulling" the jpg from them to you, say when you move the mouse or every 2/3 seconds. And as it's an img tag as opposed to a variable, it will take up the same amount of memory constantly.
That would overcome the memory problems associated with creating a new image object every frame.
Just an off the top of my head idea.
LVL 23

Assisted Solution

sciwriter earned 264 total points
ID: 13417757
You are basically talking Z-indexing.  I.e. hiding and showing layers based on their visibility or Z index -- you can write different text or images to different layers, then just make one layer visible by changing the z-index, while all the rest remain there, but unseen.  

In your case, you need to realize this is a fairly new DHTML technology, and it is unlikely that IE 5.5 will do what you want, completely that is.  If you can assume IE 6+ and the latest Mozilla browsers, they both handle this fine.

Go on a google search for javascript z-indexing, see if that will help -- it is a complex topic, don't give up too soon.
LVL 10

Assisted Solution

BobSiemens earned 264 total points
ID: 13422959
Have you considered using a tool like this one:


Use a command line tool or lined library which will, on the server side, ovelay images.  That way, you aren't trying to send up a bunch of images and work out the overlay on the client side.  Instead you'd send up one image which has been composed on the server using relatively simple graphics manipulations.

Featured Post

Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article covers the basics of the Sass, which is a CSS extension language. You will learn about variables, mixins, and nesting.
What is Node.js? Node.js is a server side scripting language much like PHP or ASP but is used to implement the complete package of HTTP webserver and application framework. The difference is that Node.js’s execution engine is asynchronous and event…
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…
Suggested Courses

580 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question