CSS background-image: BLOB

e://

good day people
I wanted to know how to display a blob field as a background image of a div.

How can an image (jpg) file saved as a blob be output/displayed in a Web page using PL/SQL procedure. The hpt.prn does not work.

In a region type PL / SQL (anonymous block) I have:


<pre>
declare
cursor cr_cursor is
select ID
, BACKGROUND
, FILENAME
, MIMETYPE
, LAST_UPDATE_DATE
from CFG_BACKGROUND;
v_style VARCHAR(4000);
begin
v_style := '<style>';
FOR v_cursor IN cr_cursor LOOP
v_style := v_style||'.slide_'||v_cursor.ID||'{background:url('||v_cursor.FONDO )||') no-repeat 0 0;}';
END LOOP;
v_style := v_style || '</style>';
htp.print(v_style);
end;
</pre>



the result I want is this:

*<style>*
*.slide_1 { background-image:url(image.jpg) no-repeat 0 0;}*
*.slide_2 { background-image:url(photo.jpg) no-repeat 0 0;}*
*.slide_3 { background-image:url(image_one.jpg) no-repeat 0 0;}*
*.slide_4 { background-image:url(image_dog.jpg) no-repeat 0 0;}*
*</style>*

Edited by: e:// on 24/09/2010 13:46

Edited by: e:// on 24/09/2010 13:46

fac586

First of all, the CSS syntax isn't quite right. The <tt>background-image</tt> property only specifies the URL of the background image. To specify the <tt>background-position</tt> and <tt>background-repeat</tt> as well, use the <tt>background</tt> shorthand property.

Secondly, there are syntax errors in the PL/SQL region code:

v_style := v_style||'.slide_'||v_cursor.ID||'{background:url('||v_cursor.FONDO )||') no-repeat 0 0;}'; 

There's no <tt>FONDO</tt> member in the cursor record, and it's followed by a misplaced ')'...

Thirdly (and probably most important), the URL needs to point to a resource that will actually download the image to the browser. An On-Demand Process can be used for this:

1. Create application item <tt>ODP_CFG_BACKGROUND_ID</tt> to use as an image ID parameter for the ODP.

2. Create the <tt>ODP_CFG_BACKGROUND</tt> on-demand application process:

declare

  l_background  cfg_background.background%type;
  l_mimetype    cfg_background.mimetype%type;
  l_filename    cfg_background.filename%type;

begin

  select
            bg.background
          , bg.mimetype
          , bg.filename
  into
            l_background
          , l_mimetype
          , l_filename
  from
            cfg_background bg
  where
            bg.id = :odp_cfg_background_id;

  owa_util.mime_header(l_mimetype, false);
  htp.p('Content-Length: ' || dbms_lob.getlength(l_background));
  htp.p('Content-Disposition: filename="' || l_filename || '"');
  owa_util.http_header_close();
  wpg_docload.download_file(l_background); 

end;

3. Rewrite the PL/SQL region code to generate URLs to the ODP:

 begin

  htp.p('<style type="text/css">');

  for bg in (select to_char(id, 'tm9') id from cfg_background)
  loop
    htp.p(
         '.slide_'
      || bg.id
      || ' { background: url(f?p=&APP_ID.:&APP_PAGE_ID.:&APP_SESSION.:APPLICATION_PROCESS=odp_cfg_background:N::odp_cfg_background_id:'
      || bg.id
      || ') 0 0 no-repeat; }');
  end loop;

  htp.p('</style>');
  
end;

Note also that <tt>style</tt> is only valid within the page <tt>head</tt> element, so unless the page template contains a suitably placed region position a PL/SQL region may not be the best way to deliver the style sheet...

fac586

First of all, the CSS syntax isn't quite right. The <tt>background-image</tt> property only specifies the URL of the background image. To specify the <tt>background-position</tt> and <tt>background-repeat</tt> as well, use the <tt>background</tt> shorthand property.

Secondly, there are syntax errors in the PL/SQL region code:

v_style := v_style||'.slide_'||v_cursor.ID||'{background:url('||v_cursor.FONDO )||') no-repeat 0 0;}'; 

There's no <tt>FONDO</tt> member in the cursor record, and it's followed by a misplaced ')'...

Thirdly (and probably most important), the URL needs to point to a resource that will actually download the image to the browser. An On-Demand Process can be used for this:

1. Create application item <tt>ODP_CFG_BACKGROUND_ID</tt> to use as an image ID parameter for the ODP.

2. Create the <tt>ODP_CFG_BACKGROUND</tt> on-demand application process:

declare

  l_background  cfg_background.background%type;
  l_mimetype    cfg_background.mimetype%type;
  l_filename    cfg_background.filename%type;

begin

  select
            bg.background
          , bg.mimetype
          , bg.filename
  into
            l_background
          , l_mimetype
          , l_filename
  from
            cfg_background bg
  where
            bg.id = :odp_cfg_background_id;

  owa_util.mime_header(l_mimetype, false);
  htp.p('Content-Length: ' || dbms_lob.getlength(l_background));
  htp.p('Content-Disposition: filename="' || l_filename || '"');
  owa_util.http_header_close();
  wpg_docload.download_file(l_background); 

end;

3. Rewrite the PL/SQL region code to generate URLs to the ODP:

 begin

  htp.p('<style type="text/css">');

  for bg in (select to_char(id, 'tm9') id from cfg_background)
  loop
    htp.p(
         '.slide_'
      || bg.id
      || ' { background: url(f?p=&APP_ID.:&APP_PAGE_ID.:&APP_SESSION.:APPLICATION_PROCESS=odp_cfg_background:N::odp_cfg_background_id:'
      || bg.id
      || ') 0 0 no-repeat; }');
  end loop;

  htp.p('</style>');
  
end;

Note also that <tt>style</tt> is only valid within the page <tt>head</tt> element, so unless the page template contains a suitably placed region position a PL/SQL region may not be the best way to deliver the style sheet...

e://

thanks for the solution.

PeruFlashback

Hi Paul J MacMillan,
It works very well !
But it doesn't work for the login page.
I guess login page cann't call an application process... Is there a shorcut to get this ?
Thank you very much !

Edited by: mario1977 on Jan 17, 2013 11:20 AM