ajax-dashboard question

Internet Creating Weather Web Sites
1

OK…I got the dashboard going fine.Added it to my current page but cant get it centered right. Its off to the right. Ive messed with the .css files, but havent gotten anywhere with that. I can post any files that might be of help. Thanks, Mark.

http://www.snoqualmieweather.com/

2

I looked at your page source and you have to head sections which are calling out 2 different css files. Here is a snippet from your page source. Something is not right here.

[color=red] [/color] 
[color=red][b]<link rel="stylesheet" type="text/css" href="./gila-screen.css" media="screen" title="Gila (screen)" />
<link rel="stylesheet" type="text/css" href="./gila-print.css" media="print" />[/b][/color]

<title>Snoqualmie, Washington Weather</title>
 <link rel="alternate" type="application/rss+xml" title="Snoqualmie Weather (RSS 2.0)" href="http://www.snoqualmieweather.com/rss-feed.php"  /> 
 <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />

<!-- ##### Header ##### -->

<div id="header">
  <h1 class="headerTitle">
   <a href="./index" title="Browse to homepage">Snoqualmie Weather</a>
  </h1>

  <div class="subHeader">
    <span class="doNotDisplay">Navigation: </span> |

    <a href="./forecast.php" title="7 Day Forecast">7 Day Forecast</a> |
    <a href="./wunderground.php" title="Wunderground">Wunderground</a> |
    <a href="./graphs.php" title="Graphs">Graphs</a> |
    <a href="./links.php" title="Links">Links</a> |
    <a href="./storm_report.php" title="Storm Report">Storm Report</a> |
          </div>

</div>

<div id="side-bar">

  <!-- ##### Left Sidebar ##### -->

  <div class="leftSideBar">

    <!-- menubar -->

    <p class="sideBarTitle">Navigation</p>

  • Home
  • Warnings/Advisories
  • NW Stations
  • Observation Map
    •       <li><a href="./earthquakes.php" title="Local Earthquakes">Earthquakes</a></li>
      <li><a href="./cameras.php" title="Live Webcam">Webcam</a></li>
      <li><a href="./wxrecords.php" title="Station Weather Records">Weather Records</a></li>
      <li><a href="./wxclimate.php" title="Climate Data">Climate Data</a></li>
      <li><a href="./wxlocal2.php" title="Sun and Moon Phases">Sun/Moon Phases</a></li>
      <li><a href="./wapindex.php" title="Cell/PDA">Cell/PDA</a></li>

      <li><a href="./status.php" title="System Status">System Status</a></li>
      <li><a href="./about.php" title="About">About</a></li>
      <li><a href="./contact.php" title="Contact Us">Contact</a></li>

External Links

    <p class="sideBarTitle"></p>

    <span class="sideBarText">
      <img src="rss.jpg" height="20" width="20" alt="RSS Feed"/>

RSS Feed

USA Weather Finder

PWS Weather

Free Page Rank Tool 
<!-- ##### Main Copy ##### -->
No Weather Records Have Been Established For This Station Today
There are no active watches, warnings or advisories for zone WAZ505.

[color=red] [/color] 
<meta name="description" content="Personal weather station." />
<meta http-equiv="content-type" content="application/xhtml+xml; charset=ISO-8859-1" />
[color=red][b]<link rel="stylesheet" type="text/css" href="weather-screen-orange-narrow.css" media="screen" title="screen" />
<link rel="stylesheet" type="text/css" href="weather-print-php.css" media="print" />[/b][/color]
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<title>Snoqualmie Weather</title>

Chuck

3

Thanks Chuck…yeah…I was thinking that was going to be a problem. Im running the dashboard as a standalone which its not really meant to be done that way. I’ll remove one of them .css files and see what happens.

4

I missed typed that you had 2 head sections. Which css are you using.

Chuck

5

a reminder im not using the templates. Im using


 <link rel="stylesheet" type="text/css" href="./gila-screen.css" media="screen" title="Gila (screen)" />

For the site…

and using this…



<link rel="stylesheet" type="text/css" href="weather-screen-orange-narrow.css" media="screen" title="screen" />

for the dashboard.

6

Well after messing with it enough, I got it.

7

Another question… i notice when I go to other peoples sites running the dashboard there Icons in the dashboard appear immediately. But mine don’t show up until the first update, is there anyway I can fix this so they appear faster instead of having the dreaded red x show up? Thanks.

8

Its because the Dashboard displays its data using two methods

  1. Javascript and
  2. regular html code
    The html displays first and is then refreshed by ajax at intervals.

I see that your are using different directories and file types for both methods and that the html directory doesn’t have the images in it, hence the red cross until Ajax refreshes it. These are where your images point to and their type:

Ajax - http://www.snoqualmieweather.com/ajax-images/wr-NNW.png
html - http://www.snoqualmieweather.com/images1/wr-NNE.jpg

Cheers

9

So…is what your saying is. I should have the same images in both folders? Did i understand you right?

10

You have two options I guess, change the http code to point to the right directory and image type, or copy all the pictures from ajax-images to images1 :wink:
cheers

11

OK… Thanks…I’ll copy them over to the other folder.

12

Don’t forget that your wind graphics are .png using ajax, but you have .jpg in html. Unless you copy .jpg versions of the wind graphics to the other folder they wont display.

Rather that copying the wind images, take a look through your ajax-dashboard.php for the following …

$wrType = ‘.png’; // extension of the graphic filename

I’m guessing you have it setup for ‘.jpg’ instead of ‘.png’ ?

Cheers

13

Thanks…that fixed that. and i also had to change the size in the dahboard too. When the dashboard first loads before the first update, the current condition icon is huge, then changes to small after the first update. Where can i change that setting at?

14

We have been talking about that in the topic about my dashboard script, you can check it out here:

http://discourse.weather-watch.com/t/38674

Hope that helps!

Scott