試作 CKEditor 圖片選擇器 ( image upload )

之前的文章有分享過用 MongoDB 和 Asp.Net MVC 寫一個別人分享的 blog程式，裡面有用到 CKEditor (ASP.Net版)，因為需要上傳文件，所以也要用 CKFinder，但是我想要的是 google blogspot的方式，點選圖片按鈕時可以出現一個 dialog，可以上傳後再選擇或是從雲端選擇圖片，最重要的是要有多選，但基本的元件好像無法達到多選，所以想自己找出一個方法可以達成的。目前在多選的部份已經達到這樣的需求，作法如下

wowza - Play Your First Live Stream

Set up your live streaming in five minutes or less!

Spark直接存取 MongoDB

參考文件 Stratio spark-mongodb First Step

使用 spark連結 mongoDB有兩種方式，一種要透過 Hadoop，而另一種就是使用 Stratio直接連接 MongoDB，視需要來使用不同的連接方式，因為我是初學者，所以先用直接連接的方式，按照步驟設定，目前可以測試成 Spark SQL查詢 mongoDB資料，但使用 Spark Shell時會出現 String Cast Exception。我要再多問問 google大神是否能找出解答.......

Docker介紹

參考文件：《Docker —— 從入門到實踐》正體中文版
完整的說明非常詳盡，如果要馬上試用的話，請參考 Docker Machine 快速建置 docker VM

Docker Machine 快速建置 docker VM

  官網         GitHub

這個真的太好用了，最近用來建置 mongoDB Replica Set和 ODOO(openERP)，非常建議一定要試看看，一下子就完成了，如果要安裝的話要使用 docker toolbox就可了。

分享 Scaling Docker #1 - High Availability Docker DevOps with CoreOS, Etcd, Fleet, Flannel & Nginx

檔案全文檢索第一步 ：asp.net MVC with apache Solr and mongoDB demo

依據 建構全文檢索的網站 - 架構視意圖，目前簡單實作可以上傳檔案也成功把檔案內文解析出來後連同檔案一起存在 MongoDB內，Demo 如下

ThunderBird 使用 LDAP通訊錄

1.LDAP通訊錄設定，參考文件：Thunderbird設定LDAP通訊錄

2.設定可以搜尋 displayName字串
設定上沒什麼問題 ，預設查詢時會找 commonName和 mail的屬性，但如果使用者把英文姓名放在 commonName，中文姓名放在 displayName在用中文姓名時就會查詢不到，要解決這個問題，想要用中文姓名查詢的話，這邊有個解法，參考 ：Thunderbird Tips，最主要加上四個參數在系統上即可

ldap_2.servers.IntaiMail.attrmap.DisplayName
displayName

ldap_2.servers.IntaiMail.autoComplete.commentFormat
[displayName]

ldap_2.servers.IntaiMail.autoComplete.nameFormat
[displayName]

ldap_2.servers.IntaiMail.autoComplete.filterTemplate
(|(mail=*%v*)(displayName=*%v*))


3.指定 LDAP通訊錄，最後指定郵件匣的設定，選項"寫信與通訊錄"，在通訊錄尋找郵件地址時選擇使用其它 LDAP伺服器，並指定剛剛新增的 LDAP通訊錄即可

IIS設定讓相同的 web程式可以使用 IP和 Domain Name連結

之前有作一個 MVC的 portal，使用者是打入 IP如 192.168.xx.xx/portal的方式連結的，在 IIS的是設定虛擬目錄的方式，而最近要導 AD了，因為有 DNS所以同仁希望可以用 portal.xxxx.com的方式就可以連結，而且之前 IP的方式也可以保留，作法請參考下列網站
http://www.flag.com.tw/book/cento-5105.asp?bokno=F6201&id=164

主要作法是再新增一個 IIS網站 port也是 80，網站目錄指定到虛擬目錄的那一個，但是要再多作一個動作，就是在新增的網站設定 繫結，要指定這個新網站 IP對應指定一個 domain name，這樣就可以。

用 browser打開時如果有碰到 呼叫 LoadLibraryEx (於 ISAPI 篩選器 "C:\Windows\Microsoft.NET\Framework\v4.0.30319\\aspnet_filter.dll" 上) 失敗
記得把 ISAPI上把多的 \拿掉即可

建構檔案管理及全文檢索的網站 - 架構視意圖

近期要使用下列的技術自行建立一個全文檢索功能的網站，管理使用者上傳的任何文件，實作中有任何進度會再進一步分享

Mongodb Online Training

我的工作小記事

2002 ~ 2024 在資通電腦使用 J2EE, JSP技術幫台積電開發 EIC(工程師資訊)系統，原本台積已經有這一套系統是用 Delphi開發 ActiveX程式，但要改掉使用當時最流行的 Java EJB, JSP等，我的工作在有限的一星期內要讓系統上有相關圖表顯示製程良率資訊，否則專案將會失敗，後來成功實作 JClass圖表讓專案成功。

2004 ~ 2006 在華聯生技個人開發 Oligo Control System讓使用者管控生物晶片最重要的原料 Oligo(DNA片段)，從進料至生產的控管，讓晶片上 DNA探針完全符合生產要求。
晶片說明：Phalanx Human One Array

2009 使用 Asp.Net 2.0技術改版勝華科技官網
         使用 Flex 3+ J2EE技術開發儀器管理系統 儀器管理系統 Demo
         導入 web service應用，讓 Notes可以跟其它系統作資料溝通
2010 協助勝華科技導入 Oracle ERP ( EBS) R12，負責模組 GL, AP, PO, NM, GV
2012 建置實作 OAuth Server讓自己開發的系統作認證、授權用 OAuth實作文章

2015~ 2016 利用 Asp.Net MVC 5技術在兩星期內開發預算系統，
         包含鉅茂 ERP資訊讀取、DB Objects建立、.Net程式碼開發、前端網頁開發等
         Portal建置，使用 bootstrap 3, jquery, fullcalendar等前端 java script程式開發
         Bootstrap實作相關

2017~2018  PLM收尾，完成驗收

 

2018 ~2019 導入 SAP ERP，團隊建罝，使用者端需求管理，Server問題排除等

 

2019 ~2023 改善資安，設備更換，導入 802.1x，資安政策建立等

 

 

 

asp.net mvc存取 wowza具有安全控管的影音串流

參考文件：How to protect streaming using SecureToken in Wowza Streaming Engine

先說一下當年勇好了，大約在13年前 adobe推出了 flash remoting技術，不只可以連結資料庫而且針對多媒體影音串流的部份也可以連至 adobe media server可以達到視訊的功能，而 flash remoting也就後來變成 Flex。

當時自己可以用 flash remoting開發出有現上會議室的功能，可以即時視訊，白板畫畫、聊天等，當時自己在新竹，還跟在台北的朋友作過測試，蠻不賴的。程式碼目前也還保留著。

回到正題，要如何設定你的 wowza application具有安全存取和 如何在存取，參考文件有詳細的說明。 最主要的作法就是產生 token讓 wowza server確認是否正確。而產生 token string的工作就用一個 class作產生，最後再儲存至 Viewbag變數讓 View可以讀到，這樣就可以了。


還有，文件上一直到到，產生 token的工作千萬不要寫在 javascript程式碼內，因為會被看光光哦。

使用 videojs with dash.js and video-dash.js

參考網址：videojs-contrib-dash

videojs最新版本下載網址：  videojs/github/release

依據參依網址的設定用在自己的專案會一直發生錯誤，不管用 nuget下載或是至 videojs官網下載，只好退而求其次只使用 Dash.js，但後來發現其實是 videojs的版本太舊導致的，所以至 git要下載 5.2的版本，HTML 5 (Chrome)和 flash (IE 11)播放測試過是 OK的

無法載入檔案或組件 'Antlr3.Runtime' 或其相依性的其中之一

參考文件 Could not load file or assembly 'Antlr3.Runtime (1)' or one of its dependencies

因為在 Coding時電腦當機後強制重新開機就出現這個問題
如果碰到此問題，可先試著把 %TEMP%資料夾清空再試試。

好文分享

企業 IT 應該有自己的步調
胡百敬：我花十年學習 你就得花十年趕上

這幾天剛好看到非常棒的文章，趕快分享一下~~~

bootstrap範例網站

範例網址：bootply    jsfiddle

Template & Theme：Start Bootstrap

這兩個網站有很多的範例可以參考，包含 java script程式碼，css，html的語法，最重要的是可以直接就看到執行結果，非常方便，有興趣的人可以來這邊找到你想要的答案

使用 group by 或是利用 partition by來取得資料

目前有一個需求，希望可以取得某一段區間的訂單資料，並用公司、客戶、產品型號、幣別、月份作 Group By，來計算產品數量，還有在這一期間內該產品的最新單價作為下年度的預估單價，而最新單價的部份用 Group By的方式如下：


select  company,curr_code,cust_code, prod_num,max(price)
 from ( select a.Fa02 'company'
 ,isnull(a.Fa13, 'NT$') 'curr_code'
 ,a.Fa061 'cust_code'
 ,c.Fb04 'prod_num'
 ,c.Fb23 'order_lline_date'
 , isnull(c.Fb14,0) 'price'

from DATAWIN.dbo.kfm01 a
,DATAWIN.dbo.kfm02 c
where 1=1
and a.Fa01 = c.Fb01
and isnull(Fa124,'N') = 'N'
and LEFT(c.Fb23 ,6) >= '201301'
and LEFT(c.Fb23 ,6) <= '201312'

and c.Fb23 = (select max(Fb23) from  DATAWIN.dbo.kfm01 e,DATAWIN.dbo.kfm02 f
where 1=1
and e.Fa01 = f.Fb01
and isnull(e.Fa124,'N') = 'N'
and LEFT(f.Fb23 ,6) >= '201301'
and LEFT(f.Fb23 ,6) <= '201312'
and a.Fa02 = e.Fa02
and a.Fa13 = e.Fa13
and a.Fa061 = e.Fa061
and c.Fb04 = f.Fb04
             )
 ) a
 group by company,curr_code,cust_code, prod_num ;

上面的作法應該是大家常使用的，不過還有另一種作法是使用 ROW_NUMBER() OVER (PARTITION BY ORDER BY)的方式來達成，作法如下，寫法比 Group By還簡單，可以參考看看。

多個 fullcalendar顯示在同一個網頁注意事項 - 使用 bootstrap tab

參考文件：fullcalendar render















目前使用者希望各別會議的預約能夠獨立顯示，所以我想到的是用 bootstrap tab的方式，
在取得 json event array後動態產生一個 tab和一個 fullcalendar div只顯示單一會議室的 events，
雖然我覺得這樣的作法不好，因為如果有30、40個會議室的話，tab就有 30個，提供這個功能是希望使用者能一眼就看出那個時段比較少的會議室預約，所以比較徧好單一 fullcalendar顯示所有的 events，不同的會議室 event用不同的顏色作區別。

我的作法如下：

IIS 7連結網路分享目錄

IIS 無法直接存取已建立網路磁碟机，作法如下 

1. 建立 本機(server) 使用者,  在另外一台要作分享目錄的電腦也建立相同帳號、密碼，並把分享目錄指定給這個帳號，給予 read write權限
2. 設定本機(server)目錄權限 因為使用 aps.net mvc5 且 64位元，建議下面兩個目錄都要設定        C:\Windows\Microsoft.NET\Framework64\v4.0.30319\Temporary ASP.NET Files 
                C:\Windows\Microsoft.NET\Framework\v4.0.30319\Temporary ASP.NET Files   
3. 至 iis 7，其應用程式上新增一個虛擬目錄，指定分享目錄並輸入帳號、密碼
4. 修改 Web.config檔   <web.system>內加入
            <identity impersonate=" true" userName="*****" password=" ******" />
5. 程式取得目錄名稱   string default_root = Server.MapPath("../虛擬目錄名稱" );

         
    之前也寫過的文章

IIS 7以上如何執行執行檔 exe, bat

參考文件：Foo.cmd won't output lines in process (on website)
                    System.Diagnostics.Process does not work on IIS 7

目前有個需求需要在 Asp.net MVC網頁上按個連結就可以直接把標籤列印出來，所以要使用 Process這個類別

寫法大同小異，如下

                      string command = string .Format("tscgin.exe {0} {1}", "mo_print.ini", fileName);

                   

                    Process p = new Process();

                    // Redirect the output stream of the child process.

                    p.StartInfo.UseShellExecute = false;

                    p.StartInfo.RedirectStandardOutput = true;

                   p.StartInfo.WorkingDirectory = "c:\somewhere"

                    p.StartInfo.FileName =  "cmd.exe";

                    p.StartInfo.Arguments = "/c " + command;

                    p.Start();

                   string output = p.StandardOutput.ReadToEnd();

                    p.WaitForExit();

但在 IIS和本機(或 Server)目錄需要設定權限的動作，如下

1. 建一個新目錄存放 exe or bat file，並設定權限 NetworkService或建立一個帳號具有執行、寫入、讀取
2. 至 IIS 找出應用程式的 Application Pool後點選"進階應用"，找到 "識別"選項，使用者選擇 NetworkService或你自己建立的新帳號即可

使用 moment處理 asp.net MVC回傳的 json string

參考文件：Serializing Dates in JSON 
                    momentjs

在 asp.net MVC Controller or WebAPI回傳 json時，一般會使用 json.NET的 JsonConvert.SerializeObject作處理，如果欄位有日期的話，在 json.NET 4.5的版本就會自動轉成  ISO 8601 standard 的格式，而非微軟那個格式，除非有指定 TimeConverter

JsonConvert.SerializeObject(System.DateTime.Now) ISO格式如右 "2015-06-17T00:00:00Z"
而在前端 javascript在接到時就可以用 moment所提供的功能作轉換如下所示即可

moment(event.start).format( 'YYYY-MM-DD HH:mm:ss' )

Fullcalendar popover

參考文章： "Singleton" Bootstrap Popover with Close Button - JSFiddle,
                     How to close previous popovers in fullCalendar?

目前我的日曆希望能點選事件 (event)時可以有 bootstrap popover功能出現且規則如下

1. 一次只能有一個 popover出現
2. 點選  event時，只顯示該 event popover
3. 點選 day時要把顯示的 popover關閉，如果有 more視窗存在，也要一併關閉
4. 因為有設定 eventLimt，所以在點選 more時，要把 popover關閉

參考的文章是使用 fn.extend方式 (jquery extend比較像合併(merge)觀念，並非物件導向的繼承), 先作一個 function內有 popover template，然後再合併原本的 event element，這樣就可以作出我想要的功能囉，可以參考看看

Fullcalendar 常用到的參數分享

相關的說明都可以在官網文件找的到 FullCalendar Documentation
目前有用到的參數如下：

//表頭的顯示，依照需求可以作訂定
 header: {
                left: 'prev,next today',
                center: 'title',
                right: 'month,agendaWeek,agendaDay'
            },

defaultDate: new Date() //一開始的啟始日期，都會一般用 new Date當天日期
         
businessHours: false // 是否顯示工作區間，預設是6:00~ 10:00, 也可以制定
         
eventLimit: true //  如果有太多事件 (event)在同一天在 View month，可以用 more來代表

 //View 是 week or day時，畫面啟始時間會移到所指定的 scrollTime
scrollTime: 'HH;mm:ss'

CSS 色彩配置 for fullcalendar event

因為要找 fullcalendar event的顏色配色，下面這些可以提供參考，像我這種沒有美學的工程師，要試著開始了解怎麼排版、配色，讓自己的專案能有加分的效果

25 Examples of Perfect Color Combinations in Web Design


Best Color Tools And Articles For Designers

wufoo gallerydesign

看起來不會太亂，配色也不錯

Bootstrap Typeahead處理 json格式資料，並更新另一個 input的值

參考文件： Bootstrap typeahead ajax result format - Example

因為 Bootstrap Typeahead的 source是一個字串陣列 (string array)，如果使用者希望可以 source可以是 json string array而且在 typeahead選擇時可以更新另一個 input的值，這一篇文章就可以幫助你，作法如下

1. source 接回的是 json string array
2. 實作 matcher, sorter, highlighter
3. 實作 updater，在這邊就可以用 JSON.parse 處理 obj，再把某個 attribute值指定給特定的input

Fullcalendar 使用 google calendar event資訊 - javascript

 

參考文件：google calendar api - javascript範例

上面的參考文件使用 OAuth 2讀取非公開的日曆步驟如下：
1. Google Developers Console創件一個 project (如果有就省略)
2. API的部份記得要開通 calendar API 
3. 到憑證 (Credentials)至少要有一個 web application憑證
    a. Authorized JavaScript Origins記得要輸入網址如http://localhost:8000
        ，可以是 IP或是 domain name，可以多個，這是你實際 javascript讀取 API要識別的。
    b. Authorized Redirect URIs 要清空

Treehouse - 網頁技術教學

找到一個 youtube網頁技術教學，想挖寶的人可以看看 treehouse

好用的 CSShake - 製造晃動的動畫效果

有時候希望在使用 ajax捉資料時可以跟使用者互動，一般是將滑鼠的狀態作改變

但是也可以用一些動畫來顯示，像 CSShake就可以達到我的要求

只要套用 csshake.min.css，然後再要套用的 element上 class加上比如 shake shake-little (小震動)

就可以囉，真是方便。



CSShake

CSShake Github

bootstrap 使用css transform後會造成 nav bar閃爍(flicker)的問題 in chrome

參考文件：Prevent flicker on webkit-transition of webkit-transform

因為實作CSS Animation - 以小米為師時，發現只要移動滑鼠滾輪時，bootstrap nav bar就會一閃一閃的，眼睛很不舒服，可是在 IE 11上就沒這個問題，這是因為 css使用了 -webkit-transform  造成的，解決方式就是在 body內加上 -webkit-backface-visibility : hidden; 即可

$(window).scrollTop() 的值都為 0

因為之前為了要解決一個問題 開啟 bootstrap modal會造成首頁內容左移 (shit to left)，css 設定如下

html {
  overflow: hidden;
  height: 100%;}

因為把 height設為 100%，所以捉取到的值永遠都是 0，但為了作到動畫效果  CSS Animation - 以小米為師   ，所以只好又把它修改回來。

CSS Animation - 以小米為師

參考網站
优秀网站看前端 —— 小米Note介绍页面
小米電源官網

bootstrap model開啟後馬上又自動關閉

相關文章：Bootstrap Modal immediately disappearing

剛好我就是這個原因，因為我是使用 asp.net mvc開發
不小心使用了 script.render載入了兩次 bootstrap.js，後來拿掉後就沒有這個問題了

開啟 bootstrap modal會造成首頁內容左移 (shit to left)

解決方式 Twitter Bootstrap modal pushes html content to the left

主要的作法就是在 css加上如下內容

html {
  overflow: hidden;
  height: 100%;}
body {
  overflow: auto;
  height: 100%;}

/* unset bs3 setting */.modal-open {
 overflow: auto; 
}

ASP.Net MVC 5使用 bootstrap 3 typeahead和 modal實作電話查詢

ERP set default org for view

begin
MO_GLOBAL.SET_POLICY_CONTEXT('S',121);
end;

select
sys_context('multi_org2','current_org_id')
from
dual

遞迴~~~ 百元買百雞

從工作開始~~程式使用遞廻的寫法並不多，一是順展、逆展 BOM，另一個是前公司因為接了 Apple的產品，其 barcode 2D有特殊的編碼原則，所以也用遞迴產生，而這次是因為姪子在大陸復旦大學讀一年級，上了 C的課程，教授出了一個作業名叫百元買百雞，規則如下，公雞1隻3元，母雞1隻1元，小雞1元3隻，請問用一百元買一百隻雞的組合為何，請用程式表現出來，真不知道是大陸的學生程度太高，還是我們太笨，叫一年級的學生寫這個，當下聽到這個題目時，直覺應該是用遞迴的方式，只是不能馬上寫的出來，而且也不想丟臉，所以用力了想了一個下午就寫好了，但是用 C#寫出來的，有興趣的人也可以試試