Crop image proportionally with PHP
First of all, I’m not PHP geek. But, PHP is my second expert language after CF. I’ve created some freelance projects with PHP . You can hire me if you have some freelance projects for low cost and full reliable.
When I surf website for cropping image, I found this site. It’s cool. Check it out.
Coldfuion Report Builder
Of the most powerful and convenient report builder is Coldfusion Report Builder. It’s absolutely just like crystal report. You can make your report design in CF report builder or you can use their built-in theme, either. Are you getting sick of writing query in cf report builder? It’s ok. You can write Query in your cfm file and output report just like :
<cfquery name=”qryUsers” datasource=”#application.datasource#”>
SELECT * FROM Users WHERE U_ID = <cfqueryparam value=”#url.id#” cfsqltype=”CF_SQL_NUMBER”>
</cfquery><cfreport template=”NewColdFusionReport.cfr” query=”qryUsers” format=”PDF”>
</cfreport>
CFQUERYPARAM and Oracle Databases
I’ve already shown in my old posts about the benefit of using cfqueryparam tag. Using this tag can prevent SQL inject and output data format what SQL like.
Generally, we use old-fashioned style like
<CFQUERY DATASOURCE=”DSN_NAME”>
SELECT username
FROM users
WHERE user_id=#SESSION.USER_ID#
</CFQUERY>
In modern style, we use cfqueryparam tag within cfquery tag like
<CFQUERY DATASOURCE=”DSN_NAME”>
SELECT username
FROM users
WHERE user_id=<cfqueryparam value=”#SESSION.USER_ID#” cfsqltype=”cf_sql_number”>
</CFQUERY>
It’s ok for passing variable is integer. If we want to pass string variable, we need to do following code. Unlike old-fashioned style, we don’t need to put single quote in front of and end of cfqueryparam tag.
<CFQUERY DATASOURCE=”DSN_NAME”>
SELECT username
FROM users
WHERE user_name=<cfqueryparam value=”#SESSION.USER_NAME#” cfsqltype=”cf_sql_varchar”>
</CFQUERY>
Buch..!! How about Like condition..?? Don’t worry. You can use as follow:
<CFQUERY DATASOURCE=”DSN_NAME”>
SELECT username
FROM users
WHERE user_name=<cfqueryparam value=”%#SESSION.USER_NAME#%” cfsqltype=”cf_sql_varchar”>
</CFQUERY>
Check mouse pointer location
Do you want to check your mouse pointer location? It’s kinda simple. Check it out.
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN” “http://www.w3.org/TR/html4/strict.dtd”>
<html>
<head>
<title>Browser Coordinate Computation Demo</title>
<script type=”text/javascript”>
function move(e)
{
if (!e) e= event;
var docX,docY;if (e.pageX == null)
{
// IE case
var d= (document.documentElement &&
document.documentElement.scrollLeft != null) ?
document.documentElement : document.body;
docX= e.clientX + d.scrollLeft;
docY= e.clientY + d.scrollTop;
}
else
{
// all other browsers
docX= e.pageX;
docY= e.pageY;
}var coord= document.getElementById(‘coord’);
while (coord.firstChild) coord.removeChild(coord.firstChild);
coord.appendChild(document.createTextNode(docX+’,'+docY));var xhair= document.getElementById(‘crosshair’);
xhair.style.left= docX-8+’px’;
xhair.style.top= docY-8+’px’;return false;
}if (document.addEventListener)
{
document.addEventListener(“mousedown”,move, false);
}
else if (document.attachEvent)
{
document.attachEvent(“onmousedown”,move);
}
</script>
</head>
<body>
<h3>Click to Move Crosshairs</h3>
Shrink screen so you can get scroll bars and test this in a scrolled window.
<p>
X,Y=(<span id=”coord”>?,?</span>);
<img id=”crosshair” src=”crosshair.gif” style=”position: absolute; left: 90px; top: 150px”><p> <p> <p> <p> <p>
<pre>
if (e.pageX == null)
{
// IE case
var d= (document.documentElement &&
document.documentElement.scrollLeft != null) ?
document.documentElement : document.body;
docX= e.clientX + d.scrollLeft;
docY= e.clientY + d.scrollTop;
}
else
{
// all other browsers
docX= e.pageX;
docY= e.pageY;
}
</pre>
</body>
</html>
Best credit : http://unixpapa.com/js/mouse.html
raphael js
I was speechless after surfing this website. All of his projects make me awe. We can refer or modify more useful projects by the way of learning his javascript projects.
Cheers,
Refresh parent window from child window with ShowModalDialog
Yesterday, I was in problem. Because, my supervisor told me to refresh main window from child window when child window is closed. I thought, I could do it with window.opener.location.href. Actually, it doesn’t work because this new window is created by showmodaldialog of javascript. That’s why I was running through on it. Finally, I got it.
Coding for parent window (main.html)
<input type=”button” value=”Open” onclick=”javascript:window.showModalDialog(“child.html”, window)”>
Coding for child window (child.html)
<SCRIPT LANGUAGE=”JavaScript”>
<!–
function close(){if (window.dialogArguments && dialogArguments.location) {
dialogArguments.location.href = ‘main.html’;
window.close();}}// –>
</SCRIPT><input type=”button” value=”Close” onclick=”close()”>
Increase and decrease count by clicking with Javascript
Today, my supervisor wants me to do simple javascript program. It seems, it’s kinda simple but complicated when I implement it. This program is, to increase or decrease count by clicking on button. I took 1 hour to implement this program. Voilà..!!
<form name=”myform”>
<input type=”Hidden” name=”init” value=”3″>
<input type=”Button” name=”actoin” value=”+” onclick=”increase()”>
<input type=”Button” name=”actoin” value=”-” onclick=”decrease()”>
</form><script>
<!–
var x = document.myform.init.value;function increase()
{
x++;
document.getElementById(“mynumber”).innerHTML = x;
}function decrease()
{
x–;
document.getElementById(“mynumber”).innerHTML = x;
}
–>
</script><p id=”mynumber”>3</p>
Dynamically Create Rounded Button
My boss wants me to create rounded button with dynamically color generated by database. At that time, I was dilemma because I know, I couldn’t crop rounded corner images with different color. Because, as I told above, these colors will come from database. So, I consider other ways and how to solve this problem. Eventually, I gotcha. Here is as follow:
StyleSheet
<style>
<!–
span.left {background:[fill_your_color] url(“rd_images/rounded_left.gif”); width:8px; height:25px; }
span.center {background:[fill_your_color]; height:25px; border-top:1px #000000 solid; border-bottom:1px #000000 solid; color:#ffffff; text-align:center; font-weight:bold; font-family:arial; padding:2px 0px 0px 0px;}
span.right {background:[fill_your_color] url(“rd_images/rounded_right1.gif”); width:8px; height:25px;}
–>
</style>
HTML
<span class=”left”></span><span class=”center”>Caption</span><span class=”right”></span>
OUTPUT
output
Download rounded images : 
MVC (Model View Controller)
I’m not used to this architectural but I’ve created so many applications with this style. In coldfusion, we categorize all of query CFM in model folder. In view folder, we put vier HTML cfm files. For calling page, we use controller file. In controller file, all of model files and view files are included. Why we used this architectural is we want all of separated files to be reusable.
MVC
CFChart with LightBox
CFChart
In these days, my client want me to integrate CFchart and Lightbox. I know, it’s not easy doing and kinda complicated. That’s why I was doing for that project around 3 hours.
First of all, I need to show pop-up window when users click on each slide of CFchart. That’s why I consider to use “URL” attribute of CFChart. After that, integrate with lightbox. There are so many lightbox features. Among them, I use GreyBox. It’s simple and doesn’t need embed javascript in CFML coding. It’s kinda simple. 
PPSHEIN ON FACEBOOK
 |
 |
Twitter
- ppshein: http://ppshein.wordpress.com
- ppshein: I didn't say "I'm good in Ajax" but I can do my best.
- ppshein: I can't observe anything today. How sucks..!!!
- ppshein: I'm now dilemma between them. :(
- ppshein: Starting retrieving my PHP knowledge to enhance again.
- ppshein: Baby, we're the champion..!!!
- ppshein: feel lazy at home today. :(
- ppshein: Keen to learn PHP and JSP again..!!
- ppshein: I'm not Coldfusion geek. I'm just beginner on it.
- ppshein: Delf A1 exam is finished. :)
