Advanced search  

News:

CPG Release 1.6.26
Correct PHP8.2 issues with user and language managers.
Additional fixes for PHP 8.2
Correct PHP8 error with SMF 2.0 bridge.
Correct IPTC supplimental category parsing.
Download and info HERE

Pages: [1] 2   Go Down

Author Topic: Custom javascript code to footer  (Read 13149 times)

0 Members and 1 Guest are viewing this topic.

mykee

  • Contributor
  • Coppermine frequent poster
  • ***
  • Country: hu
  • Offline Offline
  • Gender: Male
  • Posts: 140
    • One moment from Hungary
Custom javascript code to footer
« on: August 14, 2013, 10:01:49 am »

Hi all,

I have a question: how can I put a custom (ex. javascript) code to before </body> tag with a plugin?
I write a plugin, and I used page_header filter, but this not helped, I need insert my code to end of page.

Thanks,
Mykee
Logged
My gallery and demo for AnythingSlider, Photocols and CollagePlus plugin: http://foto.acegem.hu/index.php

Stramm

  • Dev Team member
  • Coppermine addict
  • ****
  • Country: 00
  • Offline Offline
  • Gender: Male
  • Posts: 6006
    • Bettis Wollwelt
Re: Custom javascript code to footer
« Reply #1 on: August 14, 2013, 06:31:35 pm »

Have a look at the list of plugin hooks
http://documentation.coppermine-gallery.net/en/dev_plugin_hooks.htm

eg. you can use page_start to add your .js to the list of added files

Depending on what you want to achive use eg. the hooks file_data, page_html or gallery_footer to call your script. As said, have a look at the list of hooks and chose the one that fits your needs.

mykee

  • Contributor
  • Coppermine frequent poster
  • ***
  • Country: hu
  • Offline Offline
  • Gender: Male
  • Posts: 140
    • One moment from Hungary
Re: Custom javascript code to footer
« Reply #2 on: August 14, 2013, 08:19:28 pm »

Thanks, I used page_html and page_footer too, code is there on footer, but no runned. :-( I get this error in IE debugger: jQuery not defined. If I add directly this code, then working. I don't understand...

Here is my code:
Code: [Select]
$thisplugin->add_filter('gallery_footer','isotope_footer_addons');

Code: [Select]
function isotope_footer_addons($html)
{
global $ISOTOPESET, $CONFIG, $CPG_PHP_SELF, $JS;

   $footblock =
<<< EOT
<script type="text/javascript">
  $(function (){
      var $container = $('#isocontainer');
   
      $container.imagesLoaded( function(){
        $container.isotope({
          itemSelector : '.photo'
        });
      });
      $(".tiptip").tipTip();
     
EOT;
if ($ISOTOPESET['isotope_lbox'] == 1) {
$footblock .= <<< EOT
// Use this example, or...
// $('a[@rel*=lightbox]').lightBox(); // Select all links that contains lightbox in the attribute rel
// This, or...
// $('#gallery a').lightBox(); // Select all links in object with gallery ID
// This, or...
$('a.lightbox').lightBox({
  imageLoading: 'plugins/isotope/lightbox2/images/lightbox-ico-loading.gif',
imageBtnClose: 'plugins/isotope/lightbox2/images/lightbox-btn-close.gif',
imageBtnPrev: 'plugins/isotope/lightbox2/images/lightbox-btn-prev.gif',
imageBtnNext: 'plugins/isotope/lightbox2/images/lightbox-btn-next.gif',
  containerResizeSpeed: 350,
  keyToClose: 'x',
  txtImage: 'Kép:',
txtOf: ', Összesen:',
  attribute: 'rel'
  });
  // Select all links with lightbox class
// This, or...
// $('a').lightBox(); // Select all links in the page
// ... The possibility are many. Use your creative or choose one in the examples above
EOT;
}
$footblock .= <<< EOT

});
</script>
EOT;

  $htmlclose = $footblock."</body>";
   $html = str_replace("</body>", $htmlclose, $html);

    return $html;
}


Here is my direct code to html part, what working:
Code: [Select]
<script type="text/javascript">
    $(function(){
      var $container = $('#isocontainer');
   
      $container.imagesLoaded( function(){
        $container.isotope({
          itemSelector : '.photo'
        });
      });
      $(".tiptip").tipTip();

   <?php if ($ISOTOPESET['isotope_lbox'] == 1) { ?>   
// Use this example, or...
// $('a[@rel*=lightbox]').lightBox(); // Select all links that contains lightbox in the attribute rel
// This, or...
// $('#gallery a').lightBox(); // Select all links in object with gallery ID
// This, or...
$('a.lightbox').lightBox({
  imageLoading: 'plugins/isotope/lightbox2/images/lightbox-ico-loading.gif',
imageBtnClose: 'plugins/isotope/lightbox2/images/lightbox-btn-close.gif',
imageBtnPrev: 'plugins/isotope/lightbox2/images/lightbox-btn-prev.gif',
imageBtnNext: 'plugins/isotope/lightbox2/images/lightbox-btn-next.gif',
  containerResizeSpeed: 350,
  keyToClose: 'x',
txtImage: 'Kép:',
txtOf: ', Összesen:',
  attribute: 'rel'
  }); // Select all links with lightbox class
// This, or...
// $('a').lightBox(); // Select all links in the page
// ... The possibility are many. Use your creative or choose one in the examples above
  <?php ?>
 
    });     
</script> 
Logged
My gallery and demo for AnythingSlider, Photocols and CollagePlus plugin: http://foto.acegem.hu/index.php

mykee

  • Contributor
  • Coppermine frequent poster
  • ***
  • Country: hu
  • Offline Offline
  • Gender: Male
  • Posts: 140
    • One moment from Hungary
Re: Custom javascript code to footer
« Reply #3 on: August 16, 2013, 11:19:39 am »

Tried with page_footer, page_html too, insert to before </body> and to head with document ready functions, but not helped. :( Inserted code not runned. I drop this solution, and integrate script after display code (inside body), and then working. I don't understand why not working in head or before closed body. Like render html, and insert code after this, and browsers not running this code.  :(
Logged
My gallery and demo for AnythingSlider, Photocols and CollagePlus plugin: http://foto.acegem.hu/index.php

Stramm

  • Dev Team member
  • Coppermine addict
  • ****
  • Country: 00
  • Offline Offline
  • Gender: Male
  • Posts: 6006
    • Bettis Wollwelt
Re: Custom javascript code to footer
« Reply #4 on: August 16, 2013, 11:43:46 am »

Please zip your plugin and attach it to your next post

mykee

  • Contributor
  • Coppermine frequent poster
  • ***
  • Country: hu
  • Offline Offline
  • Gender: Male
  • Posts: 140
    • One moment from Hungary
Re: Custom javascript code to footer
« Reply #5 on: August 16, 2013, 12:01:39 pm »

Here is my plugin. Include four jQuery plugin in one addon with different licenses, and not ready yet. I plan a few function too, but working now correctly.
Logged
My gallery and demo for AnythingSlider, Photocols and CollagePlus plugin: http://foto.acegem.hu/index.php

mykee

  • Contributor
  • Coppermine frequent poster
  • ***
  • Country: hu
  • Offline Offline
  • Gender: Male
  • Posts: 140
    • One moment from Hungary
Re: Custom javascript code to footer
« Reply #6 on: August 16, 2013, 02:39:40 pm »

Just for a fair play: here is corrected licensed plugin for JQuery authors, who's include my plugin header with site links. Many thanks for authors!

I hope this will ok.
Logged
My gallery and demo for AnythingSlider, Photocols and CollagePlus plugin: http://foto.acegem.hu/index.php

Αndré

  • Administrator
  • Coppermine addict
  • *****
  • Country: de
  • Offline Offline
  • Gender: Male
  • Posts: 15764
Re: Custom javascript code to footer
« Reply #7 on: August 20, 2013, 03:39:24 pm »

Is this thread solved?
Logged

mykee

  • Contributor
  • Coppermine frequent poster
  • ***
  • Country: hu
  • Offline Offline
  • Gender: Male
  • Posts: 140
    • One moment from Hungary
Re: Custom javascript code to footer
« Reply #8 on: August 21, 2013, 07:57:03 am »

No, original problem is live (put code after site render and not working), but solved with inline script. This solution no nice, because I'd like put code to footer, but I cannot use. :(
Logged
My gallery and demo for AnythingSlider, Photocols and CollagePlus plugin: http://foto.acegem.hu/index.php

Αndré

  • Administrator
  • Coppermine addict
  • *****
  • Country: de
  • Offline Offline
  • Gender: Male
  • Posts: 15764
Re: Custom javascript code to footer
« Reply #9 on: August 21, 2013, 10:27:31 am »

Please try the attached plugin. The main issue was that you used
Code: [Select]
$containerinstead of
Code: [Select]
containeror
Code: [Select]
\$container
Logged

mykee

  • Contributor
  • Coppermine frequent poster
  • ***
  • Country: hu
  • Offline Offline
  • Gender: Male
  • Posts: 140
    • One moment from Hungary
Re: Custom javascript code to footer
« Reply #10 on: August 21, 2013, 10:40:26 am »

Many thanks for great help, I will try it at today, and rewrite this plugin with your codes!  :D Many thanks!
Logged
My gallery and demo for AnythingSlider, Photocols and CollagePlus plugin: http://foto.acegem.hu/index.php

mykee

  • Contributor
  • Coppermine frequent poster
  • ***
  • Country: hu
  • Offline Offline
  • Gender: Male
  • Posts: 140
    • One moment from Hungary
Re: Custom javascript code to footer
« Reply #11 on: August 22, 2013, 06:14:07 pm »

Thanks, this tip helped and solved my problem! Many thanks for great help!
Logged
My gallery and demo for AnythingSlider, Photocols and CollagePlus plugin: http://foto.acegem.hu/index.php

mykee

  • Contributor
  • Coppermine frequent poster
  • ***
  • Country: hu
  • Offline Offline
  • Gender: Male
  • Posts: 140
    • One moment from Hungary
Re: Custom javascript code to footer
« Reply #12 on: August 24, 2013, 02:02:47 pm »

Eh, I have a problem with language parameter. I added this global to function:
Code: [Select]
global $ISOTOPESET,$CPG_PHP_SELF,$lang_plugin_isotope;But when I use print_r, then I see: lang array is empty.  :o Why not get my plugin language?

Here is footer script now:
Code: [Select]
// Add script to footer
function isotope_footer_addons($html) {
    global $ISOTOPESET,$CPG_PHP_SELF, $lang_plugin_isotope;

$isotope_pages_array = array('index.php');
 if (in_array($CPG_PHP_SELF, $isotope_pages_array) == TRUE)
 {
 
    print_r ($lang_plugin_isotope); exit;
    $betext = $lang_plugin_isotope['linktext'];
    $linktext = "'".$betext."'";
       
   $footblock = <<< EOT
<script type="text/javascript">
$(function(){
//Isotope plugin


     
      var count = $('#isocontainer').length;
      count = count + 1;
      var container = $('.container');
     
      container.imagesLoaded( function(){
        container.isotope({
          itemSelector : '.photo'
        });
      });
     
       $("#isotope_filter:first").attr('id', 'isotope_filter'+0);
       $("#isotope_filter.isotopemenu").attr('id', '').parent().hide();
           
    for (i=0;count>i;i++){     
       $('#isocontainer').attr('id', 'isocontainer'+i);     
      }     
     
      $('a.isoitem').click(function(){
      var selector = $(this).attr('data-filter');
      container.isotope({ filter: selector });
      $(".active").removeClass("active");
      $(this).addClass("active");
      return false;
        });
     
   
     
EOT;

  if ($ISOTOPESET['isotope_adipoli'] == 1) {
  $footblock .= <<< EOT
//Adipoli plugin
      $('.adipoli').adipoli({
          'startEffect' : '{$ISOTOPESET['isotope_adipoli_start']}',
          'hoverEffect' : '{$ISOTOPESET['isotope_adipoli_hover']}',
          'imageOpacity': '0.8', // default: 0.5, set value 0 - full transparent to 1 - no transparent with 0.10 steps
          'animSpeed' : '50' //default: 300 - milliseconds
      });
EOT;
  }
     
//TipTip addons     
    $footblock .= <<< EOT
      $(".tiptip").tipTip({maxWidth: '400px'});
EOT;
     
     
   
   if ($ISOTOPESET['isotope_lbox'] == 1) {
   
   $footblock .= <<< EOT
//Lightbox 0.51 plugin
      alert ({$linktext});
// Use this example, or...
// $('a[@rel*=lightbox]').lightBox(); // Select all links that contains lightbox in the attribute rel
// This, or...
// $('#gallery a').lightBox(); // Select all links in object with gallery ID
// This, or...
$('a.lightbox').lightBox({
  imageLoading: 'plugins/isotope/lightbox2/images/lightbox-ico-loading.gif',
imageBtnClose: 'plugins/isotope/lightbox2/images/lightbox-btn-close.gif',
imageBtnPrev: 'plugins/isotope/lightbox2/images/lightbox-btn-prev.gif',
imageBtnNext: 'plugins/isotope/lightbox2/images/lightbox-btn-next.gif',
  imageBlank: 'plugins/isotope/lightbox2/images/lightbox-blank.gif',
  containerResizeSpeed: 350,
  keyToClose: 'x',
  txtImage: 'Kép:',
  txtOf: ', Összesen:',
  attribute: 'add',
  Linktext: {$linktext}
  }); // Select all links with lightbox class
// This, or...
// $('a').lightBox(); // Select all links in the page
// ... The possibility are many. Use your creative or choose one in the examples above
EOT;
  }
 
$footblock .= <<< EOT

    });
</script>
EOT;

    $htmlclose = $footblock."</body>";
    $html = str_replace("</body>", $htmlclose, $html);
}
    return $html;
}
Logged
My gallery and demo for AnythingSlider, Photocols and CollagePlus plugin: http://foto.acegem.hu/index.php

Joe Carver

  • Dev Team member
  • Coppermine addict
  • ****
  • Country: us
  • Offline Offline
  • Gender: Male
  • Posts: 1545
  • aka 'i-imagine'
    • Home Page
Re: Custom javascript code to footer
« Reply #13 on: August 24, 2013, 03:07:17 pm »

This line doesn't make sense to me, although I am not certain what you are trying to do with the output. If you are just tying to show some text, remove the line entirely or comment it out.

    print_r ($lang_plugin_isotope); exit;

Unless you are trying to do something else, try return instead of exit in that line.
Quote from: http://php.net/manual/en/function.print-r.php
If you would like to capture the output of print_r(), use the return parameter. When this parameter is set to TRUE, print_r() will return the information rather than print it.

[edit]
Don't forget to include the lang file.
Code: [Select]
include(../../your_plugin/lang/plugin_lang.php);setting the path according your plugin's path.
[/]

Config>>Debug>>Notices should also be showing/helping you too.

This is a great resource for all to use... PHP.NET

« Last Edit: August 24, 2013, 03:45:24 pm by Joe Carver »
Logged

mykee

  • Contributor
  • Coppermine frequent poster
  • ***
  • Country: hu
  • Offline Offline
  • Gender: Male
  • Posts: 140
    • One moment from Hungary
Re: Custom javascript code to footer
« Reply #14 on: August 24, 2013, 04:50:58 pm »

Problem with my language only. Because if add global parameters $lang_meta_album_names or $lang_common, then I get array when use print_r like this:
Code: [Select]
print_r ($lang_meta_album_names); exit;
but with my language ($lang_plugin_isotope) not. :(
Under other function worked (like function isotope_mainpage), but under this function I get empty (false) array.
I will check debug mode, but I think under this no call my $lang_plugin_isotope global.
Logged
My gallery and demo for AnythingSlider, Photocols and CollagePlus plugin: http://foto.acegem.hu/index.php

mykee

  • Contributor
  • Coppermine frequent poster
  • ***
  • Country: hu
  • Offline Offline
  • Gender: Male
  • Posts: 140
    • One moment from Hungary
Re: Custom javascript code to footer
« Reply #15 on: August 24, 2013, 05:03:27 pm »

Thanks, I solved it!
I put code to function isotope_footer_addons($html) from my init.inc.php. No called if use this:
Code: [Select]
require('./plugins/isotope/include/init.inc.php');

After put lang codes to function, then working. :) Great thanks!
Logged
My gallery and demo for AnythingSlider, Photocols and CollagePlus plugin: http://foto.acegem.hu/index.php

mykee

  • Contributor
  • Coppermine frequent poster
  • ***
  • Country: hu
  • Offline Offline
  • Gender: Male
  • Posts: 140
    • One moment from Hungary
Re: Custom javascript code to footer
« Reply #16 on: August 24, 2013, 05:07:06 pm »

Modified to this, and it's ok:
Code: [Select]
global $CONFIG,$ISOTOPESET,$CPG_PHP_SELF;

require('./plugins/isotope/include/init.inc.php');
Logged
My gallery and demo for AnythingSlider, Photocols and CollagePlus plugin: http://foto.acegem.hu/index.php

mykee

  • Contributor
  • Coppermine frequent poster
  • ***
  • Country: hu
  • Offline Offline
  • Gender: Male
  • Posts: 140
    • One moment from Hungary
Re: Custom javascript code to footer
« Reply #17 on: August 24, 2013, 05:11:34 pm »

Modified to this, and it's ok:
It's not ok, because under admin settings missing any text. I use this in function:
Code: [Select]
global $CONFIG,$ISOTOPESET,$CPG_PHP_SELF;


if (file_exists("./plugins/isotope/lang/{$CONFIG['lang']}.php")) {
  require "./plugins/isotope/lang/{$CONFIG['lang']}.php";
} else {require "./plugins/isotope/lang/english.php";}
Logged
My gallery and demo for AnythingSlider, Photocols and CollagePlus plugin: http://foto.acegem.hu/index.php

Αndré

  • Administrator
  • Coppermine addict
  • *****
  • Country: de
  • Offline Offline
  • Gender: Male
  • Posts: 15764
Re: Custom javascript code to footer
« Reply #18 on: August 26, 2013, 10:21:37 am »

There are 2 possibilities to make your language file array available:
1. include your plugin's init.inc.php file to every function, where needed
2. use the plugin hook "page_start" to make your language array globally accessible (have a look at e.g. the more_meta_albums plugin if you don't know how to do that)
Logged

mykee

  • Contributor
  • Coppermine frequent poster
  • ***
  • Country: hu
  • Offline Offline
  • Gender: Male
  • Posts: 140
    • One moment from Hungary
Re: Custom javascript code to footer
« Reply #19 on: August 26, 2013, 10:45:50 am »

Thanks André!

If I use require line for init.inc.php under isotope_footer_addons($html) function, then under Plugin Manager will not show any text under my plugin  :o
If I use inline solution (like in my previous comment), then working.

I don't understand why working directly in main code (in same codebase.php), but under page footer functions not.  ???
Here is filters:
Code: [Select]
$thisplugin->add_filter('plugin_block','isotope_mainpage');
$thisplugin->add_filter('gallery_footer','isotope_footer_addons');

- under function isotope_mainpage() is working directly this "global $lang_plugin_isotope"
- under function isotope_footer_addons($html) is not working this "global $lang_plugin_isotope"

If I add to "page_start" filter, then I can delete this from isotope_mainpage() function?  ::) And this will not get any problem under Plugin Manager? (I will try it.)

 ???
Logged
My gallery and demo for AnythingSlider, Photocols and CollagePlus plugin: http://foto.acegem.hu/index.php
Pages: [1] 2   Go Up
 

Page created in 0.026 seconds with 20 queries.