[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
?
Solved

load img src with partial filename?

Posted on 2006-05-20
25
Medium Priority
?
460 Views
Last Modified: 2010-05-18
I am designing a weather site and have been given permission to use the map on

http://www.earthsci.unimelb.edu.au/~awatkins/bay.html

This is a gif image that is updated every 5 mins, so the file name changes too, ie bay1905061443.gif for 19/05/2006 14:43. The next image would be bay1905061448.gif, and so on. The file name is always changing, bay{DDMMYYhhmm}.gif, with minutes changing in 5 minute increments...so 03, 08, 13, 18 etc to 58 and back to 03.

I asked how to load the image with script to change the {DDMMYYhhmm} variable of the filename, but had some inherint problems I hadn't considered. For more info see;
http://www.experts-exchange.com/Web/Web_Languages/JSP/Q_21857644.html#16724782

We'd been looking at pulling the source image by trying to use the full filename, which has many potential problems. Stupidly I hadn't considered the flipside. Can we just tell it to source bay*.gif, where * is an unknown and ignored variable? There is only one file named bay{DDMMYYhhmm}.gif in the source directory and is constantly overwritten with the next image, so the script wouldn't encounter errors due to other .gif files with 'bay' in their names. This does away for the need to combine any date or time figures to created the desire filename. We just go for the constant instead, being 'bay' and '.gif'.

Is there any way to ignore the rest of the filename?
0
Comment
Question by:elysiandc
  • 9
  • 8
  • 4
  • +1
24 Comments
 
LVL 3

Expert Comment

by:Krule
ID: 16727010
Hmm, this isn't javascript related, which is what that last question is posted in.

It would be a lot easier if I knew what environment you were in, since this is better made as server-side scripting. (Ie: php/asp/jsp)

Theres really no clean way to browse through the directories of another server, unless you use something like AJAX, and the other server has directory listing on, which is does not appear to. In fact, theres no way of doing this unless you own that site, and can turn on directory listings, or you own it and can write a server side script to accomplish this.

That being said, if you could do that, why wouldn't you be able to just rename the file that is updated to not have a timestamp? So thats not a good solution.

Another solution would be to brute force it. That is, generate todays date, then just iterate through all the possible numbers for the minutes/hours (24*60) and see which one doesn't return a 404. This would also require some AJAX since you would need to make a request to the server.
0
 
LVL 23

Expert Comment

by:basicinstinct
ID: 16727659
Well if you know the name of the image ONCE then you know it forever - ie, if you know the image was called 1905061443.gif then you don't need to guess what the next image will be called.  You know what every image will be called forever ad infinitum.  

Of course, there is a chance that either server gets the time settings out of whack, in which case you would have problems.  But servers are meant to be reliable, so it shouldn't need to happen.  A good error handling routine would help - something along the lines of what Krule says perhaps, where you try a few alternatives until you don't get a 404.  You could even cheat and load the page at http://www.earthsci.unimelb.edu.au/~awatkins/bay.html and grab the image source from there...  That may give you a performance hit though - might work in error situations however.

0
 
LVL 28

Expert Comment

by:rrz
ID: 16728838
>Can we just tell it to source bay*.gif, where * is an unknown and ignored variable?  
Yes, using  "Regular Expressions" to search the source code.  I am not an expert with RegEx but maybe someone will help.  Perhaps something like    "http://www.earthsci.unimelb.edu.au/~awatkins/bay\d*.gif"   or   "http://www.earthsci.unimelb.edu.au/~awatkins/bay\d{10}.gif"    will work for the pattern to search for in the code. Maybe just searching for the img tag would work. You would also need the map tag.
Since you don't seem to have any server-side engine to help you, what do you think about using an applet ?  But I would need to colaborate with some experts to get it done.   rrz
0
Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

 
LVL 3

Expert Comment

by:Krule
ID: 16728865
I don't see how an Applet would work any better than any JS solution using RegEx.

This seems a bit 'hackey' to me if I say. I think just asking the owner of the site to make a copy of the file named 'bay.gif' would save yourself a TONE of work. Sometimes the best solution is not technical, but civil :-)
0
 
LVL 28

Expert Comment

by:rrz
ID: 16728898
Krule,  Please show us how javascript can grab the source code.
I am not suggesting that we use an applet for the display of the image. What I am suggesting is that we use an applet to dynamically grab the current name of the image and pass it the page.   rrz
0
 

Author Comment

by:elysiandc
ID: 16728917
Perhaps if I explain a little of the method behind the madness of my question could help.

I originally wanted client side script so that I could implement the map on the Scuba shops current weather site ( http://www.aquaticadventures.com.au/weather.htm ). Three reasons for this, 1.taking a while to build the new site, 2.they don't currently have PHP or the like setup on the current one and 3. they can't keep accurate details up, and divers need accurate weather info for safety reasons. This one map has about 80% of the info they need and is updated every 5 mins, so is a fantastic resource.

I will need to setup a content management system and a shop, so will be using PHP down the track. I understand a server side solution would probably be better/easier and I dare say I will need some help when I get to that...so stay tuned.

In the mean time I am open to both RegEx and Applets, perhaps a pref for RegEx. I'll search around a bit and see what I can find out too.
0
 
LVL 3

Expert Comment

by:Krule
ID: 16728945
Oh hmm..I guess if this isn't your domain you can't use XMLHttpRequest object..then no, javascript can't do this.

I'll keep thinking
0
 

Author Comment

by:elysiandc
ID: 16728951
Oh, I forgot to mention one of the key factors. The guy that owns the site works in Earth Science at Melbourne University, so pulls all this weather info from various sources no one else can get access to. There are all sorts of graphs and charts on the site that are dynamically generated by 3rd party monitoring software, just like the map. Unfortuantely he has no control over how the file is named as he doesn't run the software, the Uni does.

Have a look at the source code for the site ( http://www.earthsci.unimelb.edu.au/~awatkins/bay.html ). I can't even figure out how the site a)dynamically updates the line 'OBSERVATIONS LAST UPDATED: Monday May 22 01:12' or creates the line <img align="center"  USEMAP="#home_nav" border=0 width=346 height=316 src = "http://www.earthsci.unimelb.edu.au/~awatkins/bay2205060103.gif" alt="Bay Winds">. The only JavaScript I see on the page are for the navigation menu, and the mystery script in the HEAD that I don't understand....
0
 
LVL 28

Expert Comment

by:rrz
ID: 16729078
As Krule posted, this is easy with server-side technology.
Have you considered taking the easy way out and just putting a link  on your page ?
0
 
LVL 28

Expert Comment

by:rrz
ID: 16729296
If you don't want a link on your page to the map page, then maybe you could use javascript( as suggested by Krule). Maybe you could use a frameset. The map page could be a very small frame on the bottom and then use the DOM to grab the image tag and put it into your page in the top frame. Just an idea that I didn't test. Yes, it is a
>bit 'hackey'
0
 
LVL 3

Assisted Solution

by:Krule
Krule earned 300 total points
ID: 16729660
Yeah, I was thinking of posting this suggestion, making an invisible frame that loaded the other page and then you could use DOM to search for the image tag. It's not clean, but feasible. I could post some code to do this if you like.
0
 

Author Comment

by:elysiandc
ID: 16730964
I'd certainly be up for giving it a shot that way. I don't mind if it seems a bit 'hackey', as this is only intended to be a temporary solution until the new site is ready to go, I'll give anything a go in the mean time. :D
0
 
LVL 23

Assisted Solution

by:basicinstinct
basicinstinct earned 600 total points
ID: 16731270
This works.  It is serverside technology (JSP).
I will put this on a live server in a few hours so you can see it in action.  I'll post here when it's up.

<%@ page language="Java" %>
<%@ page import="java.util.*" %>
<%!
      public static final int START_MIN = 03;
    public static final int INTERVAL = 5;
    public static final int MINS_IN_HOUR = 60;
    public static final int DATE_COMPONENT_LEN = 2;
    public static final String IMG_EXTENSION = ".gif";
   
    private String getImgName()
    {
        Calendar today = Calendar.getInstance();
        int day = today.get(Calendar.DAY_OF_MONTH);
        int month = today.get(Calendar.MONTH);
        int year = today.get(Calendar.YEAR);
        int hours = today.get(Calendar.HOUR_OF_DAY);
        int mins = today.get(Calendar.MINUTE);
        month++;
        return (pad(day) + pad(month) + pad(year) + pad(hours) + pad(getImageMinutes(mins)) + IMG_EXTENSION);
    }
   
    private String pad(int digits)
    {
        String s = Integer.toString(digits);
        int sLen = s.length();
        if(sLen < DATE_COMPONENT_LEN)
        {
            s = '0' + s;
        }
        else if(sLen > DATE_COMPONENT_LEN)
        {
            s = s.substring(sLen - DATE_COMPONENT_LEN);
        }
        return s;
    }
   
    private int getImageMinutes(int currentMinutes)
    {
        int retVal = currentMinutes;
        int endMin = (((MINS_IN_HOUR / INTERVAL) - 1) * INTERVAL ) + START_MIN;
        if(currentMinutes < START_MIN || currentMinutes >= endMin)
        {
            retVal = endMin;
        }
        else
        {
            for(int i= START_MIN; i < MINS_IN_HOUR ; i += INTERVAL)
            {
                if(i > currentMinutes)
                {
                    retVal = i - INTERVAL;
                    break;
                }
            }
        }
        return retVal;
    }
%>
<html>
     <head>
          <meta http-equiv="refresh" content="300">
     </head>
     <body>
          <p align="left"><img src='http://www.earthsci.unimelb.edu.au/~awatkins/bay<% out.print(getImgName()); %>'>
     </body>
</html>
0
 
LVL 23

Expert Comment

by:basicinstinct
ID: 16733950
having trouble with server, sorry.
i was thinking though, what about just loading the foreign page in aniframe like ths:

<html>
      <head>
            <title>Your page on your site</title>
      </head>
      <body>
            <h1>Your page heading</h1>
            <p>Some words and stuff</p>

            <iframe frameborder="0" scrolling="no" width="60%" height="80%" src="http://www.earthsci.unimelb.edu.au/~awatkins/bay.html"/>
      </body>
</html>
0
 

Author Comment

by:elysiandc
ID: 16740972
Thanks a million for your ongoing help with this one basicinstinct (and everyone else too!), I really really appreciate it very much.

I have tried the JSP solution, but can't seem to get the image to show up. I checked the source image and the name has now changed from 03, 08, 13, 18 etc sequence to 01, 06, 11 etc. I emailed the guy that owns the weather map and he explained that sometimes that systems tht generate the map have bugs (like temp showing 99.99 degrees) and need to be restarted, so the date/time stamp on the filename is subject to change. Clearly this rules out using the date/time variable in any way. Damn, hell, crap, bugger! I really liked that solution too.

I've given the iframe a go, it's pretty good, but still shows the menu bar from the source site across the top. I'd like to get rid of that as it gives too many options for the end user, and the info provided there is not really relevant to the dive site. I know I can set the frame size to lose the menu off the bottom, but is there anyway to 'crop' the source page in the frame to block the unnecessary info?

I've been searching for a way to move the content up in the frame, effectively chopping/hiding the menu off the top, but haven't had much luck so far. The map is not in a table with a name to refer to...   Will keep looking.
0
 
LVL 28

Expert Comment

by:rrz
ID: 16742276
>I have tried the JSP solution  
So, you do have a servlet container at your site ?  If yes, then you could use   java.net.HttpURLConnection or <c:import> (JSTL)  to grab the source code.   What parts of the map page do you want ?      rrz
0
 

Author Comment

by:elysiandc
ID: 16743064
I've just checked again with the clients host. No JSP setup or available. Nothing server side at this stage, I have to get the client to upgrade to get PHP, CGI or ASP.
0
 
LVL 28

Expert Comment

by:rrz
ID: 16743336
Then I guess Krule's suggestion
>making an invisible frame that loaded the other page and then you could use DOM to search for the image tag.  
might the way to go. He offered to post code.   What parts of the map page do you want ?  Just the image ?  Do you want the clickable area parts ?  Do you want the links that give more info ?  Also I noticed that the  heading  "OBSERVATIONS LAST UPDATED:   "  is not in sync with the image numbers.  Is that a problem ?
0
 

Author Comment

by:elysiandc
ID: 16743453
I also noticed that the times were out of sych, this does not matter though. I am really only after the image. I'll then make this a link back to the original site, so if end users want more info they can go straight there in new window. The clickable areas link back to a bunch of graphs and charts, which won't mean a lot to the divers. I'd have no idea how to do this so a code sample would mean the world to me.
0
 
LVL 28

Expert Comment

by:rrz
ID: 16743578
It was Krule's idea
>making an invisible frame    
and he said he had the code.  He was around a couple of hours ago.
0
 
LVL 28

Expert Comment

by:rrz
ID: 16744991
I tried to implement something like the following line in a dive page.
 document.images[0].src = parent.mapPage.document.images[0].src  
But I came up againest javascript's  "same-origin policy". I guess I don't know javascript as well as I thought I did. Hopefully Krule has the solution.
0
 

Author Comment

by:elysiandc
ID: 16883596
Hi all,

I've been checking around and read heaps of articles - it's just making things worse for me! Too much info that I don't understand, I'm afraid.

I can do the invisible frame easlily enough, but it's doing my head in trying to work out the correct way to pull the image from it. Points are still going for this...

Any suggestions? Thanks!
0
 
LVL 28

Accepted Solution

by:
rrz earned 600 total points
ID: 16885489
As I stated in my last post due to javascript's security policy I was unable to grab the image. See  
http://www.devarticles.com/c/a/JavaScript/JavaScript-Security/     
0
 

Author Comment

by:elysiandc
ID: 17071703
Crap, sorry. Forgot to close of this question. Thanks a million for all your help with this guys. I have gone the frame oprion for now. Am setting up PHP for the clients new site, so maybe there will be a way around the problem with that instead. I'll search the PHP section and post the problem again there. :) Thanks!
0

Featured Post

New feature and membership benefit!

New feature! Upgrade and increase expert visibility of your issues with Priority Questions.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Currently, there is an issue with being able to copy values from an external application to a dropdown list in Project Web Access (PWA).  The standard copy and paste methods don't seem to work properly. Here is a way to accomplish this task to s…
Moore’s Law has proven itself time and time again since it was first introduced. So what’s next? Will Moore’s law continue to remain relevant, or will new technology take over and bring us the next big advancement in computing?
Are you ready to place your question in front of subject-matter experts for more timely responses? With the release of Priority Question, Premium Members, Team Accounts and Qualified Experts can now identify the emergent level of their issue, signal…
Is your data getting by on basic protection measures? In today’s climate of debilitating malware and ransomware—like WannaCry—that may not be enough. You need to establish more than basics, like a recovery plan that protects both data and endpoints.…
Suggested Courses
Course of the Month20 days, 3 hours left to enroll

873 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question