Support

Forums

Contact Me

Posts Tagged 'javascript'

JavaScript

JavaScript (sometimes abbreviated JS) is a prototype-based scripting language that is dynamic, weakly typed and has first-class functions. [http://en.wikipedia.org/wiki/JavaScript]

Minimize some part of Your GUI to have more space

  • Let the user minimize/maximise some part of Your GUI to have more space on demand
  • Working in all browser
  •  Use cookieJar script also in this section

Method to put in Your <HEAD> html document:

var CookieJar = new TDCookieJarObj();  CookieJar.setPath("/"); function FoldByName(iImageID, sMenuID) {
if (document.getElementById(sMenuID).style.display == 'none') {
document.getElementById(sMenuID).style.display = 'block';
document.images[iImageID].src='up.gif';
document.images[iImageID].alt='Minimize';
document.images[iImageID].title='Minimize';
CookieJar.setCookie(sMenuID,"open");
} else {
document.getElementById(sMenuID).style.display = 'none'; document.images[iImageID].src='down.gif'; document.images[iImageID].alt='Maximize'; document.images[iImageID].title='Maximize';
CookieJar.setCookie(sMenuID,"close");
} }


Example of use, here I want to hide the title on demand because it take a lot of space....The user has now a switch on-switch off icon where He can minimize on demand  this part of the GUI
<a href="javascript:FoldByName('TITLE','TITLE2');"><img name='ButtonExpand' id='TITLE' src='down.gif' alt='hide the title' align='AbsMiddle' style='border-width:0px;' /></a> <div class=smallText id='TITLE2'>
<H1> This is an Example</H1> </div> <script language='Javascript'>cookie = CookieJar.getCookie("TITLE2");if ( cookie == "close" )FoldByName('TITLE','TITLE2');</script>
Articles tagged

javascript to the limits

This game has been rewrite in javascript and is more than playable. Enjoy going back to the root like me: I  use to play lemmings on a 486DX 50Mhz  15 Years Ago...

Lemmings™ is an intriguing game in which you help hordes of otherwise-mindless creatures - knows as walkers - escape hostile environments.
Articles tagged

Setting cookie to remember user preferences in Your application

  • Persistent or session cookies can be set...
  • You can also set the path...
  • A lot of options, see the comments from the authors
  • A very powerful script!!!!!

//------------------------------------------------------------------------------
// TopDragon CookieJar(tm)
//------------------------------------------------------------------------------
// A Javascript CookieJar object with associated methods for using cookies.
//
// Copyright 2001 by TopDragon Software (www.bydisn.com or 
 This email address is being protected from spambots. You need JavaScript enabled to view it.
 ).
//
// This code isn't shareware, it's absolutely free. But if you really want to 
// (or if your conscience bugs you) feel free to send cash, gifts, liquor,
// stocks, or just drop me a line and let me know that you're actually using it.
// That will give me incentive to do more free stuff like this.
//
// Be sure to visit the TopDragon software page at www.bydisn.com/software!
// There's lots of other free stuff (and some stuff that that isn't free too).
//------------------------------------------------------------------------------
// You may remove the following instructions/comments to decrease the size of 
// this file, but PLEASE leave the above copyright info. I worked hard on this.
//------------------------------------------------------------------------------
// To use, just include this file in your HTML like this:
//  <script language="JavaScript" src="./TDCookieJar.js"></script>
//
// A CookieJar object is automatically created and initialized.
//
// Methods:
//
//  getCookie(cookie-name)
//
//   Returns the value of the named cookie or "UNDEFINED"
//
//   Example:
//
//    username = CookieJar.getCookie("username");
//
//  setCookie(cookie-name, cookie-value[, cookie-expiration])
//
//   Sets the named cookie to the value specified, with the expiration
//   date specified. Expiration date is optional. If not specified the
//   cookie is temporary (expires when the browser session ends).
//
//   Expiration can be specified in a variety of ways:
//
//    Via a Date object (you set it's value)
//
//    Via the string "NEVER" or "never" or "Never"
//    Never in this case is actually 12/31/2099.
//
//    Via a date string in any of the formats recognized by the 
//    Date.parse method. Such as:
//     "Dec. 25, 2001" or "December 25, 2001"
//
//    Via an "incremental" expression string +nu
//    Where:
//     + signifies an incremental expression
//     n is any positive number
//     u is the "units" designation:
//      d or D for days
//      h or H for hours
//      m or M for minutes
//    For example: "+30d" means the cookies expires in 30 days
//
//   Example:
//
//    CookieJar.setCookie("username","TopDragon","never");
//
//  deleteCookie(cookie-name)
//
//   Deletes the named cookie. Actually, the deletion is done by the
//   browser. This method sets the value of the cookie to null and it's
//   expiration date to a year ago. This will make the browser delete it.
//
//   Example:
//
//    CookieJar.deleteCookie("username");
//
//  cookiesEnabled()
//
//   Returns true if cookies are enabled on this computer, false otherwise.
//   It determines this by attempting to set and retrieve a test cookie.
//
//   Example:
//
//    if ( !CookieJar.cookiesEnabled )
//     alert("You must have cookies enabled to access this site");
//
//  setDomain(domain)
//
//   Sets the valid domain for the cookie. Must be in the form:
//    domain-name.com or subdomain.domain-name.com
//   Only cookies that match the domain name are returned. If
//   you do not set a domain, the current domain is used by the browser.
//
//   The domain you set is used for all subsequently set cookies.
//
//   Example:
//    CookieJar.setDomain("topdragonsoftware.com")
//
//  setPath(pathname)
//
//   Sets the valid path for the cookie. Must be in the form:
//    "/" or "/mypages" or "/mypages/index.html"
//   Only cookies that match the path are returned. / is the most
//   general path. If you do not specify a path, the current path
//   is used (i.e. only the current page will be able to access the
//   cookie). To allow any page on your site to access the cookie,
//   set a pathname of "/".
//
//   The pathname you set is used for all subsequently set cookies.
//
//   Example:
//    CookieJar.setPath("/")
//
//  setSecure([boolean])
//  setUnsecure([boolean])
//
//   Sets or unsets the "secure" status of the cookies. If the status
//   is "secure", the cookie will only be sent via secure pathways
//   (i.e. URLs with https:// in front of them). If called without a
//   parameters, it's the same specifying "true".
//
//   The secure status you set is used for all subsequently set cookies.
//
//   Example:
//
//    CookieJar.setSecure() or CookieJar.setSecure(true)
//
//  If you need to access the cookies in the cookie jar, they are stored in
//  a "hash" array (i.e. an array indexed by cookie name) called "cookies".
//  For example, to list all cookies in the cookie jar, you can do this:
//
//   with (document.demo) {
//    output.value = "CookieJar Cookies:\n";
//    for ( var cname in CookieJar.cookies ) {
//     output.value += cname+"="+CookieJar.cookies[cname]+"\n";
//    }
//   }
//
//  The CookieJar is automatically refreshed every time you call the 
//  getCookie, setCookie or deleteCookie methods to make sure that cookies
//  which have expired during the session are removed from the CookieJar.
//  If you need to refresh the CookieJar yourself for some reason,
//  you can call the internal refresh function CookieJar.refreshCookies().
//
//  For debugging, you can access the CookieJar as a string. Accessing the
//  CookieJar as a string (for example, when assigning to a variable or a
//  field) will automatically call the CookieJar.toString function to format
//  the output like this: "CookieJar: name=value;name=value;
//
//------------------------------------------------------------------------------

//------------------------------------------------------------------------------

function TDCookieJarObj() {
        this.cookies = new Array();
        this.secure = false;
        this.domain = "";
        this.path = "";
        this.theCookie = "";
        this.cookiesEnabled = testCookies();
        if ( !this.cookiesEnabled ) {
                this.toString = cookiesNotEnabled;
                this.refreshCookies = cookiesNotEnabled;
                this.setCookie = cookiesNotEnabled;
                this.getCookie = cookiesNotEnabled;
                this.deleteCookie = cookiesNotEnabled;
                this.setDomain = cookiesNotEnabled;
                this.setPath = cookiesNotEnabled;
                this.setSecure = cookiesNotEnabled;
                this.setUnsecure = cookiesNotEnabled;
        } else {
                this.toString = CookieJarToString;
                this.setCookie = setCookie;
                this.getCookie = getCookie;
                this.deleteCookie = deleteCookie;
                this.setDomain = setDomain;
                this.setPath = setPath;
                this.setSecure = setSecure;
                this.setUnsecure = setUnsecure;
                this.refreshCookies = refreshCookies;
                this.refreshCookies();
        }
        return this;

//------------------------------------------------------------------------------
// Internally Used Functions
//------------------------------------------------------------------------------

        function cookiesNotEnabled() {
                alert("Cookies are not enabled!");
        } // cookiesNotEnabled

        function refreshCookies() {
                delete this.cookies;
                this.cookies = new Array();
                this.theCookie = document.cookie;
                // If there is a cookie string, parse it and store the cookies
                if ( this.theCookie.length > 0 ) {
                        this.theCookie += ';';
                        var startpos = 0;
                        var endpos = 0;
                        do {
                                endpos = this.theCookie.indexOf(';', startpos);
                                var tmp = this.theCookie.substring(startpos, endpos);
                                var eqpos = tmp.indexOf('=');
                                if ( eqpos > -1 ) {
                                        var cname = tmp.substring(0,eqpos);
                                        this.cookies[cname] = unescape(tmp.substring(eqpos+1));
                                } else {
                                        this.cookies[tmp] = "";
                                }
                                startpos = this.theCookie.charAt(endpos+1) == " " ? endpos + 2 : endpos + 1;
                        } while ( startpos < this.theCookie.length );
                }
        } // refreshCookies

        function getExpirationDate(exp) {
                // See if it's a Date object
                if (exp.constructor == Date) {
                        expdt = exp;
                // See if it's the string "NEVER" (never is 12/31/2099 in this case)
                } else if ( exp.toUpperCase() == "NEVER" ) {
                        expdt = new Date(2099,11,31);
                // See if it's an incremental format: +nD (days), +nH (hours), +nM(minutes)
                } else if (exp.charAt(0) == '+') {
                        var incr = parseInt(exp.substring(1,exp.length-1));
                        var unit = exp.charAt(exp.length-1);
                        if ( 'DdHhMm'.indexOf(unit) < 0 ) {
                                alert("CookieJar.setCookie: Invalid expiration date increment unit");
                                return "";
                        }
                        if ( isNaN(incr) ) {
                                alert("CookieJar.setCookie: Non-numeric expiration date increment");
                                return "";
                        }
                        switch (unit.toUpperCase()) {
                                case "D" : incr *= 24;
                                case "H" : incr *= 60;
                                case "M" : incr *= 60;
                                default  : incr *= 1000;
                        }
                        expdt = new Date();
                        expdt.setTime(expdt.getTime()+incr);
                // See if it's a date string in a format accepted by the 
                // Date.parse method, such as "Dec. 25, 2001"
                } else {
                        if ( isNan(Date.parse(exp)) ) {
                                alert("CookieJar.setCookie: Invalid expiration date");
                                return "";
                        }
                        expdt = new Date(exp);
                }
                // Got a valid expiration date, format and return the expires string
                return ";expires="+expdt.toGMTString();
        } // getExpirationDate

        function testCookies() {
                // Sets and gets a cookie to see if cookies are enabled
                var exp = new Date();
                exp.setTime(exp.getTime()+(60*1000));
                document.cookie = "test=1;expires="+exp.toGMTString();
                if ( document.cookie ) {
                        if ( document.cookie.indexOf('test=1') >= 0 ) {
                                // Yup, they're enabled. Delete the test cookie
                                exp.setFullYear(exp.getFullYear()-1);
                                document.cookie = "test=;expires="+exp.toGMTString();
                                return true;
                        }
                }
                return false;
        } // testCookies

        function CookieJarToString() {
                this.refreshCookies();
                var str = "CookieJar: ";
                for ( x in this.cookies ) {
                        str += x+"="+this.cookies[x]+";";
                }
                return str;
        } // CookieJarToString

//------------------------------------------------------------------------------
// CookieJar Public Methods 
//------------------------------------------------------------------------------
        
        function setCookie(cname,cval) {
                var cexp = "";
                if ( arguments.length > 2 ) {
                        cexp = getExpirationDate(arguments[2]);
                }
                var cdom = this.domain == "" ? "" : ";domain="+this.domain;
                var cpath = this.path == "" ? "" : ";path="+this.path;
                var csec = this.secure == false ? "" : ";SECURE";
                document.cookie = cname+"="+escape(cval)+cexp+cdom+cpath+csec;
                this.refreshCookies();
        } // setCookie

        function getCookie(cname) {
                this.refreshCookies();
                return this.cookies[cname];
        } // getCookie

        function deleteCookie(cname) {
                var lastyear = new Date();
                lastyear.setFullYear(lastyear.getFullYear()-1);
                this.setCookie(cname,"",lastyear);
                this.refreshCookies();
        } // deleteCookie

        function setDomain(domain) {
                this.domain = domain;
        } // setDomain

        function setPath(path) {
                this.path = path;
        } // setPath

        function setSecure() {
                if ( arguments.length == 0 ) {
                        this.secure = true;
                } else {
                        if ( typeof(arguments[0]) != "boolean" ) {
                                alert("CookieJar.setSecure: Argument is not boolean");
                        } else {
                                this.secure = arguments[0];
                        }
                }
        } // setSecure

        function setUnsecure() {
                if ( arguments.length == 0 ) {
                        this.secure = false;
                } else {
                        if ( typeof(arguments[0]) != "boolean" ) {
                                alert("CookieJar.setUnsecure: Argument is not boolean");
                        } else {
                                this.secure = !arguments[0];
                        }
                }
        } // setUnsecure

}

var CookieJar = new TDCookieJarObj();
Articles tagged

Read more: Setting cookie to remember user preferences in Your application

Alternate row colour and onhover effect in html table

domTableEnhance is a script that turns every table with a special class into an enhanced one. The tables enhanced by domTableEnhance will have an alternate row colour and have a rollover on each row that includes cells (header rows won't get a rollover). domTableenhance adds these effects by applying classes to the rows, which means that you don't need to know any Javascript to change the look. More here at the official homepage
Articles tagged

Read more: Alternate row colour and onhover effect in html table

AJAX for Java developer

IBM has put an interesting online article about  DWR (Direct Web remoting) technology...

In the simplest terms, DWR is an engine that exposes methods of server-side Java objects to JavaScript code. Effectively, with DWR, you can eliminate all of the machinery of the Ajax request-response cycle from your application code. This means your client-side code never has to deal with an XMLHttpRequest object directly, or with the server's response. You don't need to write object serialization code or use third-party tools to turn your objects into XML. You don't even need to write servlet code to mediate Ajax requests into calls on your Java domain objects.
Read more at IBM developerworks
Articles tagged

On hover, display help or diverse informations for a professional look

Overlib
overLIB is a JavaScript library created to enhance websites with small popup information boxes (like tooltips) to help visitors around your website. It can be used to provide the user with information about what will happen when they click on a link.
You want to see this free script in action? more here at the official Homepage

Read more: On hover, display help or diverse informations for a professional look

Joomlacomment 4.0 jQuery optimization

joomla_cms

jocomment I did install yesterday evening the latest version of !JoomlaComment

!JoomlaComment is one of the first extensions for Joomla,that let you comment under articles.

The !JoomlaComment system can be installed on any joomla website within seconds! Make
your website more interactive!

Main Features:

  • ajax-based
  • captcha protection
  • akismet support
  • ubb code support
  • threathed/nested comments
  • multilanguage support
  • mail, website input
  • See more features here

Joomla support templates, depending on which templates you use

  • MTdefault-emotop, these templates MTxxxx use mootols 1.11
  • JQdefaut-emotop, these templates JQxxxx use Jquery
  • ..

You may behind the scene include another additional AJAX library in Joomla!® frontend, this lead to performance issues:

If !JoomlaComment use JQuery 1.1.4 and not the AJAX library of Joomla!, aka Mootools 1.11. Another huge JavaScript files that make my server busier!

Since any static files can be offloaded to another server to gain more speed. For example, any static images, JavaScript or CSS files can be moved to a different server for more speed.

In order to be able to offload this JavaScript library to Google code, you’ll have to do the following:

In the template you are using, for example in components/com_comment/joscomment/templates/JQdefault-emotop/index.html

Search for

{library}
<script type="text/javascript" src="components/com_comment/joscomment/jscripts/jquery-1.1.4.pack.js"></script>
<script>jQuery.noConflict();</script>
{/library}

and replace with

{library}
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
<script>jQuery.noConflict();</script>
{/library}

Note that I use here the latest JQuery version (1.3.2) and not the default version of !joomlaComment (1.1.4), here is why

Enhancing Your GUI with some professional effects

Browser Javascript tips and tricks for improving Your business application GUI
All credits to original authors....

All theses examples have to be put in the body onload="" tag of Your pages....

More in the javascript section....

Read more: Enhancing Your GUI with some professional effects

Table with fixed header, scrolling body

all credits to Authors

keywords

table html scrolling rows body

Purpose

If you want to create a table with a fixed header row and a scrolling body.

Links:

 Using Iframe

http://www.htmlcodetutorial.com/frames/_IFRAME.html
Changing color of slider (using css)

body {
background-color:#777777;
scrollbar-arrow-color: #9f632b;
scrollbar-base-color: #555555;
scrollbar-darkshadow-color: #555555;
scrollbar-track-color: #777777;
scrollbar-face-color: #555555;
scrollbar-shadow-color: #aaaaaa;
scrollbar-highlight-color: #666666;
scrollbar-3dlight-color: #666666;
}

  • W3C compliant but as usual not working in IE ;-) NS4  VIEW HERE
  • Fixed table head - scrollable table body IE NS4 VIEW HERE
  • M$ way as in windows update IE only VIEW HERE
  • Using overflow-y in table IE NS4 VIEW HERE
  • Showing or Hiding row in a table (Javascript) IE NS4 VIEW HERE 
  • Showing or hiding a bloc of data IE NS4
  • Using css to change position of a second table (one table is the header the other is the content)
  • Using css and fixed columns width to create 2 table, one fixed, and one using overflow-y VIEW HERE
  • Others: contact me to submit your code here to help other web developer :-)

gather client browser informations with javascript

http://waltercedric.com/java/gathertInformationsWJavascrip.html

save page as t have source code

Donations

Thank You for supporting my work