Pages

Sunday, June 24, 2018

New Plugin: Image Gallery


Image Gallery Pluign


   Image Gallery is plugin to display images based on prettyPhoto javascript library.

  How to Use


  Create a Region, choose Type "Image Gallery[Plug-In]" and in Region source enter following code:

select 'f?p=&APP_ID.:0:&APP_SESSION.:APPLICATION_PROCESS=GETFILE:::FILE_ID:'||
your_image_id SHOW_IMAGE,
your_image_name FILENAME,
your_image_id IMAGE_ID,
 APEX_UTIL.PREPARE_URL(
    p_url => 'f?p=' ||:APP_ID || ':4:'||:APP_SESSION||'::NO::P4_ID:'||your_image_id,
    p_checksum_type => 'SESSION') IMAGE_URL
from your_table
  Create Application Process onDemand GETFILE with following code:


    begin

    for c1 in (select *

                 from your_table

                where id = :FILE_ID) loop

        --

        sys.htp.init;

        sys.owa_util.mime_header( c1.mime_type, FALSE );

        sys.htp.p('Content-length: ' || sys.dbms_lob.getlength( c1.content));

        sys.htp.p('Content-Disposition: attachment; filename="' || c1.filename || '"' );

        sys.htp.p('Cache-Control: max-age=3600');  -- tell the browser to cache for one hour, adjust as necessary

        sys.owa_util.http_header_close;

        sys.wpg_docload.download_file( c1.content );

    

        apex_application.stop_apex_engine;

    end loop;

    end;

 
  Create Application Item FILE_ID where we store ID of image

Options 


 1. Style

    you can choose different style of prettyPhoto image Gallery
2. Autoplay slideshow

    with or without auto slideshow

 3. Animation speed

 4. Slideshow

     Duration of slideshow in miliseconds
5.Link icon   Icon for random link

How to get it 

Preview


Here is the link to a working demo:  

demo username/password: demo/demo



Posted by at

28 comments:

  1. houshmandJune 26, 2018 at 12:57 AM

    hi,
    Application Process onDemand which option Process Point:
    on demand,on submit, ajax callback ?

    ReplyDelete
  2. AnonymousJuly 15, 2018 at 12:15 PM

    Hello,
    I'm using Apex 5.1.4, but when I import the plugin it returns an error: "NOT COMPATIBLE (Your export may contain calls not supported by your application version.)".
    meanwhile; in the read me file it tells this plugin compatible from '5.0' to '18.1'
    So, please help what is the problem here?

    ReplyDelete
    Replies
    1. nhaskoJuly 25, 2018 at 5:31 AM

      Hello
      I have exported this plugin from apex 18.1
      I will update plugin on github in next release

      Delete
  3. Ahmed ElgamalJuly 15, 2018 at 12:18 PM

    Hello,
    I'm using Apex 5.1.4, but when I import the plugin it returns an error: "NOT COMPATIBLE (Your export may contain calls not supported by your application version.)".
    meanwhile; in the read me file it tells this plugin compatible from '5.0' to '18.1'
    So, please help what is the problem here?

    ReplyDelete
    Replies
    1. nhaskoJuly 25, 2018 at 5:32 AM

      Hello
      I have exported this plugin from apex 18.1
      I will update plugin on github in next release

      Delete
  4. AnonymousJuly 17, 2018 at 4:33 AM

    Thank you very much for your input. I liked your gallery of images.
    When importing your plugging gives me an error of: NOT COMPATIBLE.
    Version of the database: 12.1.0.2
    APEX version: 5.1.1

    ReplyDelete
    Replies
    1. nhaskoJuly 25, 2018 at 5:32 AM

      Hello
      I have exported this plugin from apex 18.1
      I will update plugin on github in next release

      Delete
  5. Wayne lenAugust 25, 2018 at 7:57 AM

    Hai Thank you so much. Like your gallery of images.
    Found that you demo pages, first click on image able to select edit or view. Is it the features not in plug-in? Wish to know how to do it.

    ReplyDelete
  6. nhaskoAugust 29, 2018 at 6:46 AM

    Hi,
    thank you for useing it. That is plugin feature. To have this feature you need in your select statment add column with link to your edit page like this:

    APEX_UTIL.PREPARE_URL(
    p_url => 'f?p=' ||:APP_ID || ':4:'||:APP_SESSION||'::NO::P4_ID:'||your_image_id,
    p_checksum_type => 'SESSION') IMAGE_URL

    The column alias must be IMAGE_URL.

    I hope it will help you.

    Nihad

    ReplyDelete
  7. AsaduzzamanJanuary 8, 2019 at 8:00 AM

    This comment has been removed by the author.

    ReplyDelete
  8. AsaduzzamanJanuary 8, 2019 at 8:11 AM

    Dear thank you,
    can you please explain
    your_image_id,
    what do you mean by image_id

    ReplyDelete
  9. Muhammad Ahmed KhanFebruary 18, 2019 at 7:18 AM

    i need carousel region that fetch images from database ... can you help me with that please

    ReplyDelete
    Replies
    1. nhaskoFebruary 25, 2019 at 5:05 AM

      When i get free time i will look into this..

      Delete
  10. Carlos BrítezApril 22, 2019 at 7:19 AM

    Hello! i love this plugin, it works perfectly in non-public pages, but when I change the page to publish it stops showing the images, I already change the application process to Public and it does not work, do you know why it could be?

    ReplyDelete
    Replies
    1. Carlos BrítezApril 22, 2019 at 7:56 AM

      Hello! I solved it alone, but if it's useful to someone, the page 10 is the page of the gallery and it have to be public, the link should point to the page 10, not 0, like this example
      select 'f?p=&APP_ID.:10:&APP_SESSION.:APPLICATION_PROCESS=GETFILE:::FILE_ID:'||id SHOW_IMAGE,
      name FILENAME,
      id IMAGE_ID,
      null IMAGE_URL
      from sbinfo.images

      Delete
  11. Carlos BrítezApril 22, 2019 at 7:55 AM

    This comment has been removed by the author.

    ReplyDelete
  12. askFebruary 18, 2020 at 8:16 PM

    how do i get the image_URL

    ReplyDelete
    Replies
    1. nhaskoFebruary 19, 2020 at 5:33 AM

      Hello,

      You need at first to create application Process 'GETFILE' with following code

      begin

      for c1 in (select *
      from your_table
      where id = :FILE_ID) loop
      --

      sys.htp.init;

      sys.owa_util.mime_header( c1.mime_type, FALSE );
      sys.htp.p('Content-length: ' || sys.dbms_lob.getlength( c1.content));
      sys.htp.p('Content-Disposition: attachment; filename="' || c1.filename || '"' );
      sys.htp.p('Cache-Control: max-age=3600'); -- tell the browser to cache for one hour, adjust as necessary
      sys.owa_util.http_header_close;
      sys.wpg_docload.download_file( c1.content );

      apex_application.stop_apex_engine;

      end loop;
      end;

      and then in select list you put for image_URL folowing code

      'f?p=&APP_ID.:0:&APP_SESSION.:APPLICATION_PROCESS=GETFILE:::FILE_ID:'||image_id

      image id is id of your image in table

      if you have more question feel free to ask.

      Regards,

      Nihad

      Delete
  13. Carlos BMarch 3, 2020 at 11:40 AM

    Hi Nihad! You did a great job with this plugin! Awesome! I've a question. Is possible implement a refresh for the gallery? I've a button that open a form to add a new image. This works fine, the image is stored in DB, but after this I can't refresh the gallery. I tried with a dynamic action

    ReplyDelete
  14. Edward LogJuly 21, 2020 at 10:26 AM

    Hi Nihad! you did a great job, but the image is not displaying for me the empty page is displying for me, there is a error in console. So please help me

    Application Process
    begin
    for c1 in (select *
    from tst
    where IDNUMBER = :FILE_ID) loop

    sys.htp.init;
    sys.owa_util.mime_header( c1.MIMETYPE, FALSE );
    sys.htp.p('Content-length: ' || sys.dbms_lob.getlength( c1.PRGIMAGE));
    sys.htp.p('Content-Disposition: attachment; filename="' || c1.PROGNAME || '"' );
    sys.htp.p('Cache-Control: no-cache');
    sys.owa_util.http_header_close;
    sys.wpg_docload.download_file( c1.PRGIMAGE );

    apex_application.stop_apex_engine;
    end loop;
    end;
    ----------------------------------
    Select Query

    select 'f?p=&APP_ID.:0:&APP_SESSION.:APPLICATION_PROCESS=GETFILE:::FILE_ID:'||IDNUMBER SHOW_IMAGE,
    PROGNAME FILENAME,
    IDNUMBER IMAGE_ID,
    null IMAGE_URL
    from test

    -------------------
    I created FILE_ID in application items

    --------------------
    Please tell me what's my mistake


    ---------------------

    ReplyDelete
  15. Edward LogJuly 21, 2020 at 10:27 AM

    The table name is also tst in select query, I mistakenly typed test, SO the table name is tst only

    ReplyDelete
  16. Edward LogJuly 22, 2020 at 1:49 AM

    Pls anybody help me, I need this plugin urgently

    ReplyDelete
    Replies
    1. nhaskoJuly 24, 2020 at 2:10 AM

      Hi Edward,

      can you pleas contact me on nhasko@gmail.com, i will try to help you.

      Kind Regards,

      Nihad

      Delete
  17. Edward LogJuly 27, 2020 at 2:49 AM

    Hi nhasko,
    I mailed you. please help me, I need this plugin urgenly.

    ReplyDelete
  18. Edward LogJuly 27, 2020 at 7:26 AM

    Thanks for your Swift reply. I mailed you the table structure. Please check it.

    ReplyDelete
  19. Edward LogJuly 27, 2020 at 10:23 AM

    Hey Nihad,
    Thanks for your timely help! Your blog has been a great help to me always. Its so humble of you, how you respond immediately to those in need of your help.
    Will definetly contact you in the future in case of any help.
    Way to go buddy!
    Thanks & Regards,
    Edward Log.

    ReplyDelete

Subscribe to: Post Comments (Atom)