บันทึกของวีร์ | Vee(r)'s Blog

มกราคม 4, 2011

สิ่งที่ผมมักจะลืมเวลาใช้ xhtml + svg + javascript

Filed under: Javascript — ป้ายกำกับ:, , , — वीर @ 4:21 pm
  1. ลืมใช้ xhtml ดูเหมือนว่า svg จะใส่ลงไปใน html 4 ธรรมดาลำบากกว่า xhtml
  2. ลืมเปลี่ยน content-type เวลาส่ง text/html มาเฉยๆ เหมือนมันเจ๊ง ฯ ก็เลยส่ง application/xhtml+xml ไปแทน
  3. ลืมใช้ header ที่ถูกต้อง หลังมาผมปะอันนี้ไปเลย
    <?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  4. ผมมักจะเขียน Javascript ด้วย ก็มักจะลืม //<![CDATA[
  5. ลืมว่าใส่ tag ของ svg อย่างไร หลังๆ ผมก็ copy อันนี้มาปะเลย 

    <svg width="3cm" height="3cm" id="treeview"
     xmlns="http://www.w3.org/2000/svg" version="1.1"></svg>
  6. อย่างอื่นๆ ก็คงลืม แบบลืมไปแล้วว่าลืม

พฤศจิกายน 10, 2009

Range ใน Javascript

Filed under: Javascript — ป้ายกำกับ:, , , , , — वीर @ 1:32 am

Range นี้ผมใช้ตอนอยากจะดูว่า ข้อความ อะไรที่ถูกเลือกอยู่บ้าง เวลาใช้ก็เขียนแบบนี้

var sel = window.getSelection();
if(sel.rangeCount > 0) 
    var r = sel.getRangeAt(0);

เขียน code แบบนี้ก็จะได้ r ที่เป็น range ออกมา อ่อผมใช้กับ Firefox 3.0.x และ Opera 10.x นะครับ IE 6-8 เข้าใจว่าใช้ไม่ได้ ส่วน chrome กับ safari ก็ยังไม่ได้ศึกษาเท่าไหร่

พอได้ range มา ผมก็รู้ได้ว่า element ไหน โดนเลือกตัวเริ่ม ตัวไหนตัวปิดโดยดูจาก r.startContainer และ r.endContainer ตามลำดับ แต่ว่าใน container อาจจะเป็น Text ก็อาจจะถูกเลือกแค่บางตัวในนั้นก็ต้องมาดู r.startOffset และ r.endOffset อีก

เท่านี้ก็คงพอใช้งานได้แล้ว …

กันยายน 20, 2008

javascript: __noSuchMethod__

Filed under: old posts — ป้ายกำกับ:, , — वीर @ 4:05 pm

ใน parrot vm เรียกว่า fallback มั้ง. ประมาณว่าเราส่ง message (เรียก method) ไปที่ object แล้วมันไม่มี method ชื่อที่เราเรียกแล้วจะทำอะไรต่อ … ถ้าเป็น C++ หรือ Java ก็คง compile ไม่ผ่าน หรือเปล่า? ไม่ค่อยแน่ใจ. ถ้าเป็น ecmascript/javascript ก็อาจจะเกิด runtime error แต่ว่าเราก็ทำอะไรได้มากกว่านั้นโดยใช้ __noSuchMethod__ นี้ล่ะ. http://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Global_Objects/Object/noSuchMethod

มันคงเอาไปใช้ทำอะไรแบบ model.findByName, model.findById, model.findByLastName หรือชื่อ method ที่เปลี่ยนไปมามากมาย โดยอาจจะเปลี่ยนตาม column ของ database ในตัวอย่างนี้ จะเขียน method ดักไว้หมดก็คงไม่ไหว (แต่ไม่ทำแบบนี้ก็ได้นะ) … แน่นอนจบซะงั้น.

ป.ล. ผมไม่เคยอยากรู้มาก่อนเลย จนกระทั่ง nf ถาม

เพิ่มเติม: nf แจ้งว่าใช้กับ webkit ไม่ได้. สงสัยจะไม่ใช่ standard T_T … แต่ก็มีคน request ใน webkit https://bugs.webkit.org/show_bug.cgi?id=18058.

สิงหาคม 4, 2008

แยก double click กับ click ทีเดียวบน html + ecmascript ไม่ง่ายอย่างที่คิด

Filed under: old posts — ป้ายกำกับ:, , , , , — वीर @ 7:40 am

อัน code นี้เข้าไป. การทำงานของมันคือเมื่อ click ก็ให้พิมพ์ click ออกมา. ถ้า double-click ก็พิมพ์ “double click” ออกมาง่ายๆ.  ผมแอบไปหวังว่าพอ double click แล้ว event click มันก็ไม่ควรจะออกมา ไม่งั้นก็จะแยกแยะไม่ได้. แต่มันไม่เป็นงั้น เวลา double click สิ่งที่ได้คือ “click click double-click”. ก็เลยไม่ใช้ละ double click ยาก  เลี่ยงๆ ไปใช้ shift + click  ก่อนแล้วกัน ไว้ค่อยหาทางแก้ไปเรื่อยๆ.

$(document).ready(function() {
    $("#but").click(function(ev) {
        $("#watch").each(function() {
            $(this).html($(this).text() + " click");
        });
    });

    $("#but").dblclick(function(ev) {
        $("#watch").each(function() {
            $(this).html($(this).text() + " double-click");
        });
    });
});

พฤษภาคม 4, 2008

TinyMCE 3 plugin for JQuery

Filed under: old posts — ป้ายกำกับ:, , , , , , , , — वीर @ 7:31 pm 

$.fn.tinymce = function(options){
    return this.each(function(){ tinyMCE.execCommand("mceAddControl", false, this.id); });
}

function initMCE()
{
    tinyMCE.init({mode : "none",
                  theme : "advanced",
                  theme_advanced_toolbar_location : "top",
                  theme_advanced_toolbar_align : "left",
                  theme_advanced_statusbar_location : "bottom",
                  theme_advanced_resizing : true});
}

initMCE();

Reference:

กุมภาพันธ์ 28, 2008

Firefox 3 *เร็ว* ขึ้นอีก

Filed under: old posts — ป้ายกำกับ:, , , , — वीर @ 3:05 am

อ่านข่าวมากจาก http://cybernetnews.com/2008/02/25/firefox-3-performance-gets-a-boost/ โดยผ่าน http://slashdot.org/article.pl?sid=08/02/27/2049258&from=rss  เขาลองทดสอบ Firefox และ Web browser อื่นๆ บน Windows โดยใช้ SunSpider Javascript Benchmark ปรากฎว่า Firefox 3 เร็วกว่า web browser อื่นๆมากรวมทั้ง Firefox 2 และ Opera.

ที่น่าแปลกใจคือใน benchmark นี่เร็วว่า IE 7 เกือบๆ 10 เท่า เร็วกว่า Firefox 2 เกิน 4 เท่า. น่าสงสัยว่าทดสอบอะไรบ้าง ก็เลยตามไปดูที่ http://webkit.org/perf/sunspider-0.9/sunspider.html นี่ ก็ปรากฎว่าเขาทดสอบ javascript แบบเน้นๆ เลย ไม่รวมพวก DOM หรืออะไรอื่นๆ.  Javascript เร็วขึ้น ก็น่าจะทำให้เล่นเว็บเร็วขึ้นบ้าง แต่ก็ยังมีปัจจัยสำคัญอื่นๆอีก อย่างการ render html หรือว่าการใช้ DOM ที่ benchmark นี้ไม่ได้วัด.

Theme: Shocking Blue Green. บลอกที่ WordPress.com .

Follow

Get every new post delivered to your Inbox.

Join 632 other followers