Blog posts
- Aug 26 - Shorten your long urls (0)
- Apr 13 - Photographing for ortographic view (0)
- Mar 31 - Add youtube search on your site (0)
- Dec 24 - Christmas and new year (0)
- Nov 11 - Redward sponsor VLP (1)
- Sep 09 - Texture Projection (0)
- Aug 03 - Backup files from Samba to a Desktop computer (2)
- Jul 25 - UbuntuInfo Script (1)
- Jul 06 - Create a chat using jquery and php (9)
Shorten your long urls
Created Aug 26, 2010 23:55 by MarwellnIf you have a long url and want to make it shorter, use our site http://korturl.com - it's easy!
Photographing for ortographic view
Created Apr 13, 2010 14:38 by TruBAs 3d artist you often finding yourself looking for references to rely upon, sometimes you cant find those on the net and have to take them yourself, often those are references of people or animals that are unique or specific.
I have looked for a decent guide to help explain how to do this more than once without success, with help of trail and error learnt what to look for and this is my guide to help you.
Tried to make this as breif that I could and I hope you find it helpful.
Understanding ortographic view
Perspective view is the common view and thats what both our eyes and camera uses.
Ortgraphic dont work in the same way it lack depts so it doesnt know if its close to something or far away. You can think of it as a scanner that looks in straight line up.
Ortographic view also cant be rotated it only works on top, side and front, it can be flipped but thats not importent.
Computers simulates Perspective, But when you work with 3d images you are best set to use the ortographic views while working.
Below you see one example of how perspective looks versus ortographic

A cubic object like this wont show it sides in ortographic view, no telling how high something is, well you have the shadow in this example but its only used in this example since you wont see it while working. same goes with all sides. while aligned to the camera a cube wont show more than one side.
To use a camera that uses perspective to take a photo for use in ortographic view, you will have to do the next best thing.
One of the more importent references you take is of people. as you may understand at this point a perspective is not similer and problems accure when starts building, the best example of a human head is a ball. round and with depth.

Ortograpic view shows exactly 50% of the surface of a round ball, while a perspective will never be able to do that, it can come closer the further you move away from it.
Thats the general rule of how to take the ortographic view. Be as far away as you can.
So this is what you do:
You need a camera with optical zoom, stand 5-10 meters away should be enough. the Further the better but you should still be able to see what you are photographing. If you have lots of megapixlar in your camera you can stand a little further away if the optical zoom wont be enough. Who ever creates referenses from the photos later can easely just crop out areas that is not used.

(note that the front image is flipped, since she didnt 100% look straight, this was just eaiser to work with)
the Problem that will appear if not using this technique is that the ears on the person you are doing will disappear more or less, the head will be coned backwards. and if its really bad it wont go unnoticed and you cant really fix it afterwards witout creating new problems.
easy enough? So far so good I say.
while thats importent to know we have few points left just as importent while working with people but also with objects you may use.
Taking a portrait
The same goes with taking a photo for ortagraphic and you do with a portrait, just less room for error.
Imagen you have your freind infront of you and going to take his/hers photo to be used for a 3d construct.
You begin with taking the front/side photos, this is what you are going to consider:
Do I have a Neatrual background? - White background is prefered but any other color as long as its not blend with clothing and skin/hair will do.
Is the light soft enough and is it behind me? - for use of texture this is very importent but should always be considered
Tripod? - enough said, just use one.
What level of height should I use? - Always middle of the object, if you are taking the portrait its either the eyes or the noes you are aiming at.
Full body shot, and you should be en height of chest/torso (Do head and body seperate)
Clothing and Hair? - While this is dependent on who is making the 3d model, In most cases you should avoid things that hang, like earings, lose bracelet. the best is to elaborate between photographer and 3d artist what rules to follow and what to avoid.
Hair can be done is so many ways and but are hard to get right. Flat and controlled hair is mostly best way to go
Where is the model looking at? - While looking isnt the issue, people tend to align there head at where they are looking. give the model something look at if possible.
Like for the Front shot, the camera is a naturel point too look at, and for side you may consider putting something up on the wall that is height with your camera.
one of the more importent things and can make the artist loose hair over while setting it up like in the last example with the girl above.
the lines of the head, eyes and ears have to fit, else you have to rotate the side till you get it right and you may never find it to be perfect. Even when this is followed to the letter, things may look odd. Trying too hard to fix it wont make it better.
There is not garantee this will solve all problems, but hopefully let you avoid and some of the holes and understand how it works.
Quistions can be sent to our inbox or in comments below.
I have looked for a decent guide to help explain how to do this more than once without success, with help of trail and error learnt what to look for and this is my guide to help you.
Tried to make this as breif that I could and I hope you find it helpful.
Understanding ortographic view
Perspective view is the common view and thats what both our eyes and camera uses.
Ortgraphic dont work in the same way it lack depts so it doesnt know if its close to something or far away. You can think of it as a scanner that looks in straight line up.
Ortographic view also cant be rotated it only works on top, side and front, it can be flipped but thats not importent.
Computers simulates Perspective, But when you work with 3d images you are best set to use the ortographic views while working.
Below you see one example of how perspective looks versus ortographic

A cubic object like this wont show it sides in ortographic view, no telling how high something is, well you have the shadow in this example but its only used in this example since you wont see it while working. same goes with all sides. while aligned to the camera a cube wont show more than one side.
To use a camera that uses perspective to take a photo for use in ortographic view, you will have to do the next best thing.
One of the more importent references you take is of people. as you may understand at this point a perspective is not similer and problems accure when starts building, the best example of a human head is a ball. round and with depth.

Ortograpic view shows exactly 50% of the surface of a round ball, while a perspective will never be able to do that, it can come closer the further you move away from it.
Thats the general rule of how to take the ortographic view. Be as far away as you can.
So this is what you do:
You need a camera with optical zoom, stand 5-10 meters away should be enough. the Further the better but you should still be able to see what you are photographing. If you have lots of megapixlar in your camera you can stand a little further away if the optical zoom wont be enough. Who ever creates referenses from the photos later can easely just crop out areas that is not used.

(note that the front image is flipped, since she didnt 100% look straight, this was just eaiser to work with)
the Problem that will appear if not using this technique is that the ears on the person you are doing will disappear more or less, the head will be coned backwards. and if its really bad it wont go unnoticed and you cant really fix it afterwards witout creating new problems.
easy enough? So far so good I say.
while thats importent to know we have few points left just as importent while working with people but also with objects you may use.
Taking a portrait
The same goes with taking a photo for ortagraphic and you do with a portrait, just less room for error.
Imagen you have your freind infront of you and going to take his/hers photo to be used for a 3d construct.
You begin with taking the front/side photos, this is what you are going to consider:
Do I have a Neatrual background? - White background is prefered but any other color as long as its not blend with clothing and skin/hair will do.
Is the light soft enough and is it behind me? - for use of texture this is very importent but should always be considered
Tripod? - enough said, just use one.
What level of height should I use? - Always middle of the object, if you are taking the portrait its either the eyes or the noes you are aiming at.
Full body shot, and you should be en height of chest/torso (Do head and body seperate)
Clothing and Hair? - While this is dependent on who is making the 3d model, In most cases you should avoid things that hang, like earings, lose bracelet. the best is to elaborate between photographer and 3d artist what rules to follow and what to avoid.
Hair can be done is so many ways and but are hard to get right. Flat and controlled hair is mostly best way to go
Where is the model looking at? - While looking isnt the issue, people tend to align there head at where they are looking. give the model something look at if possible.
Like for the Front shot, the camera is a naturel point too look at, and for side you may consider putting something up on the wall that is height with your camera.
one of the more importent things and can make the artist loose hair over while setting it up like in the last example with the girl above.
the lines of the head, eyes and ears have to fit, else you have to rotate the side till you get it right and you may never find it to be perfect. Even when this is followed to the letter, things may look odd. Trying too hard to fix it wont make it better.
There is not garantee this will solve all problems, but hopefully let you avoid and some of the holes and understand how it works.
Quistions can be sent to our inbox or in comments below.
Add youtube search on your site
Created Mar 31, 2010 17:35 by MarwellnI've been using Youtube alot lately and while having some spare time, I came across the Youtube API and began thinking about doing a simple Youtube video search.
The result? This.
Read the following steps if you want to create your own Youtube video search engine.
The Zend framework is required for this, so if your unsure if you have it or not, you can download the framework from Zend's webpage. Just select Zend Framework Minimal Package and unzip the Zend folder into the root of your Youtube search folder.
This simple Youtube search only have two files. It's index.php and styles.css.
In the index.php file, add this:
Have in mind that you need to change the path to the Zend loader (Loader.php) if you havent placed the zend framework in a Zend folder into the root of your Youtube search folder.
If you want to change the amount of entries found from your search, you can change the $maxResults variable to a different value.
In the styles.css file, add this:
And now we're done. No more code for this simple Youtube search.
You can find a live preview here: http://www.redward.org/public/projects/youtubesearch/
The result? This.
Read the following steps if you want to create your own Youtube video search engine.
Zend framework
The Zend framework is required for this, so if your unsure if you have it or not, you can download the framework from Zend's webpage. Just select Zend Framework Minimal Package and unzip the Zend folder into the root of your Youtube search folder.
The code
This simple Youtube search only have two files. It's index.php and styles.css.
File: index.php
In the index.php file, add this:
<?php
// load Zend and Youtube zend class
require "Zend/Loader.php"; // specify your own path here
Zend_Loader::loadClass('Zend_Gdata_YouTube');
// reset variables
$vidList = null;
function echoVideoList($feed) {
$res = '<ul id="videoList">';
foreach ($feed as $entry) {
$videoId = $entry->getVideoId();
$thumbnailUrl = $entry->mediaGroup->thumbnail[0]->url;
$videoTitle = $entry->mediaGroup->title;
$videoDescription = $entry->mediaGroup->description;
$watchPage = $entry->mediaGroup->player[0]->url;
$res .= "<li>
<img src='{$thumbnailUrl}' alt='thumbnail' class='youSearchThumbnail' />
<a href='{$watchPage}'>{$videoTitle}</a>
<p>".substr($videoDescription, 0, 100).(strlen($videoDescription) > 100 ? " ..." : null)."</p>
</li>
<li class='youSearchSeperator'></li>";
}
$res .= '</ul>';
return $res;
}
// process video search
if (isset($_POST['search'])) {
$searchTerm = $_POST['searchTerm']; // your search query
$maxResults = 20; // amount of entries shown from search result
$yt = new Zend_Gdata_YouTube();
$query = $yt->newVideoQuery();
$query->setQuery($searchTerm);
$query->setMaxResults($maxResults);
$feed = $yt->getVideoFeed($query);
$vidList = echoVideoList($feed);
}
// layout
echo "<html>
<head>
<title>Youtube video search</title>
<link rel='stylesheet' type='text/css' href='styles.css' />
<meta http-equiv='Content-Type' content='text/html;charset=utf-8' />
</head>
<body>
<div id='container'>
<h1>Youtube video search</h1>
<form method='post' action='' id='youSearchForm'>
<input type='text' name='searchTerm' value='".(isset($_POST['searchTerm']) ? $_POST['searchTerm'] : null)."'>
<input type='submit' name='search' value='Search' />
</form>
$vidList
</div>
</body>
</html>";
?>
// load Zend and Youtube zend class
require "Zend/Loader.php"; // specify your own path here
Zend_Loader::loadClass('Zend_Gdata_YouTube');
// reset variables
$vidList = null;
function echoVideoList($feed) {
$res = '<ul id="videoList">';
foreach ($feed as $entry) {
$videoId = $entry->getVideoId();
$thumbnailUrl = $entry->mediaGroup->thumbnail[0]->url;
$videoTitle = $entry->mediaGroup->title;
$videoDescription = $entry->mediaGroup->description;
$watchPage = $entry->mediaGroup->player[0]->url;
$res .= "<li>
<img src='{$thumbnailUrl}' alt='thumbnail' class='youSearchThumbnail' />
<a href='{$watchPage}'>{$videoTitle}</a>
<p>".substr($videoDescription, 0, 100).(strlen($videoDescription) > 100 ? " ..." : null)."</p>
</li>
<li class='youSearchSeperator'></li>";
}
$res .= '</ul>';
return $res;
}
// process video search
if (isset($_POST['search'])) {
$searchTerm = $_POST['searchTerm']; // your search query
$maxResults = 20; // amount of entries shown from search result
$yt = new Zend_Gdata_YouTube();
$query = $yt->newVideoQuery();
$query->setQuery($searchTerm);
$query->setMaxResults($maxResults);
$feed = $yt->getVideoFeed($query);
$vidList = echoVideoList($feed);
}
// layout
echo "<html>
<head>
<title>Youtube video search</title>
<link rel='stylesheet' type='text/css' href='styles.css' />
<meta http-equiv='Content-Type' content='text/html;charset=utf-8' />
</head>
<body>
<div id='container'>
<h1>Youtube video search</h1>
<form method='post' action='' id='youSearchForm'>
<input type='text' name='searchTerm' value='".(isset($_POST['searchTerm']) ? $_POST['searchTerm'] : null)."'>
<input type='submit' name='search' value='Search' />
</form>
$vidList
</div>
</body>
</html>";
?>
Have in mind that you need to change the path to the Zend loader (Loader.php) if you havent placed the zend framework in a Zend folder into the root of your Youtube search folder.
If you want to change the amount of entries found from your search, you can change the $maxResults variable to a different value.
File: styles.css
In the styles.css file, add this:
* { margin:0; padding:0; }
html, body {
font-family:Tahoma, FreeSans;
font-size:11px;
margin:5px;
}
input, textarea, select {
font-family:Tahoma, FreeSans;
font-size:11px;
}
#container {
margin:0 auto;
width:600px;
text-align:center;
background:#F7F7F7;
border:1px solid #ECECEC;
}
#videoList {
text-align:left;
padding:10px;
}
#videoList li { list-style-type:none; }
#videoList li img { float:left; width:120px; height:90px; margin-right:5px; }
#videoList li.youSearchSeperator { clear:both; padding-bottom:10px;}
#videoList li.youSearchSeperator:last-child { padding:0px;}
html, body {
font-family:Tahoma, FreeSans;
font-size:11px;
margin:5px;
}
input, textarea, select {
font-family:Tahoma, FreeSans;
font-size:11px;
}
#container {
margin:0 auto;
width:600px;
text-align:center;
background:#F7F7F7;
border:1px solid #ECECEC;
}
#videoList {
text-align:left;
padding:10px;
}
#videoList li { list-style-type:none; }
#videoList li img { float:left; width:120px; height:90px; margin-right:5px; }
#videoList li.youSearchSeperator { clear:both; padding-bottom:10px;}
#videoList li.youSearchSeperator:last-child { padding:0px;}
And now we're done. No more code for this simple Youtube search.
You can find a live preview here: http://www.redward.org/public/projects/youtubesearch/
Christmas and new year
Created Dec 24, 2009 07:00 by Marwelln
Redward sponsor VLP
Created Nov 11, 2009 21:48 by Marwelln
Take a look at their site either from our portfolio at this site or by viewing the site itself at http://www.vlp.se.
Texture Projection
Created Sep 09, 2009 17:01 by TruBIve stumble upon this a few times on the net and not too long ago I helped freind with creating a scene using projection for live work he was doing for a company.I have yet to see the final results but I was impressed how easy and fast it was to set up.
Let me start of that this is no in-dept tutorial, I know its possible with maya that I use and 3d studio max, possibly many similar applications.
All im going to talk about the usefulness and when you should use it.
The easiest way to describe this is that you take a picture or even a painted image work, you set it to project over the scene, and the projection works very much like it does in the cinema, home theater or flashlight if you will.
Like shown in the picture below.

Then you add objects that "attracts" the projection and get all the detail that comes with it, this could be really hard and you have to put both mind and effort into this to get it good. the more primitive shapes that is in the image the better.
Buildings and houses, walls in general is good. open terrain and so on.
You most likely have to edit details like wires, things that is just too small or shallow to use. you better add that as 3d detail later.
Good thing is that the building and such dont have to be a 100% right, you can miss shape it to fit the texture and still get a results just as good.
No worries about shadows just that it gets the appropriate light
Thats pretty much how it works, now you have a scene that you can move around in, you cant stray too far off the original angle since you will see edges and textures of for an example houses being projected in the sky, this can be avoided however if you have several shaders/textures for different objects, like the sky is painted one or an complete other texture which may give some extra freedom. more work, but not that much if you need it.
My scene
I took a photo from a road trip a couple years ago I think I was in Austria. took me around two days to do with some trail and error
You can see the image below and the results in a still image. I choose this image simple cause there was a simple scene with treelines, backdrop, ground and some details. Since all the tutorials ive seen was of harder objects like corridors, mountains and houses.

If you look closely they are pretty similar and that is good thing ofcourse. Also take note that the camera is closer into the scene than the original due to that you cant be further out only further in. But the magic comes first to life when the scene turns into animation like in this clip here.
As you can its a simple camera movement and added two objects, the two planes, actually interacting with the surroundings through their shadows.
Having a walking meshwarrior wouldn't make much difference other than more animation work for it.
Its not hard to this but some planing is needed before you even start, lets get to that later.
Lets break it down now Yo.
the Scene have four key components, and that is the ground, the whole ground since that is one and the same.
the first line of trees, the second line of trees, and the backdrop being the sky and some distant mountins.
Thats four right, 1,2,3.. yeah.
Four key components.
the Ground is edited to have the ground and trees first line of trees is edit out, also the lonely tree in the middle and poles from the fence.
The first line of trees is edited somewhat, but for most part it has this alpha channel, which is for those who don't know is a black and white image that regulates the transparency of the image. meaning that I more ore less just cut out the trees with black and white.
The second line of trees is using the same texture as the ground, since its a clear line of trees its not much to talk about.
And at last the backdrop which isn't edited at all, it has the mountains like I said, but since we are not going much upwards with the camer there was no reason to edit that out, even though I could.
a Scene from an other angle below.

Click for slightly larger image
Good overview how the scene is built, and also a good example what you cant do with it when it comes to where from you shoot the scene.
We have some details that we need to talk about, being the lonely the tree and fence poles. Those like I said was edited out and the tree is texture that is using a alpha channel to regulate its transparency like the first tree line did.
and the poles for the fence is just 3d primitives added with a basic texture to fit in. they are using a shadows that falls on the ground to and some extra realism into the scene, and they are one of those details that are need to be done afterwards. If this was a city with lots of little things that "poked" out in the air and thing that is hanging around all those would have to be edited out from the original added later.
Adding bump maps would surely higher the experience but I didn't have to think about that since there is no obvious place to add that.

Here is a better view of the different components in the scene, only three since the second tree line and the ground is the same.
I didnt bother changing color for the lonely tree and the other details but you can see where they are and how simple the scene really is.

a Wire to even more see how its built, this is what I look that while working with it getting the 3D lines to fallow the lines the photo.
..and last, the final results.

Click for slightly larger image
any feedback or quistions about can be sent either to my email TruB@Redward.org or the comments below.
/TruB
Let me start of that this is no in-dept tutorial, I know its possible with maya that I use and 3d studio max, possibly many similar applications.
All im going to talk about the usefulness and when you should use it.
The easiest way to describe this is that you take a picture or even a painted image work, you set it to project over the scene, and the projection works very much like it does in the cinema, home theater or flashlight if you will.
Like shown in the picture below.

Then you add objects that "attracts" the projection and get all the detail that comes with it, this could be really hard and you have to put both mind and effort into this to get it good. the more primitive shapes that is in the image the better.
Buildings and houses, walls in general is good. open terrain and so on.
You most likely have to edit details like wires, things that is just too small or shallow to use. you better add that as 3d detail later.
Good thing is that the building and such dont have to be a 100% right, you can miss shape it to fit the texture and still get a results just as good.
No worries about shadows just that it gets the appropriate light
Thats pretty much how it works, now you have a scene that you can move around in, you cant stray too far off the original angle since you will see edges and textures of for an example houses being projected in the sky, this can be avoided however if you have several shaders/textures for different objects, like the sky is painted one or an complete other texture which may give some extra freedom. more work, but not that much if you need it.
My scene
I took a photo from a road trip a couple years ago I think I was in Austria. took me around two days to do with some trail and error
You can see the image below and the results in a still image. I choose this image simple cause there was a simple scene with treelines, backdrop, ground and some details. Since all the tutorials ive seen was of harder objects like corridors, mountains and houses.

If you look closely they are pretty similar and that is good thing ofcourse. Also take note that the camera is closer into the scene than the original due to that you cant be further out only further in. But the magic comes first to life when the scene turns into animation like in this clip here.
As you can its a simple camera movement and added two objects, the two planes, actually interacting with the surroundings through their shadows.
Having a walking meshwarrior wouldn't make much difference other than more animation work for it.
Its not hard to this but some planing is needed before you even start, lets get to that later.
Lets break it down now Yo.
the Scene have four key components, and that is the ground, the whole ground since that is one and the same.
the first line of trees, the second line of trees, and the backdrop being the sky and some distant mountins.
Thats four right, 1,2,3.. yeah.
Four key components.
the Ground is edited to have the ground and trees first line of trees is edit out, also the lonely tree in the middle and poles from the fence.
The first line of trees is edited somewhat, but for most part it has this alpha channel, which is for those who don't know is a black and white image that regulates the transparency of the image. meaning that I more ore less just cut out the trees with black and white.
The second line of trees is using the same texture as the ground, since its a clear line of trees its not much to talk about.
And at last the backdrop which isn't edited at all, it has the mountains like I said, but since we are not going much upwards with the camer there was no reason to edit that out, even though I could.
a Scene from an other angle below.

Click for slightly larger image
Good overview how the scene is built, and also a good example what you cant do with it when it comes to where from you shoot the scene.
We have some details that we need to talk about, being the lonely the tree and fence poles. Those like I said was edited out and the tree is texture that is using a alpha channel to regulate its transparency like the first tree line did.
and the poles for the fence is just 3d primitives added with a basic texture to fit in. they are using a shadows that falls on the ground to and some extra realism into the scene, and they are one of those details that are need to be done afterwards. If this was a city with lots of little things that "poked" out in the air and thing that is hanging around all those would have to be edited out from the original added later.
Adding bump maps would surely higher the experience but I didn't have to think about that since there is no obvious place to add that.

Here is a better view of the different components in the scene, only three since the second tree line and the ground is the same.
I didnt bother changing color for the lonely tree and the other details but you can see where they are and how simple the scene really is.

a Wire to even more see how its built, this is what I look that while working with it getting the 3D lines to fallow the lines the photo.
..and last, the final results.

Click for slightly larger image
any feedback or quistions about can be sent either to my email TruB@Redward.org or the comments below.
/TruB
Backup files from Samba to a Desktop computer
Created Aug 03, 2009 16:08 by MarwellnHave you set up Samba (shared folder in Windows 2003) and ever wondered if you could get those files automatically to your Desktop computer? You can (using a Windows operation system)! If you go into the control panel, you'll see Sync Center, that's where all the magic happens. There's not much to do in there, but it's enough to have it working.
Follow these following steps to synchronize your files (from a server) to your desktop PC.
Step one:
Select a folder and share it.
Step two:
After you've shared a folder, go into the share and right click a folder and select Always available offline.
Step three:
Go back to the Sync Center, click on Offline files and select Schedule.
Step four:
Select each folders you want to schedule in the new window that appears.
Step five:
Choose if you want the synchronization to be at a scheduled time or when an event occurs.
Step six:
Select the date (if you selected time) or options (if you selected event) you want and click next.
Step seven:
Enter a name and click save.
If you didn't encounter any errors you should have a working Synchronization.
You files is located in C:\Windows\CSC
Follow these steps to change the location:
Step one:
Open the Registry Editor by typing Regedit in the search box in the start menu.
Step two:
Go to Computer\HKEY_LOCAL_MACHINE\Software\Microsoft\Windows\CurrentVerison\NetCache
Step three:
Add a new String Value, right click on an empty space, select New and then String Value. Name it DatabaseLocation.
Step four:
Double click on the new string value (DatabaseLocation), in the value data field, enter where you want your files to be saved.
To view your offline files, you will have to go the the Sync Center, click Manage offline files in the menu and then View your offline files.
Follow these following steps to synchronize your files (from a server) to your desktop PC.
Step one:
Select a folder and share it.
Step two:
After you've shared a folder, go into the share and right click a folder and select Always available offline.
Step three:
Go back to the Sync Center, click on Offline files and select Schedule.
Step four:
Select each folders you want to schedule in the new window that appears.
Step five:
Choose if you want the synchronization to be at a scheduled time or when an event occurs.
Step six:
Select the date (if you selected time) or options (if you selected event) you want and click next.
Step seven:
Enter a name and click save.
If you didn't encounter any errors you should have a working Synchronization.
Where is my files located?
You files is located in C:\Windows\CSC
Follow these steps to change the location:
Step one:
Open the Registry Editor by typing Regedit in the search box in the start menu.
Step two:
Go to Computer\HKEY_LOCAL_MACHINE\Software\Microsoft\Windows\CurrentVerison\NetCache
Step three:
Add a new String Value, right click on an empty space, select New and then String Value. Name it DatabaseLocation.
Step four:
Double click on the new string value (DatabaseLocation), in the value data field, enter where you want your files to be saved.
How do I view my offline files?
To view your offline files, you will have to go the the Sync Center, click Manage offline files in the menu and then View your offline files.
UbuntuInfo Script
Created Jul 25, 2009 23:52 by MarwellnI recently installed a new server with Ubuntu as operation system, on that I installed phpsysinfo, which made my client freeze, it also displayed a lot of things I wasn't interested of. So I came up with the idea to make my own system information script (UbuntuInfo).
UbuntuInfo is simple to use and built using modules. If you know how Ubuntu works and also know how to code PHP you can easily create your own modules to show.
The script looks like the picture to the right (click on it for bigger picture), is 57kb in size (7zip doesnt compress tar files good) and can be downloaded from here: www.redward.org/files/ubuntuinfo-v1.0.tar
UbuntuInfo is simple to use and built using modules. If you know how Ubuntu works and also know how to code PHP you can easily create your own modules to show.
The script looks like the picture to the right (click on it for bigger picture), is 57kb in size (7zip doesnt compress tar files good) and can be downloaded from here: www.redward.org/files/ubuntuinfo-v1.0.tar
Create a chat using jquery and php
Created Jul 06, 2009 22:31 by MarwellnThis blog post will show you how to create your own (simple) chat with html, jquery (javascript) and php.
Let's start by setting up our folder structure. The folder structure should look like this:
* /data/messages/
* /
The messages folder will contain all messages written. Well structured with folder for each month and files for each day inside the "month-folder". Don't forget to chmod the messages folder to 0777.
After that's complete, we can start building our chat by creating an index.php and styles.css file in the root. In those files, we're
going to build and decide how our layout should look like.
In the index file, add doctype, html, head and body tag like this:
As we are using jquery as our javascript library, we need to include the jquery file inside the head tags, and while we\'re at it, we\'re also going to
add a link to our own javascript file, style file and a mandatory title tag. Change the head tags to this:
The title tag can be changed, the link and the two script tags must remain as it is.
When that is done, we need to start designing our layout. In this example, we\'re going to use four divs, one as container, one for all messages, one
for text input and one to show that the text is being sent. Change the body tags to this:
The div with id container is mainly for centering the chat. The div with id chat-messages will, after calling an ajax query get the 25 (a user chosen
limit) latest messages. The div with id chat-send is what it looks like, it contains all input boxes and buttons, and the last div will show a loading message after pressing the enter key or the send button.
That's all the code for the index file. (Should look like this: http://www.redward.org/public/projects/chat/index.phps)
We're now going to start styling our website. Open up the styles.css file (create it if you haven\'t already). The first thing we're are going to do in the file is to chose a default font size and font type (family). We\'re also going to add some padding so the site is a bit from the wall. We're doing that with the following code (add it into the styles file):
Tahoma is a standard and a nice looking font, unfortunately it's not available in Linux (or at least Ubuntu), and that's why we're also using the FreeSans font which is pretty similar to Tahoma.
Next thing we're going to do is to make the chat 500 pixels wide and centered, using the following code:
Next is the div containing the messages and the div containing the input boxes and the input button:
The border-radius element is only for Firefox and Webkit (Chrome, Opera). It makes the corners round!
Next is the input boxes and the input button:
Nothing out of the ordinary with that. The loading div might be a bit trickier, it requires a absolute:relative; which can make the position a bit of if the width is changed. Following code is used:
It's hidden as standard, and that's why there's display:block;. It will be shown when pressing the enter key or the send button using our jquery code.
The last bit of code in the styles file is this:
This is used for each message row.
The style file is now complete and should look like this: http://www.redward.org/public/projects/chat/styles.txt
Now there's only three files left. chat.js, chat-msgs.php and chat.php. Lets start with opening the chat.js file (create it if you haven't already).
Add this in the file:
The keydown part gets the sendtext function when clicking the enter key. Same thing goes for the click event, it gets the sendtext function after pressing the send button. The getmessages function is used to get the 25 (user selected limit) latest messages.
After you've added the javascript code above, you're going to add three new functions. getmessages, getmess and sendtext. Add to following code to the file:
The getmessages function gets the messages via setTimeout and the getmess function every five seconds. The getmess function gets the messages with ajax post via a file called chat-msgs.php. The sendtext function checks if all required values are inserted and posts the message with ajax post via chat.php. The getmess function is called if the ajax post is successful.
Our javascript file, chat.js, is now complete and should look like this: http://www.redward.org/public/projects/chat/chat.txt
Next step ahead, open up chat-msgs.php (create it if you haven\'t already) and begin by adding these lines to the file:
If the file is called withour $_POST, it will die and nothing will be returned. The mess_output variable is set to null, else php would show an error while using the code below. The limit variable sets how many messages you want to be shown.
Next up is the getmessages function and the initie to it as well. This is the code:
The function search trough each folder for a maximum of 25 (your limit) hits or 20 folders. It then returns the value found from the files to an array.
The array is printed with a foreach loop together with the mess_output variable like this:
That's all for the chat-msgs.php file. The final result for that file should look like this: http://www.redward.org/public/projects/chat/chat-msgs.phps
Now there's only one file left. Open up chat.php (create it if you haven't already) and add this to the top of the file:
The first piece checks if user and message is set via post, if not, the file return false and dies. The curdate variable is like a shortcut. Instead of writing date two times, we use a variable named curdate.
Next up comes two function, one to change the text so it doesn\'t destroy the page and another for creating the text. This is the code:
The chatsend function is only used so you doesn't have to write the same piece of code twice.
The absolute last thing we're going to do is to add the following code to the file:
The code creates a directory and file automatically if it doesn't exists. If it exists it appends the message to the end of the file.
The file should now look like this: http://www.redward.org/public/projects/chat/chat.phps
The script can be downloaded from http://www.redward.org/public/projects/chat/chat.7z.
A preview of the script is found here: http://www.redward.org/public/projects/chat/
Let's start by setting up our folder structure. The folder structure should look like this:
* /data/messages/
* /
The messages folder will contain all messages written. Well structured with folder for each month and files for each day inside the "month-folder". Don't forget to chmod the messages folder to 0777.
After that's complete, we can start building our chat by creating an index.php and styles.css file in the root. In those files, we're
going to build and decide how our layout should look like.
In the index file, add doctype, html, head and body tag like this:
<?php
echo "<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Strict//EN\"
\"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd\">
<html xmlns='http://www.w3.org/1999/xhtml' lang='en' xml:lang='en'>
<head>
</head>
<body>
</body>
</html>";
?>
echo "<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Strict//EN\"
\"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd\">
<html xmlns='http://www.w3.org/1999/xhtml' lang='en' xml:lang='en'>
<head>
</head>
<body>
</body>
</html>";
?>
As we are using jquery as our javascript library, we need to include the jquery file inside the head tags, and while we\'re at it, we\'re also going to
add a link to our own javascript file, style file and a mandatory title tag. Change the head tags to this:
<head>
<title>Chat - Using jquery (javascript) and php (no database required)!</title>
<link rel='stylesheet' href='styles.css' type='text/css' media='screen' />
<script src='http://code.jquery.com/jquery-latest.js' type='text/javascript'></script>
<script src='chat.js' type='text/javascript'></script>
</head>
<title>Chat - Using jquery (javascript) and php (no database required)!</title>
<link rel='stylesheet' href='styles.css' type='text/css' media='screen' />
<script src='http://code.jquery.com/jquery-latest.js' type='text/javascript'></script>
<script src='chat.js' type='text/javascript'></script>
</head>
The title tag can be changed, the link and the two script tags must remain as it is.
When that is done, we need to start designing our layout. In this example, we\'re going to use four divs, one as container, one for all messages, one
for text input and one to show that the text is being sent. Change the body tags to this:
<body>
<div id='container'>
<!-- show messages -->
<div id='chat-messages'>
Loading messages...
</div>
<!-- send message formular -->
<div id='chat-send'>
<input type='text' id='send-user' />
<input type='text' id='send-text' />
<input type='button' id='send-text-button' value='Send' />
</div>
<div id='send-loading'>Loading...</div>
</div>
</body>
<div id='container'>
<!-- show messages -->
<div id='chat-messages'>
Loading messages...
</div>
<!-- send message formular -->
<div id='chat-send'>
<input type='text' id='send-user' />
<input type='text' id='send-text' />
<input type='button' id='send-text-button' value='Send' />
</div>
<div id='send-loading'>Loading...</div>
</div>
</body>
The div with id container is mainly for centering the chat. The div with id chat-messages will, after calling an ajax query get the 25 (a user chosen
limit) latest messages. The div with id chat-send is what it looks like, it contains all input boxes and buttons, and the last div will show a loading message after pressing the enter key or the send button.
That's all the code for the index file. (Should look like this: http://www.redward.org/public/projects/chat/index.phps)
We're now going to start styling our website. Open up the styles.css file (create it if you haven\'t already). The first thing we're are going to do in the file is to chose a default font size and font type (family). We\'re also going to add some padding so the site is a bit from the wall. We're doing that with the following code (add it into the styles file):
* { margin:0; padding:0; }
html {
font-size:11px;
font-family:Tahoma, FreeSans;
padding:10px;
}
html {
font-size:11px;
font-family:Tahoma, FreeSans;
padding:10px;
}
Tahoma is a standard and a nice looking font, unfortunately it's not available in Linux (or at least Ubuntu), and that's why we're also using the FreeSans font which is pretty similar to Tahoma.
Next thing we're going to do is to make the chat 500 pixels wide and centered, using the following code:
/* div container */
#container {
width:500px;
margin:0 auto;
text-align:center; /* centering fix for ie */
}
#container {
width:500px;
margin:0 auto;
text-align:center; /* centering fix for ie */
}
Next is the div containing the messages and the div containing the input boxes and the input button:
/* list messages div */
#chat-messages {
border:1px solid gray;
-moz-border-radius-topleft:5px;
-webkit-border-top-left-radius:5px;
padding:2px;
text-align:left;
word-wrap:break-word;
}
/* send div */
#chat-send {
border:1px solid gray;
border-top:none;
-moz-border-radius-bottomright:5px;
-webkit-border-bottom-right-radius:5px;
padding:2px;
text-align:left;
}
#chat-messages {
border:1px solid gray;
-moz-border-radius-topleft:5px;
-webkit-border-top-left-radius:5px;
padding:2px;
text-align:left;
word-wrap:break-word;
}
/* send div */
#chat-send {
border:1px solid gray;
border-top:none;
-moz-border-radius-bottomright:5px;
-webkit-border-bottom-right-radius:5px;
padding:2px;
text-align:left;
}
The border-radius element is only for Firefox and Webkit (Chrome, Opera). It makes the corners round!
Next is the input boxes and the input button:
/* the send input box */
#send-text {
width:324px;
font-size:inherit;
font-family:inherit;
border:1px solid #ececec;
}
#send-user {
width:100px;
font-size:inherit;
font-family:inherit;
border:1px solid #ececec;
}
/* the send input button */
#send-text-button {
font-size:11px; /* must enter values for IE7 */
font-family:Tahoma, FreeSans; /* must enter values for IE7 */
width:60px;
}
#send-text {
width:324px;
font-size:inherit;
font-family:inherit;
border:1px solid #ececec;
}
#send-user {
width:100px;
font-size:inherit;
font-family:inherit;
border:1px solid #ececec;
}
/* the send input button */
#send-text-button {
font-size:11px; /* must enter values for IE7 */
font-family:Tahoma, FreeSans; /* must enter values for IE7 */
width:60px;
}
Nothing out of the ordinary with that. The loading div might be a bit trickier, it requires a absolute:relative; which can make the position a bit of if the width is changed. Following code is used:
#send-loading {
position:relative;
top:-20px;
text-align:right;
right:70px;
color:gray;
display:none;
}
position:relative;
top:-20px;
text-align:right;
right:70px;
color:gray;
display:none;
}
It's hidden as standard, and that's why there's display:block;. It will be shown when pressing the enter key or the send button using our jquery code.
The last bit of code in the styles file is this:
.mess-holder { padding:2px; }
.mess-holder:hover { background:#ececec; }
/* set divs to inline */
.mess-holder div {
display:inline;
}
.mess-holder:hover { background:#ececec; }
/* set divs to inline */
.mess-holder div {
display:inline;
}
This is used for each message row.
The style file is now complete and should look like this: http://www.redward.org/public/projects/chat/styles.txt
Now there's only three files left. chat.js, chat-msgs.php and chat.php. Lets start with opening the chat.js file (create it if you haven't already).
Add this in the file:
$(document).ready(function(){
getmessages();
$('#send-text-button').click(function(event){
sendtext();
});
});
$(window).keydown(function(event){
var kC = event.keyCode;
if (kC == 13) { /* when pressing the 'enter' key */
sendtext();
}
});
getmessages();
$('#send-text-button').click(function(event){
sendtext();
});
});
$(window).keydown(function(event){
var kC = event.keyCode;
if (kC == 13) { /* when pressing the 'enter' key */
sendtext();
}
});
The keydown part gets the sendtext function when clicking the enter key. Same thing goes for the click event, it gets the sendtext function after pressing the send button. The getmessages function is used to get the 25 (user selected limit) latest messages.
After you've added the javascript code above, you're going to add three new functions. getmessages, getmess and sendtext. Add to following code to the file:
function getmessages() {
getmess();
setTimeout("getmessages()", 5000);
}
function getmess() {
$.ajax({
type: 'post',
url: 'chat-msgs.php',
data: { iCHAT: true },
error: function (data) {
alert("Error occoured while trying to get messages: "+data);
},
success: function (data) {
$('#chat-messages').html(data);
}
});
}
function sendtext() {
var x = $('#send-text').val();
var y = $('#send-user').val();
if (y == '') { alert('Please enter a username before posting.'); }
if (x != '' && y != '') {
$.ajax({
type: 'post',
url: 'chat.php',
data: { message: x, user: y },
beforeSend: function () {
$('#send-loading').html('Loading...');
$('#send-loading').show();
},
error: function (data) {
alert('Error occoured: '+data);
$('#send-loading').html('Error occoured.');
},
success: function (data) {
$('#send-loading').hide();
$('#send-text').val('');
getmess();
}
});
}
}
getmess();
setTimeout("getmessages()", 5000);
}
function getmess() {
$.ajax({
type: 'post',
url: 'chat-msgs.php',
data: { iCHAT: true },
error: function (data) {
alert("Error occoured while trying to get messages: "+data);
},
success: function (data) {
$('#chat-messages').html(data);
}
});
}
function sendtext() {
var x = $('#send-text').val();
var y = $('#send-user').val();
if (y == '') { alert('Please enter a username before posting.'); }
if (x != '' && y != '') {
$.ajax({
type: 'post',
url: 'chat.php',
data: { message: x, user: y },
beforeSend: function () {
$('#send-loading').html('Loading...');
$('#send-loading').show();
},
error: function (data) {
alert('Error occoured: '+data);
$('#send-loading').html('Error occoured.');
},
success: function (data) {
$('#send-loading').hide();
$('#send-text').val('');
getmess();
}
});
}
}
The getmessages function gets the messages via setTimeout and the getmess function every five seconds. The getmess function gets the messages with ajax post via a file called chat-msgs.php. The sendtext function checks if all required values are inserted and posts the message with ajax post via chat.php. The getmess function is called if the ajax post is successful.
Our javascript file, chat.js, is now complete and should look like this: http://www.redward.org/public/projects/chat/chat.txt
Next step ahead, open up chat-msgs.php (create it if you haven\'t already) and begin by adding these lines to the file:
<?php
/* die if post iCHAT not set */
if (!isset($_POST['iCHAT']) || $_POST['iCHAT'] != true) { die(); }
/* reset variables */
$mess_output = null;
$limit = 25; // max 25 messages shown
/* die if post iCHAT not set */
if (!isset($_POST['iCHAT']) || $_POST['iCHAT'] != true) { die(); }
/* reset variables */
$mess_output = null;
$limit = 25; // max 25 messages shown
If the file is called withour $_POST, it will die and nothing will be returned. The mess_output variable is set to null, else php would show an error while using the code below. The limit variable sets how many messages you want to be shown.
Next up is the getmessages function and the initie to it as well. This is the code:
/* check through files and folders function */
function getmessages($day, $b, $i) {
global $messages, $limit;
$time = strtotime("$day day");
$dat['day'] = date('j', $time);
$dat['month'] = date('m', $time);
$dat['year'] = date('Y', $time);
$dir = "data/messages/".$dat['year']."-".$dat['month'];
$file = $dat['day'].".php";
if (file_exists($dir."/".$file)) {
$mess_string = file_get_contents($dir."/".$file);
$mess[$dir."/".$file] = simplexml_load_string("<?xml version='1.0'?><document>$mess_string</document>");
foreach ($mess[$dir."/".$file]->item as $mss) {
$date = explode(" ", $mss->date);
$messages[$date['1']] = "<div class='mess-holder'>
<div class='mess-date'>(".date("Y-m-d H:i:s", $date['1']).")</div>
<div class='mess-user'><".$mss->user."></div>
<div class='mess-body'>".$mss->body."</div>
</div>";
++$i;
}
if (count($messages) < $limit) getmessages($day-1, $b, $i);
} else {
if ($b <= 40) {
++$b;
getmessages($day-1, $b, $i);
} else {
return false;
}
}
}
/* initiate message-get */
getmessages(date('j'), 0, 0);
function getmessages($day, $b, $i) {
global $messages, $limit;
$time = strtotime("$day day");
$dat['day'] = date('j', $time);
$dat['month'] = date('m', $time);
$dat['year'] = date('Y', $time);
$dir = "data/messages/".$dat['year']."-".$dat['month'];
$file = $dat['day'].".php";
if (file_exists($dir."/".$file)) {
$mess_string = file_get_contents($dir."/".$file);
$mess[$dir."/".$file] = simplexml_load_string("<?xml version='1.0'?><document>$mess_string</document>");
foreach ($mess[$dir."/".$file]->item as $mss) {
$date = explode(" ", $mss->date);
$messages[$date['1']] = "<div class='mess-holder'>
<div class='mess-date'>(".date("Y-m-d H:i:s", $date['1']).")</div>
<div class='mess-user'><".$mss->user."></div>
<div class='mess-body'>".$mss->body."</div>
</div>";
++$i;
}
if (count($messages) < $limit) getmessages($day-1, $b, $i);
} else {
if ($b <= 40) {
++$b;
getmessages($day-1, $b, $i);
} else {
return false;
}
}
}
/* initiate message-get */
getmessages(date('j'), 0, 0);
The function search trough each folder for a maximum of 25 (your limit) hits or 20 folders. It then returns the value found from the files to an array.
The array is printed with a foreach loop together with the mess_output variable like this:
$i = 0;
if (isset($messages)) {
rsort($messages);
foreach ($messages as $msgskey => $msgsval) {
if ($i <= $limit) {
$mess_output = $msgsval.$mess_output;
}
++$i;
}
}
echo (isset($messages) ? $mess_output : 'No messages written yet.');
?>
if (isset($messages)) {
rsort($messages);
foreach ($messages as $msgskey => $msgsval) {
if ($i <= $limit) {
$mess_output = $msgsval.$mess_output;
}
++$i;
}
}
echo (isset($messages) ? $mess_output : 'No messages written yet.');
?>
That's all for the chat-msgs.php file. The final result for that file should look like this: http://www.redward.org/public/projects/chat/chat-msgs.phps
Now there's only one file left. Open up chat.php (create it if you haven't already) and add this to the top of the file:
<?php
$messageCheck = (isset($_POST['message']) ? str_replace(" ", "", $_POST['message']) : null);
$userCheck = (isset($_POST['user']) ? str_replace(" ", "", $_POST['user']) : null);;
/* die if message or user is not set or empty */
if (!isset($messageCheck) || empty($messageCheck) || !isset($userCheck) || empty($userCheck)) {
return false;
die();
}
/* set curdate variabel */
$curdate = date('Y')."-".date('m');
$messageCheck = (isset($_POST['message']) ? str_replace(" ", "", $_POST['message']) : null);
$userCheck = (isset($_POST['user']) ? str_replace(" ", "", $_POST['user']) : null);;
/* die if message or user is not set or empty */
if (!isset($messageCheck) || empty($messageCheck) || !isset($userCheck) || empty($userCheck)) {
return false;
die();
}
/* set curdate variabel */
$curdate = date('Y')."-".date('m');
The first piece checks if user and message is set via post, if not, the file return false and dies. The curdate variable is like a shortcut. Instead of writing date two times, we use a variable named curdate.
Next up comes two function, one to change the text so it doesn\'t destroy the page and another for creating the text. This is the code:
/* fix post variables */
function stripinput($val) {
$replace = array("<", ">", "&");
$with = array("<", ">", "&");
$val = str_replace($replace, $with, $val);
return $val;
}
/* write function */
function chatsend($newfile=false) {
$res = ($newfile ? '' : "\n")
."\t<item>
<user>".stripinput($_POST['user'])."</user>
<date>".microtime()."</date>
<body>".stripinput($_POST['message'])."</body>
<ip>".$_SERVER['REMOTE_ADDR']."</ip>
</item>";
return $res;
}
function stripinput($val) {
$replace = array("<", ">", "&");
$with = array("<", ">", "&");
$val = str_replace($replace, $with, $val);
return $val;
}
/* write function */
function chatsend($newfile=false) {
$res = ($newfile ? '' : "\n")
."\t<item>
<user>".stripinput($_POST['user'])."</user>
<date>".microtime()."</date>
<body>".stripinput($_POST['message'])."</body>
<ip>".$_SERVER['REMOTE_ADDR']."</ip>
</item>";
return $res;
}
The chatsend function is only used so you doesn't have to write the same piece of code twice.
The absolute last thing we're going to do is to add the following code to the file:
/* check if folder exists */
if (is_dir("data/messages/$curdate")) {
if (file_exists("data/messages/$curdate/".date('j').".php")) {
$fp = fopen("data/messages/$curdate/".date('j').".php", "a+");
fwrite($fp, chatsend());
fclose($fp);
} else {
$fp = fopen("data/messages/$curdate/".date('j').".php", "w+");
fwrite($fp, chatsend(true));
fclose($fp);
}
} else {
/* create dir if not found */
mkdir("data/messages/$curdate", 0755);
fopen("data/messages/$curdate/index.php", "w+");
$fp = fopen("data/messages/$curdate/".date('j').".php", "w+");
fwrite($fp, chatsend(true));
fclose($fp);
}
?>
if (is_dir("data/messages/$curdate")) {
if (file_exists("data/messages/$curdate/".date('j').".php")) {
$fp = fopen("data/messages/$curdate/".date('j').".php", "a+");
fwrite($fp, chatsend());
fclose($fp);
} else {
$fp = fopen("data/messages/$curdate/".date('j').".php", "w+");
fwrite($fp, chatsend(true));
fclose($fp);
}
} else {
/* create dir if not found */
mkdir("data/messages/$curdate", 0755);
fopen("data/messages/$curdate/index.php", "w+");
$fp = fopen("data/messages/$curdate/".date('j').".php", "w+");
fwrite($fp, chatsend(true));
fclose($fp);
}
?>
The code creates a directory and file automatically if it doesn't exists. If it exists it appends the message to the end of the file.
The file should now look like this: http://www.redward.org/public/projects/chat/chat.phps
The script can be downloaded from http://www.redward.org/public/projects/chat/chat.7z.
A preview of the script is found here: http://www.redward.org/public/projects/chat/








![[www.korturl.com]p_korturl.png](plugins/gallery/images/Partners/[www.korturl.com]p_korturl.png)
![[www.anrdoezrs.net(slash)click-3898058-10645381]p_beniro.png](plugins/gallery/images/Partners/[www.anrdoezrs.net(slash)click-3898058-10645381]p_beniro.png)
![[www.vispark.se]p_vispark.png](plugins/gallery/images/Partners/[www.vispark.se]p_vispark.png)