Forums

How to hardcode GoogleMaps block

Permalink 1 user found helpful
Can I hardcode GoogleMaps plugin into template?

If yes (what I assume) where can I find list of options for this block that need to be set in PHP?

Thanks
 
alphaboson replied on at Permalink Best Answer Reply
When you will hardcode ist,
why you will use the cc5 block?

In this case I would prefer to add the google api
whiteout anything else:
https://developers.google.com/maps/documentation/javascript/tutorial...

(when you will make the coordinates editable you can use a custom page attribute)
WalkingInTheDarkness replied on at Permalink Reply
the reason for hardcoding is:

1. GoogleMaps block is placed in the footer therefore it's displayed on every single page,
2. its parent div element is initially hidden and displayed when "Contact Us" link is clicked therefore is not easily editable for users

I will try method described in the link you have provided 'cause I am concerned about the result (having GoogleMaps displayed) not the specific way how to get it (using this particular addon),

Thanks!
JohntheFish replied on at Permalink Reply
JohntheFish
As above, if you are writing javascript, its probably easier to directly code the Google api. Just copy and paste some script from Google.

If you want to do it without code, you could have a global area containing a "Magic Toggle" block set to wrap the maps block, so it toggles on and off. If you really wanted, you could also ajax load the maps block using "Blocks by AJAX". So you could achieve what you want reasonably efficiently without writing any new code. Even as the developer of the addons I mention, in this case I would probably just write a few lines of javascript.
WalkingInTheDarkness replied on at Permalink Reply 1 Attachment
Thanks for replies, guys

Of course I chosed just adding some javascript to my home.js (thanks for link, alphaboson), and (almost) everything works as it should - however I encountered some small problem I cannot solve (I am not sure if should ask in this thread as this is completely not c5 related),

* div with GoogleMap is not displayed when page is loaded (class='hidden'),
* there are three links in footer that open extra div above footer, two of them display text documents, one contact details with GoogleMap (clicking one of them removes class='hidden')
* and now - when 'Contact' link is clicked extra div is displayed but the actual map occupies about 1/8 of designated div only (when other parts of GoogleMap like Google logo, dropdown list to change type of map and link to terms and conditions are placed over whole div) --> please see attached file
* when one of other links is clicked, contact div is faded out, new div appears - and if contact link is clicked again this time GoogleMap is displayed correctly

What may be reason of this?

(described behavior is not dependant on way of launching initialize() function - whether by 
google.maps.event.addDomListener(window, 'load', initialize);
or by 
$('#footer-basic-contact').click(function() {
      $('#footer-extra').removeClass('hidden');
      $('#footer-extra-privacy, #footer-extra-terms').fadeOut(900);
      $('#footer-extra-contact').delay(900).fadeIn(900);
      initialize();
   });
JohntheFish replied on at Permalink Reply
JohntheFish
Google maps doesn't like being rendered when hidden. I fixed the core map block as per:
https://github.com/concrete5/concrete5/pull/775...

The general technique is described in
http://www.concrete5.org/documentation/how-tos/developers/improve-r...

More discussion of the problem:
http://www.concrete5.org/community/forums/customizing_c5/google-map...
WalkingInTheDarkness replied on at Permalink Reply
thanks, I will look at your solution,

in a meanwhile I have discovered that removal of delay() from script solves the problem ;-)

//   replace
$('#footer-basic-contact').click(function() {
      (...)
      $('#footer-extra-contact').delay(900).fadeIn(900);
      (...)
   });
//   with:
$('#footer-basic-contact').click(function() {
      (...)
      $('#footer-extra-contact').fadeIn(1800);
      (...)
   });