Archive for the ‘Javascript’ Category

Unix : Redirection basics, part 1

Saturday, April 3rd, 2010

Note: This entry does not discuss Unix pipes. That will be part 2.

One of the powers of the Unix command line is the ability to redirect input and output of either end of the command (for most commands, anyway).

By default, Unix assumes that the default input will come from the keyboard, and the default output would go to the display. So, to view all the files in a directory, you type “ls” at the command line and the program returns to the display of all the files in a directory.

But you can also direct the output of a program to another source, such as to a text file. You can also specify a new source of input.

This is done using the “>” and the “<” characters.

For instance, say you want to get a list of files in a directory, but instead of having them appear on the screen, you want to put them in a new file, called ListOfInfo.txt. then you’d type:

$ls > ListOfInfo.txt

And if you wanted to add more information to this file, you could append the info with “>>”, i.e.:

$ps -aux>> ListOfInfo.txt

(Otherwise, with just a single “>” Unix will just overwrite the contents of an existing file).

Just as “>” directs the output, using “<” will direct input. For instance…

$wc < ListOfInfo.txt

…will give you the word count of the ListOfInfo.txt file.

You can mix and match these commands. For instance…

$wc < ListOfInfo.txt > WCResults.txt

Keep in mind that not all Unix programs accept redirection, of either input or output. A command such as “mkdir” can’t accept input or redirect its work elsewhere.

* * *

When running a shell, Unix keeps three different streams, or files, for input/output purposes. Each gets a file descriptor number (More on that later). They are:

Standard Input: The file that captures the input, usually from the keyboard (file descriptor # 0).

Standard Output: The file that captures the output, which is usually sen to the terminal display (It has a File descriptor # 1).

Standard Error: This file captures the error messages from the shell or the running program (It has a file descriptor # 2).

With this in mind, “>” really means “1>” and “<” is shorthand for “0<”.

All this means you can redirect standard input output and error messages. For instance, say you want to capture an error message in a text file. You can’t do that with the standard redirect. A wc on a nonexistent file reirected to an output file will not send the error message to the file. Instead, you can type:

$wc phonyfile.txt 2> ErrorFile.txt

Note, you can also group these redirections for a single stream. “1>$2″ sends standard output to the standard error file, and “2>$1″ sends the error output to the standard output.


Taken from this book:


…as well as a class I’m taking on Unix. All mistakes are my own, however.–Joab Jackson





HTML: The Difference Between id and class

Thursday, April 30th, 2009

In HTML markup, an id is an attribute you can graft onto a element markup tag, one that identifies that element with a word:

<p id=”sampletest”>This is the sample test</p>

The W3C defines id as the “document-wide unique id.” You can use the name of an id only once, and in a single type of tag, on a Web page. Ryan Fiat writes, “Simply put, an ID is like the sticker that says ‘you are here’ on a mall directory, and there can only ever be one of those.”

Very much like the id, a class can also be grafted onto an element, in a very similar fashion:

<p class=”sampletest”>This is the sample test</p>

The class attribute specifies a classname for an element, says the W3C. You can add your own class to most elements (except base, head, html, meta, param, script, style, and title).

A class can be used to give a name to a particular part of a web page, i.e. <p class=”preamble”>. This can be useful for manipulating that part of the HTML document, through CSS (to stylize that section), or Javascript (to process the content of that section).

Unlike an id, a class can be used across multiple tags. For example, you could have both of these elements in a document:

<h3 class=”legalese”>title</h3>
<div class=”legalese”>content</div>

You could call only one of the classes (i.e. “div.legalese”), or define legalese, and it will apply in both instances. (Click here for working example. View source to see how it works)

ALSO, another cool thing about classes is that more than one can be used in a single element. They are separated by spaces within the quotes:

<p class=”legalese preamble”>content<p>

In this case, if you have CSS stylesheet definitions for both legalese and preamble, then they would both apply to the content above.

In a CSS style sheet, for instance, you could embed these style elements in your document via CSS:

.preamble { font: bold; }
.legalese { font-size: 325%;}

And any content marked with these classes (i.e. <div class=”preamble legalese”>) would be stylized accordingly (Click here for working example. View source to see how it works).


One nice thing you can do with an id that you can’t do with a class: Internal navigation. Anchor linking, it’s called. A browser can use an id as a sort of internal navigation by attributing it to a markup tag of some sort:

<a href=”#content”>This will take you over yonder</a>

<p>hilldale</p>

<p>hilldale</p>

<p>hilldale</p>

<p>hilldale</p>

<p>hilldale</p>

<p id=”content”>Yonder!!</p>

(Click here for working example. View source to see how it works).

–Joab Jackson





Apache: Redirecting Web page requests

Sunday, April 5th, 2009

If you move a Web page on your site to another location, or give it a another address, there are a number of ways you can have the Apache Web server software automatically redirect browser requests that come in for the page to the new location.

The easiest way is to put a page at the old address that automatically directs the browser to the new location, i.e.:

<html>
<head>
<meta http-equiv=”refresh” content=”0;url=http://www.TheNewAddress.com”>
</head>
</html>

In the above page, the meta tag redirects the browser to the new location (here, it is “http://www.TheNewAddress.com”), with a delay of 0 seconds (“0″) . The user just sees the page at its current location.


This process of setting up a new page for each updated address is a but cumbersome though. Far better would be to put all the old addresses and their new replacements in a single file, which Apache could check every time a new request for a page comes in.

Fortunately, the HTTP protocol has something called 301 Status code, which is basically a permanent change-of-address notification.

For Apache, doing a 301 redirect involves setting a .htaccess blank file (or appending an existing one). The period in front of the the name means it will be a hidden file—to see hidden files, use the “ls-a” command.

To create such a file, just name a blank text file .htaccess. Place it in the root directory of your Web server (Or if all the pages you are redirecting are in one directory, place the file in that directory).

Then, add a new line for each redirect in the following form:

[old address] [new address]

For example, this entry at the bozo.com site…

/OldFiles/OldBozo.html /NewDirectory/NewFile.html

…clicking on the link “http://bozo.com/OldFiles/OldBozo.html,” the user’s browser will automatically pull up the “http://bozo.com/NewDirectory/NewFile.html.”

Note that when the new page is outside the control of the Web server, the full address (including “http://”) of the destination address must be used, not just the internal directory tree.

Setting up an Apache .htaccess file, if one didn’t previously exist, requires letting your copy of Apache know that this file exists and should be consulted. In Ubuntu, and probably other distributions as well, Apache ignores the .htaccess page in the default install.

(Note, for this instruction, I am using Apache 2.2.8 on Ubuntu server 8.0.4).

Doing this requires two steps. First of all, find the “apache2.conf” file. In Ubuntu, it is located in “/etc/apache2″ directory. It can be edited at the command line with a text editor, such as vi, emacs or Pico.

Open the file and search for the mention “.htaccess.” Check to see that “.htaccess” follows the “AccessFileName” option. If it is enabled, there will be no ‘#’ at the beginning of the line (meaning it is not commented out). This tells Apache to look in this file for directives, such as a page address substitute as the one above. It should read:

AccessFileName .htaccess

That is probably already set correctly, but the second step probably involves some changes in configuration. Namely you have to set something called “AllowOverride,” which is the configuration setting that tells Apache whether or not to follow the .htaccess requests

This option can be found in another file, one showing the directories that Apache should use for the Web site. In Ubuntu, it is the “default” file in the “sites-available” folder (“/etc/apache2/sites-available”). (NOTE: In Ubuntu this file is also under another name as a symbolic link, in the “sites-enabled” folder.)

In this “default” file, you will find a list of directories on your server that have been enabled as Web server pages.

<Directory /var/www/>
Options Indexes FollowSymLinks MultiViews
AllowOverride None
Order allow,deny
allow from all
</Directory>

NOTE: This is the not the “document root” entry, but the one right after it. The “document root” entry also has an AllowOverride. It is set as “none” and can stay that way.

Each entry (framed by <Directory> and the </Directory> tags) in this list specifies the options that Apache should use for that directory. In the above entry, change “AllowOverride None” to “AllowOverride All”.

A bite of explanation: “AllowOverride None” means Apache does not look for the .htaccess file, and does not follow its instructions. “AllowOverride All” means that it does.

After you make this change, or any changes to these configuration files, you need restart the Apache server software. In Ubuntu it is done thusly from the command line:

/etc/init.d/apache2 restart

(Note, you do not need to restart Apache when new entries to .htaccess are made. That seemed obvious but I should mention this anyway)


Also, if you know that all your rerouting is being done from one folder. You can place the .htaccess file in that folder, and, instead of changing the “AllowOverride” setting for the whole site, just make a new entry in the “default” configuration file for that one directory.

For instance, I wish to redirect addresses of expired Web pages in the “/var/www/L/” folder. I would place an .htaccess file in that folder and add this entry into the “default” configuration file:

<Directory /var/www/L/>
AllowOverride All
</directory>

This seems to be all you need to add–the other options are inherited from the listing of the parent directory.

End-note: I’ve found that Apache is extremely fussy about what is put into an .htaccess file. Don’t put junk in just as a way of testing something else out. Only properly formed URL’s or internal links should be added. Anything else will halt all Apache redirects, giving users only error messages.


Note: Other forms of redirection are discussed here.

–Joab Jackson

And now, a word from our sponsor:





Javascript:: Running Javascript in a browser

Wednesday, July 30th, 2008

Window is the global object for a browser. All variables are defined as properties of a window.

“var answer = 42″ = “window.answer = 42″ (window can also be called “self”)

“document” is the document object of the current window.

Javascript is event driven: It does something in response to a user-action–mouse movements, keyboard, etc.

–Joab Jackson





Javascript: Objects

Wednesday, July 30th, 2008

An object is a named piece of data. Each named value is a property of an object.

Properties can contain any data type, including arrays and functions, as well as other objects.

The format is “object.property.”

To invoke a function from an object, name the object, function and the () operator i.e.document.write(“Test”).

To create a new object, use the new constructor. i.e.
var point = new Object();

Then you set the properties:
point.a = 14
point.b = 7

–Joab Jackson





Javascript: Three ways to evoke functions

Wednesday, July 23rd, 2008

1. With a function statement.
The typical way to write a function is to have it as its own chunk of text. The function is declared by the function statement, followed by the name of the function and the () operator, into which you place the names of the arguments (variables) to send to the function itself.

function print(msg)
{
document.write(msg)
}

The return statement may or may not be used. It causes the function to stop executing and return to the caller.

2. As a variable.

Here the function is evoked by the “new” operator.

Var A = new function(“x”, “y”, “return x*y”);

Note, everything is contained within the (). Also, everything is placed within quotes, that is to say rendered in a string.

3. A Function literal.

This is good for one -time functions. It is a function without a name. It can be assigned as a variable.

Var f = function(x) {return x*x:

Note, that strings are not used in this case.

–Joab Jackson

[ad]

The datatypes of Javascript

Wednesday, July 23rd, 2008

JavaScript works with the following datatypes: numbers, strings, boolean values, functions, objects, arrays.

Objects and arrays are a composite data type. Functions and arrays are specialized types of objects.

Unlike many languages functions, is a data type. This allow functions to be used as variables or even as an object property.

–Joab Jackson

[ad]

Javascript: Anatomy of a few simple functions

Thursday, July 10th, 2008

Here are some basics on how to feed data to and from Javascript functions on a Web page. The following are pulled from JavaScript examples

#1 Simple Function: In this function, a function executes a pop-up box that says Hello. It is called from within a form ["onclick="myfunction()] And myfunction is this: function myfunction() {alert(“HELLO”);}.

#2 Function with arguments: First, the page calls a JavaScript function and hands it some text ["myfunction('Hello')"]. The function inserts the text in an alert box. [alert(txt)]

#3 Here, you put JavaScript in the actual body of the Web page, one that calls another JavaScript chunk of code in the head. Myfunction is basically a section of text [return ("Hello, have a nice day!")]

–Joab Jackson





Javascript: Functions

Monday, June 30th, 2008

A Javascript function is a piece of code that when given a value, can return a value. It can be defined once and reused.

You define a function with a name. Then you can call the function by the name, along with a set of values it will need. They will be placed in parenthesis.

Functions are actually data values. As such, they can be stored in arrays or variables.

–Joab Jackson





Javascript: Math data types

Sunday, June 29th, 2008

MATH DATA TYPES:

Javascript can do the basic mathematical operators ( +, – , /). Javascript can express more complex mathematical operations through a single math object. This is the square root:

x = 16;
y = Math.sqrt(x);
document.write(y);

(will display the answer “4″)

And here is the sine of x:

z = Math.sin(x);
document.write(z);

(will display the answer “-0.2879033166650653 “)

You can convert a number to a string:

a = x.toString(10);

(will display 16)

You can specify the base:

a = x.toString(16);

(10)

a = x.toString(2);

(10000)

–Joab Jackson