Issarangul's Blog

Sunday, April 26, 2015

ท่านพระอาจารย์มั่นได้แสดงธรรมโดยยกธรรมชาติมาเปรียบเทียบ

“...ธรรมะ หรือ ธัมโม ต้องเรียนเอามาจากธรรมชาติ เห็นความเกิด ความแปรปรวนของสังขารประกอบด้วยไตรลักษณ์

เป็นนักปฏิบัติกรรมฐานอย่าเชื่อหมอมากนัก ให้เชื่อธรรม เชื่อกรรม เชื่อผลของกรรม จึงจะดี ธรรมะทั้งหมดชี้เข้าที่กายกับจิต เพราะกายและจิตนั่นแหละเป็นคัมภีร์เดิม เป็นคัมภีร์ธรรมะที่แท้จริง

ภูเขา ทะเล สายน้ำ แผ่นดิน แผ่นฟ้า เห็นไปดูไปก็ไม่มีความหมาย ให้เห็นแต่ชาติทุกข์ ชราทุกข์ พยาธิทุกข์ มรณทุกข์ เท่านั้นแล

ทิฐิมานะนั่นแหละ เป็นภูเขาสูงหาที่ประมาณมิได้

โลกสันนิวาส มีความแปรปรวนตั้งเที่ยงอยู่เช่นนั้น แต่จิตของเรารักษาไว้ให้ดี อย่าให้ติด ถ้าไม่ติดก็ได้ชื่อว่าเป็นสุข

พิจารณาค้นกาย ตรวจกายถูกดีแล้ว ค้นดูกายถึงหลัก แลเห็นอริยสัจของจริงแล้ว เดินตามมรรคเห็นตัวสมุทัย เห็นทุกขสัจ

ต้องทำจิตให้เป็นเอก ต้องสงเคราะห์ธรรมให้เป็นเอกเสมอ

พระอรหันต์มีคุณอนันต์นับหาประมาณมิได้ พระอรหันต์ตรัสรู้ในตัวเห็นในตัว มีญาณแจ่มแจ้งดี ล้วนแต่เล่าเรียนธรรมชาติทั้งนั้น”

ที่มา : dhammajak.net

Friday, January 06, 2012

เรียนรู้ jQuery ตอนที่ 2 : Filters

ในตอนที่แล้วได้เรียนรู้ jQuery Selectors ไปแล้ว ในตอนนี้เราจะมาเรียนรู้ jQuery Filters ซึ่งก็ตามชื่อใช้กรอง elements ที่ถูก select อีกทีนึง รูปแบบการใช้งาน Filters ก็มีดังนี้
Basic Filter

:even และ :odd เป็นการ select เฉพาะ element คู่และคี่ จาก element ทั้งมันที่ถูก select ทั้งนี้เริ่มนับ element แรกเป็น 0 มายกตัวอย่าง
```
$('tr:even')
$('table.maintable tr:odd')
```
บรรทัดแรกเป็นการ select element แท็ก tr ทุกๆอัน แต่ filter เฉพาะ element คู่ ส่วนบรรทัดถัดมา select element แท็ก tr ทุกอันใน table ที่ class = "maintable" และ filter เฉพาะ element คี่เท่านั้น
:first และ :last เป็นการกรองเอาฉพาะ element แรก และ element สุดท้ายจาก element ทั้งหมดที่ถูก select มา ยกตัวอย่าง
```
$('tr:even')
$('p:first')
$('div:last')
```
บรรทัดแรกเลือก element แท็ก p ทุกอันแล้วกรองเอาเฉพาะแท็ก p อันแรกเท่านั้น ส่วนบรรทัดที่สองเราก็ได้แท็ก div ท้ายสุด
:not(selector) เป็นการกรอง element ที่ระบุใน () ออกไป ยกตัวอย่างเช่น
```
$('a:not(.navmenu)')
$('a:not([href^="http://"])')
```
บรรทัดแรก select element แท็ก a ทั้งหมดยกเว้นแท็ก a ที่ class="navmenu ส่วนบรรทัดที่สอง select element แท็ก a ทั้งหมดยกเว้นแท็ก a ที่ href ขึ้นต้นด้วย http://
:eq(index) ให้มอง element ทั้งหมดที่ถูก select มาเป็นอาเรย์เริ่มจาก 0 แล้ว filter นี้จะกรองเอาเฉพาะ element ที่ตำแหน่งในอาเรย์ที่เราต้องการ ยกตัวอย่งเช่น
```
$('td:eq(2)')
```
ก็จะเป็นการ select element แท็ก td ตัวที่ 3 จากทั้งหมด (อย่าลืมว่านับจาก 0 ดังนั้น :eq(2) จึงหมายถึงอันที่ 3)
:gt(index) และ :lt(index) เช่นเดียวกับ :eq() เพียงแต่ :gt(index) จะกรองเอาเฉพาะที่มากกว่าค่า index และ :lt() จะกรองเอาเฉพาะที่น้อยกว่าค่า index
:focus ใช้สำหรับการหา element ที่กำลังถูก focus อยู่ ดังตัวอย่างด้านล่างนี่
```
$(':focus')
$('*:focus')
$('input:focus')
```
สองบรรดทัดแรกจะได้ผลลัพธ์เหลือนกัน คือจะได้ element ที่ถูก focus คือเราสามารถละ * ได้นั้นเอง ส่วนบรรทัดที่ 3 จะ select element เฉพาะที่เป็นแท็ก input ที่ถูก focus เท่านั้น ลองดูตัวอย่างด้านล่างนี่คือการนำไปใช้งาน
```
<!DOCTYPE html>
<html>
<head>
  <style>
.focused {
    background: #abcdef;
}
</style>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
  
<div id="content">
    <input tabIndex="1">
    <input tabIndex="2">
    <select tabIndex="3">
        <option>select menu</option>
    </select>
    <div tabIndex="4">
        a div
    </div>
</div>

<script>
$( "#content" ).on( "focus blur", "*", function( event ) {
    var elem = $( this );
    elem.toggleClass( "focused", elem.is( ":focus" ) );
});
</script>

</body>
```
:header เป็นการ select เฉพาะ element แท็ก h1 h2 h3 h4.. ตัวอย่างก็เช่น
```
$(':header')
```

Child Filter

:first-child selector filter นี้จะเป็นการ select ทุก element ที่เป็น element ลูกอันแรกของ parent ต่างจาก :first ที่จะได้เพียง element ลูกอันแรก ของ element parent ตัวแรก ถ้างงๆ ลองดูตัวอย่างด้านล่าง

<!DOCTYPE html>
<html>
<head>
  <style>
  span { color:#008; }
  span.sogreen { color:green; font-weight: bolder; }
  </style>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
  <div>
    <span>John,</span>
    <span>Karl,</span>
    <span>Brandon</span>

  </div>
  <div>
    <span>Glen,</span>
    <span>Tane,</span>
    <span>Ralph</span>

  </div>
<script>
    $("div span:first")
        .css("text-decoration", "underline")
        .hover(function () {
              $(this).addClass("sogreen");
            }, function () {
              $(this).removeClass("sogreen");
            });

</script>

</body>
</html>

จะเห็นว่าถ้าใช้ :first-child จะได้ element มา 2 ตัวคือ

<span>John,</span>
<span>Glen,</span>

แต่ถ้าลองเปลี่ยไปใช้ :first จะได้ element เดียวคือ

<span>John,</span>

:last-child อันนี้จะคล้ายกับ :first-child เพียงแต่จะ select ทุก element ที่เป็น element ลูกอันสุดท้ายของ parent
:nth-child() จะสามารถใช้งานได้หลายรูปแบบดังด้านล่างนี่
```
$('td:nth-child(even)')
$('td:nth-child(odd)')
$('td:nth-child(2n)')
$('td:nth-child(2n + 1)')
$('td:nth-child(2)')
```
สองบรรทัดแรกจะคล้ายๆกับ :even และ :odd เพียงแต่ :nth-child(even) และ :nth-child(odd) จะนับ element ลูกของแต่ละ parent เริ่มจาก 1 ส่วน :even และ :odd จะนับ element แรกเริ่มจาก 0 โดยนับไปเรื่อยๆไม่ว่าจะเป็น element ลูกของ element ไหนก็ตาม ที่เหลือผมไม่ขออธบาย เพราะอาจอธิบายแล้วคนอานอาจจะงง ก็ลองดูตัวอย่างจากเว็ป jQuery น่าจะเข้าใจมากกว่า
http://api.jquery.com/nth-child-selector/
:only-child อันนี้เป็นการ select element ลูก ถ้า element นั้นเป็น element ลูกเพียงตัวเดียวของ parent เช่น
```
$('p:only-child')
```
element แท็ก p จะถูก select ถ้า element parent มีแท็ก p element เดียวเป็น element ลูก

Contain Filter

:contains() เป็น filter ที่กรองเอาเฉพาะ element ที่มีข้อความหรือสตริงที่เรากำหนด เช่นถ้าใน html มี element ตามด้านล่างนี้
```
John Resig
George Martin
Malcom John Sinclair
J. Ohn
```
หากเราใช้คำสั่ง
```
$("div:contains('John')")
```
element 1 และ 3 ก็จะถูก select หรือถ้าเราใช้ำคำสั่ง
```
$("div:contains('oh')")
```
element 1 และ 3 ก็จะถูก select แต่ element ที่ 4 ไม่ถูก select เพราะ O ตัวใหญ่นั่นเอง
:empty เป็น filter ที่กรองเอาเฉพาะ element ที่ไม่มี element ลูก หรือไม่มีข้อความ (Textnode) ใน element นั้นๆ ดังตัวอย่างด้านล่างนี่
```
<table border="1">
    <tr><td>TD #0</td><td></td></tr>
    <tr><td>TD #2</td><td></td></tr>
    <tr><td></td><td>TD#5</td></tr>
</table>
```
ถ้าเราจะหาแท็ก td ที่ว่างไม่มีข้องความ หรือ element ลูก ก็ทำได้โดย
```
$('td:empty')
```
:parent filter นี้จะตรงข้ามกับ :empty เพราะจะกรองเอาเฉพาะ element ที่มี element ลูก หรือมีข้อความ(Textnode) ใน element นั้นๆ
:has(selector) เป็น filter ที่กรองเอาเฉพาะ element ที่มี element ลูกตามที่เราระบุ อย่างน้อยหนึ่ง element ยกตัวอย่างเช่น
```
<div><p>Hello in a paragraph</p></div>
<div>Hello again! (with no paragraph)</div>
```
ถ้าเราจะหา element div ที่มี element p เป็น element ลูก ก็ทำได้โดย
```
$('div:has(p)')
```

เป็นอันจบเกี่ยวกับ jQuery Filters ไว้ผมอ่าน jQuery ต่อแล้ว ผมจะมาเขียนสรุปตอนต่อๆไปเรื่อยๆครับ

Friday, December 30, 2011

เรียนรู้ jQuery ตอนที่1 : Selector

jQuery Selectors

Tag Selector เลือก (select) element ตาม Tag HTML
```
$('a') // select element ที่เป็น tag <a>
$('div')   // select element ที่เป็น tag <div>
$('img')   // select element ที่เป็น tag <img> 
$('div, span')   // select element ที่เป็น tag <div> และ <span>
```
จากบรรทัดสุดท้ายด้านยนนั้นจะเห็นว่าเราเลือก element พร้อมๆกันดีเดียวก็ได้ ในทีนี้เราเลือกแท็ก div และ span พร้อมๆกัน
ID Selector
เลือก (select) element ตาม ID เช่นใน HTML มี element ตามด้านล่างนี่
```
<p id="subject">Hello!!.</p>
<p id="message">Hello, how are you?.</p>
```
ถ้าต้องการ select เฉพาะ element ที่มี ID มีค่าเฉพาะเจาะจง ก็ทำได้ตามด้านล่าง
```
$('#message')   
$('#subject, #message')
```
ซึ่งบรรทัดแรกเรา select เฉพาะ element ที่มี id = message ส่วนบรรทัดที่สองเรา select element ที่มี id เป็น subject และ message
Class Selector
เลือก (select) element ตาม Class
```
$('.submenu')
$('.submenu1, .submenu2, .submenu3') 
$('div#mainmenu.submenu')   
```
จะเห็นว่าเราสามารถผสมผสาน select โดยระบุ tag id และ class ร่วมกันได้
Descendent Selector
เป็นการ select element โดยการะบุ selector ตามระดับชั้นของแท๊กใน HTML ด้านล่างลองดูโค้ด HTML ด้านล้าง
```
<html>
<body>
 <h1>Welcome to Codesniper.Org</h1>
 <p class="intro">Hello jQuery!</p>
 <p>jQuery selectors</p>
Learning jQuery is fun :)
 <div id="main">
  <p>Paragraph one</p>
  <p>Paragraph two</p>
  <p>Paragraph three</p>
  <div id="sub">
   <p>Paragraph subone</p>
   <p>Paragraph subtwo</p>
  </div>
 </div>
</body>
</html>
```
จาก HTML ด้านบนถ้าเราลองใช้คำสั่งตามด้านล่างนี้
```
$('#main p')
```
จะเป็นการ select ทุกแท็ก <p> รวมถึงที่อยู่ภายใต้แท็ก <div> ที่ id = sub ด้วยเพราะถือว่าอยู่ภายในแท็ก <div> ที่ id = main
Child Selector
ทีนี้ถ้าเราต้องการเลือก element ที่อยู่ภายในแท็กใดแท็กหนึ่งเพียงแค่ 1 ระดับ เช่นจาก HTML ด้านบน เราต้องการเลือกเฉพาะแท็ก <p> ภายใน <div> ที่ id = main เท่านั้นไม่รวมแท็ก <p> ที่ id = sub เราก็สามารถทำได้โดย
```
$('#main > p')
```
จะเป็นการ select แท็ก <p> ทั้ง 3 แท็กที่อยู่ภายในแท็ก <div>
Adjacent sibling Selector
เป็นการ select element ที่อยู่ระดับเดียวกันและอยู่ติดกัน เช่นใน HTML ด้านบนถ้าเราจะ select element แท็ก <p> ที่อยู่ถัดจากแท็ก <h1> หรือ element ในบรรทัดที่สองถ้าดูด้านล่างนี่
```
 <h1>Welcome to Codesniper.Org</h1>
 <p class="intro">Hello jQuery!</p>
 <p>jQuery selectors</p>
```
เราก็สามารถใช้คำสั่งดังนี้
```
$('h1 + p')
```
หรือถ้าจะ select element ในบรรทัดที่ 3 ก็ใช้คำสั่ง
```
$('.intro + p')
```
Attribute Selector
เป็นการ select element โดยดูจาก attribute ว่าเป็นไปตามที่เราต้องการจะ select หรือเปล่า โดยรูปแบบก็มีดังนี้
- [attribute] เป็นการ select element ที่มี attribute ตามที่เรากำหนด เช่น
```
$('a[href]')
$('div[id]')
```
  บรรทัดแรกเป็นการ select element แท็ก a ที่มีการระบุ attribute href อยู่ภายในแท็ก ส่วนบรรทัดที่สองเป็นการ select element แท็ก div ที่มี attribute id
- [attribute ="value"] อันนี้จะ select โดยระบุละเอียดขึ้นไปอีกโดยระบุทั้ง attribute และ value ของ attribute เช่น
```
$('a[href="http://www.codesniper.org"]')
$('input[type="text"])
```
- [attribute|="value"] จะ select element ทุกๆ element ที่มี attribute มีค่าขึ้นต้นตามที่เราระบุไว้ หรือมีค่าขึ้นต้นตามที่เราระบุไว้และตามด้วย "-" ยกตัวอย่างถ้าใน HTML เรามี element ตามด้านล่างนี่
```
<a href="example.html" hreflang="en">Some text</a> 
<a href="example.html" hreflang="en-UK">Some other text</a>
<a href="example.html" hreflang="english">will not be outlined</a>
```
  ถ้าเราต้องการ select element แท็ก a ที่มี attribute hreflang มีค่า "en" และ "en-UK" แต่ไม่รวม "english" เราก็สามารถทำได้โดย
```
$('a[hreflang|="en"]')
```
- [attribute^="value"] เป็นการ select element โดยระบุ attribute จะต้องมีค่าขึ้นต้นด้วยข้อมความที่เราระบุไว้ เช่นถ้าต้องหาร select element แท็ก a ที่ลิ้งก์ไปยังเว็ปไซต์ต่างๆ เราก็สามารถทำได้โดย ระบุหา attribute "href" ที่มีค่าขึ้นต้นด้วย "htttp:// นั่นเอง
```
$('a[href^="http://"]')
```
  หรือถ้าจะ select element แท็ก a ทุกๆอันที่ที่เป็นลิงก์ส่งอีเมล์ก็สามารถทำได้โดย
```
$('a[href^="mailto:"]')
```
- [attribute$="value"] รูปแบบคำสั่งนี้เป็นการ select element ที่ attribute มีค่าลงท้ายตามที่เราระบุ เช่นถ้าเราต้องการ select element แท็ก a ทุกอันที่เป็นลิ้งก์ไปยังไฟล์ zip ก็สามารถทำได้ดังนี้
```
$('a[href$=".zip"]')
```
- [attribute*="value"] รูปแบบคำสั่งนี้เป็นการ select element ที่ attribute มีค่าที่เราระบุตรงส่วนใดก็ใด้ เช่นถ้าเราต้องการ element แท็ก a ที่มีค่า attribute "href" หรือลิ้งก์ไปยังเว็ปไซต์ใดๆที่มีคำว่า "codesniper" ลองดู element ด้านล่างนี่
```
<a href="http://www.codesniper.org">main link</a>
<a href="http://www.codesniper.net">mirror 1</a>
<a href="http://codesniper.dyndns.org">mirror 2</a>
```
  ถ้าเราก็ใช้คำสั่ง
```
$('a[href*="codsniper"]')
```
  ก็จะเป็นการ select element ทุกๆอันเพราะทุก element แท็ก a นั้น attribute href ที่มีคำว่า codesniper อยู่ภายในนั่นเอง
- [attribute~="value"] รูปแบบคำสั่งนี้เป็นการ select element ที่ attribute มีค่าที่เราระบุตรงส่วนใดก็ใด้ภายในค่าของ attribute แต่คำที่เราระบุจะต้องเป็นคำโดดๆ ยกตัวอย่าง element ต่อไปนี้
```
<input name="man-news" />
<input name="milk man" />
<input name="letterman2" />
<input name="newmilk" />
ถ้าเราใช้ selector ตามด้านล่าง
$('a[href~="man"]')
จะมีเฉพาะ element แรกเท่านั้นที่ถูก select
```
- [attribute!="value"] รูปแบบคำสั่งนี้เป็นการ select element ที่ attribute มีค่าใดๆก็ตามที่ไม่ใช่ค่าที่เราระบุ จาก html element ในหัวข้อที่แล้วหากเราใช้คำสั่ง
```
$('a[href!="newmilk"]')
```
  ก็จะเป็นการ select element 3 อันแรกคือ
```
<input name="man-news" />
<input name="milk man" />
<input name="letterman2" />
```

ทั้งหมดนี้เป็นการสรุปใช้ jQuery Selector แบบคร่าวๆ จากที่ได้อ่านได้ศึกษามา ที่ต้องมาสรุปเขียนใน Blog เพราะอ่านแล้วกลัวลืมยิ่งถ้าไม่ค่อยได้ใช้อาจลืม เลยสรุปไว้เผื่อเวลาจะใช้จะได้มาอ่าน โดยไม่เสียเวลามาก :)

Monday, November 28, 2011

ย้าย AnnoMundi.Info มาที่ Blogger

หลังจากที่ไม่ได้อัพเดท Blog ส่วนตัวมาเป็นปีๆ มาถึงวันนี้ทุกอย่างเปลี่ยนไป การเงินเริ่มฝืดเคือง เลยทำการยุบรวม Blog ในเว็ป AnnoMundi.Info มาที่ Blogger รวมถึง redirect domain มาที่นี่ซะเลย เพราะไม่คิดว่าจะต่ออายุโดเมนในปีหน้า ตอนนี้เหลือโฮสท์ที่เช่าอยู่ที่เดียวคือ TurnKeyInternet เพิ่งเช่าสดๆร้อนๆไม่กี่วันมานี่ เพราะจะให้จ่ายรายเดือนที่เดิมคงไม่ไหว พอดีเป็นช่วง BlackFriday เลยเช่าที่ TurnKeyInternet ได้ในราคาถูกจ่ายปีนึงราวๆ $30 คาดว่าระยะเวลา 1 ปี สถานการณ์การเงินคงดีขึ้น ถ้าไม่ดีขึ้นก็อาจต้องละทิ้งทุกอย่างเข้าป่า :)

ส่วนหลังจากย้ายมาที่นี่ก็จะพยายามเขียน Blog ต่อ เพราะเวลาว่างคงเยอะหลังกิจการที่บ้านส่อแววล้มหลังช่วงน้ำท่วมใหญ่ T_T

Wednesday, July 15, 2009

Moving to Linode & Rackspace Cloud

จากที่ไม่ได้อัพเดทบล็อกมาเกือบปี แต่ความจริงก็ยังแวบๆมาอัพเดท Wordpress และ Plugin อยู่เรื่อยๆครับ แล้ววันนี้ก็ได้ฤกษ์อัพเดทบล็อกซะที เนื่องจากผมได้เริ่มทำการย้ายเว็ปต่างๆของผมไปยัง Linode และ Rackspace Cloud Server

โดยผมจะย้ายเว็ปหลักๆไปยัง Linode และเว็ปที่กำลังพัฒนาจะย้ายไปยัง Rackspace Cloud Server ไว้เมื่อลองใช้งานทั้ง Linode และ Rackspace Cloud ไปสักระยะค่อยมาตัดสินใจกันใหม่ เพราะบอกตรงๆครับ ว่าเลือกค่อนข้างยาก ในแง่การ scale ระบบ ทั้ง Linode และ Rackspace Cloud ก็พอๆกันต่างกันที่ Linode เป็น Prepaid แต่ Rackspace Cloud Server เป็น Post paid จ่ายตามที่ใช้ ซึ่งคุ้มสำหรับเว็ปที่ Traffic ไม่สูง เช่นถ้าทำเลือกสร้าง Virtual Server ขนาดหน่วยความจำ 256MB ขึ้นมาใน Rackspace Could เพื่อทำเว็ปโดยมี traffic รวมแล้วต่ำกว่า 5GB ต่อเดือน คุณก็จะจ่ายไม่เกิน $12 ในตอนสิ้นเดือน แต่ถ้าคุณทำเว็ปที่มี Traffic สูงถึงจุดนึง ค่าใช้จ่ายจะเริ่มแพงกว่า VPS แต่อย่างเว็ปผม 3-4 เว็ปนี่รวมกันยังไม่เคยใช้เกิน 5GB ต่อเดือนเลย :P อาจสงสัยว่าแล้วทำไมผมไม่เลือกใช้ Rackspace Cloud ที่เดียวไปเลย นั่นเพราะ Racspace Cloud Server นั้นจะมีแต่ Linux 64bit เช่นเดียวกับ Slicehost ซึ่งโปรแกรมเดียวกันบน 64bit จะใช้หน่วยความจำมากกว่าที่รันบน 32bit ดังนั้นที่หน่วยความจำเท่าๆกัน ที่ Linode จะรองรับงานได้มากกว่า เลยต้องขอลองใช้ไปสักระยะก่อน ถึงค่อยตัดสินใจอีกที