Clik here to view.
Coding4Fun-馬拉松照片搜尋輔助工具
現在的跑者愈來愈幸福，每逄賽事總能見到馬拉松世界、運動筆記所出動或熱心自發的攝影大人，揹著沈重攝影器材，不畏日曬雨淋地在賽道旁補捉跑友身影，賽後再上傳至網站供跑友自取留念。(在此特向辛苦的攝影大哥大姐們致敬)不過一場比賽常有成千上萬張照片，要在茫茫照片大海找尋自己的英姿有點小挑戰。照片雖然都已依拍攝時間排序，有時更會貼心註明拍攝地點，但要記下自己在何時何地遇到那家攝影師談何容易?...
View ArticleClik here to view.
2014萬金石馬拉松~
第14馬，萬金石馬拉松(先報萬金石，後來報渣打馬時算錯日期，以為隔兩週，卻不知不覺"連馬")，依教練團指示，本場仍採HRDR(Heart Rate Driven...
View ArticleClik here to view.
看影片偷按讚-Clickjacking活用入門(誤)
記得有一陣子，FB很流行"必須先按讚才能看影片"的分享貼文。討厭強迫中獎，我多半選擇不看，再不然就是自己Google去找YouTube原始影片。前陣子在JavaScript.tw FB社團看到TonyQ分享影片網站利用Clickjacking偷抓你的手按讚的伎倆，想起最近固定會收到幾個影片網站的新訊息通知(在粉絲團按過讚，預設會接收通知。PS: 想訂閱本站訊息通知的朋友，知道該怎麼做了吧? :P...
View ArticleClik here to view.
【答客問】用CSS實現上下欄排版切換
網友小黑提問:網頁配置分為上下兩欄，上欄高度固定，下欄佔滿剩餘空間。當上欄隱藏時下欄佔滿全部版面，上欄顯示時恢復原有版面配置，應如何實作?一時技癢，順便也想測驗自己的CSS技巧，拿來當家庭作業暖暖手指。在頁面放入兩個<div>當成上下欄容器，上欄<div class="top">指定height固定高。要讓下欄<div...
View ArticleClik here to view.
Big5-HKSCS編碼補遺
前陣子找到將Big5-HKSCS編碼轉為Unicode的解決方案，實際應用卻發現問題 -- 若字串已是Unicode編碼且混雜其他語系字元，HKSCS_Big5ToUnicode41()便無法招架。延續上回的例子:在"滙豐銀行...
View ArticleClik here to view.
HTML5練習-從桌面拖拉檔案到網頁
這年頭，網頁如果不支援從桌面或檔案總管直接拖拉檔案，想自稱HTML5都心虛，只能稱作HTML4.5(誤)，老闆客戶還會不時打你臉: "Gmail、OneDrive(SkyDrive)、DropBox幾百年前就有了! 為什麼你到現在還做不出來?" (網頁攻城獅內心的OS: 你有給我Google或Microsoft等級的薪水嗎?)...
View ArticleClik here to view.
HTML5檔案上傳進度條
在傳統網頁上傳大檔案，得等到全部傳完才會有回應，等待期間沒消沒息，搞不清楚是沒傳完還是當掉常為人詬病，也嚴重破壞使用者體驗。想在傳輸過程回報上傳進度，過去有些Flash、Java Applet或ActiveX的解決方案，但依賴外掛元件有部署及無法跨平台的疑慮。當HTML5規格漸成主流，長久以來的問題總算有了簡潔有效的解法。要掌握上傳進度有一個關鍵: Client...
View ArticleClik here to view.
HTML5上傳作業進度條-SignalR進階版
【前情提要】利用File API與XHR2 onprogress事件，我們成功做出檔案上傳進度條。但我在工作上常遇到另一種情境 -- 內部系統的上傳轉檔作業。營運資料檔案一般不大，加上在Intranet裡傳輸，上傳只在彈指間，Server端解析資料、塞入資料庫才是重頭戲，常得耗上幾十秒到幾分鐘。這種狀況下，用XHR2做進度條的意義不大，咻!...
View ArticleClik here to view.
TIPS-在.NET4 ASP.NET MVC專案安裝SignalR
目標平台為Windows Server 2003，ASP.NET MVC專案只能選擇.NET 4.0，在NuGet用關鍵字signalr找到程式包，安裝時卻出現以下錯誤:Could not install package 'Microsoft.Owin.Security 2.0.2'. You are trying to install this package into a project...
View ArticleClik here to view.
HTML5筆記–Object URL
相信大家對於Data URI已不陌生，這回再介紹另一個HTML5的好東西 --- Object URL。Data URI的格式為="data:image/gif;base64,R0lGOD...."，Object URL則是"blob:"再串上網址以及GUID，例如:...
View ArticleClik here to view.
【茶包射手日記】純JavaScript DOCX套版元件Debug
網友ping留言問了JS DOCX套版元件問題，由其所提供下載位置(https://github.com/djpate/docxgen)的Readme文件，判斷是PHP所開發，直覺地認為所謂JS套版是JavaScript呼叫PHP完成。但ping後續補充: 真的是純JavaScript，並提供可執行的程式包，我這才驚覺: 啥咪!!...
View ArticleClik here to view.
Clik here to view.
HTML表格欄寬分配實驗
接獲報案，某個KendoUI Grid網頁，調整瀏覽器顯示比例縮放後，最後一欄會莫名消失。試著重現問題。如上圖所示，顯示比例100%時可以看到Column1到Column5共五欄，調整比例到125%，欄位放大，Gird下方出現捲軸，但向右捲動到底只見Column4，Column5不見了。除了調整顯示比例，改變視窗寬度也有同樣效果，只要寬度不足導致水平捲軸，Column5就會消失。程式碼如下:...
View ArticleClik here to view.
切換.NET 4.5導致ASP.NET MVC非同步作業錯誤
為執行SignalR 2.0，將ASP.NET MVC 4專案目標平台改成.NET 4.5。測試了一陣子，今天才由事件檢視器發現: 雖然已編譯成.NET 4.5，因web.config <system.web><httpRuntime />未指定4.5，這段時間一直是用.NET 4.0執行，導致SignalR 2無法啟用WebSocket!...
View ArticleClik here to view.
【茶包射手日記】Windows換版後程式出現Registry錯誤
手邊有個運作多年的程式，安裝在廠商提供的Gateway機器上，呼叫廠商提供的API元件收送資料。接獲通報，因廠商更換Gateway機器，重裝程式卻無法運作，出現無法讀取HKEY_LOCAL_MACHINE\SOFTWARE\BlahAPI機碼(Registry)錯誤。由於機器、Windows、API元件、.NET程式全都可能異動，一堆變數並存，猶如在一片小籠包間射茶包... orz...
View ArticleClik here to view.
2014八卦山台地馬拉松~
我的第15馬，八卦山台地馬拉松。參加這場最主要為了領馬拉松普查的十馬獎，普查網每年會選取一場到兩場馬拉松比賽頒獎，身為馬拉松三年級生，到去年底已累積12場，符合十馬獎資格。今年普查獎春季場選在八卦山馬，適逄清明又辦在南投，便來個掃墓兼跑馬，一舉兩得 :P...
View ArticleClik here to view.
【茶包射手日記】IIS的29小時魔咒
趁著假日對一台ASP.NET MVC網站進行長時間壓測，初期數據表現不俗，顯示調校策略奏效，放著讓程式跑測試穩定性。中午因事外出，回家後馬上檢查系統是否穩定，登楞! 測試畫面顯示Web Application已重啟… orz猜想是程式寫法有問題導致Crash，心頭涼了半截，沮喪地檢查IIS主機的事件檢視器，想找出ASP.NET錯誤或IIS Crash的線索，卻發現以下記錄:A worker...
View ArticleClik here to view.
透過JavaScript將HTML轉為圖檔
最近寫了小工具用ASP.NET MVC及Knockout讀取跑道計圈GPS資料轉成HTML表格，當成運動記錄的圖檔附件，但每次產生HTML表格後都得用螢幕擷取工具將網頁畫面另存圖檔，雖然手續還算單純，但你知道，懶惰是沒有極限的，我開始動腦筋，打算將產生圖檔的動作也自動化。薑薑薑薑~ 如上圖所示，真的被我找到方法!...
View ArticleClik here to view.
集合物件的多執行緒存取注意事項
小敏，你有看過Dictionary<string, string>的Key塞null值嗎?薑! 薑! 薑! 薑~~依照MSDN文件的說明，Dictionary<TKey, TValue>的Key值不接受null值(A key cannot be null)，如果你想硬幹dict.Add(null,...
View ArticleClik here to view.
【茶包射手日記】SignalR導致Mac Safari Crash
測試發現用Mac Safari連上專案網站，在某些狀況下會連續Crash: 接著網頁因重複發生問題宣告停用:在Crash報告中看到WebSocketChannel、ScoketStreamHandleBase等字眼，該網頁唯一會涉及WebSocket的只有SignalR，改用Chrome測試，找到SignalR在特定情境建立連線出錯的證據:由HTTP...
View Article