jquery.cookie.jsでのスマフォ・PC判別

アメブロとかFC2ブログにあるような、
スマフォで見たときの「モバイル | PC」切り替えのやつ。

これをjs使って作成をしてみた。
多分探せばプラグインとかあるんだろうけど。

ということでこんな感じになった。

<script type="text/javascript" src="./js/jquery.cookie.js" />
<script type="text/javascript">
function getUA(){
 var ua = navigator.userAgent;
 var agent = "";

 if(ua.match(/ipad/i))
  agent = "iPad";
 else if(ua.match(/iphone/i))
  agent = "iPhone";
 else if(ua.match(/ipod/i))
  agent = "iPod";
 else if(ua.match(/android/i)){
  if(ua.match(/mobile/i))
   agent = "Android";
  else
   agent = "AndroidTab";
 }
 else if(ua.match(/msie/i)){
  if(ua.match(/msie 9/i))
   agent = "IE9";
  else if(ua.match(/msie 8/i))
   agent = "IE8";
  else if(ua.match(/msie 7/i))
   agent = "IE7";
 }
 else if(ua.match(/firefox/i))
  agent = "firefox";
 else if(ua.match(/opera/i))
  agent = "opera";
 else if(ua.match(/netscape/i))
  agent = "netscape";
 else if(ua.match(/safari/i)){
  if(ua.match(/chrome/i))
   agent = "chrome";
  else
   agent = "safari";
 }
 else
  agent = "undefined";

return agent;
}

var cookieName = "PCmode";
var webRootPC = "www.hoge.com";
var webRootSP = "sp.hoge.com";
var pcTargetDOM = "#Footer";
var spTargetDOM = ".pclink";

$(document).ready(function(){
 var ua = getUA();
 if(ua == "iPad" || ua == "iPhone" || ua == "iPod" || ua == "Android" || ua == "AndroidTab"){
 var get = getRequest();

 /* cookie */
 if(get['from'] == "sp")
  $.cookie(cookieName,true);/* set pc's cookie */
 else if(get['from'] == "pc"){
  $.cookie(cookieName,null);/* delete sp's cookie */
  $.cookie(cookieName,"",{path:"/",expires:-1});/* delete sp's cookie */
 }

 /* vars */
 var PCmode = $.cookie(cookieName);
 var hostname = location.hostname;
 var href = "";
 
 if(PCmode && hostname == webRootSP){/* Browser->SP and PCmode->true and Host->SP */
  href = "http://" + webRootPC + location.pathname + "?from=sp";
 }
 else if(!PCmode && hostname == webRootPC){/* Browser->SP and PCmode->false and Host->PC */
  href = "http://" + webRootSP + location.pathname + "?from=pc";
 }
 else if(PCmode && hostname == webRootPC){/* Browser->SP and PCmode->true and Host->PC */
  /* insert mobile|pc */
  $(pcTargetDOM).before('<p>表示：<a href="javascript:;" onclick="changePCmode(0)">モバイル</a> | パソコン</p>');
 }
 else if(!PCmode && hostname == webRootSP){/* Browser->SP and PCmode->false and Host->SP */
  /* rewrite mobile|pc */
  $(spTargetDOM).html('モバイル | <a href="javascript:;" onclick="changePCmode(1)">パソコン</a>');
 }

 if(href)
  location.href = href;
 }
});

function changePCmode(x){
 if(x){/* mobile->pc */
  $.cookie(cookieName,true);/* Delete sp's cookie */
  location.href = "http://" + webRootPC + location.pathname + "?from=sp";
 }
 else if(!x){/* pc->mobile */
  $.cookie(cookieName,null);/* Delete pc's cookie */
  $.cookie(cookieName,"",{path:"/",expires:-1});/* Delete pc's cookie */
  location.href = "http://" + webRootSP + location.pathname + "?from=pc";
 }
}

function getRequest(){
 if(location.search.length > 1){
 var get = new Object();
 var ret = location.search.substr(1).split("&");
 for(var i = 0; i < ret.length; i++){
  var r = ret[i].split("=");
  get[r[0]] = r[1];
 }
 return get;
 }
 else
  return false;
}
</script>

前回書いたgetUA()を使って、なおかつ色々と使う的な。
基本的に設定する必要があるところとしては、

var cookieName = "PCmode";
var webRootPC = "www.hoge.com";
var webRootSP = "sp.hoge.com";
var pcTargetDOM = "#Footer";
var spTargetDOM = ".pclink";

ここの箇所だけで、それぞれのドメインを書いたりすればよし。
説明がちょっと面倒なので、そのうち気が向いたら書くつもり。