2014年11月24日 星期一

Radiohead - Creep


When you were here before
Couldn't look you in the eye
You're just like an angel
Your skin makes me cry
You float like a feather
In a beautiful world
I wish I was special
You're so fucking special
But I'm a creep
I'm a weirdo
What the hell am I doing here?
I don't belong here
I don't care if it hurts
I wanna have control
I want a perfect body
I want a perfect soul
I want you to notice
When I'm not around
You're so fucking special
I wish I was special
But I'm a creep
I'm a weirdo
What the hell am I doing here?
I don't belong here, oh, oh
She's running out again
She's running out
She runs, runs, runs, runs
Runs
Whatever makes you happy
Whatever you want
You're so fucking special
I wish I was special
But I'm a creep
I'm a weirdo
What the hell am I doing here?
I don't belong here
I don't belong here

[MySql]在Xampp解決MySql中文亂碼問題

在C:\xampp\mysql\bin目錄中找到my.ini檔
用文字編輯器打開後
找到[client]
增加
default-character-set=utf8
找到[mysqld]
增加
character-set-server=utf8
collation-server=utf8_general_ci

重新啟動MySql後即可顯示中文

2014年11月19日 星期三

[HTML]網頁中文字亂碼解法

在HTML <head>標籤內插入<meta http-equiv="content-type" content="text/html; charset=utf-8">

2014年11月12日 星期三

[jQuery]偵測按下ENTER鍵所觸發的事件

$("input").keydown(function (event) {
        if (event.which == 13) {
            //do some thing...
        }
    });

[C#]產生圖形驗證的圖片

/// <summary>產生圖形驗證的圖片</summary>
    [WebMethod(EnableSession = true)]
    public string CreateCaptcha() {

        // 存放用來產生亂數的檔名規則
        string[]    Codes           = "A,B,C,D,E,F,G,H,J,K,L,M,N,P,Q,R,S,T,U,V,W,X,Y,Z,2,3,4,5,6,7,8,9".Split(',');
        // 存放產生亂數後的檔名
        string      CaptchaCode     = "";
        // 宣告一個亂數個體
        Random      RadomCode       = new Random();
        // 用來存放最後壓縮產生出來的驗證圖片
        Image[]     CaptchaData     = null;
        // 用來存放最後產生出來的驗證圖片
        Image       ImageCaptcha    = null;
        // 用來存放亂數產生出來的圖形
        List<Image> CaptchaImage    = new List<Image>();
        // 用來存放驗證碼
        string      VerifyCode      = "";
        // 用來存放轉陣列的圖片
        byte[]      imageBytes      = null;
        // 用來存放Base64 Code
        string      Base64String    = "";

        // 加入底圖
        CaptchaImage.Add(Image.FromFile(Server.MapPath("~/") + "/Images/VerifyImage/Background.png"));
        // 亂數產生4張圖片
        for (int Index = 1; Index <= 4; Index++) {
            // 亂數產生檔名
            CaptchaCode += Codes[RadomCode.Next(32)];
            // 紀錄驗證碼
            VerifyCode += CaptchaCode;
            // 產生出檔名並找到指定位置檔案存放至List
            CaptchaImage.Add(Image.FromFile(Server.MapPath("~/") + "/Images/VerifyImage/" + Index + CaptchaCode + ".png"));
            // 清空暫存資訊
            CaptchaCode = "";
        }
        // 把圖片List轉成Array
        CaptchaData = CaptchaImage.ToArray();
        // 合併圖片
        ImageCaptcha = this.UniteImage(100, 30, CaptchaData);
        // 紀錄驗證碼到session
        HttpContext.Current.Session[SessionKey.Captcha] = VerifyCode;
        // 使用MemoryStream存放圖片
        using (MemoryStream MemoryStr = new MemoryStream()) {
            // 將圖檔存進MemoryStream並指定格式為png
            ImageCaptcha.Save(MemoryStr, ImageFormat.Png);
            // 將圖檔轉陣列存入
            imageBytes = MemoryStr.ToArray();
            // 將圖片轉成Base64並存放入Base64String字串中
            Base64String = Convert.ToBase64String(imageBytes);
            // 回傳字串
            return Base64String;
        }
    }

        /// <summary>合併圖片</summary>
        /// <param name="paramWidth">傳入合併後的圖片寬度</param>
        /// <param name="paramHeight">傳入合併後的圖片高度</param>
        /// <param name="paramImgs">傳入要合併的圖片陣列</param>
        /// <returns>將回傳整合後的圖片</returns>
        public System.Drawing.Image UniteImage(Int32 paramWidth, Int32 paramHeight, System.Drawing.Image[] paramImgs) {
            //用來紀錄要回傳的圖片
            System.Drawing.Image ReturnImg = new System.Drawing.Bitmap(paramWidth, paramHeight);
            //用來處理整合圖像的物件
            System.Drawing.Graphics GraphicsTemp = System.Drawing.Graphics.FromImage(ReturnImg);

            //指定要清除的色系
            GraphicsTemp.Clear(System.Drawing.Color.Transparent);
            //加入圖案
            for (Int32 Index = 0; Index <= paramImgs.GetLength(0) - 1; Index++) {
                GraphicsTemp.DrawImage(paramImgs[Index], 0, 0, paramImgs[Index].Width, paramImgs[Index].Height);
            }

            return ReturnImg;
        }


[C#]亂數產生密碼

        /// <summary>以亂數生成新密碼</summary>
        /// <returns>回傳認證碼</returns>
        public string CreateNewPassword() {
            // 使用 RNGCryptoServiceProvider 產生由密碼編譯服務供應者 (CSP) 提供的亂數產生器
            RNGCryptoServiceProvider RNGPService = new RNGCryptoServiceProvider();
            // 用來存放隨機序列值
            byte[] RandomByte = new byte[4];
            // 用來存放隨機亂數值
            char[] Chars =       "0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ".ToCharArray();
            // 用來存放生成的亂數密碼
            StringBuilder Str = new StringBuilder();
            // 初始密碼長度
            int PasswordLength = 10;
            // 用來存放位元陣列轉換後的結果
            int Value = 0;
            // 開始生成密碼
            for (int Index = 0; Index < PasswordLength; Index++) {
                // 取得隨機編譯的亂數值
                RNGPService.GetBytes(RandomByte);
                // 用來存放位元陣列轉換後的結果
                Value = BitConverter.ToInt32(RandomByte, 0);
                // 產生一個非負數且最大值為隨機亂數值長度以下的亂數
                Value = Value % (Chars.Length - 1 + 1);
                if (Value < 0) Value = -Value;
                // 印出亂數
                Str.Append(Chars[Value]);
            }

            return Str.ToString();
        }

2014年11月11日 星期二

[jQuery]html2canvas 網頁轉換成canvas搭配分享至臉書

官方網站: http://html2canvas.hertzen.com/

介紹: 將整張網頁或局部元素轉為HTML5 Canvas

使用方式: 

1. 抓取table並轉成圖片

html2canvas($("table")[0], {
        onrendered: function(canvas) {
          var $div = $("fieldset div");
          $div.empty();
          $("<img />", { src: canvas.toDataURL("image/png") }).appendTo($div);
        }
      });

2. 整個頁面轉成圖片

html2canvas(document.body, {
  onrendered: function(canvas) {
    document.body.appendChild(canvas);
  }
});

搭配分享至臉書

$(".FBShare").click(function () {
        $.ajaxSetup({
            cache: true
        });
        // 取得臉書提供API
        $.getScript('//connect.facebook.net/en_UK/all.js', function () {
            // Load the APP / SDK
            FB.init({
                appId: '你申請的服務ID', // App ID from the App Dashboard
                cookie: true, // set sessions cookies to allow your server to access the session?
                status: true, // check the login status upon init?
                xfbml: true, // parse XFBML tags on this page?
                frictionlessRequests: true,
                oauth: true
            });
            FB.login(function (response) {
                if (response.authResponse) {
                    window.authToken = response.authResponse.accessToken;
                    // 網頁轉圖片分享至臉書
                    PostImageToFacebook(window.authToken);
                } else {
                }
            }, {
                scope: 'publish_actions,publish_stream'
            });
        });
     
    });
});
// 網頁轉圖片分享至臉書
function PostImageToFacebook(authToken) {
    // 網頁轉cnavas圖片
    html2canvas(document.body, {
        onrendered: function (canvas) {
            var imageData = canvas.toDataURL("image/png");
            try {
                // url轉base64
                blob = dataURItoBlob(imageData);
            } catch (e) {
                console.log(e);
            }
            // 分享至臉書
            var fd = new FormData();
            fd.append("access_token", authToken);
            fd.append("source", blob);
            fd.append("message", "這是一個測試臉書分享圖片功能");
            try {
                $.ajax({
                    url: "https://graph.facebook.com/me/photos?access_token=" + authToken,
                    type: "POST",
                    data: fd,
                    processData: false,
                    contentType: false,
                    cache: false,
                    success: function (data) {
                        console.log("success " + data);
                        $("#poster").html("Posted Canvas Successfully");
                        alert("以分享至臉書,請至臉書查看最新消息!!");
                    },
                    error: function (shr, status, data) {
                        console.log("error " + data + " Status " + shr.status);
                    },
                    complete: function () {
                        console.log("Posted to facebook");
                    }
                });

            } catch (e) {
                console.log(e);
            }
        }
    });
}
// Convert a data URI to blob
function dataURItoBlob(dataURI) {
    var byteString = atob(dataURI.split(',')[1]);
    var ab = new ArrayBuffer(byteString.length);
    var ia = new Uint8Array(ab);
    for (var i = 0; i < byteString.length; i++) {
        ia[i] = byteString.charCodeAt(i);
    }
    return new Blob([ab], {
        type: 'image/png'
    });
}

[jQuery]checkbox 是否被選取

判斷html checkbox 是否被選取

$(elem).prop("checked")    回傳boolean值    true/false


if($('#check').prop("checked")){
   alret("已選取");
}

[Laravel]環境架設,使用docker + laradock

1.選擇使用docker + laradock在windows10的環境使用 先至 docker官方網站 下載 docker for windows   2.依照執行程式下載安裝 這邊我的電腦有遇到一些問題順便記錄下來, 在下載啟動docker時發生錯誤   Hardw...