@lice ::

views: 416 times
這三個月快被apple搞屎了, 先是申請開發者帳號一波八百折
終於作好了被指示要加 in-app-purchase, 因為上頭常常朝令夕改一直不敢下去作關於"帳"的設定
(它很多設定都不能改的, 上頭那八百折其中有兩百折就是因為那樣)
===== 中間改了一次版面的分隔線 =====
還好最後決定先以完全免費的方式先上架亮亮相, 結果submit上去被說是"Invalid Binary"
找了一個最簡單的解決方法就是把XCode3升到4...沒想到是另一個惡夢的開始(簡單個屁)
Build下去變三百多個error....orz
因為都是Three20來的, 把很多沒用到的script蓋掉卻越錯越多, 最後乾脆抓一個新版的來重裝才解決掉問題
(有夠痛恨這種又大又肥, 更新後毛病一大堆的東西)
(而且XCode3到4也變太多, google找到的說明畫面都不一樣)
好不容易邊摸索新介面找到地方上架卻得到"mutiple bundle"的錯誤, 一查之下又是Three20的問題, 要把們的"Skip Install"都設為"Yes"才行
問題還沒完, 最後變成Xcode升級後不能在手機上執行一樣的錯誤"The executable was signed with invalid entitlements"
明明在上一版本都可以升級就不行是什麼道理, 最後查到原來XCode4根本可以不需要Entitlements Files(*.plist)
想想它的那些key轉到這個版本時好像變怪怪的, 說不定是就是找不到東西的緣故
果然把它刪掉就好了 orz
目前"Waiting for review"的狀態, 希望不要再有問題了啊啊啊~~~

Tag : app, apple, iphone, xcode

發表於 January 2nd, 2012 15:09 | 新發現 | Trackback 0 | Comment 0

[jquery]按enter移到下一個輸入欄位

views: 2272 times
jquery的最大作用在於增加ui的好用程度, 幾乎沒有辦不到的, 也因此對一些特殊需求就只能當作挑戰吞下去了
例如在form裡的text輸入欄位按enter要能跳到下一個欄位, 聽起來很簡單但其實沒那麼單純(其實是因為我龜毛想寫的更漂亮)
找了很久終於找到很讚的寫法:

$(function() {
	$("input[type=text]").keydown(function(event){
	  if(event.keyCode == 13){
	    $(this).nextAll("input[type=text]:first").focus();
	  }
	});
}

Tag : form, javascript, jQuery

發表於 July 21st, 2011 16:04 | 新發現 | Trackback 0 | Comment 1

Facebook 小工具的額外控制

views: 4323 times
Facebook小工具(Social Plugins)己被廣泛使用了兩年多
但被嵌入網站的管理者對於user使用這些工具的行為似乎無從介入, 也沒法把這個資訊跟網站內容作整合與統計
其實它是可以作到的, 前提是...
1. 建立facebook app 以取得app id
2. 以 JavaScript SDK 的方式來嵌入小工具(而不是用iFrame)

接著重點來了, 使用 FB.Event.subscribe 來監控user對於facebook工具的行為, 以使用率最高的"讚"按鈕來說, 用法如下:

FB.Event.subscribe('edge.create', function(href) {
	alert('謝謝你喜歡'+href);
});

也可以把alert那行替換成以下這行, 就是目前最討人厭流行的按了讚才能看的功能:
window.location = href+"?action=liked";
跟"讚"有關的Event有以下兩個, 其它可參考 FB.Event.subscribe說明...

edge.create -- 當使用者按了"讚"
edge.remove -- 當使用者取消按"讚"

使用 JavaScript SDK 很方便又功能多多, 而且對於無法使用server site code的網站管理者是一個很好的選擇...

Tag : facebook, javascript

發表於 March 17th, 2011 12:19 | 新發現 | Trackback 0 | Comment 0

Facebook Graph Api 初試

views: 6138 times
Facebook去年推出的Graph Api引起一陣嘩然, 因為它功能強大而且非常容易套用到各網站中
難怪有人說網路的世界都快被facebook統一, 而個資也越來越越藏不住了...

由於某些原因我開始嘗試使用, 沒想到一行code都不用寫就可以玩了, 以下是我的步驟:

申請facebook api: 現在已經需要手機或信用卡認證才可以申請了
請user前往以下網址同意您的app存取他的fb資料 ...參考資料
https://www.facebook.com/dialog/oauth?client_id=123456789&redirect_uri=http://myweb.com&scope=read_stream,offline_access
client_id : App id
scope : 授權範圍為read_stream(讀取塗鴉牆), offline_access(離線存取) ...參考資料
redirect_uri : call back url, 接收回傳授權碼的程式, 回傳參數為code, 型態為get參數
拿授權碼去拿access token, 往後就可以用這個access token來在授權範圍中作資料查詢
https://graph.facebook.com/oauth/access_token?client_id=123456789&redirect_uri=http://myweb.com/&client_secret=we9t8-wert9we7- 0w9e8t&code=[上項取得的code]
client_id : App id
client_secret : App secret
code : user授權碼(code)
redirect_uri : call back url, 接收回傳access token的程式, 回傳參數為access_token, 型態為page content(若為default文件記得最後要有"/")
然就可以httprequest的方式使用facebook api了, 回傳格式為json, 以下為幾個使用範例:
a. 個人資料
https://graph.facebook.com/me?access_token=[access_token]
b. 塗鴉牆
https://graph.facebook.com/me/home?access_token=[access_token]
c. 塗鴉牆上某篇detail
https://graph.facebook.com/[post_id]?access_token=[access_token]
d. 塗鴉牆上某篇留言
https://graph.facebook.com[post_id]/comments?access_token=[access_token]
一次列25筆,若要變更可在query後面加上 limit=xxx (可先從上項取得留言數再設定)

Graph Api使用說明: http://developers.facebook.com/docs/reference/api/

Tag : facebook, graph api

發表於 March 15th, 2011 15:38 | 新發現 | Trackback 0 | Comment 0

透過OAuth使用twitter api(c#)

views: 6263 times
2010/9開始 Twitter 停用了先前簡易的 api 存取方式, 讓沒注意到的使用者一陣錯愕
新的流程與以往有很大的不同, 首先要到 Twitter 註冊一個api
註冊完成會得到三組 key, 分別是:
API key / Consumer key / Consumer secret
我使用的是oauth-dot-net library, 在google code裡可以下載, 它主要幫我們作訊息加密/重組與傳送/接收回傳值的工作
記得使用前要把Consumer key與Consumer secret改為自己的設定

more..

一. 不管使用api的什麼功能, 首先都要先讓user同意該api存取他的資料, 這個動作叫作授權, 這裡有對授權流程的詳細解說...
twitterauth_process.ashx的程式如下

  const string url = "http://twitter.com/account/verify_credentials.xml";
  const string callbackurl = "http://demo.com/finish.aspx"; //完成授權後的頁面
  public void ProcessRequest(HttpContext context)
  {
    context.Response.ContentType = "text/plain";
    context.Response.Charset = "UTF-8";
    TwitterApi.oAuthTwitter oAuth = new TwitterApi.oAuthTwitter();
    if (context.Request["oauth_token"] == null)
    {//登入或請求授權頁
      oAuth.CallBackUrl = "http://demo.com/twitterauth_process.ashx?m=" + context.Request["m"].ToString(); //可自行帶參數
      context.Response.Redirect(oAuth.AuthorizationLinkGet());
    }    else    {
      //user接受授權回傳資料頁
      oAuth.AccessTokenGet(context.Request["oauth_token"], context.Request["oauth_verifier"]);
      if (oAuth.TokenSecret.Length > 0)
      {
        //We now have the credentials, so make a call to the Twitter API.
        try
        {
          string xml = oAuth.oAuthWebRequest(TwitterApi.oAuthTwitter.Method.GET, url, String.Empty);
          if (!string.IsNullOrEmpty(xml))
          {
            //儲存 oAuth.Token, oAuth.OAuthVerifier, oAuth.TokenSecret 三個值, 注意oAuth.Token, oAuth.OAuthVerifier與回傳的"oauth_token" / "oauth_verifier"並不相同, 所以不可直接把後者拿來使用
            //取得xml中的"user/id", "user/name", "user/screen_name"等相關資料
          }    else     {
            err = "twitter error";
          }
        }
        catch (System.Net.WebException ex)
        {
          err = ((System.Net.HttpWebResponse)ex.Response).StatusCode.ToString();
        }
      }
    }
    context.Response.Redirect(callbackurl); //回到完成頁
}

二. user接受授權後我們會得到該user對此api專屬的三組key, 分別是:
Token / OAuthVerifier / TokenSecret
有了上面三個認證資料, 接下來update status這個動作就單純多了

                  TwitterApi.oAuthTwitter oAuth = new TwitterApi.oAuthTwitter();
                  oAuth.Token = Request["oauth_token"].Trim();
                  oAuth.OAuthVerifier = Request["oauth_verifier"].Trim();
                  oAuth.TokenSecret = Request["oauth_secret"].Trim();
                  try
                  {
                    string url = "http://twitter.com/statuses/update.xml";
                    string xml = oAuth.oAuthWebRequest(TwitterApi.oAuthTwitter.Method.POST, url, "status=" + oAuth.UrlEncode(Request["twitter_msg"].Trim()));
                    //取得xml中"status/id"
                  }
                  catch (System.Net.WebException ex)
                  {
                    sApiMsg = (((System.Net.HttpWebResponse)ex.Response).StatusCode).ToString();
                  }

三. 最後替換掉OAuth.cs裡UrlEncode的方法
因為library 是老外寫的, 所以沒有考慮到multibyte的問題, 有幾個熱心網友馬上提出solution供大家使用
例如這個: Space and multibyte character encoding for posting to Twitter using OAuth
與這個: A Proper UrlEncode Function for oAuth in C#

Tag : c#, oauth, twitter

發表於 September 27th, 2010 14:34 | 新發現 | Trackback 0 | Comment 0

Bounce - 輕鬆分享網頁

views: 5548 times

在plurk看到朋友的分享, 覺得很實用
輸入網址後它會取得該網頁的截圖, 重點來了, 它可以讓你為標示的區塊作註解, 並以網址的方式分享給友人
以下是我試作的分享網頁:
http://www.bounceapp.com/2253

跟我目前瀏覽器外掛的fireshot差別是, 以網址分享更方便
有機會可以試試哦~

資料來源: Bounce - 輕鬆在網頁上加注釋

Tag : Web

發表於 June 25th, 2010 15:24 | 新發現 | Trackback 0 | Comment 0

jquery動態產生連結的幾個方法

views: 8698 times
1,2 是不需要JQuery的基本方法

<a href="http://www.google.com" target="_blank">link 1 - google</a>
<div onclick="window.open('http://tw.yahoo.com');">link 2 - yahoo</div>

當連結目標是動態產生時可用下列三種方法
html部份-

<div id="aa">link 3 - imtv</div>
<div id="bb">link 4 - youtube</div>
<div id="cc">link 5 - yam</div>
<form action="" method="get" id="tmpform" target="_blank" style="margin:0px;"></form>

javascript部份-

	$("#aa").click(function(){
		window.open("http://www.im.tv","mywindow");
	});
	var aa = $('＜a＞＜a＞');
	aa.attr({ 
		href:"http://www.youtube.com",
		target:"_blank"
	});
	$("#bb").wrapInner(aa);		
	$("#cc").click(function(){
		$("#tmpform").attr('action','http://www.yam.com');
		$("#tmpform").submit();
	});

*第4行的＜＞符號請自行轉換為半形<>

奇妙的是某些版本的ie6對方法3,5是失效的, 查了半天只查到這個說明:
您無法開啟新的 Internet Explorer Window，或按一下連結後未執行任何動作
遇到這個狀況時, 把方法3的window.open改成location.href就沒問題了~

Tag : javascript, jQuery

發表於 November 17th, 2009 12:37 | 新發現 | Trackback 0 | Comment 0

破圖的處理

views: 8952 times
網頁有引用到外站的圖片, 但圖片不復存在時通常會看到一個所謂的破圖
若想要保持版面的完整與美觀, 可以動態以別的圖片代替
在圖片加上onerror屬性:

<img src="myimage.jpg" onerror="ImgError(this);">

再用javascript寫一個置換圖片的function

function ImgError(source){
    source.src = "img/default_image.jpg";
    source.onerror = "";
    return true;
}

這樣在圖片load不到時就會改顯示你設定的替代圖片了~

參考來源: jQuery/Javascript to replace broken images

Tag : html, image, javascript

發表於 September 29th, 2009 16:25 | 新發現 | Trackback 0 | Comment 0

用JQuery依序展示效果

views: 9497 times
若想讓一個以上的物件, 一個接一個的表現出slide或fade等效果時
直覺的作法是:

function slideImg1(){
  for(b=0;b<ImgCount;b++){
    $(".slide1").eq(b).slideDown('slow'); 
  }
}

但不管效果的速度改的多慢,或甚至用到setTimeout或setInterval它最後都會一起出來
研究出的結果是要善用它on complate 的callback參數:

function slideImg2(){
	if(ImgIndex<ImgCount){
		$(".slide2").eq(ImgIndex).slideDown('slow',slideImg2); 
		ImgIndex++;
	}
}

附上的sample加上了顯示進度的數字, 以方便更清楚的看出差別

slide_onebyone.html

Tag : css, javascript, jQuery

發表於 August 20th, 2009 18:12 | 新發現 | Trackback 0 | Comment 0

用JQuery來自製blink blink效果

views: 10540 times
有兩種方式 1. animate: 用callback方式呼叫自己, 反覆播放opacity(透明度)的變化

function blinkblink1(){
	var opc = ($("#blinkobj1").css("opacity")==1)?0:1;
	$("#blinkobj1").animate({
	        opacity: opc
	}, 800, blinkblink1 );
}

2. 反覆使用fadein, fadeout功能

function blinkblink2a(){
	$("#blinkobj2").fadeOut("slow",blinkblink2b);
}
function blinkblink2b(){
	$("#blinkobj2").fadeIn("fast",blinkblink2a);
}

效果請看這裡:

blinkblink.html

Tag : css, javascript, jQuery, Web

發表於 August 6th, 2009 16:58 | 新發現 | Trackback 0 | Comment 0

<< prev [1] [2] [3] [4] [5] next >>

« Feb 2012 »
日	一	二	三	四	五	六
			1	2	3	4
5	6	7	8	9	10	11
12	13	14	15	16	17	18
19	20	21	22	23	24	25
26	27	28	29