如何嵌入JoinNet

為了讓大家都可以在第一時間找到駐站教師並討論3D列印技術問題，故我們在此分享如何將JoinNet雲端教室嵌入Blog平台，以下為詳細的嵌入過程。



1. 使用者必須先從右上方登入google帳戶
 


2.點選「更多」，選擇「Blogger」



3.選擇要編輯的Blog(例如3D列印教室)



4.左方功能列中選取「版面配置」



5.選擇「新增小工具」



6.找到"HTML/JavaScript"




7.將以下程式碼貼上，並將紅色部分的ID填入您的JoinNet ID

<script language="javascript">
var QUERY_TIMER = 30000; // 30 seconds
var RELOAD_TIMER = 60000; // reload every 1 minute
var query_timer = 0;
var reload_timer = 0;
var id = " 請填入ID ";
var base_url = "http://mmc.joinnet.tw:443/";
var old_nm = "n/a";
var old_pm = "n/a";

function InitInfo() {
old_nm = FindCookie("hmtg_json_nm_" + id + "@" +

base_url);
old_pm = FindCookie("hmtg_json_pm_" + id + "@" +

base_url);
document.getElementById('nm').innerHTML=old_nm;
document.getElementById('pm').innerHTML=old_pm;
}

function UpdateInfo(status,office_status,nm,pm) {
old_nm = FindCookie("hmtg_json_nm_" + id + "@" +

base_url);
old_pm = FindCookie("hmtg_json_pm_" + id + "@" +

base_url);
if(status == 5 || (status == 0 && office_status == 0)) {
document.getElementById('nm').innerHTML=old_nm;
document.getElementById('pm').innerHTML=old_pm;
}
else {
document.getElementById('nm').innerHTML=nm;
document.getElementById('pm').innerHTML=pm;
SetCookie("hmtg_json_nm_" + id + "@" +

base_url,nm);
SetCookie("hmtg_json_pm_" + id + "@" +

base_url,pm);
}
// refer to HIT documentation Section 4.5
if(status == 5) {
document.getElementById('status').innerHTML="沒有上線";
document.getElementById('img').innerHTML="<img  src=\"http://mmc.joinnet.tw/images/msgr_offline2.gif\"/>";
}else if(status == 2) {
document.getElementById('status').innerHTML="忙碌中";
document.getElementById('img').innerHTML="<img  src=\"http://mmc.joinnet.tw/images/msgr_busy.gif\"/>";
}else if(status == 3) {
document.getElementById('status').innerHTML="馬上回來！";
document.getElementById('img').innerHTML="<img  src=\"http://mmc.joinnet.tw/images/msgr_away.gif\"/>";
}else if(status == 4) {
document.getElementById('status').innerHTML="不在座位上";
document.getElementById('img').innerHTML="<img  src=\"http://mmc.joinnet.tw/images/msgr_away.gif\"/>";
}else if(office_status == 2) {
document.getElementById('status').innerHTML="正在開會喔～";
document.getElementById('img').innerHTML="<img  src=\"http://mmc.joinnet.tw/images/msgr_hosting.gif\"/>";
}else if(office_status != 0) {
document.getElementById('status').innerHTML="個人開啟JoinNet";
document.getElementById('img').innerHTML="<img  src=\"http://mmc.joinnet.tw/images/msgr_ready.gif\"/>";
}else if(status == 0) {
document.getElementById('status').innerHTML="沒有上線";
document.getElementById('img').innerHTML="<img  src=\"http://mmc.joinnet.tw/images/msgr_offline2.gif\"/>";
}else if(status == 6) {
document.getElementById('status').innerHTML="Mobile";
document.getElementById('img').innerHTML="<img  src=\"http://mmc.joinnet.tw/images/msgr_mobile.gif\"/>";
}else {
document.getElementById('status').innerHTML="在線上";
document.getElementById('img').innerHTML="<img  src=\"http://mmc.joinnet.tw/images/msgr_online.gif\"/>";
}
}

function trim(s) {
while (s.substring(0,1) == ' ') {
s = s.substring(1, s.length);
}
while (s.substring(s.length-1, s.length) == ' ') {
s = s.substring(0,s.length-1);
}
return s;
}

function FindCookie(name) {
var pair=document.cookie.split(";")
var splitValues;
var i;
for (i=0;i<pair.length;++i)
{
splitValues=trim(pair[i]).split("=");
if (unescape(trim(splitValues[0]))==name) {
if(trim(splitValues[1])) {
return unescape(trim

(splitValues[1]));
}
}
}
return "n/a";
}

function SetCookie(name,value) {
var pair=document.cookie.split(";")
var splitValues;
var i;
var found = 0;
var new_cookie = "";
for (i=0;i<pair.length;++i)
{
splitValues=trim(pair[i]).split("=");
if (unescape(trim(splitValues[0]))==name) {
found = 1;
splitValues[1] = escape(value);
}
if(trim(splitValues[0])) {
new_cookie = new_cookie + trim

(splitValues[0]) + "=" + trim(splitValues[1]) + ";\n";
}
}
if(found == 0) {
new_cookie = new_cookie + escape(name) + "=" +

escape(value);
}
document.cookie = new_cookie;
}

function ResetInfo() {
UpdateInfo(0,0,"","");
}

function QueryInfo() {
var url = base_url + "j/getuserinfo/?id=" + id +

"&callback=jsonCallback";
var script = document.createElement("script");
script.setAttribute("src", url);
script.setAttribute("type", "text/javascript");

window.jsonCallback = function(jsonObj) {
clearTimeout(query_timer);
UpdateInfo

(jsonObj.status,jsonObj.office_status,jsonObj.nm,jsonObj.pm);

// cleanup
document.body.removeChild(script);
delete window.jsonCallback;
}
query_timer = setTimeout(ResetInfo,QUERY_TIMER);
reload_timer = setTimeout(QueryInfo,RELOAD_TIMER);
document.body.appendChild(script);
}
</script>



我是：<b><a
href="http://mmc.joinnet.tw/gotomeeting.php?u=請填入ID&c=visit"><span id="nm">請填入使用者名稱</span></a></b><br />
現在：<span id="img">
<img src="http://mmc.joinnet.tw/images/msgr_offline2.gif"/>
</span> <b><span id="status">沒有上線</span></b><br />
我的個人訊息：<b><span id="pm">點我的名字留言</span></b><br /><br />
線上狀態會一分鐘自動更新，或手動點選下列按鈕更新
<form name=form1>
<p><input type="button" value="重新整理狀態" onclick="clearTimeout(query_timer);clearTimeout

(reload_timer);QueryInfo();" /></p>
</form>

8. JoinNet ID在個人設定中可以查到



9.按下存檔完成操作