x404.co.uk
http://www.x404.co.uk/forum/

Quick JavaScript help
http://www.x404.co.uk/forum/viewtopic.php?f=4&t=3556		 Page 1 of 1
Author:  forquare1 [ Wed Oct 21, 2009 1:02 pm ]
Post subject:  Quick JavaScript help
Hi all,

I'm using some code from Google to display my calendar on my site. The calendar has the page all to itself, so I want it to use that space.

Here is the code that Google has given me:
Code:
<iframe src="http://www.google.com/calendar/embed?showTitle=0&amp;showTz=0&amp;mode=WEEK&amp;height=800&amp;wkst=2&amp;hl=en_GB&amp;bgcolor=%23FFFFFF&amp;src=r6hvesmti907td536jic587qjc%40group.calendar.google.com&amp;color=%23A32929&amp;src=uhs1ae2hpi627do94fv04cbu64%40group.calendar.google.com&amp;color=%235229A3&amp;src=96vjq6maahq5klghj1rkf52qco%40group.calendar.google.com&amp;color=%232952A3&amp;src=cceghn5fc6713q86h14lp62b5g%40group.calendar.google.com&amp;color=%230D7813&amp;ctz=Europe%2FLondon" style=" border:solid 1px #777 " width="1000" height="800" frameborder="0" scrolling="no"></iframe>


As you can see, within the src attribute there is a width flag, and there is also a width and a height attribute as part of the iframe tag.
What I want to do (I think) is grab how big the users window is, then place the width and height in the given places (probably best to take a few pixels off for good measure before hand too).

Anyone know how I can achieve this? JavaScript is and option, as is PHP.

If anyone could lend a hand that'd be great,

Ben

Edit: Page will be displayed here:
http://www.hashbang0.com/calendar/
Author:  EddArmitage [ Wed Oct 21, 2009 1:12 pm ]
Post subject:  Re: Quick JavaScript/PHP help
I'm guessing it's got to be js, as php would involve lots of messy passing back and forth from server to client to server and back to the client. I'm not going to be much use, sorry :(
Author:  forquare1 [ Wed Oct 21, 2009 1:30 pm ]
Post subject:  Re: Quick JavaScript help
Thanks for posting Edd. I suspected JS was going to 'cleaner', it does irk me that such a horrid thing must be used, but then again the calendar itself is all JS, so I suppose I should quit complaining...

I've found this code:
Code:
var winW = 630, winH = 460;

if (parseInt(navigator.appVersion)>3) {
 if (navigator.appName=="Netscape") {
  winW = window.innerWidth-16;
  winH = window.innerHeight-16;
 }
 if (navigator.appName.indexOf("Microsoft")!=-1) {
  winW = document.body.offsetWidth-20;
  winH = document.body.offsetHeight-20;
 }
}

(from http://www.javascripter.net/faq/browserw.htm )

Would this work for me? I've no idea how to wrap it up so the web server doesn't try and parse it like HTML, and I've no idea how to use the variables winW and winH in general HTML code...
Author:  forquare1 [ Wed Oct 21, 2009 5:22 pm ]
Post subject:  Re: Quick JavaScript help
Solved :D
It's a nasty hack, but it works well enough...

Code:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">



<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
   <title>Ben's Life</title>
   
   <script type="text/javascript">
   <!--
   function getHeight()
   {
      var y = 0;
              if (self.innerHeight)
              {
                      y = self.innerHeight;
              }
              else if (document.documentElement && document.documentElement.clientHeight)
              {
                      y = document.documentElement.clientHeight;
              }
              else if (document.body)
              {
                      y = document.body.clientHeight;
              }
      return y-35;
      
   }
   //-->
   </script>
   
   <script type="text/javascript">
   <!--
   function getWidth()
   {
      var x = 0;
              if (self.innerHeight)
              {
                      x = self.innerWidth;
              }
              else if (document.documentElement && document.documentElement.clientHeight)
              {
                      x = document.documentElement.clientWidth;
              }
              else if (document.body)
              {
                      x = document.body.clientWidth;
              }
      return x-35;
      
   }
   //-->
   </script>
   

</head>

<body>
   
   <script type="text/javascript">
   <!--
      document.write("<P ALIGN=center><iframe src='http://www.google.com/calendar/embed?title=Bens%20Life&amp;showTz=0&amp;mode=WEEK&amp;height="+getHeight()+"&amp;wkst=2&amp;hl=en_GB&amp;bgcolor=%23FFFFFF&amp;src=r6hvesmti907td536jic587qjc%40group.calendar.google.com&amp;color=%23A32929&amp;src=uhs1ae2hpi627do94fv04cbu64%40group.calendar.google.com&amp;color=%235229A3&amp;src=96vjq6maahq5klghj1rkf52qco%40group.calendar.google.com&amp;color=%232952A3&amp;src=cceghn5fc6713q86h14lp62b5g%40group.calendar.google.com&amp;color=%230D7813&amp;ctz=Europe%2FLondon' style=' border-width:0 ' width='"+getWidth()+"' height='"+getHeight()+"' frameborder='0' scrolling='no'></iframe></P>");
   //-->
   </script>
   


</body>
</html>
Page 1 of 1 All times are UTC
Powered by phpBB® Forum Software © phpBB Group
https://www.phpbb.com/