jikker的隨手雜記: 2013

2013年12月13日星期五

jQuery實做輸入時清除input文字

以下程式碼可以完成點擊input對話框時清除上面的文字，若沒輸入則還原


$(".box").focus(function(){ 
    $(this).addClass("focus"); 
    if($(this).val() ==this.defaultValue){   
        $(this).val("");            
    }  
}).blur(function(){ 
    $(this).removeClass("focus"); 
    if ($(this).val() == '') { 
        $(this).val(this.defaultValue); 
    } 
});

2013年11月28日星期四

使用python的pycrpto工具就可以簡單的完成AES加解密的程序，要注意的地方是使用的key跟vi需要是16byte的倍數長度的字串，以及加密的區快也需要是16byte的倍數，所以若資料量不足16byte則建議用\0補足16byte。
加密執行完畢後會產生file.encrypt, file.key，file.encrypt就是加密後的檔案，file.key則放入解密需要的資訊，若遺失了檔案就無法解密了。解密執行完畢後則會產生出file.decrypt，就是解密後的檔案。

使用方法
python ./encrypt.py encrypt file
python ./encrypt.py decrypt file keyfile


import os, sys, json
from Crypto.Cipher import AES

if len(sys.argv) < 3 or ( sys.argv[1] == "decrypt" and len(sys.argv) != 4 ):
    print "command encrypt/decrypt file (keyfile)"
    
action = sys.argv[1]
file = sys.argv[2]

def encrypt(file):
    print "Encrypt now"
    if os.path.isfile(file):
        statinfo = os.stat(file)
        size = statinfo.st_size
        name = os.path.basename(file)
        key = genkey(file, size)
        obj = AES.new(key[0].decode('hex'), AES.MODE_CBC, key[1].decode('hex') ) # 將key轉回binrary格式再使用
        chunksize = 16*4 #單次加密區塊大小 必須為16的倍數
        encrypt_file = file + '.encrypt' # 加密後檔名
        with open(file, 'rb') as inputfile:
            with open(encrypt_file, 'wb') as outputfile:
                while True:
                    chunk = inputfile.read(chunksize) # 讀取原始檔案
                    if len(chunk) == 0: # 加密完畢後退出迴圈
                        break
                    elif len(chunk) % chunksize != 0: # 若剩餘長度不足大小 自動補\0
                        chunk += '\0' * (chunksize - len(chunk) % chunksize)
                    outputfile.write(obj.encrypt(chunk)) # 寫入加密後的資料
        print "Encrypt finish."
    else:
        print "Encrypt file not exist.";

def decrypt(file, key):
    print "Decrypt now"
    if os.path.isfile(file):
        f = open(key, 'r')
        key = eval(f.read()) # 讀取key
        f.close()
        obj = AES.new(key[0].decode('hex'), AES.MODE_CBC, key[1].decode('hex') ) # 將key轉回binrary格式再使用
        chunksize = 16*4*4 # 解密區塊大小 必須為16的倍數
        name = file.split('.')[0] + ".decrypt" # 解密後檔名
        with open(file, 'rb') as inputfile:
            with open(name, 'wb') as outputfile:
                while True:
                    chunk = inputfile.read(chunksize)
                    if len(chunk) == 0: # 解密完畢後退出迴圈
                        break
                    outputfile.write(obj.decrypt(chunk)) # 寫入解密後的資料
            outputfile.truncate(key[2]) # 將多餘的檔案去除
        
        print "Decrypt finish."
    else:
        print "Decrypt file not exist.";
        
def genkey(file, size):
    # 產生16byte長度的亂數
    # [key, vi, filesize]
    key = [ os.urandom(16).encode('hex'), os.urandom(16).encode('hex'), size] # 將亂數轉為字串方便存成文字檔
    keyfile = file + ".key"
    fk = open( keyfile, 'w')
    fk.write(json.dumps(key))
    fk.close()
    return key
    
if action == "decrypt":
    key = sys.argv[3]
    decrypt(file, key)
else:
    encrypt(file)

網站在google, yahoo搜尋不到的解決方式

最近弄了幾個新網站，結果在google跟yahoo上搜尋沒在最前面，yahoo甚至找不到，只好手動提醒他們加入了

Google
到google的回報系統輸入你網站的網址及可

Yahoo!
由於yahoo搜尋現在都靠微軟的bing了，所以現在網路上一堆錯誤的回報網址，進去都是404，根據yahoo說明中心的說明，正確的回報系統在http://www.bing.com/toolbox/submit-site-url別跑錯了~~~

不過回報之後也沒有保證多久能找的到...慢慢等吧 XD

2013年11月1日星期五

jQuery File Tree 只顯示資料夾與中文亂碼修正

jQuery File Tree是一套滿好用的檔案樹套件，可以顯示遠端Server的檔案路徑。不過他目前只能選擇檔案，不能只選資料夾，而且若是中文檔名，取得的路徑還會是亂碼，以下做一點小修改，讓他支援中文檔名以及可以選取資料夾。

首先，針對他的connector動手腳，以下是php的範例，不過各版本其實是相同原理

jqueryFileTree.php


foreach( $files as $file ) {
    if( file_exists($root . $_POST['dir'] . $file) && $file != '.' && $file != '..' && !is_dir($root . $_POST['dir'] . $file) ) {
    $ext = preg_replace('/^.*\./', '', $file);
    echo "<li class=\"file ext_$ext\"><a href=\"#\" rel=\"" . htmlentities($_POST['dir'] . $file) . "\">" . htmlentities($file) . "</a></li>";
    }
}

接下來修改
jQueryFileTree.js
先把所有escape換成encodeURIComponent，然後再把點擊資料夾的部分回傳資料以及加入CSS方便辨識


if(jQuery) (function($){
 
$.extend($.fn, {
fileTree: function(o, h) {
    // Defaults
    if( !o ) var o = {};
    if( o.root == undefined ) o.root = '/';
    if( o.script == undefined ) o.script = 'jqueryFileTree';
    if( o.folderEvent == undefined ) o.folderEvent = 'click';
    if( o.expandSpeed == undefined ) o.expandSpeed= 500;
    if( o.collapseSpeed == undefined ) o.collapseSpeed= 500;
    if( o.expandEasing == undefined ) o.expandEasing = null;
    if( o.collapseEasing == undefined ) o.collapseEasing = null;
    if( o.multiFolder == undefined ) o.multiFolder = true;
    if( o.loadMessage == undefined ) o.loadMessage = 'Loading...';
    
    $(this).each( function() {
        function showTree(c, t) {
            $(c).addClass('wait');
            $(".jqueryFileTree.start").remove();
            $.post(o.script, { dir: t }, function(data) {
                $(c).find('.start').html('');
                $(c).removeClass('wait').append(data);
                if( o.root == t ) $(c).find('UL:hidden').show(); else $(c).find('UL:hidden').slideDown({ duration: o.expandSpeed, easing: o.expandEasing });
                bindTree(c);
            });
        }
        
        function bindTree(t) {
            $(t).find('LI A').bind(o.folderEvent, function() {
                if( $(this).parent().hasClass('directory') ) {
                    if( $(this).parent().hasClass('collapsed') ) {
                        // Expand
                        if( !o.multiFolder ) {
                            $(this).parent().parent().find('UL').slideUp({ duration: o.collapseSpeed, easing: o.collapseEasing });
                            $(this).parent().parent().find('LI.directory').removeClass('expanded').addClass('collapsed');
                        }
                        $(this).parent().find('UL').remove(); // cleanup
                        showTree( $(this).parent(), encodeURIComponent($(this).attr('rel').match( /.*\// )) );
                        $(this).parent().removeClass('collapsed').addClass('expanded');
                        $("a").removeClass("hover"); // 移除所有hover class
                        $(this).addClass('hover');   // 現有資料夾加入hover class
                        h($(this).attr('rel'));      // 回傳路境
                    } else {
                        // Collapse
                        $(this).parent().find('UL').slideUp({ duration: o.collapseSpeed, easing: o.collapseEasing });
                        $(this).parent().removeClass('expanded').addClass('collapsed');
                    }
                } else {
                    h($(this).attr('rel'));
                }
                return false;
            });
            // Prevent A from triggering the # on non-click events
            if( o.folderEvent.toLowerCase != 'click' ) $(t).find('LI A').bind('click', function() { return false; });
        }
        // Loading message
        $(this).html('<ul class="jqueryFileTree start"><li class="wait">' + o.loadMessage + '<li></ul>');
        // Get the initial file list
        showTree( $(this), encodeURIComponent(o.root) );
    });
}
});
 
})(jQuery);

2013年10月4日星期五

jQuery UI Dialog 按下 Enter 自動送出

WWWWWWWOOOOOOOOOOOOOOOOOWWWW

3年來第一篇技術文章 XD

jQuery的Dialog對於我這種UI白癡來說實在很好用，但是他沒有內建Dialog表單的熱鍵，所以沒有辦法按下Enter就自動送出表單，解決方法是利用focse mothod加入熱鍵檢察，並執行click指令


$( "#form" ).dialog({
    buttons: {
        "送出": function() {
            $.ajax({  // 新增帳號
                type: "POST",
                url: 'manager.php?a=add',
                data: { name:name.val() },
                dataType: "json",
                error: function(xhr) {
                    alert("ajax error");
                },
                success: function(response) {
                    if ( response.status){ //成功
                        $( "#form" ).dialog( "close" ); //關閉dialog                             }else { //失敗show錯誤訊息
                        updateTips( tips, response.code );
                    }
                }
            });
        },
        "取消": function() {
            $( this ).dialog( "close" );
        }
    },
    focus: function() {
        $(':input', this).unbind('keyup'); // 解除事件綁定 不然會重複送出
        $(':input', this).keyup(function(event) {
            if (event.keyCode == 13) { // 偵測到按Enter
                $(this).parent().parent().parent().find("button:first").click(); // 尋找送出按鈕 層級依照頁面設定測試
            }
        });
    }
});

2013年1月5日星期六

2012回顧

TMMMMMD
一年居然就這樣過了，這邊該不會變成我寫回顧專用的blog吧...
好吧，2012目標有16項，只完成了7項，加油，好嗎?

再來看看2012幹了些什麼好事吧...

2011/12/31 在101等爆炸
2012/01/01 接受招換回家修電腦...
人生第一次尾牙抽獎成果$3000
人生第一次打麻將，也只打過那一次...XD
人生第一次在除夕掛急診...
人生第一次10公里慢跑
人生第一次戴隱形眼鏡
人生第一次看演唱會-蘇打綠
人生第一次上台演講還有錢拿!!
提了2個專利
公司提案獲獎，老闆親自頒獎
靠裝熟認識了一些新朋友 XD
去峇里島玩~
人生第一次換工作
買了kinect!
年度最佳爛片蜘蛛人驚奇再起

比起前年的一堆3C 我今年好節制阿 XXXXD

jikker的隨手雜記

2013年12月13日星期五

jQuery實做輸入時清除input文字

2013年11月28日星期四

使用python實做AES加密

網站在google, yahoo搜尋不到的解決方式

2013年11月1日星期五

jQuery File Tree 只顯示資料夾與中文亂碼修正

2013年10月4日星期五

jQuery UI Dialog 按下 Enter 自動送出

2013年1月5日星期六

2012回顧

搜尋我的blog

網誌存檔

分類標籤

追蹤者

關於jikker

Google

jikker的隨手雜記

2013年12月13日 星期五

jQuery實做輸入時清除input文字

2013年11月28日 星期四

使用python實做AES加密

網站在google, yahoo搜尋不到的解決方式

2013年11月1日 星期五

jQuery File Tree 只顯示 資料夾 與中文亂碼修正

2013年10月4日 星期五

jQuery UI Dialog 按下 Enter 自動送出

2013年1月5日 星期六

2012回顧

搜尋我的blog

網誌存檔

分類標籤

追蹤者

關於jikker

Google

2013年12月13日星期五

2013年11月28日星期四

2013年11月1日星期五

jQuery File Tree 只顯示資料夾與中文亂碼修正

2013年10月4日星期五

2013年1月5日星期六