Friday, June 4, 2010

Creating a Search Function 2

In the last post, I mentioned how I would upload files to the server and collect their details into the db.
Here, I'll show you how I was able to search, format and display all the information:




$search=$_POST["search"];
$level = $_POST["level"];
$type = $_POST["type"];

//get the mysql and store them in $result
$result = mysql_query("SELECT * FROM Resources WHERE level LIKE '%$level%' AND (tags LIKE '%$search%' or name LIKE '%$search%') AND type LIKE '%$type%' ORDER BY date DESC ");


//grab all the content
while ($get_info = mysql_fetch_array($result)){
$series[] = array('name' => $get_info['name'], 'url' => $get_info['url'], 'tags' => $get_info['tags'], 'level' => $get_info['level'], 'submittedby' => $get_info['submittedby'], 'date' => $get_info['date']);
}

?>
<!-- Show Content -->
<p>Here are all the resources...</p>

<?php foreach ($series as $show): ?>
<blockquote>
<h2><?php echo htmlspecialchars($show['name'], ENT_QUOTES, 'UTF-8'); ?></h2>
<p><em><a href="http://www.tracyr.comlu.com/SFVT/upload/<?php echo htmlspecialchars($show['url'], ENT_QUOTES, 'UTF-8'); ?>">click to download file </a></em><br/>
Tags:
<em><?php echo htmlspecialchars($show['tags'], ENT_QUOTES, 'UTF-8'); ?></em><br/>
Submitted By:
<em><?php echo htmlspecialchars($show['submittedby'], ENT_QUOTES, 'UTF-8'); ?></em><br/>
Date added: <?php echo htmlspecialchars($show['date'], ENT_QUOTES, 'UTF-8'); ?>
</p></blockquote>
<?php endforeach; ?>





Basically, the code allows me to grab all of the content from the db- if I want to filter it using the search form, that's where this comes in:


WHERE level LIKE '%$level%' AND (tags LIKE '%$search%' or name LIKE '%$search%') AND type LIKE '%$type%'



The second part of the code allows me to format the results by fetching the array and mixing html and php to decide how each result displays. It also allows me to create the url of each file since they are all in the /upload folder and the filename comes from the database.

This all took me a little while to get working- especially understanding the fetch array and "for each..." sections. But got there in the end!

Creating a Search Function

One of the biggest projects of my site has been to create the ability for users to upload files, load them into a folder and their into a database, return the formatted results and format them.
Here are some of the things I've been working on:

Uploading Files

The first thing I did was create a form. The form posts to an external php file, collects inputted data about the file and there is a field that allows you to select a file (type:"file"). Here's the code I used to upload the file to the folder on the server:




$file = ($_FILES['uploaded']['name']);

/*upload*/
$target = "upload/";
$target = $target . basename( $_FILES['uploaded']['name']) ;
$ok=1;
if(move_uploaded_file($_FILES['uploaded']['tmp_name'], $target))
{



The other main task was to add the data to the database:




$name = $_REQUEST['name'] ;
$tags = $_REQUEST['tags'] ;
$submittedby = $_REQUEST['submittedby'] ;
$file = ($_FILES['uploaded']['name']);
$level=serialize($_POST['level']);
$type=serialize($_POST['type']);


mysql_query("INSERT INTO Resources
(name, tags, level, type, url, submittedby) VALUES(' $name ', ' $tags ', ' $level ', ' $type ', '$file', '$submittedby') ")

or die(mysql_error());

echo "Data Inserted!";
echo "The file ". basename( $_FILES['uploadedfile']['name']). " has been uploaded";
}
else {
echo "Sorry, there was a problem uploading your file.";
}

if ($uploaded_type =="text/php")
{
echo "No PHP files<br>";
$ok=0;
}




... Just don't forget to connect to mySQL first.

What I've Been Up To

Hi All,
I was pretty ill for the last couple of weeks so missed the lectures, but I've been working hard on my site and getting it operating. I thought I would share with you some of what I've been doing.

Javascript form validation

I've learnt how to validate forms by checking if a field is empty...



if (form.name.value == "") {
alert( "Please enter the name of the resources." );
form.name.focus();
return false ;
}



(For this you need to specify the name of the field you want to validate (name) and if necessary, the id of the form (in this case 'form'))

... and check two passwords are the same



if (form.password.value != form.retypePassword.value)
{
alert("The two passwords are not the same.");
form.retypePassword.focus();
return false;
}



(This specifies the two password fields- 'password' and 'retypePassword')

To make these validations happen, you need to put them inside a function (in this case 'checkform') and add to the form an 'onsubmit' that executes the fuction, ie.



onsubmit="return checkform(this)

Saturday, May 15, 2010

Login system

I've been working this week on trying to figure out how to register users and log them into my site. This tutorial has been really helpful to me and might be for you if you want to do the same thing:
http://net.tutsplus.com/articles/news/how-to-build-a-login-system-for-a-simple-website/
The only problem is it doesn't finish- it doesn't show you how to register users or set an expiration date to the session. But it has enough for it to make sense to me and do the rest on my own.
Good luck!

Designing Databases


This week's prac was about databases. In working through the idea of a video store database, here's a possible solution:


Id

Name

Address

Telephone No

Driver’s Licence No

Email address

Password

0001

Amber Jones

23 Bla bla la

01283471050

12893140509384

calksjdopfwn@nsfaadf.com

secret

Id

Title

Copy No

Year

Genre

Actors

Release to shelf date

Current rental code

Current status

0001

The Negotiator

1

2009

Action

Joe Blow

3.4.2010

Newrelease

On shelf

Id

Rental Period (days)

Daily price within rental period

Daily price overdue

Auto assign at x weeks after release to shelf date

Newrelease

1

5.00

5.00

0

Weekly

7

1.00

0.50

16

Customer id

Title id

Date out

Date in

0001

0001

6.4.10

7.4.10


Saturday, May 8, 2010

Tool for Wireframing

It's probably a bit late for everyone, but I just thought I'd mention the tool I'm using to create my wireframes- so easy!
I'm using http://gomockingbird.com/
This is the type of thing you end up with:

Tuesday, May 4, 2010

MySQL

The prac today was about MySQL commands and using them to manipulate data. I'll be doing quite a bit of this interacting with php for my site. I've created a new page to display the final task in the prac- it took me a couple of tries to LIMIT, ORDER BY and SELECT in the same command, but here's what I came up with:

SELECT * FROM `books` WHERE LEFT(title, 1) = 'M' ORDER BY title LIMIT 0,3

This piece of code selects from the table called 'books' all titles that begin with M (where the left most character of the field 'title' is 'M'). It then orders the selection by title and limits it to three entries. The trick with this is that the ORDER BY needs to be done before the LIMIT- otherwise it doesn't work.

Just for a bit of fun, I had a play around with acually displaying the data on a site, and here's the code to do that:



<?php
$database="a4186211_wp";
mysql_connect ("mysql12.000webhost.com", "a4186211_tsr", "password");
@mysql_select_db($database) or die( "Unable to select database");
$result = mysql_query( "SELECT name, tags, url FROM Resources" )
or die("SELECT Error: ".mysql_error());


$query="SELECT * FROM `books` WHERE LEFT(title, 1) = 'M' ORDER BY title LIMIT 0,3";
$result=mysql_query($query);

$num_rows = mysql_num_rows($result);
print "There are $num_rows records.<P>";
print "<table width=200 border=1>\n";
while ($get_info = mysql_fetch_row($result)){
print "<tr>\n";
foreach ($get_info as $field)
print "\t<td><font face=arial size=1/>$field</font></td>\n";
print "</tr>\n";
}
print "</table>\n";

?>


Here's the link:
http://www.tracyr.comlu.com/Resources/new%202.php

Tuesday, April 20, 2010

JavaScript

You can check out my prac here:
http://tracyr.comlu.com/script/blog.html

It wasn't too difficult. Looking at the resources Alistair posted in UTS Online, I opened up the date file, and it suggested that to find a difference between two dates, do this:

timeA = new Date();
timeB = new Date( 'June 8 1982' );
timeDifference = timeA - timeB;

If 'new Date' is left blank, then it will assume today's date. The second date is my birthday- so this will calculate the difference between today's date and my birthday.
The only problem with this is that it's in milliseconds. In the same reference article for javascript date, it mentions there are 86 400 000 milliseconds in a day, so to get the number of days is pretty simple- take the time difference (which is now in milliseconds) and divide it by 86 400 000- which will give the number of days. To diplay this number in the document, I added the 'document.write'.

result= timeDifference/86400000;
document.write(result);

The last thing I did (mainly to check my maths since I wasn't convinced I was doing the right calculations!) was to divide the number of days I came up with by 365. This then converts the days into years. Now it's only approximate because it doesn't take into consideration leap years, but it was accurate enough to check by maths since I know how old I am!

To do this I added:

years = result/365;

And the final thing I did was to write this number to the document, but I wanted to write it so it was a whole number, without the decimal points, so I added in 'math.round' which rounds it to the nearest whole number- taken straight from w3schools.

document.write(Math.round(years) + "
");

So that was the JavaScript Prac!

Tuesday, April 13, 2010

PHP

I finished the php Prac from yesterday (the guestbook) and have it up and running here: (although I deliberately left out the images- so apologies for that).




I thought I would run you through some of the obstacles I came across in case you have the same issues:


Setting up a database:

Most of it was pretty straight forward- I followed the instructions in the script- made sure id was set to 'not null' and 'auto increment'. I just got a little stuck understanding about the primary key making the primary key the 'id' field- I needed to look for the button that made it the primary key.

"SQL PRIMARY KEY Constraint

The PRIMARY KEY constraint uniquely identifies each record in a database table.

Primary keys must contain unique values.

A primary key column cannot contain NULL values.

Each table should have a primary key, and each table can have only one primary key."

http://www.w3schools.com/sql/sql_primarykey.asp


Modifying the file to connect to the database:

My 000webhost members area had all the info to plug straight into the script directly under the instructions in quotation marks. The only one that got me stuck was the server- which was a different server from the one listed on the front page on the members area, I just needed to search the MySQL area for the database server.

Uploading:
No problems! Just used Filezilla and after rectifying the server issue, it all worked fine.

Adding a 'country' field:
Firstly, country needed to be added to the database table.
My strategy for this was simple- I scoured the document and every time I found 'name' 'email' and 'message' I added 'country' in the same syntax the others were in. First time round, I managed to get the JavaScript happening- new field and being able to type in the field, but wouldn't have 'country' emailed or appear at the top of the guest book. I went through it again, found that I had missed a couple of sections and did it again. Managed to get it to email, but not appear at the top of the page or add to the database. Finally found the part of the script that added it to the database and it all worked fine. I've hi-lighted all the changes I made to the script below.


__________________________________________________________________





Guestbook







::Guestbook - A::


dbc = mysql_connect($server, $user, $password) or die ("Connection failed!");
mysql_select_db($database) or die ("Database failed!");
}
/* DISPLAY RECORDS */
function display_records($offset, $entries_per_page)
{
$this->result = mysql_query("SELECT id, name, email, country, message, date FROM $this->table ORDER BY id DESC LIMIT $offset, $entries_per_page") or die ("Query failed!");
while ($row = mysql_fetch_array($this->result)) {
// SOME NICE FORMATTING HERE;
$display_name = nl2br(htmlspecialchars($row["name"]));
$display_email = nl2br(htmlspecialchars($row["email"]));
$display_country = nl2br(htmlspecialchars($row["country"]));
$display_message = nl2br(htmlspecialchars($row["message"]));
// THIS ALLOWS USING SMILIES AND IS NOT DANGEROUS;
$display_message = str_replace ("<img src=smiles/", "", $display_message);
// DISPLAY WHAT WE HAVE AT LAST;
echo "
Name: [" . $display_name . " ], Country: [" . $display_country . "], " . $row["date"] . "
" . "Email: " . $display_email . "

" . $display_message;

}
/******************************************************************************/
/* This code here handles pages stuff, number and next/previous links, etc. */
/* If you don't need some of the features, just delete corresponding parts. */
/******************************************************************************/
$this->count_result = mysql_query("SELECT count(id) AS number FROM $this->table") or die ("Query failed!");
while ($count = mysql_fetch_array($this->count_result)) {
$total_entries = $count["number"];
}
// HOW MANY PAGES OF RECORDS WE HAVE;
// THIS BLOCK IS ESSENTIAL FOR FURTHER PARTS;
$pages = $total_entries / $entries_per_page;
if ($pages < pages =" 1;"> 1) {
$pages = (int) $pages + 1;
}
else {
$pages = $pages;
}
if (($offset > $total_entries) or (!is_numeric($offset)))
$offset = 0;
// CURRENT PAGE NUMBER;
$pagenow = ($offset/$entries_per_page + 1);
echo "

* * *
Page " . $pagenow . " of " . $pages;
// NEXT/PREVIOUS PAGE LINKS DISPLAY
$next = $offset + $entries_per_page;
$previous = $offset - $entries_per_page;
if ($pages <> 1) {
echo " || ";
if ($previous < href="http://www.blogger.com/gb.php?offset=">";
echo ">>>";
}
elseif ($next >= $total_entries) {
echo "";
echo "<<<
";
}
else {
echo "";
echo "<<<
";
echo " | ";
echo "";
echo ">>>
";
}
echo "

";
}
// DISPLAY LINKS TO ALL PAGES SEPARATELY;
echo "
Pages: ";
$i = 0;
while ($i < $pages) { $ri = $i + 1; $showpage = $i * $entries_per_page; if ($ri == $pagenow) echo $ri . " "; else echo "" . $ri . " ";
$i++;
}
echo "
";
}
/******************************************************************************/
/* End of pages code, this section is the longest, but you get pages features */
/******************************************************************************/
/* ADD RECORDS TO DATABASE */
function add_record($name, $email, $country, $message, $smilies="on", $webmaster, $message_length, $language_filter, $bad_words)
{
if ($email == "") {
$email = "no_email";
}
// IF LANGUAGE FILTER IS ENABLED AND WEBMASTER EMAIL ADDRESS DEFINED DO THIS;
if (($language_filter == 1) and (strlen($webmaster) <> 0)) {
for ($i=0;$i<> 0) {
$message = substr($message, 0, $message_length);
}

// IF USER USES SMILIES DO THIS;
if ((isset($smilies)) and ($smilies == "on")) {
$format_smilies = array (
":-)", "\'Smile\'",
"8-)", "\'Glasses\'",
":(", "\'Angry\'",
":-D", "\'Big",
"%-)", "\'I",
">8-|", "\'Evil\'",
":-o", "\'Kiss",
"?", "\'Question\'",
":-(", "\'Sad\'",
"[$-)", "\'Sleepy\'",
":-P", "\'Tongue\'",
";-)", "\'Wink\'"
);

for ($i=0;$ithis->result = mysql_query("INSERT INTO $this->table (name, email, country, message, date) VALUES ('$name', '$email', '$country', '$message', NOW())");
// When guestbook is signed a message is emailed
// to webmaster if this feature is enabled;
if (strlen($webmaster) <> 0) {
$sendmessage = "Name: " . $name . "\nCountry: " . $country . "\nEmail: " . $email . "\nMessage: " . $message;
@mail($webmaster, "Guestbook signed", $sendmessage);
}
if (!$this->result)
echo "Error!";
}
/* DISCONNECT FROM DATABASE */
function disconnect_db()
{
mysql_close($this->dbc);
}
}
/******************************************************************************/
/* END OF GUESTBOOK CLASS */
/******************************************************************************/


/******************************************************************************/
/* INSTALLATION: */
/* 1) create a table in the MYSQL database with a query: */
/* CREATE TABLE guestbook ( */
/* id int(5) NOT NULL auto_increment, */
/* name varchar(50), */
/* email varchar(50), */
/* message text, */
/* date datetime, */
/* PRIMARY KEY (id) */
/* ) */
/* 2) define some variables below as they suit your environment; */
/* 3) possibly change any formatting in the display_records() function; */
/* 4) copy gb.php to your server and enjoy; */
/******************************************************************************/
// Let's define some variables;
$webmaster = 'ts_richardson@yahoo.com.au'; // EMAIL ADDRESS TO SEND WARNINGS TO
// WHEN GUESTBOOK IS SIGNED; LEAVE
// EMPTY IF YOU WANT THIS FEATURE
// DISABLED;
$server = 'mysql12.000webhost.com'; // DATABASE SERVER;
$database = 'a4186211_wp'; // DATABASE NAME;
$user = 'a4186211_tsr'; // USER TO CONNECT TO DATABASE;
$password = 'mypassword'; // USER PASSWORD;
$entries_per_page = 5; // HOW MANY RECORDS PER PAGE;
$message_length = 1024; // MESSAGE LENGTH ALLOWED, LEAVE 0
// IF YOU WANT ANY SIZE MESSAGES,
// THIS CUTS MESSAGE TO DEFINED SIZE;
$language_filter = 1; // 1 - enable language filter;
// 0 - disable language filter;
$bad_words = array ( // Bad words vocabulary (add your own);
'bottom', 'trousers'
);
// Let's spawn an instance of guestbook class;
$myGB = new Guestbook;
$myGB->connect_db($server, $database, $user, $password);

// aw- put the POST variables into the variables used in the script
$message = $_POST['message'];
$email = $_POST['email'];
$country = $_POST['country'];
$name = $_POST['name'];
$smilies = $_POST['smilies'];

// If user submitted form, add a record;
if (isset($message)) {
if (!isset($smilies))
$myGB->add_record($name, $email, $country, $message, "no", $webmaster, $message_length, $language_filter, $bad_words);
else
$myGB->add_record($name, $email, $country, $message, $smilies, $webmaster, $message_length, $language_filter, $bad_words);
}
// If opened without $offset variable defined, it is zero;
if ((!isset($offset)) or ($offset < offset =" 0;">display_records($offset, $entries_per_page);
$myGB->disconnect_db();
?>
and the form:
* Name:


Email:


Country:


* Message:








Monday, April 12, 2010

Macro and Micro Analysis

You'll find a link to my analysis here:



A couple of key things from my analysis I wanted to share with you:


-A great resource I found that covers a range of technologies that you would use to develop a site. It covers some history, background and advantages and drawbacks, as well as some how-tos.


Lane, J., Moscovitz, M. & Lewis, J.R., 2008. Foundation Website Creation with CSS, XHTML, and JavaScript, Available at: http://dx.doi.org.ezproxy.lib.uts.edu.au/10.1007/978-1-4302-0992-8 [Accessed April 7, 2010].


-While looking into html/ Xhtml and hml5, I realised that while I'd use Xhtml mostly, it might be good to at least look into using some html5 tags since that's what's coming.

Here's a great article about using html5 tags with graceful degradation:



Here's a section I really liked:


"HTML5 is not for everyone. Therefore, you must be wise and select how and where to use it. Think of all the markup flavours you’ve got available as tools: use the right one for the right job. Therefore, if your website is coded in standards compliant XHTML strict there’s no real need to change to HTML5.
There’s also the fact that by using HTML5 code right now your website gets stuck in some kind of “limbo” since even though your browser will render HTML5, it does not understand it as of yet. This may also apply to other software such as screenreaders and search engines.
Lastly you must consider that HTML5 is still under heavy development, and it’s probably the “most open” project the W3C has ever done. With the immense amount of feedback and all the hype around it, the current draft is bound to change and it’s impossible to predict how much."


Lastly, PHP was something to get my head around, particularly thinking about its advantages and drawbacks- which required a comparison with other alternatives. Here's an article that compares three major options PHP, Rails and Java. It gave me some ideas on what to compare and how to compare- and the graph makes it easy to access:

Wednesday, April 7, 2010

CSS and Positioning

Here are a couple of things that have stood out with regards to CSS that have been important for me to get my head around:

1. Class vs ID

"The difference between ID and class is that an ID selector can be called only once in a document, while a class selector can be called multiple times in a document. The second difference is that ID can be called by Javascript's getElementByID function.

There is no hard rule on when to use ID and when to use Class. My suggestion is to use class as much as possible for maximum flexibility, with the only exception being when you want to use Javascript's getElementByID function, in which case you need use ID.

Class and ID names are both case sensitive. For example, .classone and .ClassOne are two different classes."

Reference and more info:

http://www.1keydata.com/css-tutorial/class-id.php


2.Positioning

It's taken me a while to get my head around the different forms of positioning. Here's a website I think demonstrates it pretty well:

http://www.barelyfitz.com/screencast/html-training/css/positioning/


I also had a go at the challenge css prac from the lecture, and I'm told my solution is a little unconventional, so feel free to have a look at it here:

http://www.tracyr.comlu.com/new%202.html

Thursday, April 1, 2010

CSS and design

Hi All!
I really loved this site Viveka shared on Tuesday http://www.csszengarden.com/, it gave me lots of ideas for using CSS in my own site. I've been working on designs this week, and have come up with the raw beginnings of two to choose between-wondering if you can all help? Please check these out and tell me which one you like best. Cheers!

Thursday, March 25, 2010

PHP and databases

Tuesday's lecture was really helpful to me since I'm planning of having quite a bit of changing content on my site- which makes use of databases- which makes use of php. It was great to understand how it fits into the bigger picture. I've spent quite a bit of time this week looking into registration pages, blogging and forums to see how I can possibly integrate them into my site. I'm not sure whether I'm allowed to use it (from a course point of view), but I've managed to get wordpress up and running on my server, and phpBB- for blogging and forums. Even if it doesn't get used in the end, it was great to have the practice creating a database on the server, uploading the files, editing the php files to link to the databases I've created, and look at how I can create my own templates to integrate with the blogging/ forum technologies. It's obviously really important that I have a lot of control over the way it looks and its functionality- so I've been playing with that. I've also been trawling through the web and studying php codes that allow a user to register for a site, then log-in. I haven't quite got up to using it yet, but I feel I have a pretty good understanding of how it works. It's been a productive week for me!
The beginnings of a forum on my site:
http://www.tracyr.comlu.com/phpBB3/
The beginnings of a blog on my site:
http://www.tracyr.comlu.com/wordpress/
References:
http://wordpress.com
http://www.phpbb.com/
http://forum.codecall.net/php-tutorials/2014-simple-register-login-logoff-system.html
http://www.olate.co.uk/articles/185
http://www.swish-db.com/tutorials/view.php/tid/601

Sunday, March 21, 2010

Web 2.0

http://www.fuelinteractive.com/blog/800px-Web_2.0_Map.svg.png




I've been doing research about Web 2.0 in order to get an idea of what works on the web today, and to see how I can harness web 2.0 principles in my own site. The main thrust of my site is to connect home English tutors with each other in order to help them become better tutors- this can be done by sharing lesson resources, motivating through personal stories and messages, and reducing the feeling of isolation by facilitating the organisation of events. So how can I use 2.0 principles to make this work. Here are a couple of ideas...

All quotes taken from: O'Reilly, Tim (2005) What is Web 2.0: Design patterns and business models for the next generation of software. http://oreilly.com/pub/a/web2/archive/what-is-web-20.html?page=1

http://blogs.voices.com/thebiz/web1vsweb2.png

"The central principle behind the success of the giants born in the Web 1.0 era who have survived to lead the Web 2.0 era appears to be this, that they have embraced the power of the web to harness collective intelligence"
"The competitive opportunity for new entrants is to fully embrace the potential of Web 2.0. Companies that succeed will create applications that learn from their users, using an architecture of participation to build a commanding advantage not just in the software interface, but in the richness of the shared data"
I really like this. In fact I see this as integral to my site. I want my members to share their experiences and skills with each other. I'm worried I don't have the skills to make a site that will effectively do this. I'd love some suggestions!

"At its most basic, a blog is just a personal home page in diary format. But as Rich Skrenta notes, the chronological organization of a blog "seems like a trivial difference, but it drives an entirely different delivery, advertising and value chain.""
I can definitely see the value in blogging on my site if all members can contribute to it- or perhaps if they had their own pages. If they can't I'm not sure it will be relevant to my site.

" Database management is a core competency of Web 2.0 companies, so much so that we have sometimes referred to these applications as "infoware" rather than merely software."
While this article refers to major websites with sophisticated data, the concept of compiling and supplying useful data to my users is quite important. The potential to collate and share lesson resources, possibly even using the idea of a 'folksonomy' with user generated tags is worth exploring.

"Operations must become a core competency." and "Users must be treated as co-developer". Ultimately, the success of the site lies in its ability to be a service, not a product. Along with this, the content has to constantly evolve.

"substituting a simple pragmatism for ideal design"
Keep it simple- simple, light weight technologies are successful. Ultimately, I don't think this will be a problem since I will only be capable of developing simple technologies. However, the principle of keeping it simple (for the user) will be useful.

"One other feature of Web 2.0 that deserves mention is the fact that it's no longer limited to the PC platform."
At this stage, it is not a primary goal to develop my site for an exhaustive list of platforms but it is worth thinking about the scalability of my site.


I also had a look at another site that deals exclusively with 2.0 graphic design. It has quite a bit of food for thought, and I may use it quite a bit when I get to the design stage:
http://www.webdesignfromscratch.com/web-design/web-2.0-design-style-guide.php#simplicity


So all of this raises some questions for me that you may be able to help with:
- What will it take to create a blog that all site members to contribute to? Can you rss a blog that requires registration to read it? With very basic skills, can I learn them quick enough to do it?
- What about users uploading lesson activities- how hard will this be? Format?
- Can I embed delicious links in my site and can other users update this- what form??
- Forums? How does that work?
- What other suggestions have you got for 'easy' and 'simple' (but useful!) user contribution and interaction?
I'd love your help!!!!

Friday, March 12, 2010

Networks- Schmetworks





This week has been a pretty extensive learning process for me as I am so utterly unfamiliar with networking and the whys and hows of it. It has, in the past, been a topic I avoided because there is a lot of associated jargon and some abstract ideast that have confused me. My attempt, this week, has been to lock down some jargon and try to get a solid understanding of how it all works. I've listed my 'ramblings' about networks and my discoveries here.

Servers
"A server is just a computer that sits on a network waiting for clients to ask for things." (http://digitalfire.com/dreamsite/whatisaserver.html). Servers are essentially normal computers. There are different types: mail, web, file servers. A file server is like the one I use at work, where we log on and access shared (or private) files. My desktop PC is the client.

A web server is a web host- servers around the world that rent out web space. They all have IP addresses. So does my PC, assigned by my Internet Service Provider (ISP). (http://www.wisegeek.com/what-is-a-web-server.htm). When I type in a URL, it sends a request to the website server's IP address, which in turn sends a response to my IP address. This allows me to download web pages from these servers.

LANs compared to WANs.
A Local Area Network is a series of computers joined together- either peer-to-peer or client-server architecture. A WAN is a series of connected LANs. (http://www.webopedia.com/TERM/L/local_area_network_LAN.html).

An Internetwork
Is simply connected networks (ie. The Internet).

Protocols
"There are rules governing how data is transferred over networks, how they are compressed, how they are presented on the screen and so on. These set of rules are called protocols." (http://voip.about.com/od/voipbasics/g/protocoldef.htm)

IP: Internet Protocol, defines a set of rules governing the way computers use IP packets to send data over the Internet or any other IP-based network. Along with addressing, routing is one of the main functions of the IP protocol.
TCP:Transmission Control Protocol, used for the reliable transmission of data over a network.
HTTP: Hypertext Transfer Protocol, used for transmitting and displaying information in the form of web pages on browsers.
FTP: File Transfer Protocol, used for file transfer (uploading and downloading) over the Internet
SMTP: Simple Mail Transfer Protocol, used for email
Ethernet: Used for data transmission over a LAN.
Wi-Fi: One of the wireless protocols.

TCP adn IP work together to create smooth internet transmissions- TCP ensures reliability- no loss of packets, correct ordering, acceptable delay and non-duplication of packets.

Packets
Data split in to bits for easy transmission. "These packets contain not only the data, but the sender's identification, the destination, and a little error-control information to make sure the data was not damaged." (http://library.thinkquest.org/C007645/english/1-networkcomm.htm)

ISPs
"The client typically connects to the Internet by calling the host computer of the Internet Service Provider (ISP). This computer is directly hooked up to the Internet; thus it is actually the real client." (http://library.thinkquest.org/C007645/english/1-networkcomm-1.htm)

Ports
"A server provides services on separate ports. eg. telnet www.unsw.edu.au 80" (lecture- Viveka). There are standard ports for particular services and a firewall restricts access to ports protocols.

Sunday, March 7, 2010

How Smart is the SMART Table?






http://www2.smarttech.com/st/en-US/Products/SMART+Table/

This is the new SMART Table- just recently out in Australia. It's put out by the same people who made the first interactive whiteboards, who are also the most common brand. It's multi- finger touch, uses cameras to locate position and requires only power. To control the applications on it, you can use a syncing software or USB stick. At the moment, there's a limited number of applications that can be modified with selected curriculum material on a PC, saved and loaded onto the table.
This is where I see digital technologies going in the next few years in schools. Why? Collaboration is the answer. More and more, collaboration is the fundemental learning mode in the classroom. More and more research comes out that collaboration is the key to successful learning. So how does IT and collaboration happen? Well, it's true that more and more collaboration online is going on for educational purposes- forums, blogs, chat, pages that allow group contribution, and these modes of learning are becoming more popular. However, many teachers find these types of learning modes confrontational because they are not digital natives. They can become quite complex and overwhelming for teachers who are at much lower technology user levels than their students. And I think it's not hard to make a case for face-to-face collaboration as a useful learning mode.
So how else can we collaborate with IT in the equation? Well interactive whiteboards can facilitate class collaboration, but only one or two students can touch a board at a time.
Students can sit next to each other on one computer and discuss their work- but we all know the drawbacks of that-only one student can control the computer at once.
That's why I can see a future with the Smart Table. It's all about collaboration. Lots of kids can have their fingers on it at once. A group of kids can easily see the activity in front of them, discuss it and all students can see the other student's progress.
So what about applications? I'd love to get my teeth into designing some great learning tools for this. At the moment, the main drawback is the limited set of activites you can do on it and (in my opinion) the lack of imagination for the activities the have created. I think they need to get their head around the fact that a different learning mode means completely different activities (not the old-fashion mulitple choice question). The other limitation is also, of course, the price. At $10000 a pop (in Australia) it's going to have to come down in price before it's benefits can justify it's costs.
I'd be interested to know what others think of it...

Saturday, March 6, 2010

Criticism- Ahh

http://www.smashingmagazine.com/2010/03/02/web-design-criticism-a-how-to/

The above article got me thinking about feedback, criticism and and assessment in different fields. As a teacher, feedback is easy- you know you're not doing a good job because your students react to it. As a primary teacher, it's not hard to know a lesson isn't going well. Children let it all show- the body language is clear, the behavour is clear. And as a teacher, you can respond to it. Adults are harder- much more controlled in their reactions. You can't necessarily read an adult and gauge how they are reacting. They won't tell you the whole truth unless they want to. And adults can be embarassed about giving (much needed) negative feedback. In my experience, most adults will avoid giving criticism unless they can absolutely help it. Which makes it hard if we want to grow, learn and develop. The web is even worse for this. You develop a site, it goes live. You don't see your user, you don't exactly know how they're using the site, you don't know what they think of the content. Of course you can do some formal research, but we rely on informal feedback most in our daily lives. I run online training sometimes from my office. I hate it, because I have no idea how it's going because I can't see my audience or share their experience.
I'm really looking forward to taking this course because I want to learn, develop and grow as a designer. I don't enjoy getting negative feedback, but I'm looking forward to being a better designer. The article was a good reminder to me about how to take criticism, to put it all in perspective and also how to be a better judge of my own work. I plan to come back to these guidelines and read them again as I'm working so I've got some more objective tools from which I can judge my own work. It's very easy to focus on the look of the site and forget the usability and content. Particularly in a field where response is not so easy to gauge, it's good to have some tools and guidelines to try to work out whether something works or not.

Wednesday, March 3, 2010

What did Berners-Lee get us into?



I came across this interview with Berners-Lee from BBC today- the creator of the first website. It got me thinking not just about how the web has changed, but also how people have changed because of the web. Can people be changed by one piece of technology in the space of 14 years? And to what extent are we better off?- as the interviewer so clearly keeps asking throughout the interview.

I'm not old enough to really talk about what life was like 'before' and 'after' because I'm a digital native (Prensky, 2001)- I essentially grew up with it. But for most people not much older than me, there is definitely a sense of 'before the web' and 'after the web'.

So have they actually been changed by it? In my humble opinion, there are those who use it to do the old things in new ways and those who use it to do new things in new ways. Those are the people who have actually been changed by it.

Let me illustrate with an example from my field: I teach interactive whiteboards. One of the features is a screen shade- you black out the screen and drag a handle to revel parts of the screen at a time. It always amuses me that the older teachers particularly 'Ooo' and 'Ahh' at this bizarrely simple, and I think useless feature. Until I realised that it looks exactly like the old overhead-projector-with-the-piece-of-paper-covering-up-text trick. The teachers want to do old things with new technologies- it's familiar and comfortable, but not new.

It's worth remembering, though, that a vast number of people still live in the 'before', either by choice or circumstance. We all know those that live in 'before' by choice- who refuse to set up an email account, use online banking, order their travel tickets or find out the movie session times online- usually our grandmothers, who can be forgiven because they are our grandmothers. But what about those people who live in the 'before the web' by circumstance? Whole nations and societies are still there, and it worries me that the already vast gap between rich and poor is driven even further apart by those that live 'before the web' and those that live 'after the web'.

References:
http://news.bbc.co.uk/2/hi/technology/4132752.stm, 3.3.10
Prensky, M 2001 ‘Digital Natives, Digital Immigrants’, On The Horizon, vol. 9, no. 5.