Update bug notice:
– Clearing string username and password before login action
– Fixing CSS bug for IE 5 and IE 6
– Change from $_GET to $_REQUEST for URL parameter
– More secure and custom user password encryption
– Change jQuery JS Lib to jquery-1.3.2.min.js
– Fixing HTML TAG for Ajax Spinner Display
Enjoy it friends!!
If you want to download the old version, it’s still available at:
http://dremi.info/articles/drelogin-v10-a-simple-jquery-php-login.html
Report and Bug:
Please contact me for report and bug.
Demo:
Username: dremi
Password: terusberjuang

Share on Facebook

However we still need :
Member register form, just a simple HTML code
jQuery library, the Ajax Masterpiece
PHP Script, basic validation script
Little bit of member sql table, we will create it using PHPMyAdmin
Now, open your Dreamweaver, or any Code Editor, Notepad++ are welcome!
First, we will create HTML code for member register form. Remember, this form is just for illustrate the real form.

<form id="form1" name="form1" method="post" action="">
<fieldset>
	<legend>Check Username Availability</legend>
	<label>Username <span class="require">(* requiered: alphanumeric, without white space, and minimum 4 char</span></label>
    <input type="text" name="username" id="username" size="15" maxlength="15" onchange="loadContentResult(this.value)" />
	<div id="spinner"></div>
    <div id="actionresult"></div>
	<div class="clear"></div>
	<label>Email:</label>
	<input type="text" name="email" id="email" size="30" maxlength="255" />
	<div class="clear"></div>
	<input type="submit" name="submit" id="submit" value="Register" />
</fieldset>
</form>

On my input code, I use onchange=”loadContentResult(this.value)” to handle username field value while onChange event. So, where is come from the loadContentResult() ?

Here are the Javascript code, include for jQuery preloader.
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
// Count the number of times a substring is in a string.
String.prototype.substrCount =
  function(s) {
    return this.length && s ? (this.split(s)).length - 1 : 0;
  };
// Return a new string without leading and trailing whitespace
// Double spaces whithin the string are removed as well
String.prototype.trimAll =
  function() {
    return this.replace(/^\s+|(\s+(?!\S))/mg,"");
  };
//event handler
function loadContentResult(username) {
	if(username.substrCount(' ') > 0)
	{
		$("#actionresult").hide();
		$("#actionresult").load("user.php?msg=whitespace", '', callbackResult);
	}
	else
	{
		$("#actionresult").hide();
		$("#actionresult").load("user.php?username="+username.trimAll()+"", '', callbackResult);
	}
}
//callback
function callbackResult() {
	$("#actionresult").show();
}
//ajax spinner
$(function(){
	$("#spinner").ajaxStart(function(){
		$(this).html('<img src="image/wait.gif" />');
	});
	$("#spinner").ajaxSuccess(function(){
		$(this).html('');
 	});
	$("#spinner").ajaxError(function(url){
		alert('Error: server was not respond, communication interrupt. Please try again in a few moment.');
 	});
});
</script>

To call jQuery library, use
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>

You must carefull to validate string from username field before send it into PHP script. The problem is if you enter white space string from username field then send it into PHP script without validate it before, you will trouble while accessing user.php as PHP Script. So I need to add this javascript before validated by PHP script.
// Count the number of times a substring is in a string.
String.prototype.substrCount =
  function(s) {
    return this.length && s ? (this.split(s)).length - 1 : 0;
  };
// Return a new string without leading and trailing whitespace
// Double spaces whithin the string are removed as well
String.prototype.trimAll =
  function() {
    return this.replace(/^\s+|(\s+(?!\S))/mg,"");
  };

How about jquery as script loader? To load user.php and attempt it into DIV ID for #actionresult, we can use this script:
//event handler
function loadContentResult(username) {
	if(username.substrCount(' ') > 0)
	{
		$("#actionresult").hide();
		$("#actionresult").load("user.php?msg=whitespace", '', callbackResult);
	}
	else
	{
		$("#actionresult").hide();
		$("#actionresult").load("user.php?username="+username.trimAll()+"", '', callbackResult);
	}
}
//callback
function callbackResult() {
	$("#actionresult").show();
}

Don’t worry about ajax loading animation, I use simple GIF animation as spinner:
//ajax spinner
$(function(){
	$("#spinner").ajaxStart(function(){
		$(this).html('<img src="image/wait.gif" />');
	});
	$("#spinner").ajaxSuccess(function(){
		$(this).html('');
 	});
	$("#spinner").ajaxError(function(url){
		alert('Error: server was not respond, communication interrupt. Please try again in a few moment.');
 	});
});

So, what netxt!? It’s time to make cool PHP Script to validate our username string (in this case, I just use username field as POST variable. But before it, let’s create our mysql table:
CREATE TABLE `member2` (
`member_id` int( 11 ) NOT NULL AUTO_INCREMENT ,
`username` varchar( 15 ) NOT NULL ,
`email` varchar( 255 ) NOT NULL ,
PRIMARY KEY ( `member_id` )
);
INSERT INTO `member` VALUES (1, 'dremi', 'webmaster@dremi.info');

This script for user.php file as response validator. Remember this is main function only, you may add some connection script.
function clearString($value)
{
	if (get_magic_quotes_gpc())
	{
		$value = stripslashes($value);
	}
	if (!is_numeric($value))
	{
		$value = mysql_real_escape_string($value);
	}
	$value = trim(strip_tags($value));
	return $value;
}
function validStr($str, $num_chars, $behave) //alpha numeric only for entire of string width
{
	if($behave=="min")
	{
		$pattern="^[0-9a-zA-Z]{".$num_chars.",}$";
	}
	elseif($behave=="max")
	{
		$pattern="^[0-9a-zA-Z]{0,".$num_chars."}$";
	}
	elseif($behave=="exactly")
	{
		$pattern="^[0-9a-zA-Z]{".$num_chars.",".$num_chars."}$";
	}
	if(ereg($pattern,$str))
	{
		return true;
	}
	else
	{
		return false;
	}
}

And this is for validate condition.
$username	= $_REQUEST['username'];
$msg		= $_REQUEST['msg'];
if(isset($username) && $username != '')
{
	if(validStr($username, 4, 'min') == false)
	{
		?>
		<span style="color:red">You enter invalid username</span>
		<?php
	}
	else
	{
		connect(_HOST, _USER, _PASS, _DB);
		$jCekMember = numrows(query("SELECT * FROM member WHERE username = '".clearString($username)."'"));
		if($jCekMember != 0)
		{
			?>
			<span style="color:blue">Username <?php echo $username; ?> was unavailable, another people has taken.</span>
			<?php
		}
		else
		{
			?>
			<span style="color:green">Username <?php echo $username; ?> available.</span>
			<?php
		}
		close();
	}
}
elseif($msg == 'whitespace')
{
	?>
	<span style="color:red">Username cannot contain of white space</span>
    <?php
}
else
{
	?>
	<span style="color:red">Insert username</span>
    <?php
}

While username is valid string, PHP script will check availablility on member table using this code:
$jCekMember = numrows(query("SELECT * FROM member WHERE username = '".clearString($username)."'"));

So, as showed on next line, if username is not available to register in member table, it’s mean the username has taken by another people, and message will say :
Username <?php echo $username; ?> was unavailable, another people has taken.

Well, everything is gonna be Allright 

Now let’s see the result by click on Demo Button or you can Download full code to learn.
Share on Facebook
]]>
					
					https://www.dremi.info/tutorials/html/how-to-check-username-availability-using-jquery-php.html/feed
			2
		
		
			
		
		
		https://www.dremi.info/articles/download-php-script-backup-and-restore-database.html
					https://www.dremi.info/articles/download-php-script-backup-and-restore-database.html#comments
		
		
		Thu, 01 Oct 2009 07:34:28 +0000
				
		
		
		
		
		
		
		https://www.dremi.info/?p=906

					[…]]]>
										Hi guys!




This is PHP Script to backup or restore your SQL Database. It’s Free to download!

Just visit my PHPClasses Page:

http://www.phpclasses.org/browse/package/5720.html

Or let’s discuss about something bug or report on:

http://www.phpclasses.org/discuss/package/5720/
Share on Facebook
]]>
					
					https://www.dremi.info/articles/download-php-script-backup-and-restore-database.html/feed
			3
		
		
			
		
		
		https://www.dremi.info/tutorials/jquery/creating-auto-checker-for-ip-network-lifetime.html
					https://www.dremi.info/tutorials/jquery/creating-auto-checker-for-ip-network-lifetime.html#comments
		
		
		Sat, 27 Jun 2009 00:47:36 +0000
				
		
		
		
		
		https://www.dremi.info/?p=844

					[…]]]>
										Hi! I have a tutorial to check lifetime connectivity for IP and PORT in your Network. You may use it as component of enterpise application to check IP and PORT.

So, what next ???


 
Offcourse, we need this files:  ipchecker.php, frame_ip.php, index.php,  and jquery framework.

First create  ipchecker.php for function handler:

Code:
<?
/**
#
# Auto Checker for IP Network Lifetime
# Author  hairul azami a.k.a dr.emi <webmaster@dremi.info>
# Website http://dremi.info
# License: GPL
#
**/
error_reporting(0);
define("_IMAGES", "images/");
define("_IPROUTER", "192.168.1.1");
function checkIP($ip, $p)
{
//error_reporting(E_ALL);
@set_time_limit(0);
$address = "$ip"; //your public IP
$port = $p; // your IP open port
$fp = @fsockopen($address,$port,$errno,$errstr,10);
stream_set_timeout($fp, 1);
if ($fp)
{
$statusIPport =  "<font color=green>Connected</font>";
$imgTitle = "Connected";
$imgStats = "accepted_32.png";
}
else
{
$statusIPport =  "<font color=#CCCCCC>Disconnect</font>";
$imgTitle = "Disconnect";
$imgStats = "warning_32.png";
}
$info = stream_get_meta_data($fp);
if($info['timed_out'])
{
$statusIPport =  "<font color=#CCCCCC>Time Out</font>";
$imgTitle = "Time Out";
$imgStats = "cancel_32.png";
}
flush();
$checkID = strtoupper(gethostbyaddr($address));
if($checkID != $address)
{
$comname = $checkID;
}
elseif($checkID == _IPROUTER)
{
$comname = "ROUTER";
}
else
{
$comname = "NONAME";
}
echo "
<div style='text-align:center;'>
<img src='"._IMAGES . $imgStats."' alt='$imgTitle' title='$imgTitle' border=0><br>
<strong>$imgTitle</strong><br>
$address:$port<br>
$comname
</dvi>";
}
checkIP($_GET['ip'], $_GET['port']);
?>

The function will used as checker for each of variable IP and PORT

Second, create an jQuery Auto Load for file, called as frame_ip.php

In this file, you must load jQuery framework to complete javascript function bellow

Code:
<script language="javascript" src="jquery-1.2.6.min.js"></script>
<script language="javascript">
//show animation
$(function(){
$("#ajax_display").ajaxStart(function(){
$(this).html('<div style="text-align:center"><img src="images/ajax-loader-trans.gif"/><br>Checking Target...</div>');
});
$("#ajax_display").ajaxSuccess(function(){
$(this).html('');
});
$("#ajax_display").ajaxError(function(url){
alert('jqSajax is error ');
});
});
</script>

Then to load ipchecker.php, I use this code:
<div id="ajax_display"></div>
<script type="text/javascript">
function getRandom() {
$("#random").hide("slow");
$("#random").load("ipchecker.php?ip=<? echo $_GET['ip']; ?>&port=<? echo $_GET['port']; ?>", '', callback);
}
function callback() {
$("#random").show("slow");
setTimeout("getRandom();", 10000*2);
}
$(document).ready(getRandom);
</script>
<div id="random"></div>

While ip and port was defined in iframe URL, PHP function checkIP($ip, $p) will work.

I use this line for set the time while load ipchecker.php from first time to next load progress.
setTimeout("getRandom();", 10000*2);
The last is index.php

This file will give you GUI of all process
<?
for($i=1;$i<=10;$i++)
{
?>
<div id="ipslot">
<iframe scrolling="No" frameborder="0" class="frameloader" width="100px" height="100px" name="ajax_ipchecker" src="frame_ip.php?ip=192.168.1.<? echo $i; ?>&port=80">
</iframe>
</div>
<?
}
?>

While index.php loaded, frame_ip.php will work as “data sender” from URL, so we can check it in checkIP function.

Well this is screenshoot while you access index.php from http://localhost/[foldername]/index.php

OK, I think it’s really good time to see you here, thanks for read 

If you find any bug / report, just comment here ..
Share on Facebook
]]>
					
					https://www.dremi.info/tutorials/jquery/creating-auto-checker-for-ip-network-lifetime.html/feed
			4
		
		
			
		
		
		https://www.dremi.info/articles/introducing-digilib-dr-emis-latest-product.html
					https://www.dremi.info/articles/introducing-digilib-dr-emis-latest-product.html#comments
		
		
		Wed, 01 Apr 2009 02:51:06 +0000
				
		
		
		
		
		
		
		
		https://www.dremi.info/?p=79

					[…]]]>
										

This application is a masterpiece that combines several existing Digital Library concepts. Inspired by jQuery UI as one of the best ajax javascript libraries for now.
When this application was created, it adopted several existing Digilib concepts. However, after going through several analysis processes, we finally launched the newest dreDigiLIB application to the Web Development business market.
 
Read dreDigiLIB (DE-ER-E-DIJILIB)
Some of the Feature Modules that are relied on on the Aministrator page are:
Biblio
Biblio is a module that functions to organize a collection of books, e-books, theses, and several other digital library content.

Circulation 
Circulation is a module that functions to manage library data collection borrowing transactions, delays and fines.

Member
All students get member facilities to access library data. This member module functions to manage student membership.

Report
Report is a module devoted to auditing library statistical data and several other statistical data that can be used as a guide.

Tool
Tool is an additional module that is very useful for administrators in the process of maintenance and application permissions, such as application users, bulk email and database backups.



In the future, our application will continue to be developed by adding other features and will be adjusted to market demand.
 



Share on Facebook
]]>
					
					https://www.dremi.info/articles/introducing-digilib-dr-emis-latest-product.html/feed
			7
		
		
			
		
		
		https://www.dremi.info/tutorials/css/web-design-layout-plus-implementasi-jquery-tab-content.html
					https://www.dremi.info/tutorials/css/web-design-layout-plus-implementasi-jquery-tab-content.html#comments
		
		
		Wed, 26 Nov 2008 01:22:20 +0000
				
		
		
		
		
		
		
		
		
		
		https://www.dremi.info/?p=87

					[…]]]>
										 Welcome back friend! This tutorial explains how to create an interactive layout. A combination of designing web layout using Photoshop and Editing with HTML + CSS. Then implement it using jQuery Ajax when loading PHP Content


All you need is:
-Photoshop

-HTML+CSS

-jQuery Ajax

-PHP
Part I Designing Website Layout
Open your Photoshop, make the canvas size like this:

Select the Rectangle Marquee Tool, create a header object like this:

Apply multiple layer styles:



Look at the results

Now create a white line using single row marquee tool, between gradient and drop shadow. fill line make white color

Use the rounded rectangle tool to create a navigation button, use the radius as you wish

apply layer style




All gradients are in the tutorial na download package

Press [CTRL + Click] on the navigation button layer, to make a selection around the button.

Select Elliptical Marquee Tool selection and option option: Intersect with selection. Makes an oval selection above the previous selection

You will get the selection results like this

Click [CTRL + D] to Deselect

Transform vertical na object, by pressing [CTRL + T] -> Flip Vertical

Select menu Filter> Blur> Gaussian Blur. Add a 2 px radius.

and change the layer’s blending to Overlay

Give the na text button too

You can group all navigation layers into a group, and duplicate the groups into groups

Almost done with the layout, add the icon and text objects as the web title

Finally, make a footer in a simple way, like a header

Review the final layout results

Part II Slicing Images
So we’re going to take certain pictures only, take part with the slicing tool that will be needed to create CSS code.

First is the navigation slice

Pilih File > Save for Web and Device

Remember: choose Selected Slice, dowank

Then continue to the next slice, like bg-header, bg-footer and logo

So you will get some of the images needed in coding na CSS

Part III Make HTML+CSS Code
By making your website load when opened in a browser, Less Table is one of the best ways 

I like this part the most, open Dreamweaver, create a CSS file

So this is the CSS code:
  <style type="text/css">
html,body{
margin:0;
padding:0;
border:0;
/* \*/
height:100%;
/* Last height declaration hidden from Mac IE 5.x */
}
body {
background:#ffffff url(images/bg-header.gif) 0 0 repeat-x;
color:#000000;
min-width:960px;
}
#mainPan {
width:960px;
position:relative;
margin:0 auto;
}
#bodyPan {
width:960px;
margin:0 auto;
}
#headerPan {
width:960px;
height:127px;
margin:0px;
padding:0px;
}
#headerPan img.logo {
border:0px;
width:148px;
height:69px;
margin-left:20px;
margin-top:10px;
}
/* MENU TAB NAVIGATION */
#tabs {
line-height:normal;
top: 25px;
right:10px;
position:absolute;
}
#tabs ul {
margin:0;
padding:10px 10px 0 50px;
list-style:none;
}
#tabs li {
display:inline;
margin:0;
padding:0;
}
#tabs a {
font-size:12px;
font-family:Arial, Helvetica, sans-serif;
color:#ffffff;
float:left;
background:url(images/bg-navigasi.gif) no-repeat left top;
margin:0;
padding-top:10px;
text-decoration:none;
width:137px;
height:59px;
text-align:center; /*for IE + FF right here*/
}
#tabs a:hover {
font-size:12px;
font-family:Arial, Helvetica, sans-serif;
color: #FFCC00;
}
.spacer {
margin-bottom:20px;
}
/* CONTENT */
#contenPan {
font-size:11px;
color:#666666;
font-family:Arial, Helvetica, sans-serif;
width:960px;
margin:0px;
}
#contenPan h2 {
font-size:14px;
font-family:Arial, Helvetica, sans-serif;
color:#006699;
}
#contenPan a {
color:#0066CC;
text-decoration:none;
}
#contenPan a:hover {
color: #FF0000;
text-decoration:none;
}
/* FOOTER */
#footerMainPan {
position:relative;
clear: both;
width:100%;
height:138px; /*for FF add 10px;*/
overflow:hidden;
background:url(images/bg-footer.gif) 30px center repeat-x;
text-align:center;
}
#footerPan {
padding-top:50px;
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
color: #666666;
width:960px;
height:88px;
background: url(images/cutter.gif) right top no-repeat;
margin:0px;
}
#footerPan a {
color: #0099FF; text-decoration:none;
}
#footerPan a:hover {
color: #333399; text-decoration:none;
}
</style>
save dan kasi nama style.css

sekarang kite bakalan mbikin index.html

dan ini code ma:
<div id="mainPan">
<div id="bodyPan">
<div id="headerPan">
<img src="images/logo.gif" class="logo" />
<div id="tabs">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Photoshop</a></li>
<li><a href="#">CSS</a></li>
<li><a href="#">PHP</a></li>
<li><a href="#">AJAX</a></li>
</ul>
</div>
</div>
<div id="contenPan">
<h2>Heloo....</h2>
<p>This is main Content <a href="#">[link]</a></p>
<div class="spacer"> </div>
<div class="spacer"> </div>
<div class="spacer"> </div>
<div class="spacer"> </div>
<div class="spacer"> </div>
<div class="spacer"> </div>
<div class="spacer"> </div>
</div>
</div>
</div>
<div id="footerMainPan">
<div id="footerPan">
© 2008 Web Design Ajax jQuery.
<a href="http://www.psdremi.co.cc" target="_blank">
PSDREMI.CO.CC
</a>
</div>
</div>
I think that’s the code na, I’m sure you will be familiar 
Part IV Adding jQuery Ajax Scripts to Load Contents
You know jQuery right? if not, read the introduction to jQuery dlo yak on the web na 

In this section we need the jQuery script library, while plugins are not needed.

Just give this line in the HTML na, when loading the jQuery Javascript Library na
 & amp; lt; script src = "jquery-1.2.6.js" type = "text / javascript" & amp; gt; & amp; lt; / script & amp; gt; [/ javascript]

and give the javascripts code to create a function to load external content on contentPan Div
<pre>[javascript]<script type="text/javascript">
$(function(){
$("#ajax_display").ajaxStart(function(){
$(this).html('<p><img src="images/ajax-loader.gif" /></p>');
});
$("#ajax_display").ajaxSuccess(function(){
$(this).html('');
});
$("#ajax_display").ajaxError(function(url){
alert('jQuery ajax is error ');
});
});
function loadContent(id) {
$("#contenPan").hide();
$("#contenPan").load("php-loader.php?cPub="+id+"", '', callback);
}
function callback() {
$("#contenPan").show();
}
$(document).ready(loadContent(id));
</script>
Simple line:
  $(this).html('<p><img src="images/ajax-loader.gif" /></p>');
/*this line will load the ajax-loader.gif while progress on request*/
and the following code is required to call data content
  function loadContent(id) {
$("#contenPan").hide();
$("#contenPan").load("php-loader.php?cPub="+id+"", '', callback);
}
function callback() {
$("#contenPan").show();
}
php-loader.php is a PHP file whose task is to provide values in HTML form, these values will be requested by jQuery Ajax to be loaded into contentPan Div
<?
$allCount = 60; //just to simulation for data ready
if($_GET['cPub'] == 2)
{
echo "<h2>Photoshop</h2>";
echo "<p align=justify><img src='images/psdremi-logo130.gif' width='130' height=44'>";
for($i=0;$i<=$allCount;$i++)
{
echo "This is Photoshop Content. ";
}
echo "</p>";
sleep(2);
}
elseif($_GET['cPub'] == 3)
{
echo "<h2>CSS</h2>";
echo "<p align=justify><img src='images/psdremi-logo130.gif' width='130' height=44'>";
for($i=0;$i<=$allCount;$i++)
{
echo "This is CSS Content. ";
}
echo "</p>";
sleep(2);
}
elseif($_GET['cPub'] == 4)
{
echo "<h2>PHP</h2>";
echo "<p align=justify><img src='images/psdremi-logo130.gif' width='130' height=44'>";
for($i=0;$i<=$allCount;$i++)
{
echo "This is PHP Content. ";
}
echo "</p>";
sleep(2);
}
elseif($_GET['cPub'] == 5)
{
echo "<h2>AJAX</h2>";
echo "<p align=justify><img src='images/psdremi-logo130.gif' width='130' height=44'>";
for($i=0;$i<=$allCount;$i++)
{
echo "This is AJAX Content. ";
}
echo "</p>";
sleep(2);
}
else
{
echo "<h2>Home</h2>";
echo "<p><a href=''>this is a link</a></p>";
echo "<p align=justify><img src='images/psdremi-logo130.gif' width='130' height=44'>";
for($i=0;$i<=$allCount;$i++)
{
echo "Welcome back friend ! this tutorial explain about how to designing web layout with Photoshop+CSS and then using Ajax jQuery to implementad how to Load PHP Content. ";
}
echo "</p>";
}
?>
I use sleep (2) to simulate loading content which is quite long

As if everything is complete, you just need to upload it to the web server so that PHP works. ni screen shoot na


I also input this tutorial in English at PSDREMI.CO.CC and Good-tutorials.Com

Best Regard, dr.emi
Share on Facebook
]]>
					
					https://www.dremi.info/tutorials/css/web-design-layout-plus-implementasi-jquery-tab-content.html/feed
			24
		
		
			
		
		
		https://www.dremi.info/articles/drefilebrowser-v10-make-a-beautifull-file-browser-with-jquery-file-tree-and-editarea.html
					https://www.dremi.info/articles/drefilebrowser-v10-make-a-beautifull-file-browser-with-jquery-file-tree-and-editarea.html#comments
		
		
		Sun, 23 Nov 2008 19:47:53 +0000
				
		
		
		
		
		
		
		
		
		https://www.dremi.info/?p=77

					[…]]]>
										Make a beautifull File Browser with jQuery File Tree and EditArea. Setelah sukses dengan produk gw sebelumnya dreDSync V.1.0, kali ini gw melaunching sebuha open source sederhana dreFileBrowser V.1.0 


dreFileBrowser v.1.0
Make a beautifull File Browser with jQuery File Tree and EditArea

© dreFileBrowser V.1.0 2008 Developped by dr.emi

Setelah sukses dengan produk gw sebelumnya dreDSync V.1.0, kali ini gw melaunching sebuah open source sederhana dreFileBrowser V.1.0

Ini merupakan open source, dimana lu boleh memodif script na, selama lu mencantumkan author na:

Author: hairul azami a.k.a dr.emi

Author Link: https://www.dremi.info

Author Contact: webmaster@dremi.info

Menggunakan dreFileBrowser:



Extract paket RAR ini ke dalam root webserver lu, lalu ubah setting configurasi pada dfb-config.php

_ABSOLUTE_PATH = defini base path untuk instalasi dreFileBrowser

_ROOT_TREE = folder mana yang akan di scan ?

_MODEM_SPEED = definisi untuk modem speed, menentukan transfer rate

$allowed_extensions_to_preview = var array untuk extensi file yang dapat di preview

$allowed_extensions_to_edit = var array untuk extensi file yang dapat di edit

Best Regard, dr.emi
Share on Facebook
]]>
					
					https://www.dremi.info/articles/drefilebrowser-v10-make-a-beautifull-file-browser-with-jquery-file-tree-and-editarea.html/feed
			5
		
		
			
		
		
		https://www.dremi.info/articles/introducing-the-new-dredsync-v-1-0-dr-emi.html
					https://www.dremi.info/articles/introducing-the-new-dredsync-v-1-0-dr-emi.html#respond
		
		
		Sun, 02 Nov 2008 11:19:58 +0000
				
		
		
		
		
		
		
		
		
		
		
		
		https://www.dremi.info/?p=73

					[…]]]>
										dreDSync V.1.0 is a Data Syncronizer based on Flat File TXT communication and Socket Detection. Using the PHP programming language.

 
What is dreDSync V.1.0 ?

spelling (DE-ER-E DE-SYNC)
 
What for dreDSync V.1.0 ?
dreDSync V.1.0 is made to synchronize data on server and client.
 
What is the main Concept ?
Aims to handle bandwidth savings, because it uses Multimedia files.
Multimedia files have a file structure of 2 types:
First, Multimedia files (ie: audio, video, and another big filesize) which will be placed on the Server and Client as Permanent Files
Second, Miscleneous files (ie: JPG, PNG, ZIP, XML anf TXT). This file will be updated according to the predefined curriculum schedule
From the brief description above, I need an automatic downloader script, to detect the Last Modified File Miscleneous file that is updated in the future. Technically it can be described as follows:
When the administrator creates a new data update schedule, he must make a schedule in the dreDSync V.1.0 Administrator that has been provided. Thus the scanning all directories function in the dreDSync V.1.0 application will record the location of the latest updated source file location before inputting the schedule. This data collection is done by the server by placing its log download list in a TXT file, then it will “fire” all clients using Socket Connection, as a sign that the latest Update File is ready to be downloaded by each client. Thus the data synchronization process can be started.

 
Error handling while Syncronizing Data
DisConnect case
An application will of course always have a bug, thus error handling must also be prepared, keeping it from happening one day. In this case the concern is disconnection and blackout / Client nost response, so that when synchronization occurs, it is likely that data has not been processed.
For that I give a small note for each client, if the data is still not the same as the downloadlist on the server, the not complete message will be written by the client in the system log, so when the client is running again, the data synchronization process will automatically continue referring to the downloadlist. previously available. So that in dreDSync V.1.0, I don’t delete the system log on the server for the next 1 week, and this will have a positive impact for clients who haven’t finished downloading data, they still have the opportunity to download it again. But if everything is fine, the client will write a complete message in the system log.
 
Processing Screen Shoot
Running on server

Running on Client

Syncronizing Data on Progress

jQuery Panel Menu Administrator

jQuery Block UI for Login Form

CPanel Administrator for Schedule

CPanel Administrator for SysLog and Config

CPanel Administrator for Client Register

 



Share on Facebook
]]>
					
					https://www.dremi.info/articles/introducing-the-new-dredsync-v-1-0-dr-emi.html/feed
			0
		
		
			
		
		
		https://www.dremi.info/articles/membuat-inner-frame.html
					https://www.dremi.info/articles/membuat-inner-frame.html#comments
		
		
		Fri, 11 May 2007 11:04:47 +0000
				
		
		
		
		https://www.dremi.info/?p=26

					[…]]]>
										 Bwat Dokumen baru HTML , dengan memilih File > New , Pilih Basic Page dan HTML pada window yang muncul. (Mahap kalo windownya transparan, alnya itu dari Skin WinBlind nya, hihi gue suka Skin Transparan nya)



Pertama siapkan dulu Dreamweaver lu…
Dokumen HTML Frame
Bwat Dokumen baru HTML , dengan memilih File > New , Pilih Basic Page dan HTML pada window yang muncul. (Mahap kalo windownya transparan, alnya itu dari Skin WinBlind nya, hihi gue suka Skin Transparan nya)

Klik OK kalo udah.

Nah Simpan dulu dokumen barunya, File > Save .. namanya frame.html

Oke sebagai contoh lu bikin dulu content halaman untuk framenya, misalkan urutan sebuah Link satu, dua, tiga, dst…Gunakan [SHIFT+ENTER] untuk berpindah baris kebawah (<BR>)

Masing-masing kasi Link “#” / trserah lu pada Panel Properties di bawah. Sebelumnya Blok dulu text yang akan dikasi Link.

Nah kalo dah selesai, Save lagi halaman nnya [CTRL+S]

Dokumen HTML Index 

Langkah selanjutnya bwat satu dokumen baru lagi, dengan nama index.html

Pindah ke Tab CODE perhatikan Source code antara <BODY> dan </BODY>

Untuk pertama kalinya ktik code awalnya “<if” maka akan muncul secara otomatis, list source code yang telah disediakan Dreamweaver, lalu pilih “iframe” , tekan spasi dan ketik property2nya seperti: align, frameborder, marginheight, marginwidth, height/width, dan src untuk memanggil lokasi halaman yang akan ditampilkan dalam Frame.





Saat Option Browse muncul, Tekan [ENTER] untuk memilih file framenya

Klik Ok jika sudah dipilih pada Window Filenya.

Jadi Uraian Source Code INNER FRAME sementara nya seperti ini:
&amp;amp;amp;lt;iframe align=&quot;left&quot; frameborder=&quot;0&quot; marginheight=&quot;0&quot; marginwidth=&quot;0&quot; height=&quot;300&quot; src=&quot;frame.html&quot;&amp;amp;amp;gt;
Nah terakhir, tinggal menutup script HTML IFRAME nya , dengan mengetik, </IFRAME> pada baris selanjutnya. Pada Dreamweaver 8 kalo mau nutup skrip, cukup dengan mengetik “</” saja maka akan muncul </IFRAME> dengan otomatis, cerdas bukan Dreamweavernya.

Ini Script akhirnya:
&amp;amp;amp;lt;iframe align=&quot;left&quot; frameborder=&quot;0&quot; marginheight=&quot;0&quot; marginwidth=&quot;0&quot; height=&quot;300&quot; src=&quot;frame.html&quot;&amp;amp;amp;gt;
&amp;amp;amp;lt;/iframe&amp;amp;amp;gt;
Woke, lu tinggal Save lagi halaman index.html nya, dan tekan [F12] untuk mencobanya di Browser.

Kalo mau liat area framenya, lu tinggal modify aja page frame.html nya

Modify > Page Properties

Atus sesuai selera lu

Tampilan di Browser ( background frame.html gue ganti menjadi hitam)

Share on Facebook
]]>
					
					https://www.dremi.info/articles/membuat-inner-frame.html/feed
			2