Feb24

jeditable textile textarea renderer issue

Posted by: Brian Chan | Filed in: technology | Tags: , | 07:28 pm, February 24th, 2012 2 Comments »

If you have ever played with jeditable, eventually you will get to this issue, which is dealing with the textarea. The Textile renderer on the official jeditable demo page works perfectly fine, but when I tried it I experienced quite some difficulty.

Basically the text I enter would NOT be what I see after pressing the ok button, due to the html rendering of the newline character. I found a lot of people sharing their pain all over the internet:

http://stackoverflow.com/questions/5277800/jeditable-handling-output-that-has-line-breaks
http://forum.jquery.com/topic/jeditable-jquery-question-regarding-textarea

After quite some time hacking around (especially on that demo page and its source), I finally got it working that way it’s supposed to be. Here is my solution.

First, your save and load scripts should be doing what they have been doing. No change at all. Just make sure you have clean data in the database.

Second, call a string replace function to change all substring “\n” to “<br>\n”. If you are using php, then below is the code. It will make sure you will have good initial values rendered correctly by your browser.

1
$s = str_replace("\n", "<br>\n", $s);



Third, add the following callback to your .editable attribute list. Basically, on the client side it renders the line breaks for you.

1
2
3
4
callback: function(value, settings) { 
	var retval = value.replace(/\n/gi, "<br>\n"); 
	$(this).html(retval);
}

So it looks something like the following:

1
2
3
4
5
6
7
8
9
10
11
$('.editable_textile').editable('save.php', { 
    indicator : '<img src=\"images/indicator.gif\">',
    loadurl   : 'load.php',
    type      : 'textarea',
    submit    : 'OK',
    callback: function(value, settings) { 
	var retval = value.replace(/\n/gi, "<br>\n"); 
	$(this).html(retval);
    },
    cancel    : 'Cancel',
});

Then you are done! Hope this can save you some time. ;)



Feb23

香港政壇

Posted by: Brian Chan | Filed in: politics | Tags: | 09:29 pm, February 23rd, 2012 No Comments »



Feb21

Adding html tags in the mailto body?

Posted by: Brian Chan | Filed in: technology | Tags: | 10:58 am, February 21st, 2012 No Comments »

After much research, at least at this point there is no way to include html tags in the mailto body. If a particular email client plays nice then you are in luck, otherwise there is no standard, or cross email client way to include html tags in the mailto body.

During my research (just googling around…), I found this nice tool that can help construct the mailto link. You simply need to fill in the to, cc, subject, and body, then the mailto link will be generated for you. Check it out at http://jscode.com/generators/mailto_generator.shtml



Feb20

pre-filling an email in the email client using javascript

Posted by: Brian Chan | Filed in: technology | Tags: | 05:44 pm, February 20th, 2012 No Comments »

Sometimes people prefer to use their own email client application to add their own styling. That’s when we will need to pass the relevant email content to the email client. It’s simple enough so I won’t explain much. Here I am passing the email info from php to javascript.

1
2
3
4
5
6
$email_to = "johnsmith@somewhere.com";
$email_subject = "some email subject";
$email_body = "some long text, will need to escape this.";
//$email_body = urlencode($email_body);  // not this one, empty spaces will turn into +'s
$email_body = rawurlencode($email_body);  // this will encode correctly
$email_url = "mailto:$email_to?Subject=$email_subject&Body=$email_body";
?View Code JQUERY
1
2
3
$('#email_btn').click(function(){  // bind to the email btn
	window.location = "$email_url";
});

That’s it! Now upon pressing on the email button, the user’s default email client should pop up a new email window with the fields pre-filled.



Feb20

using js to open links in current window, new window, or in the background

Posted by: Brian Chan | Filed in: technology | Tags: | 05:17 pm, February 20th, 2012 No Comments »

There are times to open links in the current window, sometimes in a new window, sometimes in background. Here is how to do it.

1
2
3
4
5
6
7
8
function open2(url, opt){
  if (opt == 0) // current window
    window.location = url;
  else if (opt == 1) // new window
    window.open(url);
  else if (opt == 2) // background window
    {window.open(url); self.focus();}
}

The syntax is a bit confusing, I guess these should be standardized in the future.

Ref link: http://snippets.dzone.com/posts/show/2915



Feb20

remove the ok button in jeditable select

Posted by: Brian Chan | Filed in: technology | Tags: | 02:53 pm, February 20th, 2012 No Comments »

The default sample code for <select> in jeditable has an OK button. That ends up requiring one more click to pick a value from a dropdown.

1
2
3
4
5
 $('.editable').editable('http://www.example.com/save.php', { 
     data   : " {'E':'Letter E','F':'Letter F','G':'Letter G', 'selected':'F'}",
     type   : 'select',
     submit : 'OK'
 });

To take away that OK button, just take out that “submit” attribute. Magically, after picking a value from the dropdown the value gets updated. Kudos to the contributor who enabled this feature. ;)

1
2
3
4
 $('.editable').editable('http://www.example.com/save.php', { 
     data   : " {'E':'Letter E','F':'Letter F','G':'Letter G', 'selected':'F'}",
     type   : 'select'
 });

The hack mentioned in the following link is not applicable anymore, assuming you are using the latest version of jeditable.

http://stackoverflow.com/questions/1961383/is-there-anyway-to-in-jeditable-to-removing-submit-button-when-using-select



Feb19

The practical alternative to work

Posted by: Brian Chan | Filed in: fun | Tags: | 10:08 pm, February 19th, 2012 No Comments »

See more at: Coding Horror: <Meetings: Where work goes to die>



Feb17

qTip2 setting background color

Posted by: Brian Chan | Filed in: Uncategorized | Tags: | 10:55 am, February 17th, 2012 No Comments »

I have been playing with qTip2 for a bit. Once you figure out the code to popup a tooltip, the next thing you think about is probably styling.

I was looking for ways to set the background color from the default white to something else. If you give your qTip2′ed content, say a div, the background color yellow, you will still see white padding around your div.

To take away that white border or padding, Have the following styling.

1
2
3
4
5
6
<style type="text/css">
.ui-tooltip-content
{
    padding: 0px;
}
</style>

The white padding will then be gone. You can then style your div in anyway you want.



Feb13

The “secret” of flying cheap

Posted by: Brian Chan | Filed in: life | Tags: | 11:02 pm, February 13th, 2012 No Comments »

FRONTLINE “Flying Cheap” | Sneak Peek 1: Who’s Flying Your Plane? | PBS

Watch the full video (about an hour long) at:
http://www.pbs.org/wgbh/pages/frontline/flyingcheap/view/?autoplay

If you ever shop for cheap air tickets, I would highly recommend you to watch the full video. You really need to know who are the people who are actually flying your plane.

http://www.pbs.org/frontline/flyingcheap/ In this revealing sneak peek from “Flying Cheap,” FRONTLINE provides glimpse into the lives of regional airline pilots—from low pay and long hours to nights in cramped “crash pads.” “Flying Cheap” airs Tuesday, Feb. 9 at 9PM on PBS (check local listings).

One year after the deadliest domestic airline accident in seven years, FRONTLINE investigates the crash of Continental 3407 in Buffalo, NY, and discovers a dramatically changed airline industry, where regional carriers now account for half of the nation’s daily departures. The rise of the regionals and arrival of low-cost carriers have been a huge boon to consumers, and the industry insists that the skies remain safe. But many insiders are worried that now, thirty years after airline deregulation, the aviation system is being stretched beyond its capacity to deliver service that is both cheap and safe.

Watch “Flying Cheap” on air and online beginning Tuesday, February 9 on PBS (check local listings) and at http://www.pbs.org/frontline/flyingcheap/



Feb12

Jeremy Lin 林書豪

Posted by: Brian Chan | Filed in: Uncategorized | Tags: | 01:11 am, February 12th, 2012 1 Comment »

9 Lessons Jeremy Lin Can Teach Us Before We Go To Work Monday Morning
http://www.forbes.com/sites/ericjackson/2012/02/11/9-lessons-jeremy-lin-can-teach-us-before-we-go-to-work-monday-morning/

在週一上班前,林書豪教我們的九堂課
http://www.inside.com.tw/2012/02/12/9-lessons-jeremy-lin-can-teach-us-before-we-go-to-work-monday-morning