Google Map API


// some marker subroutines
pt = marker.getPoint( );
var newpt = new GLatLng(pt.lat(), pt.lng());
marker.value = somevalue;
marker.setPoint(pt);
marker.redraw( );


function createMarker(point, number) {
var marker = new GMarker(point);
marker.value = number;
GEvent.addListener(marker, "click", function() {
var myHtml = "" + number + "
";
map.openInfoWindowHtml(point, myHtml);
});
map.addOverlay(marker);
return marker;
}


Drupal 7 – the future

Development
http://drupal.org/contributors-guide

Forum
http://drupal.org/forum

Download
http://drupal.org/project

set time zone in PHP

PHP4 用
putenv(“TZ=Asia/Taipei”)

PHP5 用
date_default_timezone_set( “Asia/Taipei” )

也可以在 php.ini 設定: date.timezone = Asia/Taipei

Drag & Drop jquery

draggables options: http://docs.jquery.com/UI/Draggables/draggable#options

$(".droppable-photos-container").droppable({
    accept: ".img_content",
    drop: function(ev, ui) {
        ui.draggable.clone().fadeOut("fast",
        function() {
            $(this).fadeIn("fast")
        }).appendTo($(this).empty());
    }
});

<div id="droppablePhotos" style="min-height: 130px; min-height:130px; height:auto !important;  zoom:1;">
     <ul class="droppable-gallery">
            <li class="droppable-img-content">
                <img src="templates/images/P1010020.JPG" alt="Tatry 1" title="Drag me!" />
            </li>
            <li class="droppable-img-content">
                <img src="templates/images/P1010039.JPG" alt="Tatry 3" title="Drag me!" />
            </li>
            <li class="droppable-img-content">
                <img src="templates/images/P1010044.JPG" alt="Tatry 4" title="Drag me!" />
            </li>
    </ul>
    <div class="droppable-photos-container" style="text-align: center;">Drop here!</div>
</div>

人肉打咭機

Purpose: To record different employee’s in and out times.

Challenge: To save the timestamp and also prevent the repeat in and repeat out scenario.

<form id="puncher" name="puncher">
<label>小名
<select id="human" name="human">
<option value="jason_po">Jason Po</option>
<option value="kevin_tse">Kevin Tse</option>
<option value="felix_ng">Felix Ng</option>
<option value="marco_pun">Marco Pun</option>
</select>
</label>
<span><input type="submit" id="inTime" name="inTime" value="插入" /></span>
<span><input type="submit" id="outTime" name="outTime" value="抽出" /></span>
</form>

$(function() {
	$('.error').hide();

	$("#inTime").click(function() {
		// first hide any error messages
		$('.error').hide();
		var name = $("#human").val();
		var event = "in";
		var date = returntoday();
		var dataString = 'name='+ name + '&event=' + event + '&date=' + date ;

	$.ajax({
		type: "POST",
		url: "punch.php",
		data: dataString,
		success: function(data) {
		$('#savemessage').html(data);

		}
     });
    return false;
	});

	$("#outTime").click(function() {
		// first hide any error messages
		$('.error').hide();
		var name = $("#human").val();
		var event = "out";
		var date = returntoday();
		var dataString = 'name='+ name + '&event=' + event + '&date=' + date ;

	$.ajax({
		type: "POST",
		url: "punch.php",
		data: dataString,
		success: function(data) {
		$('#savemessage').html(data);

		}
     });
    return false;
	});

});

// read last action
$query="SELECT * FROM `punch_tbl` WHERE `staffname`='{$name}' ORDER BY `spottime` DESC LIMIT 1";
//

$result=mysql_query($query) or die(mysql_error("Errors at reading database"));
$stafflast = mysql_fetch_row($result);

$flag = 0;
if (($stafflast[3] == 'in') && ($event == 'in'))
{
	echo "<p>你已於" . $stafflast[4] . "插入，而並未抽出。</p>";
	$flag = 1;
}
if (($stafflast[3] == 'out') && ($event == 'out'))
{
	echo "<p>你已於" . $stafflast[4] . "抽出，不能重複抽出。</p>";
	$flag = 1;
}

if ($flag == 0) {

// save example in wword database
$query="INSERT INTO `punch_tbl` (`staffname`,`inorout`,`date`) values ('" . $name . "','" . $event . "','" . $date . "')";
$result=mysql_query($query) or die(mysql_error("Errors at writing wordinfo into database"));

if ($event == "in") echo "<p>歡迎" . $name . "上班，記得下班時抽出。</p>";
if ($event == "out") echo $name . "辛苦了，再見，記得上班時要插入。";

mysql_close($con);

}

free opensource web tools

CMS:
http://drupal.org/
http://www.joomla.org/

Project Task Mgmt:
http://www.dotproject.net/

Books:
http://www.packtpub.com/

Hosting:
http://godaddy.com

Stock Photos:
http://us.fotolia.com/godaddy

e-commerce:
http://www.oscommerce.com/

on-line forum:
http://www.simplemachines.org/

blog:
http://wordpress.org/

jquery sortable

Step 1: Make the UL LI list:

<ul id="sortme">
 <li id="27" class="sortitem">蒼龍</li>
 <li id="44" class="sortitem">朱雀</li>
 <li id="136" class="sortitem">玄武</li>
 <li id="19" class="sortitem">白虎</li>
</ul>

Step 2: Make the List Sortable

$(document).ready(function() {
	  $("#sortme").sortable({});
});

Step 3: Capture Mouse Up Event

$("#sortme").bind("mouseup", function(){
	alert('Mouseup Event');
});

Step 4: Get the Serial Data

$("ul li").each(function(i){
	data[i] = $(this).text() ;
});

But problem for this one is you get one more item: total member in data array is R+1

IN Step 4: Can also use the built in function:

strdata = $(this).sortable("serialize");

But here the ID of the UL list must be in form of xxx_1, xxx_2… etc. And also PROBLEM is in the mouseup event handler, the strdata only captures R-1 data !!! WHY WHY WHY

jquery each()

Iterates over the images inside the div and scales its id:

 $("div img").each(function(i){
   this.id = this.id + "_" + i;
 });

Before

 <div><img id='me'/><img id='me'/></div><img id='me' />

After:

 <div><img id='me_0'/><img id='me_1'/></div><img id='me' />

jquery innerfade

To incorporate an image slideshow:

Step 1: include jquery and innerfade files

<script type="text/javascript" src="jquery-1.2.6.min.js"></script>
<script type="text/javascript" src="jquery.innerfade.js"></script>

Step 2: include this jquery script in the header

<script type="text/javascript">
$(document).ready(
  function(){
  $('ul#portfolio').innerfade({
  speed: 1000,
  timeout: 5000,
  type: 'random',
  containerheight: '220px'
  });
});
</script>

Step 3: the actual list of images

<ul id="portfolio">
<li>
<a href="http://..."><img src="xxx.jpg" alt="Good Guy bad Guy" /></a>
</li>
<li>
<a href="http://.../xxx.html"><img src="images/www.gif" alt="Whizzkids" /></a>
</li>
...
</ul>

jquery sortable

can’t solve it working !!!!!!!!!!!!!!!!!!!!!!!!!!!!!