Friday, June 22, 2012

[QML] Detect mouse hover to change hover effect on ListView item

How can we do it ?

There are lots of trick to achieve this goal :
First, we use the onEntered, onExited signal of MouseArea to change the hover's opacity :

ListView {
    id: viewer
    width: 100
    height: 300
    model: 10
    delegate : viewerDelegate
}

Component {
   id: viewerDelegate
   Item {
      width: 100
      height: 30
     
      Rectangle {
         id: hoverFocusLightRect
         anchors.fill: parent
         color: "#lalala"
         opacity: 0
      }
     
      MouseArea {
            anchors.fill: parent
            hoverEnabled: true
            onEntered: {
                hoverFocusLightRect.opacity = 0.6;
            }
            onExited: {
                hoverFocusLightRect.opacity = 0;
            }
      }

      Text {
         anchors.fill: parent
         verticalAlignment: Text.AlignVCenter
         horizontalAlignment: Text.AlignHCenter
         text: index
      }
   }
}

Second, we use onPositionChanged instead of onEntered :

MouseArea {
            anchors.fill: parent
            hoverEnabled: true
            onPositionChanged: {
                hoverFocusLightRect.opacity = 0.6;
            }
            onExited: {
                hoverFocusLightRect.opacity = 0;
            }
      }

Both of these are ok, but if we press on one item , and leave the click on the other one, the onExited signal on pressed item won't be trigger, so the hover won't disappear.

The better method is to just use one boolean variant to enabled the hover effect :

ListView {
    id: viewer
    property bool enabledHover: false
    width: 100
    height: 300
    model: 10
    delegate : viewerDelegate
}

Component {
   id: viewerDelegate
   Item {
      width: 100
      height: 30
     
      Rectangle {
         id: hoverFocusLightRect
         anchors.fill: parent
         color: "#lalala"
         opacity: viewer.enabledHover ? 0.6 : 0
      }
     
      MouseArea {
            anchors.fill: parent
            hoverEnabled: true
            onPositionChanged: {                          (or onEntered)
                    viewer.enabledHover = true;
            }
      }

      Text {
         anchors.fill: parent
         verticalAlignment: Text.AlignVCenter
         horizontalAlignment: Text.AlignHCenter
         text: index
      }
   }
}

So the hover effect will display correctly, and the weird thing that show more than one hover will be disappear.

Build NSS & NSPR

1. 首先 download mozilla-build 並執行安裝 exe
2. 點選安裝目錄下 (C:\mozilla-build) 的 start-msvc9.bat
3. Download NSS (Network Security Services) src 與 NSPR (Netscape Portable Runtime) library :
a. Latest release for nss with nspr : https://ftp.mozilla.org/pub/mozilla.org/security/nss/releases/
b. NSS release note : http://www.mozilla.org/projects/security/pki/nss/release_notes.html
c. Build instruction : 你可以利用 CVS (Concurrent Versioning System)來 download nss 與 nspr 的 src 與 library, 並且按照 instruction 來 build nss, 不過用上面說的 gmake 來 compiler 需要先下載 gmake, 但有嘗試用 gmake 來 build 但會有些 c file 無法 include 到其需要的 header path, 所以可以用 make build, 這樣就可以成功了
1) export CVSROOT=":pserver:anonymous@cvs-mirror.mozilla.org:/cvsroot"
2) cvs login
3) 看你要 donwload 哪一版的 version 打上
cvs co -r NSPR_X_X_X_RTM NSPR
cvs co -r NSS_X_X_X_RTM NSS

另外一個比較清楚的安裝與 build 的步驟如下
1. 將 nss 與 nspr 的 zip 解壓所到 c:\Temp 下
2. 點選 start-msvc9.bat
3. 打上 export OS_TARGET="WINNT"
4. 打上 export BUILD_OPT="1"
5. 打上 export HOME="/c/Temp" (or another folder with read / write access)
6. 改面目錄位置到 /c/Temp/nss-3.x.x/mozilla/security/nss
7. 打上 make nss_build_all
8. 大約等上幾分鐘後, 你 build 出來的目路會放在 C:\Temp\nss-3.x.x\mozilla\dist\WINNT5.1_OPT.OBJ\bin 下

Reference : http://support.mozilla.com/en-US/questions/687296#answer-112220


Wednesday, June 08, 2011

VeriSign issue on Firefox



這是幫其他家公司的 certificate 為 Firefox 的 xpi 做 sign 的動作時發生的一個問題

原因出在這個 certificate 的 primary authority 的等級太高, 為 G5















左邊的是新的certificate , 看到他 VeriSign Primary Certification authority 的等級為 G5

右邊是我們公司的 certificate

而這個影響到我們要為 xpi 做簽章的動作,

當我們利用 xxx.pfx 做出 sign xpi 所需要的 db 檔後,

Sign 完後的 xpi , 經由 Firefox 安裝後會出現 -206 的錯誤

經由古歌大師的開導, 這個等級的 primary certification 在 Firefox 中, 預設是不讓 developer 所使用的

如下圖

所以如果將第三個選項打勾, 則用此等級的 certificate sign 過的 xpi 就可以安裝成功

結論 :

請 ODM 廠商給一個能讓 Firefox 通過的 certificate 吧~

因為我們無法要求使用者在安裝我們 Plugin 前去勾選這個選項, 讓我們能夠正確的安裝~

Reference : http://www.ivan-site.com/2010/11/signing-an-xpi-using-a-verisign-code-signing-certificate/

ps. 上面 reference 有題到我們可以將 G5 的 primary certification 上面再包一層不是此等級的 certification, 但是不知道怎麼做, 而且萬一破壞了ODM 的 certificate , 到時後翻臉不認帳, 得不償失阿~

Wednesday, April 28, 2010

Win 7 更換序號

1. 用"以系統管理員身分執行" 打開 cmd 程式
2. 輸入 "slmgr.vbs -ipk "
3. 完後要 active window, 輸入 "slmgr.vbs -ato"

之後可用 slmgr.vbs /dli 查看是否有更換成功 (會顯示序號的某一部份)

Wednesday, March 24, 2010

XMLHttpRequest status == 0 ?

這是我在測試一個簡單的 Ajax 的 sample 測試出來的..

function RequstSend()
{
var XmlHttp = new XMLHttpRequst();

var url = "Test.cgi";
XmlHttp.open('GET', url, true);
XmlHttp.send(null);
XmlHttp.onreadystatechange = function() {
if (XmlHttp.readyState == 4)
{
if (XmlHttp.status == 200)
{
alert(XmlHttp.responseText);
}
}
};
}

在 XmlHttp.status 預期成功的話會收到 200 OK 的訊息, 而 XmlHttp.responseText 會收到 Server 傳過來的內容.
但是幾次的測試下, 發現 status 都回傳 "0", 而且 responseText 內容都是空的,
而用 firebug 查看了一下 XmlHttp 的 statusText property, 結果又是顯示 "OK" 的字樣
想說都已經 OK 了, 怎麼 status 不是預期的 200, 而內容又為何會空的呢 ?

後來我想是不是我連結 page 與我去 request 的 page (test.cgi) 所在的角色並不同呢 ?
結果就發現..因為我連結測試網頁, 在 browser 上所顯示的 url 是以檔案路徑的方式去拿取 (ex: file:///D:/www/index.html) 而對於 request 的 page 來說像是去要另外一個 server 上的 file 一樣.

所以若是 url = "http://youraddress/test.cgi" 所得到的 status == 0 , responseText 為空的; 若是 url = "test.cgi" 所得到的 status == 0, responseText 為整個檔案內容, 而不是我們預期出現的 response 內容.

所以我們若是連結我們的 page , 以 http://youraddress/index.html , 而 test.cgi 放置與 index.html 放置同一個 directory, 則以 http request 回來的 status 就是 200 OK, 而內容也是我們預期 server 回應的內容了.

Reference link : Using XMLHttpRequest

IIS7 + CGI , 讓cig程式執行

再上一篇有教學如何在 win7 中, 將 IIS 與 php 配合使用
而這裡要介紹如何將 cgi 程式能夠在 windows 上的 web server 作用..

首先你先要裝 ActivePerl

然後再 IIS server manager 的中間的功能檢視, 選擇 "處理常式對應"

在右邊選擇 "新增指令對應", 並鍵入

要求路徑 : *.cgi

執行檔 : C:\Perl\bin\perl.exe "%s" %s

名稱 : (自行取)

要求限制中的指令動詞 : GET,HEAD,POST

確認後會跳出, 是否允許ISAPI擴充成式 ?.... 按下"是"

接這就寫一個簡單的 cgi 程式來測試一下是否行

Link : cgi 範例程式

Tuesday, March 23, 2010

解決 IIS 7 + php in win 7 中, 設定 "處理常式對應" 的錯誤

網路上很多教學如何設定你的 web server :

IIS7 + ASP + PHP 安裝指南,Vista x32 版 2009/02 update
Doc : MigratingPHPApplicationstoIIS7


其中一步要設定指令碼 php5isapi.dll 路徑,

然而在 win 7 中, 路徑並沒有像在 xp 一樣點選站台右鍵內容, 在主選單中的 "應用程式設定" 中設定, 而是在功能檢式中的 "處理常式對應" , 再點選右鍵, 選擇 "新增指令碼對應" 設定

但是當我要點選 "處理常式對應" 此設定的時候, 會發生一個問題

如下圖所式 : 後來在網路上查了一下...

預設 handlers 的 overrideModeDefault 是 "Deny" 的

所以, 首先你要先找到 applicationHost.config 的位置 (在 "執行" 打上 "%windir%\system32\inetsrv\config\"), 然後更改檔案中,
<section name="handlers" overridemodedefault="Deny"> </section>
overrideModeDefault 的值 deny 改為 Allow, 然後就可以點選應用常式處理來作設定的動作了..

Saturday, March 06, 2010

將 source code 貼在你的 blog 上 - SyntaxHighliger 2.1

使用 Syntaxhighlighter 來將你的 source code 以整齊, 且有行號的方式來貼在你的 blog 上
ex :

<script type="text/javascript">
var test;
funciton foo()
{
alert('Hello world!');
}
</script>

目前版本 2.1

其實就是將 SyntaxHighlighter 所提供的 script 與 css 加入 blog 架構中

可以參照 SyntaxHighlighter/Usage

目前有支援到的 code 有這些 : SyntaxHighlighter/Brushes

而所需要的 script 和 css 檔案可以參照官網上的 ftp 檔案
ex :

<script type="text/javascript" src="http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js" />

src 位置就是目前最新版本的 file

這邊有幾個蠻詳細的網站, 講的蠻詳細, 因此我就不需要再多解釋了
SyntaxHighlighter出2.1版了
在 Blogger 中插入美觀的程式碼 ~ 使用syntaxhighlighter 2.0 實戰

當然官網也可以逛一逛瞜..
SyntaxHighlighter

幾個需要注意的地方是...
在以

<pre class="brush:your_language">
... your content
</pre>

包起來的內容中,如果有需要以 tag 的方式呈現, 則你的左括號 "<" 需要以編碼的方式呈現 (&lt;), 右括號 ">" 就不需要, 不過要一起編碼也可以 (&gt;)

Thursday, March 04, 2010

[Javascript] call function

在javascript 中若要使用 var.foo() 的方式 call var 的 foo()
則可以這樣寫 :