Here is the image:

To create this demo, follow these steps:

  1. File | New | Other... | WebSnap | WebSnap Application
  2. Select Web App Debugger executable and give it a CoClass name of StreamImageTest2
  3. In the header file for the WebModule that was created, add: #include <Jpeg.hpp> after all the other includes.
  4. In the header file for the WebModule, add: TJPEGImage *m_pjpgImage; to the private section of the class that was generated.
  5. Double click on the WebModule, and add the following code in the OnCreate event:
    
      // Create a JPEGImage to keep around. This way we can dynamically
      // set the width and height of the image inside of the HTML.
      m_pjpgImage = new TJPEGImage;
    
      // Notice how I use QualifyFileName to find the full path to the
      // image from the current directory.
      AnsiString FileName = QualifyFileName("test.jpg");
      TFileStream *fsImage = new TFileStream(FileName, fmOpenRead | fmShareDenyNone);
      __try {
        m_pjpgImage->LoadFromStream(fsImage);
      }
      __finally {
        delete fsImage;
      }
      
  6. Select the WebModule and double click on the OnDestroy event from the Object Inspector, and add the following code:
    
      delete m_pjpgImage;
      
  7. From the WebSnap tab, drop down an Adapter
  8. Doubleclick on the Adapter, select the "New Item" button in the fields editor, and select an AdapterImageField.
  9. Select the AdapterImageField from the list, and change the Name in the Object Inspector to be ImageData
  10. Select the Events tab in the Object Inspector, and doubleclick on the OnGetImage event. Add the following code:
    
      Image = new TMemoryStream; // First, create the stream
      // Then, save the image out to the stream
      m_pjpgImage->SaveToStream(Image);
      // Be sure to set the MimeType to a jpeg
      MimeType = "image/jpeg";
      
  11. Doubleclick on the Adapter, select the "New Item" button in the fields editor, and select an AdapterField.
  12. Select the AdapterField from the list, and change the Name in the Object Inspector to be ImageWidth
  13. Select the Events tab in the Object Inspector, and doubleclick on the OnGetValue event. Add the following code:
    
          Value = m_pjpgImage->Width;
      
  14. Doubleclick on the Adapter, select the "New Item" button in the fields editor, and select an AdapterField.
  15. Select the AdapterField from the list, and change the Name in the Object Inspector to be ImageHeight
  16. Select the Events tab in the Object Inspector, and doubleclick on the OnGetValue event. Add the following code:
    
          Value = m_pjpgImage->Height;
      
  17. Click on the associated HTML file tab at the bottom of the code editor and add the following HTML to display the image:
    
      <P>Here is the image:<br>
      <img
      src="<%=Adapter1.ImageData.Image.AsHREF%>"
      width="<%=Adapter1.ImageWidth.Value%>"
      height="<%=Adapter1.ImageHeight.Value%>">
      

  18. Compile, and run it once to register it
  19. Start the WebAppDebugger, and select your ProjectName.CoClassName from the list. That's it!