Page 1 of 1

Faster and neater way to do this?

Posted: Sun Jun 08, 2008 3:20 pm
by Pezmc
Does anyone know a faster and less repetative way to do this? It is for whether effects on a game.

Here is my code:

Code: Select all

function Night(css) {
    if (hora >= 21 && hora <= 24 || hora >= 0 && hora <= 5) {
        var head, style;
        head = document.getElementsByTagName('head')[0];
        if (!head) { return; }
        style = document.createElement('style');
        style.type = 'text/css';
        style.innerHTML = css;
        head.appendChild(style);
    };
};
 
function Sunrise(css) {
    if ( hora >= 6 && hora <=  9 ) {
        var head, style;
        head = document.getElementsByTagName('head')[0];
        if (!head) { return; }
        style = document.createElement('style');
        style.type = 'text/css';
        style.innerHTML = css;
        head.appendChild(style);
    };
};
 
function Sunset(css) {
    if ( hora >= 18 && hora <= 20 ) {
       var head, style;
       head = document.getElementsByTagName('head')[0];
       if (!head) { return; }
       style = document.createElement('style');
       style.type = 'text/css';
       style.innerHTML = css;
       head.appendChild(style);
    }; 
};
 
function Rain(css) {
    if ( hora >= rainstarttime && hora <= rainendtime ) {
        var head, style;
        head = document.getElementsByTagName('head')[0];
        if (!head) { return; }
        style = document.createElement('style');
        style.type = 'text/css';
        style.innerHTML = css;
        head.appendChild(style);
    };
};
 
function Fog(css) {
    if ( hora >= fogstarttime && hora <= fogendtime) {
        var head, style;
        head = document.getElementsByTagName('head')[0];
        if (!head) { return; }
        style = document.createElement('style');
        style.type = 'text/css';
        style.innerHTML = css;
        head.appendChild(style);
    };
};
an example bit of the function being used is:

Code: Select all

Night('#city #container .phase2, #city #container .phase3 {    background-image:url('+webadress+'Night/city_phase2.jpg);}');
thanks

Re: Faster and neater way to do this?

Posted: Sun Jun 08, 2008 3:56 pm
by Kieran Huggins
sure, put the time of day in your body tag as a class:

Code: Select all

<body class="night">
Then you can have a single CSS file:

Code: Select all

body.day sometag {
  /* daytime styles */
}
 
body.night sometag {
  /* nighttime styles */
}

Re: Faster and neater way to do this?

Posted: Sun Jun 08, 2008 6:46 pm
by Pezmc
Sorted thanks!
However now the css on the page greasemonkey is running this on doesn't work :-(
Can anyone see why/improve my script?

I now have this:

Code: Select all

// ---- Version 1.5 ---- 
//Gm Menu Commands
    //Web Address
        function setWebAddress() {
            var WebAddressOld = GM_getValue("WebAddress", "http://solarium.pezmc.com/");
            GM_setValue("WebAddress", prompt("Where are your images hosted? (needs http://)", WebAddressOld) || WebAddressOld);
          window.location.reload();
        };
        GM_registerMenuCommand("Image Host", setWebAddress);
        var WebAddress = GM_getValue("WebAddress", "http://solarium.pezmc.com/");
    //End Web Address
 
    //Weather Forcast
        function alertWeather() {
            //Fix the end times (its inclusive)
                var trueRainEndTime = RainEndTime + 1;
                var trueFogEndTime = FogEndTime + 1;
            if (FogStartTime !== 25) {
                alert ("Today it is going to be foggy from " + FogStartTime + ":00 untill " + trueFogEndTime + ":00");
            } else { 
                alert("It is not going to be foggy today"); 
            }
            if (RainStartTime !== 25) {
                alert ("Today it is going to rain from " + RainStartTime + ":00 untill " + trueRainEndTime + ":00");
            } else {
                alert("It is not going to rain today"); 
            }
        };
        GM_registerMenuCommand("Ikariam Solarium Weather Forcast", alertWeather);
    //End Weather Forcast
//End Gm Menu Commands
 
 
//Get Time and Date
    var LocalTime = new Date();
    var Time = LocalTime.getHours();
    var LocalDate = LocalTime.getDate() + "/" + LocalTime.getMonth() + "/" + LocalTime.getFullYear();
//End Get Time and Date
 
//Invent some weather for the day (only if stored date is not current date)
    if (GM_getValue("WeatherDate", "") !== LocalDate) {
      //Calculate Weather
        //Rain
            if(Math.random()>0.5) {
                var RainStartTime = (parseInt(10) + Math.round(Math.random() * (15 - 10)));
                var RainEndTime = RainStartTime + (Math.round(Math.random()*2));
            } else { 
                var RainStartTime = 25;
                var RainEndTime = 25;
            };
            
            //Store the days times
                GM_setValue("RainStartTime", RainStartTime);
                GM_setValue("RainEndTime", RainEndTime);
            
        //Fog
            if(Math.random()>0.5) { 
                var FogStartTime = (parseInt(0) + Math.round(Math.random() * (3 - 0)));
                var FogEndTime = FogStartTime + (Math.round(Math.random()*2));
            } else { 
                var FogStartTime = 25;
                var FogEndTime = 25;
            };
    
            //Store the days times
                GM_setValue("FogStartTime", FogStartTime);
                GM_setValue("FogEndTime", FogEndTime);
            
        //Set the new weatherdate
            GM_setValue("WeatherDate", LocalDate);
    };
//End Weather Setting
 
//Get the stored weather times
    var RainStartTime = GM_getValue("RainStartTime" , 11);
    var RainEndTime = GM_getValue("RainEndTime" , 11);
    var FogStartTime = GM_getValue("FogStartTime" , 0);
    var FogEndTime = GM_getValue("FogEndTime" , 2);
//End Get the stored weather times
 
//Possible Effects
    var Effects = { 18: "Sunset", 21: "Night", 0: "Night", 6: "Sunrise", 9: "" };
 
//Change the effect!
changeEffect();
 
function changeEffect() {
  while (!Effects.hasOwnProperty(Time)) {
    Time--;
  };
  var Effect = Effects[Time];
 
//Weather
    if ( Time >= FogStartTime && Time <= FogEndTime) { Effect = "Fog"; };
    if ( Time >= RainStartTime && Time <= RainEndTime ) { Effect = "Rain"; };
    
  var oldbody = (document.body.className || "") + " ";
  document.body.className = oldbody.replace(/(Sunset|Night|Sunrise|Fog|Rain)?/, Effect);
 
  changeEffect.done = changeEffect.done || 0; // already added CSS?
  if (!changeEffect.done++) GM_addStyle(<><![CDATA[
 
//==Night==
GM_addStyle(<><![CDATA[
//--City Phases--
#city.Night #container .phase1 {    background-image:url(-WEBADDRESS-Night/city_phase1.jpg);};
#city.Night #container .phase2 {    background-image:url(-WEBADDRESS-Night/city_phase2.jpg);};
//etc...
#island.Fog #container #mainview {padding:0;height:440px;background-image:url(-WEBADDRESS-Fog/bg_island.jpg);};
  ]]></>.toXMLString());
};

Re: Faster and neater way to do this?

Posted: Sun Jun 08, 2008 11:08 pm
by Kieran Huggins
install Firebug and check te output in the console - if it doesn't make sense post the error here.

Re: Faster and neater way to do this?

Posted: Mon Jun 09, 2008 4:06 am
by Pezmc
There is no error. The pages CSS just doesn't change?

Re: Faster and neater way to do this?

Posted: Mon Jun 09, 2008 2:10 pm
by Kieran Huggins
you might need to hold shift when you hit refresh, it's possible your browser is caching the old CSS file.

You have edited the CSS file, right?