sqmod_test update. Better way to load css

34 files changed, 777 insertions, 391 deletions

diff --git a/src/css/manage_dash.less b/src/css/manage_dash.less
index f45adb2..abe8bfc 100644
--- a/src/css/manage_dash.less
+++ b/src/css/manage_dash.less
@@ -3,9 +3,13 @@
 
 #index_page{
     table.accesslist{
-        td.permission{
-            span.label{
-                margin-right:@SmallPad;
+        tr.item{
+            height:48px;
+
+            td.permission{
+                span.label{
+                    margin-right:@SmallPad;
+                }
             }
         }
     }
diff --git a/src/css/manage_problem.less b/src/css/manage_problem.less
index bd00751..e7efceb 100644
--- a/src/css/manage_problem.less
+++ b/src/css/manage_problem.less
@@ -5,4 +5,15 @@
     div.oper{
         text-align:center;
     }
+    table.list{
+        tr.item{
+            height:48px;
+
+            td.oper{
+                div.btn-group{
+                    position:absolute;
+                }
+            }
+        }
+    }
 }
diff --git a/src/css/manage_square.less b/src/css/manage_square.less
index b4f5921..87f1ca7 100644
--- a/src/css/manage_square.less
+++ b/src/css/manage_square.less
@@ -16,6 +16,8 @@
     }
     table.list{
         tr.item{
+            height:48px;
+
             td.time{
                 div.time{
                     height:12px;
@@ -26,6 +28,11 @@
                     margin-right:@SmallPad;
                 }
             }
+            td.oper{
+                div.btn-group{
+                    position:absolute;
+                }
+            }
         }  
     }
 }
diff --git a/src/html/login.html b/src/html/login.html
index da40433..3f7b15d 100644
--- a/src/html/login.html
+++ b/src/html/login.html
@@ -1,5 +1,3 @@
-<link href="/toj/css/login.css" rel="stylesheet">
-
 <div class="row">
     <div class="info span6">
         <h2>登入TOJ，開始你的解題</h2> 
diff --git a/src/html/mail.html b/src/html/mail.html
index bb10ea2..f6a8aac 100644
--- a/src/html/mail.html
+++ b/src/html/mail.html
@@ -1,5 +1,3 @@
-<link href="/toj/css/mail.css" rel="stylesheet">
-
 <div class="modal hide fade medium_modal newmail">
     <div class="modal-header">
         <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
diff --git a/src/html/manage_dash.html b/src/html/manage_dash.html
index 86996ab..e89c5b0 100644
--- a/src/html/manage_dash.html
+++ b/src/html/manage_dash.html
@@ -1,5 +1,3 @@
-<link rel="stylesheet" href="/toj/css/manage_dash.css">
-
 <div class="row">
     <div class="span3">
 
diff --git a/src/html/manage_problem.html b/src/html/manage_problem.html
index 1ee7d47..15d4c1a 100644
--- a/src/html/manage_problem.html
+++ b/src/html/manage_problem.html
@@ -1,5 +1,3 @@
-<link href="/toj/css/manage_problem.css" rel="stylesheet">
-
 <div class="modal hide fade tiny_modal create">
     <div class="modal-header">
         <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
diff --git a/src/html/manage_square.html b/src/html/manage_square.html
index 5db0460..15cb48f 100644
--- a/src/html/manage_square.html
+++ b/src/html/manage_square.html
@@ -71,14 +71,14 @@
     <div class="span2 offset1 oper">
         <button class="btn create" style="display:none;">建立方塊</button>
     </div>
-    <table class="span9 table table-hover list">
+    <table class="span10 table table-hover list">
         <thead>
             <tr>
                 <th class="span1">#</th>
                 <th class="span2">名稱</th>
                 <th class="span2">時間</th>
                 <th class="span1">公開狀態</th>
-                <th class="span2">分類</th>
+                <th class="span3">分類</th>
                 <th class="span1"></th>
             </tr>
         </thead>
diff --git a/src/html/register.html b/src/html/register.html
index 43d07bb..bb5a346 100644
--- a/src/html/register.html
+++ b/src/html/register.html
@@ -1,5 +1,3 @@
-<link href="/toj/css/register.css" rel="stylesheet">
-
 <div class="row">
     <div class="info span6">
         <h2>註冊TOJ，開始你的解題</h2> 
diff --git a/src/html/square.html b/src/html/square.html
index 483ba0a..9c8fd47 100644
--- a/src/html/square.html
+++ b/src/html/square.html
@@ -1,5 +1,3 @@
-<link href="/toj/css/square.css" rel="stylesheet">
-
 <div class="row">
     <div class="span3 catelist">
         <h3>分類</h3>
diff --git a/src/html/user_edit.html b/src/html/user_edit.html
index da8706d..504837a 100644
--- a/src/html/user_edit.html
+++ b/src/html/user_edit.html
@@ -1,5 +1,3 @@
-<link href="/toj/css/user_edit.css" rel="stylesheet">
-
 <div class="row">
     <div class="offset3 span3">
         <h3>個人資料</h3>
diff --git a/src/html/user_main.html b/src/html/user_main.html
index ad0755d..7abec49 100644
--- a/src/html/user_main.html
+++ b/src/html/user_main.html
@@ -1,5 +1,3 @@
-<link href="/toj/css/user_main.css" rel="stylesheet">
-
 <div class="cover"></div>
 <div class="row" style="height:768px; margin-top:640px; position:relative; z-index:0;">
     <div class="offset4 span2">
diff --git a/src/js/com.js b/src/js/com.js
index 3b162c2..1c8af3c 100644
--- a/src/js/com.js
+++ b/src/js/com.js
@@ -472,17 +472,32 @@ var com = new function(){
         urlchg_reen = false;
     };
 
-    that.loadpage = function(htmlurl){
+    that.loadpage = function(html_url,css_url){
         var j_index_page = $('#index_page');
+        var j_css;
         var defer = $.Deferred();
 
-        j_index_page.empty();
-        j_index_page.load(htmlurl,function(data,stat,xhr){
-            that.exheight();
+        function loadhtml(){
+            $.get(html_url,function(data){
+                j_index_page.append($(data));
+                that.exheight();
+                defer.resolve();
+            });
+        }
 
-            defer.resolve();
-        });
+        j_index_page.empty();
 
+        if(css_url != undefined){
+            j_css = $('<link rel="stylesheet">');
+            j_css.attr('href',css_url);
+            j_css.ready(function(){
+                loadhtml();
+            });
+            j_index_page.append(j_css);
+        }else{
+            loadhtml();
+        }
+        
         return defer.promise();
     };
     that.exheight = function(){
diff --git a/src/js/index.js b/src/js/index.js
index f645d3d..1058dc8 100644
--- a/src/js/index.js
+++ b/src/js/index.js
@@ -130,7 +130,6 @@ var index = new function(){
                 j_li = j_menu.find('div.menu li.profile');
                 j_li.find('a').attr('href','/toj/user:' + user.uid + '/main/'); 
                 j_li.show();
-                j_menu.find('div.menu li.square').show();
                 j_menu.find('div.menu li.mail').show();
                 j_menu.find('div.menu li.manage').show();
             }   
diff --git a/src/js/mail.js b/src/js/mail.js
index 5af97c1..8b1fc36 100644
--- a/src/js/mail.js
+++ b/src/js/mail.js
@@ -64,7 +64,6 @@ var mail = new function(){
             var as;
             var pfix;
 
-            console.log(result);
             if(com.is_callerr(result)){
                 index.add_alert('','警告','信箱發生錯誤');
             }else{
@@ -134,7 +133,7 @@ var mail = new function(){
                 mail_node.child_delayset('inbox');
                 mail_node.child_delayset('backup');
 
-                com.loadpage('/toj/html/mail.html').done(function(){
+                com.loadpage('/toj/html/mail.html','/toj/css/mail.css').done(function(){
                     var newmail_content;
                     var readmail_content;
 
@@ -160,7 +159,6 @@ var mail = new function(){
                         count = mails.length;
                         for(i = 0;i < mails.length;i++){
                             com.call_backend('core/mail/','del_mail',function(result){
-                                console.log(result);
                                 if(com.is_callerr(result)){
                                     fail++;
                                 }
diff --git a/src/js/manage.js b/src/js/manage.js
index e3af1f9..822b31e 100644
--- a/src/js/manage.js
+++ b/src/js/manage.js
@@ -34,7 +34,7 @@ var manage = new function(){
             if(direct == 'in'){
                 j_tabnav_dash.active();
 
-                com.loadpage('/toj/html/manage_dash.html').done(function(){
+                com.loadpage('/toj/html/manage_dash.html','/toj/css/manage_dash.css').done(function(){
                     var i;
                     var j_accesslist = j_index_page.find('table.accesslist');
                     var j_item;
@@ -54,7 +54,7 @@ var manage = new function(){
                     for(i = 0;i < authlist.length;i++){
                         autho = authlist[i];
 
-                        j_item = $('<tr><td class="accessid"></td><td class="permission"></td></tr>'); 
+                        j_item = $('<tr class="item"><td class="accessid"></td><td class="permission"></td></tr>'); 
                         j_item.find('td.accessid').text(autho.accessid);
                         j_permission = j_item.find('td.permission');
 
@@ -108,10 +108,10 @@ var manage = new function(){
                 j_item.find('td.title').text(title);
 
                 if(start_time != null){
-                    j_item.find('td.time > div.start').text('┌─' + com.get_timestring(start_time));
+                    j_item.find('td.time div.start').text('┌─' + com.get_timestring(start_time));
                 }
                 if(end_time != null){
-                    j_item.find('td.time > div.end').text('└→' + com.get_timestring(end_time));
+                    j_item.find('td.time div.end').text('└→' + com.get_timestring(end_time));
                 }
                 
                 j_hidden = j_item.find('td.hid');
@@ -156,7 +156,7 @@ var manage = new function(){
                 });
             }
             function _item_create(id,title,hidden,start_time,end_time,cateid,intro,logo){
-                var j_item = $('<tr class="item"><td class="id"></td><td class="title"><td class="time"><div class="time start"></div><div class="time end"></div</td><td class="hid"></td></td><td class="cate"></td><td class="oper"><div class="btn-group"><button class="btn btn-small set"><i class="icon-cog"></i></button><button class="btn btn-small del"><i class="icon-trash"></i></button></div></td></tr>');
+                var j_item = $('<tr class="item"><td class="id"></td><td class="title"><td class="time"><div class="time start"></div><div class="time end"></div></td><td class="hid"></td></td><td class="cate"></td><td class="oper"><div class="btn-group"><button class="btn btn-small set"><i class="icon-cog"></i></button><button class="btn btn-small del"><i class="icon-trash"></i></button></div></td></tr>');
                 
                 _item_set(j_item,id,title,hidden,start_time,end_time,cateid,intro,logo);
 
@@ -255,7 +255,7 @@ var manage = new function(){
             }
 
             if(direct == 'in'){
-                com.loadpage('/toj/html/manage_square.html').done(function(){
+                com.loadpage('/toj/html/manage_square.html','/toj/css/manage_square.css').done(function(){
                     var j_catebox;
                     var j_button;
 
@@ -524,7 +524,7 @@ var manage = new function(){
                 });
             }
             function _item_create(proid,title,hidden,pmodid){
-                var j_item = $('<tr><td class="proid"></td><td class="title"></td><td class="hid"></td><td class="oper"><div class="btn-group"><button class="btn btn-small set"><i class="icon-cog"></i></button><button class="btn btn-small del"><i class="icon-trash"></i></button></div></td></tr>');
+                var j_item = $('<tr class="item"><td class="proid"></td><td class="title"></td><td class="hid"></td><td class="oper"><div class="btn-group"><button class="btn btn-small set"><i class="icon-cog"></i></button><button class="btn btn-small del"><i class="icon-trash"></i></button></div></td></tr>');
 
                 _item_set(j_item,proid,title,hidden,pmodid);
 
@@ -572,7 +572,7 @@ var manage = new function(){
             if(direct == 'in'){
                 j_tabnav_problem.active();
 
-                com.loadpage('/toj/html/manage_problem.html').done(function(){
+                com.loadpage('/toj/html/manage_problem.html','/toj/css/manage_problem.css').done(function(){
                     var j_button;
 
                     j_create = j_index_page.find('div.create'); 
diff --git a/src/js/mod.js b/src/js/mod.js
index db1c617..d0475be 100644
--- a/src/js/mod.js
+++ b/src/js/mod.js
@@ -32,7 +32,7 @@ var mod = new function(){
                             var sqid_node;
 
                             sqid_node = new vus.node(sqid);
-                            eval('curr_sqmod = new ' + sqmodname + '(sqid_node);'); 
+                            eval('curr_sqmod = new ' + sqmodname + '(parseInt(sqid),sqid_node);'); 
 
                             sq_node.child_set(sqid_node);
                         });
diff --git a/src/js/square.js b/src/js/square.js
index 6e71acd..e5a75f5 100644
--- a/src/js/square.js
+++ b/src/js/square.js
@@ -92,7 +92,7 @@ var square = new function(){
         return j_box;
     }
     function catebox_set(j_box,cateid,catename){
-        j_box.data('cateid',cateid);
+        j_box.attr('cateid',cateid);
         j_box.find('h3.catename').text(catename);
     }
     function catebox_create(cateid,catename){
@@ -229,19 +229,30 @@ var square = new function(){
                 index.set_title('');
                 index.clear_tabnav();
 
-                square_node.child_delayset('user');
+                if(user.uid != null){
+                    square_node.child_delayset('user');
+                }
                 square_node.child_delayset('index');
 
-                com.loadpage('/toj/html/square.html').done(function(){
+                com.loadpage('/toj/html/square.html','/toj/css/square.css').done(function(){
                     j_catelist = j_index_page.find('ul.catelist');
                     j_indexlist = j_index_page.find('div.indexlist');
 
-                    user_tabnav = index.add_tabnav('已加入','/toj/square/user/');
+                    if(user.uid != null){
+                        user_tabnav = index.add_tabnav('已加入','/toj/square/user/');
+                        square_node.child_set(user_node);
+                    }
                     index_tabnav = index.add_tabnav('目錄','/toj/square/index/');
-                    
-                    square_node.child_set(user_node);
                     square_node.child_set(index_node);
                 });
+
+                if(url_dpart.length == 0){
+                    if(user.uid == null){
+                        com.url_update('/toj/square/index/');
+                    }else{
+                        com.url_update('/toj/square/user/');
+                    }
+                }
             }else if(direct == 'out'){
                 square_node.child_del(user_node);
                 square_node.child_del(index_node);
diff --git a/src/js/user.js b/src/js/user.js
index 73fdba0..698f22b 100644
--- a/src/js/user.js
+++ b/src/js/user.js
@@ -37,7 +37,9 @@ var user = new function(){
             document.cookie = 'hash=' + hash + ';path=/;expires=' + expire.toUTCString();
 
             imc.Auth.change_current_iden(idendesc);
-            _set_user(uid);
+            _set_user(uid).done(function(){
+                com.url_push_back('/toj/(login/|register)/');
+            });
         };
         function _logout(){
             document.cookie = 'uid=;path=/;expires=Thu, 01 Jan 1970 00:00:00 GMT';
@@ -167,7 +169,7 @@ var user = new function(){
 
                 $.when(
                     _get_user_info(user_node_uid),
-                    com.loadpage('/toj/html/user_main.html')
+                    com.loadpage('/toj/html/user_main.html','/toj/css/user_main.css')
                 ).done(function(data){
                     var reen = false;
                     var url;
@@ -220,7 +222,7 @@ var user = new function(){
 
                 $.when(
                     _get_user_info(user_node_uid),
-                    com.loadpage('/toj/html/user_edit.html')
+                    com.loadpage('/toj/html/user_edit.html','/toj/css/user_edit.css')
                 ).done(function(data){
                     var j_nickname = j_index_page.find('[name="nickname"]');
                     var j_email = j_index_page.find('[name="email"]');
@@ -354,7 +356,7 @@ var user = new function(){
                 index.set_title('');
                 index.clear_tabnav();
 
-                com.loadpage('/toj/html/login.html').done(function(){
+                com.loadpage('/toj/html/login.html','/toj/css/login.css').done(function(){
                     var j_alert = j_index_page.find('div.alert');
                     var j_submit = j_index_page.find('button.submit');
 
@@ -378,7 +380,6 @@ var user = new function(){
                                 j_alert.show();
                             }else{
                                 _login(data.uid,data.hash,data.idendesc);
-                                com.url_push_back('/toj/(login/|register)/');
                             } 
                         },username,password);
                     }); 
@@ -395,7 +396,7 @@ var user = new function(){
                 index.set_title('');
                 index.clear_tabnav();
 
-                com.loadpage('/toj/html/register.html').done(function(){
+                com.loadpage('/toj/html/register.html','/toj/css/register.css').done(function(){
                     var j_alert = j_index_page.find('div.alert');
 
                     j_index_page.find('[name="username"]').focus();
@@ -420,7 +421,6 @@ var user = new function(){
                                 com.call_backend('core/user/','login',function(result){
                                     data = result.data; 
                                     _login(data.uid,data.hash,data.idendesc);
-                                    com.url_push_back('/toj/(login/|register)/');
                                 },username,password);
                             }else{
                                 console.log(data);
diff --git a/src/pmod/pmod_test/css/manage.css b/src/pmod/pmod_test/css/manage.css
index de9f049..cdda78a 100644
--- a/src/pmod/pmod_test/css/manage.css
+++ b/src/pmod/pmod_test/css/manage.css
@@ -2,3 +2,6 @@
 #index_page div.set_mode div.content {
   height: 256px;
 }
+#index_page table.table td.oper div.btn-group {
+  position: absolute;
+}
diff --git a/src/pmod/pmod_test/css/manage.less b/src/pmod/pmod_test/css/manage.less
index eebc931..d0b1d59 100644
--- a/src/pmod/pmod_test/css/manage.less
+++ b/src/pmod/pmod_test/css/manage.less
@@ -4,4 +4,11 @@
             height:256px;
         }
     }
+    table.table{
+        td.oper{
+            div.btn-group{
+                position:absolute;
+            }
+        }
+    }
 }
diff --git a/src/pmod/pmod_test/css/view.css b/src/pmod/pmod_test/css/view.css
index e69de29..75e2dc6 100644
--- a/src/pmod/pmod_test/css/view.css
+++ b/src/pmod/pmod_test/css/view.css
@@ -0,0 +1,12 @@
+.show {
+  display: block;
+}
+.hide {
+  display: none;
+}
+#index_page div.info {
+  position: fixed;
+}
+#index_page div.info table.table {
+  margin-top: 16px;
+}
diff --git a/src/pmod/pmod_test/css/view.less b/src/pmod/pmod_test/css/view.less
index e69de29..c29798c 100644
--- a/src/pmod/pmod_test/css/view.less
+++ b/src/pmod/pmod_test/css/view.less
@@ -0,0 +1,12 @@
+@import 'mixin.less';
+@import 'color.less';
+
+#index_page{
+    div.info{
+        position:fixed;
+
+        table.table{
+            margin-top:@MediumPad;
+        }
+    }
+}
diff --git a/src/pmod/pmod_test/html/view.html b/src/pmod/pmod_test/html/view.html
index 80787a2..989f344 100644
--- a/src/pmod/pmod_test/html/view.html
+++ b/src/pmod/pmod_test/html/view.html
@@ -1,10 +1,37 @@
-<link href="/toj/pmod/pmod_test/css/view.css" rel="stylesheet">
+<div class="modal hide fade medium_modal submit">
+    <div class="modal-header">
+        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+        <h3>上傳</h3>
+    </div>
+    <div class="modal-body container-fluid">
+    </div>
+    <div class="modal-footer">
+        <button class="btn btn-primary submit">確定</button>
+        <button class="btn cancel">取消</button>
+    </div>
+</div>
 
 <div class="row">
-    <div class="span3">
-
-    </div>
-    <div class="span10">
-        LaLaLala
+    <div class="span2 offset1 info">
+        <button class="btn btn-primary submit">上傳</button>
+        <table class="table limit">
+            <thead>
+                <tr>
+                    <th class="span1">限制</th>
+                    <th class="span1"></th>
+                </tr>
+            </thead>
+            <tbody>
+                <tr>
+                    <td>時間</td>
+                    <td class="timelimit"></td>
+                </tr>
+                <tr>
+                    <td>記憶體</td>
+                    <td class="memlimit"></td>
+                </tr>
+            </tbody>
+        </table>
     </div>
+    <div class="span10 offset3 content"></div>
 </div>
diff --git a/src/pmod/pmod_test/js/pmod_test.js b/src/pmod/pmod_test/js/pmod_test.js
index 1f8f848..3d43c54 100644
--- a/src/pmod/pmod_test/js/pmod_test.js
+++ b/src/pmod/pmod_test/js/pmod_test.js
@@ -9,6 +9,35 @@ var pmod_test = function(proid,pro_node){
     pro_node.url_chg = function(direct,url_upart,url_dpart,param){
         if(direct == 'in'){
             pro_node.child_set(manage_node);
+
+            if(url_dpart.length > 0){
+                return 'cont';
+            }
+
+            com.loadpage('/toj/pmod/pmod_test/html/view.html','/toj/pmod/pmod_test/css/view.css').done(function(){
+                var j_submit;
+
+                j_submit = j_index_page.find('div.submit');
+
+                com.call_backend(callpath,'view',function(result){
+                    var data = result.data;
+                    var j_info;
+
+                    if(com.is_callerr(result)){
+                        index.add_alert('alert-error','錯誤','讀取題目失敗');
+                    }else{
+                        j_info = j_index_page.find('div.info');
+                        j_info.find('table.limit td.timelimit').text(data.timelimit + ' ms');
+                        j_info.find('table.limit td.memlimit').text(data.memlimit + ' KB');
+
+                        j_info.find('button.submit').on('click',function(e){
+                            j_submit.modal('show');
+                        });
+
+                        j_index_page.find('div.content').html(data.content);
+                    }
+                });
+            });
         }else if(direct == 'out'){
             pro_node.child_del(manage_node);
         }
@@ -83,6 +112,10 @@ var pmod_test = function(proid,pro_node){
                         j_option.attr('value',testmode_list[i].testmodeid);
                         j_testmode.append(j_option);
                     }
+                    j_option = $('<option></option>');
+                    j_option.text('未設定');
+                    j_option.attr('value',0);
+                    j_testmode.append(j_option);
                     
                     j_testmode = j_set_mode.find('[name="testmode"]');
                     j_testmode.empty();
@@ -92,6 +125,10 @@ var pmod_test = function(proid,pro_node){
                         j_option.attr('value',testmode_list[i].testmodeid);
                         j_testmode.append(j_option);
                     }
+                    j_option = $('<option></option>');
+                    j_option.text('未設定');
+                    j_option.attr('value',0);
+                    j_testmode.append(j_option);
 
                     j_mode_list.empty();
                     for(i = 0;i < data.length;i++){
@@ -210,7 +247,11 @@ var pmod_test = function(proid,pro_node){
                             index.add_alert('','警告','管理發生錯誤');
                         }else{
                             j_set_mode.find('div.content').data('codebox').setValue(data.content);
-                            j_set_mode.find('[name="testmode"]').val(data.testmodeid);
+                            if(data.testmodeid == null){
+                                j_set_mode.find('[name="testmode"]').val(0);
+                            }else{
+                                j_set_mode.find('[name="testmode"]').val(data.testmodeid);
+                            }
                         }
                     },set_mode_id);
                 });
@@ -225,6 +266,10 @@ var pmod_test = function(proid,pro_node){
                     var content = j_set_mode.find('div.content').data('codebox').getValue();
                     var testmodeid = parseInt(j_set_mode.find('[name="testmode"]').val());
 
+                    if(testmodeid == 0){
+                        testmodeid = null;
+                    }
+
                     com.call_backend(callpath,'set_mode',function(result){
                         if(com.is_callerr(result)){
                             index.add_alert('','警告','管理發生錯誤');
diff --git a/src/pmod/pmod_test/py/__pycache__/pmod_test.cpython-33.pyc b/src/pmod/pmod_test/py/__pycache__/pmod_test.cpython-33.pyc
deleted file mode 100644
index 427ec82..0000000
--- a/src/pmod/pmod_test/py/__pycache__/pmod_test.cpython-33.pyc
+++ /dev/null
diff --git a/src/pmod/pmod_test/py/pmod_test.py b/src/pmod/pmod_test/py/pmod_test.py
index baa5151..33e4a0e 100644
--- a/src/pmod/pmod_test/py/pmod_test.py
+++ b/src/pmod/pmod_test/py/pmod_test.py
@@ -24,6 +24,8 @@ class pmod_test(Problem):
         self._reg_path = 'pro/' + str(self._proid) + '/'
 
         Proxy.instance.register_call(
+            self._reg_path, 'view', self.view)
+        Proxy.instance.register_call(
             self._reg_path, 'add_mode', self.add_mode)
         Proxy.instance.register_call(
             self._reg_path, 'del_mode', self.del_mode)
@@ -50,6 +52,8 @@ class pmod_test(Problem):
 
     def unload(self, force):
         Proxy.instance.unregister_call(
+            self._reg_path, 'view')
+        Proxy.instance.unregister_call(
             self._reg_path, 'add_mode')
         Proxy.instance.unregister_call(
             self._reg_path, 'del_mode')
@@ -104,6 +108,24 @@ class pmod_test(Problem):
         cur.execute(sqlstr, sqlarr)
 
     @imc.async.caller
+    def view(self):
+        with TOJAuth.change_current_iden(self._idendesc):
+            mode = self._get_mode_by_modeid(1)
+
+            if mode == None:
+                return 'Emodeid'
+
+            testmode = self._get_testmode_info(mode['testmodeid'])
+
+        ret = {
+            'content':mode['content'],
+            'timelimit':testmode['timelimit'],
+            'memlimit':testmode['memlimit']
+        }
+
+        return ret
+
+    @imc.async.caller
     def add_mode(self, content, testmodeid):
         if(
             (content != None and type(content) != str) or
diff --git a/src/py/backend_server.py b/src/py/backend_server.py
index 7042d41..782b000 100755
--- a/src/py/backend_server.py
+++ b/src/py/backend_server.py
@@ -168,8 +168,8 @@ class BackendWorker(tornado.tcpserver.TCPServer):
                                 self._idendesc,
                                 self._link,
                                 self.center_conn.link,
-                                'blobtmp/2',
-                                TOJBlobTable(2),
+                                'blobtmp/' + str(self.ws_port - 79),
+                                TOJBlobTable(self.ws_port - 79),
                                 TOJBlobHandle)
 
         blobclient.open_container('test','ACTIVE')
@@ -180,6 +180,7 @@ class BackendWorker(tornado.tcpserver.TCPServer):
             )
         except:
             pass
+
         print(handle._fileno)
         handle.write(bytes('Hello Data','utf-8'),0)
         handle.commit(False);
@@ -287,13 +288,12 @@ class BackendWorker(tornado.tcpserver.TCPServer):
         except KeyError:
             pass
 
-    def _get_link(self,linkclass,uid = None):
+    def _get_link(self,linkclass,uid = 0):
         if linkclass == 'center':
             return self.center_conn.link
 
-        elif linkclass == 'client' and uid != None:
+        elif linkclass == 'client':
             stat,ret = Proxy.instance.call(self.center_conn.link + 'core/','get_uid_clientlink',10000,uid)
-            print(ret)
             return ret
 
     @imc.async.caller
@@ -410,7 +410,7 @@ if __name__ == '__main__':
     worker_list = []
 
     worker_list.append(Process(target = start_backend_worker,args = (81, )))
-    #worker_list.append(Process(target = start_backend_worker,args = (82, )))
+    worker_list.append(Process(target = start_backend_worker,args = (82, )))
     #worker_list.append(Process(target = start_backend_worker,args = (181, )))
     #worker_list.append(Process(target = start_backend_worker,args = (182, )))
     #worker_list.append(Process(target = start_backend_worker,args = (183, )))
diff --git a/src/py/center_server.py b/src/py/center_server.py
index 3254196..c6e81b0 100755
--- a/src/py/center_server.py
+++ b/src/py/center_server.py
@@ -266,12 +266,16 @@ class CenterServer(tornado.tcpserver.TCPServer):
 
     @imc.async.caller
     def _get_uid_clientlink(self,uid):
-        if uid in self._uid_clientmap:
-            clients = self._uid_clientmap[uid]
+        if uid == 0:
+            return list(self._client_linkmap.keys())
+
+        else:
+            if uid in self._uid_clientmap:
+                clients = self._uid_clientmap[uid]
 
-            return list(clients.keys())
+                return list(clients.keys())
 
-        return []
+            return []
 
     @imc.async.caller
     def _test_get_client_list(self,talk,talk2):
diff --git a/src/sqmod/sqmod_test/css/index.css b/src/sqmod/sqmod_test/css/index.css
index 64d7015..6313b53 100644
--- a/src/sqmod/sqmod_test/css/index.css
+++ b/src/sqmod/sqmod_test/css/index.css
@@ -1,3 +1,9 @@
+.show {
+  display: block;
+}
+.hide {
+  display: none;
+}
 @font-face {
   font-family: Saucer-Regular;
   src: url('/toj/sqmod/sqmod_test/html/Saucer-Regular.ttf');
@@ -10,15 +16,20 @@
   font-family: Saucer-Mono;
   src: url('/toj/sqmod/sqmod_test/html/Saucer-Mono.ttf');
 }
+#index_page table.jurank {
+  font-size: 12px;
+  position: absolute;
+  right: 6px;
+}
 #index_page div.stage {
   width: 100%;
   position: absolute;
-  top: 41px;
+  top: 49px;
   left: 0px;
   font-family: Saucer-Regular;
 }
 #index_page div.stage div.box {
-  margin: 0px auto 0px auto;
+  margin: 0px auto 0px 64px;
   position: relative;
 }
 #index_page div.stage div.box span.fps {
diff --git a/src/sqmod/sqmod_test/css/index.less b/src/sqmod/sqmod_test/css/index.less
index 6b9c590..cc34f07 100644
--- a/src/sqmod/sqmod_test/css/index.less
+++ b/src/sqmod/sqmod_test/css/index.less
@@ -1,3 +1,6 @@
+@import 'mixin.less';
+@import 'color.less';
+
 @font-face {
   font-family:Saucer-Regular;
   src:url('/toj/sqmod/sqmod_test/html/Saucer-Regular.ttf');
@@ -12,15 +15,20 @@
 }
 
 #index_page{
+    table.jurank{
+        font-size:@SmallFontSize;
+        position:absolute;
+        right:@SmallPad;
+    }
     div.stage{
         width:100%;
         position:absolute;
-        top:41px;
+        top:49px;
         left:0px;
         font-family:Saucer-Regular;
 
         div.box{
-            margin:0px auto 0px auto;
+            margin:0px auto 0px 64px;
             position:relative;
 
             span.fps{
diff --git a/src/sqmod/sqmod_test/html/index.html b/src/sqmod/sqmod_test/html/index.html
index 7e36bae..e677aeb 100644
--- a/src/sqmod/sqmod_test/html/index.html
+++ b/src/sqmod/sqmod_test/html/index.html
@@ -1,6 +1,18 @@
-<link href="/toj/sqmod/sqmod_test/css/index.css" rel="stylesheet">
 
-<div class="stage" exheight=true extop=47px>
+<table class="table span4 jurank">
+    <thead>
+        <tr>
+            <th>#</th>
+            <th>Player</th>
+            <th>Song</th>
+            <th>Score</th>
+            <th>Max Combo</th>
+        </tr>
+    </thead>
+    <tbody></tbody>
+</table>
+
+<div class="stage" exheight=true extop=55px>
     <div class="box">
         <canvas class="stage bottom"></canvas>
         <canvas class="stage main"></canvas>
diff --git a/src/sqmod/sqmod_test/js/sqmod_test.js b/src/sqmod/sqmod_test/js/sqmod_test.js
index d5e7065..9cd1252 100644
--- a/src/sqmod/sqmod_test/js/sqmod_test.js
+++ b/src/sqmod/sqmod_test/js/sqmod_test.js
@@ -1,9 +1,20 @@
 'use strict'
 
-var sqmod_test = function(sq_node){
+var sqmod_test = function(sqid,sq_node){
     var that = this;
     var index_node = new vus.node('index');
     var j_index_page = $('#index_page');
+    var callpath = 'sq/' + sqid + '/';
+
+    function update_result(name,song,score,maxcombo){
+        com.call_backend(callpath,'update_result',function(result){
+            if(com.is_callerr(result)){
+                index.add_alert('','錯誤','資料存取發生錯誤');
+            }else{
+                index.add_alert('alert-success','成功','記錄已送出');
+            }
+        },name,song,score,maxcombo);
+    }
 
     sq_node.url_chg = function(direct,url_upart,url_dpart,param){
         if(direct == 'in'){
@@ -17,8 +28,45 @@ var sqmod_test = function(sq_node){
     }
 
     index_node.url_chg = function(direct,url_upart,url_dpart,param){
+        var j_jurank;
+
+        function _update(){
+            com.call_backend(callpath,'list_jurank',function(result){
+                var i;
+                var data = result.data;
+                var ranko;
+                var j_item;
+
+                if(com.is_callerr(result)){
+                    index.add_alert('','錯誤','資料存取發生錯誤');
+                }else{
+                    j_jurank.empty();
+                    for(i=0;i<data.length;i++){
+                        ranko = data[i];        
+                        
+                        j_item = $('<tr><td class="rank"></td><td class="name"></td><td class="song"></td><td class="score"></td><td class="maxcombo"></td></tr>')
+                        j_item.find('td.rank').text(i + 1);
+                        j_item.find('td.name').text(ranko.name);
+                        j_item.find('td.song').text(ranko.song);
+                        j_item.find('td.score').text(ranko.score);
+                        j_item.find('td.maxcombo').text(ranko.maxcombo);
+
+                        j_jurank.append(j_item);
+                    } 
+                }
+            });
+        }
+
         if(direct == 'in'){
-            com.loadpage('/toj/sqmod/sqmod_test/html/index.html').done(function(){
+            imc.Proxy.instance.register_call(callpath,'update_jurank',function(callback){
+                _update(); 
+                callback('Success');
+            });
+
+            com.loadpage('/toj/sqmod/sqmod_test/html/index.html','/toj/sqmod/sqmod_test/css/index.css').done(function(){
+                j_jurank = j_index_page.find('table.jurank > tbody');
+
+                _update(); 
                 run();
             });
         }
@@ -38,7 +86,6 @@ var sqmod_test = function(sq_node){
                   'R':[1,0],'T':[1,1],'Y':[1,2],'U':[1,3],
                   'F':[2,0],'G':[2,1],'H':[2,2],'J':[2,3],
                   'V':[3,0],'B':[3,1],'N':[3,2],'M':[3,3]};
-    var expfunc = new Object();
 
     var j_stage_bottom;
     var j_stage;
@@ -62,6 +109,10 @@ var sqmod_test = function(sq_node){
     var imgmap = new Object();
     var audiomap = new Object();
 
+    var player_name;
+    var curr_mode = 'pro';
+    var back_running = false;
+
     var param_auto = false;
 
     function load_image(filename){
@@ -103,10 +154,9 @@ var sqmod_test = function(sq_node){
 
         return defer.promise();
     }
-    function audio_play(buffer,ds){
+    function audio_play(buffer,onstart){
         var src = audio_ctx.createBufferSource();
-        var delay = audio_ctx.createDelay(10);
-        var proc = audio_ctx.createScriptProcessor(16384,1,1);
+        var proc = audio_ctx.createScriptProcessor(256,1,1);
 
         if(typeof(buffer) == 'string'){
             buffer = audiomap[buffer];
@@ -120,26 +170,24 @@ var sqmod_test = function(sq_node){
         src.connect(proc);
 
         proc.onaudioprocess = function(e){
-            console.log(e.inputBuffer.duration);
             src.disconnect(0);
             src.connect(g_out);
             proc.disconnect(0);
 
             console.log(new Date().getTime());
-            expfunc.test();
+            if(onstart != undefined){
+                onstart();
+            }
         }
         proc.connect(g_out);
 
-        if(ds != undefined){
-            //delay.delayTime.value = ds; 
-            //delay.connect(g_out);
-            //src.connect(delay);
-        }else{
-            //src.connect(g_out);
-        }
-        src.start(0);
-
         curr_src = src;
+        src.start(0);
+    }
+    function audio_stop(){
+        if(curr_src != null){
+            curr_src.stop(0);
+        }
     }
 
     function run(){
@@ -233,7 +281,7 @@ var sqmod_test = function(sq_node){
                 if(mouse_pos != null){
                     update_butt(mouse_pos[0],mouse_pos[1],true);
                 }
-            }else if(chr == 'A'){
+            }else if(chr == 'A' && curr_mode == 'play'){
                 param_auto ^= true; 
             }
         });
@@ -284,7 +332,7 @@ var sqmod_test = function(sq_node){
                     row = j_this.data('row');
                     col = j_this.data('col');
 
-                    update_butt(row,col,true);
+                    update_butt(row,col,true,false);
                 });
                 j_butts[i][j].on('mouseup',function(e){
                     var j_this = $(this);
@@ -324,11 +372,9 @@ var sqmod_test = function(sq_node){
         _scale();
         _audio();
 
-        expfunc.audio_play = audio_play;
-
-        eng_bottom = new engine(ctx_bottom,expfunc);
-        eng = new engine(ctx,expfunc);
-        eng_top = new engine(ctx_top,expfunc);
+        eng_bottom = new engine(ctx_bottom);
+        eng = new engine(ctx);
+        eng_top = new engine(ctx_top);
 
         ctx.fillStyle = '#1C1C1C';
         ctx.font = '100px Saucer-Regular';
@@ -339,32 +385,37 @@ var sqmod_test = function(sq_node){
 
             window.requestAnimationFrame(_update);
 
-            play();
-        })
+            pro();
+        });
 
-        /*setTimeout(function(){
-            _audio();
-            _audio_play(ab_select);
-            
-            st = new Date().getTime();
-            window.requestAnimationFrame(_ani);
-        },2000);*/
+        while(true){
+            player_name = prompt('Your player name','Foo');
+            if(player_name != ''){
+                break;
+            }
+        }
     }
 
     function preload(){
         return $.when(
             load_image('door_blue.png'),
+            load_image('startmark.png'),
             load_image('wave1.png'),
             load_image('wave2.png'),
             load_image('top.png'),
             load_image('light.png'),
             load_audio('select.ogg'),
-            load_audio('result.ogg')
+            load_audio('result.ogg'),
+            load_audio('select.ogg')
         ); 
     }
     
-    function update_butt(row,col,touch){
+    function update_butt(row,col,touch,click){
         if(butts[row][col].touch != touch){
+            if(click != false){
+                j_butts[row][col].click();
+            }
+
             butts[row][col].touch = touch;
             update_top();
         }
@@ -402,6 +453,11 @@ var sqmod_test = function(sq_node){
         var wave2_off = -1920;
 
         function _wave(){
+            if(curr_mode == 'play'){
+                back_running = false;
+                return;
+            }
+
             wave1_off -= 4;
             if(wave1_off < -i_wave1.width){
                 wave1_off = -(wave1_off + i_wave1.width);
@@ -421,14 +477,21 @@ var sqmod_test = function(sq_node){
             eng_bottom.add_work(_wave);
         }
         
-        eng_bottom.add_work(_wave);
+        if(back_running == false){
+            back_running = true;
+            eng_bottom.add_work(_wave);
+        }
     }
 
-    function play(){
+    function play(song){
         var defer = $.Deferred();
 
         var end = false;
         var i_marks = new Array();
+        var i_perfects = new Array();
+        var i_greats = new Array();
+        var i_goods = new Array();
+        var i_bads = new Array();
 
         var timemap = new Array();
         var st = null;
@@ -437,16 +500,19 @@ var sqmod_test = function(sq_node){
         var note_score;
         var last_touch;
 
+        var curr_tpb;
         var curr_combo = 0;
         var score = {
             'score':0,
+            'door_note':0,
             'perfect':0,
             'great':0,
             'good':0,
             'bad':0,
             'miss':0,
             'max_combo':0,
-            'total_note':0
+            'total_note':0,
+            'auto':false
         };
 
         function _judge(time){
@@ -454,27 +520,34 @@ var sqmod_test = function(sq_node){
 
             time = Math.abs(time);
 
-            if(time > 500){
+            if(time > 425){
                 score.miss += 1;
+                score.door_note -= 8;
                 ret = 4;
-            }else if(time > 200){
+            }else if(time > 170){
                 score.bad += 1;
                 score.score += note_score * 0.1;
+                score.door_note -= 8;
                 ret = 3;
-            }else if(time > 100){
+            }else if(time > 85){
                 score.good += 1;
                 score.score += note_score * 0.4;
+                score.door_note += 1;
                 ret = 2;
-            }else if(time > 50){
+            }else if(time > 42){
                 score.great += 1;
                 score.score += note_score * 0.7;
+                score.door_note += 2;
                 ret = 1;
             }else{
                 score.perfect += 1;
                 score.score += note_score;
+                score.door_note += 2;
                 ret = 0;
             }
 
+            score.door_note = Math.min(Math.max(0,score.door_note),score.total_note);
+
             if(ret <= 2){
                 curr_combo += 1;
                 score.max_combo = Math.max(score.max_combo,curr_combo);
@@ -493,20 +566,35 @@ var sqmod_test = function(sq_node){
             var col;
             var time;
             
-            function __drawmark(ctx,x,y,time){
-                var image = i_marks[Math.floor(time / 36.36364)];
-
-                ctx.drawImage(image,x + 8,y + 8,304,304);
+            function __drawmark(ctx,x,y,time,judge,judge_time){
+                var off;
+                    
+                if(time < 800){
+                    ctx.drawImage(i_marks[Math.floor(time / 36.36364)],x,y,320,320);
+                }
+                if(judge != -1){
+                    off = eng.ts - judge_time;
+
+                    if(judge == 0 && off < 225){
+                        ctx.drawImage(i_perfects[Math.floor(off / 15)],x,y,320,320);
+                    }else if(judge == 1 && off < 225){
+                        ctx.drawImage(i_greats[Math.floor(off / 15)],x,y,320,320);
+                    }else if(judge == 2 && off < 210){
+                        ctx.drawImage(i_goods[Math.floor(off / 15)],x,y,320,320);
+                    }else if(judge == 3 && off < 195){
+                        ctx.drawImage(i_bads[Math.floor(off / 15)],x,y,320,320);
+                    }
+                }
             }
 
             for(i = 0;i < poslist.length;i++){
                 pos = poslist[i];
 
                 time = (eng.ts - st) - pos.time; 
-                if(time >= -509 && time < 291){
+                if(time >= -509 && time < 620){
                     row = pos.pos[0];
                     col = pos.pos[1];
-                    __drawmark(ctx,butts[row][col].x,butts[row][col].y,time + 509);
+                    __drawmark(ctx,butts[row][col].x,butts[row][col].y,time + 509,pos.judge,pos.judge_time);
                 }
             }
         }
@@ -529,8 +617,9 @@ var sqmod_test = function(sq_node){
                     end = true;
                     j_stage_bottom.css('background-color','transparent');
                     
-                    result(score);
-
+                    eng.add_work(function(){
+                        result(song,score);
+                    });
                     return;
                 }
             }else{
@@ -538,7 +627,11 @@ var sqmod_test = function(sq_node){
                 if((ct + 509) >= map.time){
                     poss = map.pos;
                     for(i = 0;i < poss.length;i++){
-                        poslist.push({'judge':-1,'time':map.time,'pos':poss[i]});
+                        poslist.push({'judge':-1,'judge_time':-1,'time':map.time,'pos':poss[i]});
+                    }
+
+                    if(map.tpb != undefined){
+                        curr_tpb = map.tpb;
                     }
 
                     curr +=1;
@@ -549,9 +642,10 @@ var sqmod_test = function(sq_node){
             for(i = 0;i < poslist.length;i++){
                 pos = poslist[i];
                 time = ct - pos.time;
-                if(time >= 500){
+                if(time > 500){
                     if(pos.judge == -1){
                         pos.judge = _judge(time);
+                        pos.judge_time = eng.ts;
                     }
                     continue;
                 }
@@ -560,15 +654,18 @@ var sqmod_test = function(sq_node){
                 col = pos.pos[1];
 
                 if(param_auto == true){
-                    if(time > - 40 && time < 0){
+                    score.auto = true;
+
+                    if(butts[row][col].touch == false && time > -40 && time < 0){
                         update_butt(row,col,true);
                     }else if(time > 40 && time < 100){
                         update_butt(row,col,false);
                     }
                 }
 
-                if(butts[row][col].touch == true && last_touch[row][col] == false){
+                if(pos.judge == -1 && butts[row][col].touch == true && last_touch[row][col] == false){
                     pos.judge = _judge(time);
+                    pos.judge_time = eng.ts;
                 }
 
                 next_poslist.push(pos);
@@ -585,6 +682,37 @@ var sqmod_test = function(sq_node){
             eng.add_work(_update);
         }
         
+        function _prepare(){
+            var defer = $.Deferred();
+            var i_startmark = imgmap['startmark.png'];
+            var poss = timemap[0].pos;
+            
+            function __draw(ctx){
+                var i;
+                var pos;
+                var row;
+                var col;
+                
+                if((eng.ts - st) >= 5000){
+                    defer.resolve();
+                    return;
+                }
+                
+                for(i = 0;i < poss.length;i++){
+                    pos = poss[i];
+                    row = pos[0];
+                    col = pos[1];
+
+                    ctx.drawImage(i_startmark,butts[row][col].x + 35,butts[row][col].y + 35,250,250);
+                }
+                
+                eng.add_draw(0,__draw);
+            }
+
+            eng.add_draw(0,__draw);
+
+            return defer.promise();
+        }
         function _combo(){
             var last_combo = curr_combo;
             var ani_st = -1;
@@ -609,8 +737,6 @@ var sqmod_test = function(sq_node){
 
                 ctx.font = '60px Saucer-Mono';
                 ctx.fillText('combo',272 + 352 * 3 - 64 - m_combo.width,32 + 352 * 2 + 64);
-
-                last_combo = curr_combo;
             }
             function __update(){
                 if(end == true){
@@ -620,8 +746,9 @@ var sqmod_test = function(sq_node){
                     if(curr_combo != last_combo && ani_st == -1){
                         ani_st = eng.ts; 
                     }
-                    eng.add_draw(0,__draw);
+                    eng.add_draw(5,__draw);
                 }
+                last_combo = curr_combo;
 
                 eng.add_work(__update);
             }
@@ -632,8 +759,8 @@ var sqmod_test = function(sq_node){
             eng.add_work(__update);
         }
         function _score(){
+            var m_player;
             var m_otua;
-            var i_door = imgmap['door_blue.png'];
 
             function __draw(){
                 var text;
@@ -643,15 +770,6 @@ var sqmod_test = function(sq_node){
                     return;
                 } 
 
-                var ratio = score.max_combo / score.total_note;
-                var move = eng.beat_ease(307,40,(eng.ts - st) % 307);
-                var dw = 3840 * ratio + move;
-                var dh = 2880 * ratio + move;
-
-                ctx.drawImage(i_door,-dw / 2,-dh / 2,1920 + dw,1440 + dh);
-                ctx.fillStyle='rgba(0,0,0,' + (0.9 - (0.7 * ratio)) + ')';
-                ctx.fillRect(0,0,1920,1440);
-
                 text = Math.ceil(score.score).toString();
 
                 ctx.fillStyle = '#D9D9D9';
@@ -659,60 +777,52 @@ var sqmod_test = function(sq_node){
                 m = ctx.measureText(text);
                 ctx.fillText(text,272 + 352 * 3 - 64 - m.width,32 + 352 - 64);
 
-                if(param_auto == true){
-                    ctx.font = '60px Saucer-Mono';
-                    ctx.fillText('Player: OTUA',272 + 352 * 3 - 64 - m_otua.width,32 + 352 * 3 + 64);
+                ctx.font = '60px Saucer-Mono';
+                if(param_auto == false){
+                    text = 'Player: ' + player_name;
+                    m = m_player;
+                }else{
+                    text = 'Player: OTUA';
+                    m = m_otua;
                 }
+                ctx.fillText(text,272 + 352 * 3 - 64 - m.width,32 + 352 * 3 + 64);
 
-                eng.add_draw(0,__draw);
+                eng.add_draw(5,__draw);
             }
 
+            ctx.fillStyle = '#D9D9D9';
             ctx.font = '60px Saucer-Mono';
+            m_player = ctx.measureText('Player: ' + player_name);
             m_otua = ctx.measureText('Player: OTUA');
 
-            eng.add_draw(0,__draw);
+            eng.add_draw(5,__draw);
         }
+        function _door(){
+            var i_door = imgmap['door_blue.png'];
 
-        /*
-        expfunc.play_draw = function(ctx,x,y,time){
-            var image = i_marks[Math.floor(time / 36.36364)];
-
-            ctx.drawImage(image,x + 8,y + 8,304,304);
-        };*/
-        expfunc.play_draw = function(ctx,poslist,ct){
-            var i;
-            var pos;
-            var row;
-            var col;
-            var time;
-            
-            function __drawmark(x,y,time){
-                var image = i_marks[Math.floor(time / 36.36364)];
-
-                ctx.drawImage(image,x + 8,y + 8,304,304);
-            }
-
-            for(i = 0;i < poslist.length;i++){
-                pos = poslist[i];
-
-                time = ct - pos.time; 
-                if(time >= -509 && time < 327){
-                    row = pos.pos[0];
-                    col = pos.pos[1];
-                    __drawmark(butts[row][col].x,butts[row][col].y,time + 509);
+            function __draw(ctx){
+                var ratio = score.door_note / score.total_note;
+                var move = eng.beat_ease(curr_tpb,40,(eng.ts - st) % curr_tpb);
+                var dw = 3840 * ratio + move;
+                var dh = 2880 * ratio + move;
+                
+                if(end == true){
+                    return;
                 }
-            }
+                
+                ctx.drawImage(i_door,-dw / 2,-dh / 2,1920 + dw,1440 + dh);
+                ctx.fillStyle='rgba(0,0,0,' + (0.9 - (0.5 * ratio)) + ')';
+                ctx.fillRect(0,0,1920,1440);
+                
+                eng.add_draw(0,__draw);
+            } 
+
+            eng.add_draw(0,__draw);
         }
-        
-        expfunc.test = function(){
-            st = eng.ts;
-            console.log(new Date().getTime());
-            eng.add_work(_update);
-            _combo();
-            _score();
-        };
 
-        $.get('/toj/sqmod/sqmod_test/html/JOMANDA.ju',function(data){
+        curr_mode = 'play';
+
+        $.get('/toj/sqmod/sqmod_test/html/song/' + song + '/' + song + '.ju',function(data){
             var i;
             var j;
             var k;
@@ -720,6 +830,8 @@ var sqmod_test = function(sq_node){
             var line;
             var parts;
 
+            var delay;
+            var lpb;
             var tpb;
             var lbeat;
             var beat;
@@ -734,19 +846,23 @@ var sqmod_test = function(sq_node){
 
             lines = data.split('\n');
 
-            //Find start
+            //Load param
+            delay = 0;
             for(i = 0;i < lines.length;i++){
                 line = lines[i];
-                if(line == '#start#'){
+                if(line.charAt(0) == 'd'){
+                    delay = parseInt(line.split('=')[1]);
+                }else if(line == '#start#'){
                     i++;
                     break;
                 }
             }
 
             //Read beatmap
+            lpb = 0;
             tpb = 0;
             lbeat = 0;
-            ltime = 200;
+            ltime = delay + 5000;
             total_note = 0;
             for(;i < lines.length;i++){
                 if((line = lines[i]) == ''){
@@ -773,6 +889,10 @@ var sqmod_test = function(sq_node){
                     }
 
                     timemap.push({'time':time,'pos':pos});
+                    if(lpb != tpb){
+                        timemap[timemap.length - 1].tpb = tpb;
+                        lpb = tpb;
+                    }
                 }
 
                 lbeat = beat;
@@ -796,64 +916,80 @@ var sqmod_test = function(sq_node){
 
             j_stage_bottom.css('background-color','#1C1C1C');
 
-            defers.push(load_audio('JOMANDA.ogg'));
+            defers.push(load_audio('song/' + song + '/' + song + '.ogg'));
             for(i = 0;i < 22;i++){
                 defers.push(load_image('mark/mal_' + i + '.png'));
             }
-            //defers.push(load_image('mark/clearmark.png'));
+            for(i = 0;i < 15;i++){
+                defers.push(load_image('mark/fect_' + i + '.png'));
+            }
+            for(i = 0;i < 15;i++){
+                defers.push(load_image('mark/at_' + i + '.png'));
+            }
+            for(i = 0;i < 14;i++){
+                defers.push(load_image('mark/d_' + i + '.png'));
+            }
+            for(i = 0;i < 13;i++){
+                defers.push(load_image('mark/_' + i + '.png'));
+            }
 
             $.when.apply($,defers).done(function(ab_song){
                 var i;
+                var j;
 
-                for(i = 0;i < 22;i++){
-                    i_marks[i] = arguments[i + 1];
+                j = 1;
+                for(i = 0;i < 22;i++,j++){
+                    i_marks[i] = arguments[j];
+                }
+                for(i = 0;i < 15;i++,j++){
+                    i_perfects[i] = arguments[j];
+                }
+                for(i = 0;i < 15;i++,j++){
+                    i_greats[i] = arguments[j];
+                }
+                for(i = 0;i < 14;i++,j++){
+                    i_goods[i] = arguments[j];
+                }
+                for(i = 0;i < 13;i++,j++){
+                    i_bads[i] = arguments[j];
                 }
 
                 defer.resolve();
 
                 //Start
-                console.log(ab_song.sampleRate);
-                console.log(ab_song.length);
-                audio_play(ab_song);
+                param_auto = false;
+                curr_tpb = timemap[0].tpb;
+
+                st = eng.ts;
+                _door();
+                _combo();
+                _score();
+                _prepare().done(function(){
+                    audio_play(ab_song,function(){
+                        console.log(eng.ts);
+                        eng.add_work(_update);
+                    });
+                });
             });
         });
 
-        
-
         return defer.promise();
     }
     
-    expfunc.result_draw = function(ctx,offx,offy,score){
-        ctx.font = '150px Saucer-Regular';
-        ctx.fillText('Result',offx,offy);
-
-        ctx.font = '120px Saucer-Regular';
-        ctx.fillText(score.score,offx,offy + 200);
-
-        ctx.font = '100px Saucer-Regular';
-        ctx.fillText('Perfect',offx,offy + 350);
-        ctx.fillText(score.perfect,offx + 600,offy + 350);
-        ctx.fillText('Great',offx,offy + 450);
-        ctx.fillText(score.great,offx + 600,offy + 450);
-        ctx.fillText('Good',offx,offy + 550);
-        ctx.fillText(score.good,offx + 600,offy + 550);
-        ctx.fillText('Bad',offx,offy + 650);
-        ctx.fillText(score.bad,offx + 600,offy + 650);
-        ctx.fillText('Miss',offx,offy + 750);
-        ctx.fillText(score.miss,offx + 600,offy + 750);
-        ctx.fillText('Max Combo',offx,offy + 900);
-        ctx.fillText(score.max_combo,offx + 600,offy + 900);
-    };
-
-    function result(score){
+    function result(song,score){
+        var st;
+        var ori_score;
+        var show_score;
         var offx = 272 + 352 + 32;
         var offy = 32 + 256;
 
         function _draw(ctx){
+            var ct = eng.ts - st;
+
             if(score.max_combo == score.total_note){
                 ctx.fillStyle = "#F9BF45";
                 ctx.font = '130px Saucer-Regular';
-                ctx.fillText('FULL COMBO',offx + 32,offy + 72);
+                ctx.fillText('FULL COMBO',offx + 32,offy + 56);
 
                 ctx.fillStyle = '#1C1C1C';
             }
@@ -861,220 +997,187 @@ var sqmod_test = function(sq_node){
             ctx.font = '150px Saucer-Regular';
             ctx.fillText('Result',offx,offy);
 
-            ctx.font = '120px Saucer-Regular';
-            ctx.fillText(score.score,offx,offy + 200);
+            ctx.font = '120px Saucer-Mono';
+            ctx.fillText(show_score,offx,offy + 200);
 
             ctx.font = '100px Saucer-Regular';
             ctx.fillText('Perfect',offx,offy + 350);
-            ctx.fillText(score.perfect,offx + 600,offy + 350);
+            ctx.fillText(score.perfect,offx + 700,offy + 350);
             ctx.fillText('Great',offx,offy + 450);
-            ctx.fillText(score.great,offx + 600,offy + 450);
+            ctx.fillText(score.great,offx + 700,offy + 450);
             ctx.fillText('Good',offx,offy + 550);
-            ctx.fillText(score.good,offx + 600,offy + 550);
+            ctx.fillText(score.good,offx + 700,offy + 550);
             ctx.fillText('Bad',offx,offy + 650);
-            ctx.fillText(score.bad,offx + 600,offy + 650);
+            ctx.fillText(score.bad,offx + 700,offy + 650);
             ctx.fillText('Miss',offx,offy + 750);
-            ctx.fillText(score.miss,offx + 600,offy + 750);
+            ctx.fillText(score.miss,offx + 700,offy + 750);
             ctx.fillText('Max Combo',offx,offy + 900);
-            ctx.fillText(score.max_combo,offx + 600,offy + 900);
-        }
-        function _update(){
-            eng.add_draw(0,_draw);
-            eng.add_work(_update);
+            ctx.fillText(score.max_combo,offx + 700,offy + 900);
+
+            ctx.fillStyle = '#1C1C1C';
+            ctx.font = '60px Saucer-Regular';
+            ctx.fillText('BACK',1360,1344);
+
+            if(ct < 1000){
+                eng.add_draw(0,_draw);
+            }else if(show_score < score.score){
+                show_score = Math.min(score.score,ori_score + (ct - 1000) * 20); 
+                eng.add_draw(0,_draw);
+            }
         }
 
+        curr_mode = 'result';
+
+        st = eng.ts;
+        ori_score = Math.ceil(score.score);
+        show_score = ori_score;
+        score.score += 100000 * score.door_note / score.total_note;
         score.score = Math.ceil(score.score);
         audio_play('result.ogg');
 
-        eng.add_work(_update);
-        back();
-    }
-    
+        if(score.auto == false){
+            update_result(player_name,song,score.score,score.max_combo);
+        }
 
-   /* function test(){
-        var i;
-        var j;
-        var st;
-        var j_div;
-        var j_box;
-        var j_fps;
-        var j_stage_bottom;
-        var j_stage;
-        var j_stage_top;
-        var ctx_bottom;
-        var eng_bottom;
-        var ctx;
-        var eng;
-        var ctx_top;
-        var eng_top;
+        j_butts[3][3].on('click',function(e){
+            j_butts[3][3].off('click');
 
-        
-        var audio;
-        var ab_select;
-        var ab_song2;
-        var ab_song3;
-        var ab_song4;
-
-        var i_top = new Image();
-        var i_light = new Image();
-        var i_wave1 = new Image();
-        var i_cover2 = new Image();
-        var i_cover3 = new Image();
-        var i_cover4 = new Image();
+            eng.add_work(function(){
+                pro();
+            });
+        });
 
-        var i_marks = new Array();
+        eng.add_draw(0,_draw);
+        back();
+    }
+    
+    function pro(){
+        var defers = [];
+        var curr_song = null;
+        var start_cd = null;
+        var end = false;
 
-        function _load(){
-            var i;
-            var image;
+        function _draw(ctx){
+            var title;
+            var timer;
 
-            
+            function __draw_pro(i,j,title,cover){
+                var x,y;
 
-            i_top.src = '/toj/sqmod/sqmod_test/html/top.png';
-            i_light.src = '/toj/sqmod/sqmod_test/html/light.png';
-            i_wave1.src = '/toj/sqmod/sqmod_test/html/wave1.png';
-            i_cover2.src = '/toj/sqmod/sqmod_test/html/IMSOHAPPY.jpg';
-            i_cover3.src = '/toj/sqmod/sqmod_test/html/JOMANDA.jpg';
-            i_cover4.src = '/toj/sqmod/sqmod_test/html/MOTHERSHIP.png';
+                x = butts[i][j].x;
+                y = butts[i][j].y;
 
-            for(i = 0;i < 15;i++){
-                image = new Image();
-                image.src = '/toj/sqmod/sqmod_test/html/mark/mal_' + i + '.png';
-                i_marks.push(image);
+                if(cover != undefined){
+                    ctx.drawImage(cover,x,y,320,320); 
+                }else{
+                    ctx.fillStyle = '#1C1C1C';
+                    ctx.font = '40px Saucer-Bold';
+                    ctx.fillText(title,x + 32,y + 290);
+                }
             }
-            for(i = 0;i < 7;i++){
-                image = new Image();
-                image.src = '/toj/sqmod/sqmod_test/html/mark/malpassed_' + i + '.png';
-                i_marks.push(image);
+            
+            if(end == true){
+                return;
             }
             
-           
-            _load_audio('select.ogg',function(buffer){
-                ab_select = buffer;
-            });
-            _load_audio('IMSOHAPPY.ogg',function(buffer){
-                ab_song2 = buffer;
-            });
-            _load_audio('JOMANDA.ogg',function(buffer){
-                ab_song3 = buffer;
-            });
-            _load_audio('MOTHERSHIP.ogg',function(buffer){
-                ab_song4 = buffer;
-            });
-        }
-
-        
-        
-        
+            __draw_pro(0,0,'A+B Problem');
+            __draw_pro(0,1,'JOMANDA',imgmap['song/JOMANDA/JOMANDA.jpg']);
+            __draw_pro(0,2,'JOMANDA',imgmap['song/SHION/SHION.jpg']);
+
+            ctx.fillStyle = '#1C1C1C';
+            ctx.font = '60px Saucer-Regular';
+            if(curr_song != null){
+                if(start_cd == null){
+                    start_cd = eng.ts;
+                }
 
-        
+                timer = 60 - ((eng.ts - start_cd) / 1000);
+                if(timer <= 0){
+                    _start();
+                }
+                
+                ctx.fillText('BACK',1002,1344);
+                ctx.fillText('START',1360,1344);
 
-        function _pro(){
-            var curr_song = null;
-            var start_cd = null;
+                ctx.font = '48px Saucer-Regular';
+                ctx.fillText(new Number(timer).toFixed(2),1360,1244);
 
-            function __draw(){
-                eng.add_draw(function(ctx){
-                    var title;
+                title = curr_song;
+            }else{
+                ctx.fillText('PREV',1002,1344);
+                ctx.fillText('NEXT',1360,1344);
 
-                    function _draw_pro(i,j,title,cover){
-                        var x,y;
+                title = 'SELECT  PROBLEM';
+            }
 
-                        x = butts[i][j].x;
-                        y = butts[i][j].y;
+            ctx.rotate(Math.PI / 2);
+            ctx.font = '100px Saucer-Regular';
+            ctx.fillText(title,32,-100);
 
-                        if(cover != undefined){
-                            ctx.drawImage(cover,x + 8,y + 8,304,304); 
-                        }else{
-                            ctx.fillStyle = '#1C1C1C';
-                            ctx.font = '40px Saucer-Bold';
-                            ctx.fillText(title,x + 32,y + 290);
-                        }
-                    }
+            eng.add_draw(0,_draw);
+        }
+        function _start(){
+            var i;
+            var j;
 
-                    _draw_pro(0,0,'A+B Problem');
-                    _draw_pro(0,1,'I\'m so happy',i_cover2);
-                    _draw_pro(0,2,'JOMANDA',i_cover3);
-                    _draw_pro(0,3,'Mother Ship',i_cover4);
+            if(curr_song == null){
+                return;
+            }
 
-                    ctx.fillStyle = '#1C1C1C';
-                    ctx.font = '60px Saucer-Regular';
-                    if(curr_song != null){
-                        if(start_cd == null){
-                            start_cd = eng.ts;
-                        }
-                        
-                        ctx.fillText('BACK',1002,1344);
-                        ctx.fillText('START',1360,1344);
+            end = true;
+            audio_stop();
 
-                        ctx.font = '48px Saucer-Regular';
-                        ctx.fillText(new Number(60 - ((eng.ts - start_cd) / 1000)).toFixed(2),1360,1244);
+            for(i = 0;i < 4;i++){
+                for(j = 0;j < 4;j++){
+                    j_butts[i][j].off('click');
+                }
+            }
 
-                        title = curr_song;
-                    }else{
-                        ctx.fillText('PREV',1002,1344);
-                        ctx.fillText('NEXT',1360,1344);
+            eng.add_work(function(){
+                play(curr_song);
+            });
+        }
+        
+        curr_mode = 'pro';
 
-                        title = 'SELECT  PROBLEM';
-                    }
+        defers.push(load_audio('song/JOMANDA/JOMANDA.ogg'));
+        defers.push(load_audio('song/SHION/SHION.ogg'));
+        defers.push(load_image('song/JOMANDA/JOMANDA.jpg'));
+        defers.push(load_image('song/SHION/SHION.jpg'));
 
-                    ctx.rotate(Math.PI / 2);
-                    ctx.font = '100px Saucer-Regular';
-                    ctx.fillText(title,32,-100);
+        $.when.apply($,defers).done(function(){
+            j_butts[0][1].on('click',function(e){
+                load_audio('song/JOMANDA/JOMANDA.ogg').done(function(ab_song){
+                    audio_play(ab_song);
                 });
-
-                eng.add_work(__draw);
-            }
-
-            butts[0][1].on('click',function(e){
-                _audio_play(ab_song2);
-                curr_song = 'I\'m so happy';
-            });
-            butts[0][2].on('click',function(e){
-                _audio_play(ab_song3);
                 curr_song = 'JOMANDA';
             });
-            butts[0][3].on('click',function(e){
-                _audio_play(ab_song4);
-                curr_song = 'Mother Ship';
+            j_butts[0][2].on('click',function(e){
+                load_audio('song/SHION/SHION.ogg').done(function(ab_song){
+                    audio_play(ab_song);
+                });
+                curr_song = 'SHION';
             });
 
-            butts[3][2].on('click',function(e){
+            j_butts[3][2].on('click',function(e){
                 if(curr_song != null){
-                    _audio_play(ab_select);
+                    audio_play('select.ogg');
                     start_cd = null;
                     curr_song = null;
                 }
             });
-            butts[3][3].on('click',function(e){
-                _test();
+            j_butts[3][3].on('click',function(e){
+                _start(); 
             });
 
-
-            __draw();
-        }
-        
-        function _test(){
-            
-        function _ani(){
-            var et = new Date().getTime();
-            j_fps.text(Math.floor(1 / (et - st) * 1000));
-            st = et;
-
-            window.requestAnimationFrame(_ani);
-
-            eng_bottom.update();
-            eng.update();
-            eng_top.update();
-        }
-
-        
-
-        
-    }*/
+            audio_play('select.ogg');
+            eng.add_draw(0,_draw);
+            back();
+        });
+    }
 };
 
-var engine = function(ctx,expfunc){
+var engine = function(ctx){
     var that = this;
     var workq = new Array();
     var drawq = new Array();
@@ -1120,6 +1223,8 @@ var engine = function(ctx,expfunc){
         var worktq;
         var drawtq;
         
+        var tmp = new Date().getTime();
+
         that.ts = new Date().getTime() - st;
 
         //worker.postMessage({'type':0,'ts':that.ts});
@@ -1142,14 +1247,15 @@ var engine = function(ctx,expfunc){
             });
             for(i = 0;i < drawtq.length;i++){
                 ctx.save();
-                if(drawtq[i].func == undefined){
-                    drawtq[i].draw(ctx);
-                }else{
-                    expfunc[drawtq[i].func].apply(null,drawtq[i].param);
-                }
+                drawtq[i].draw(ctx);
                 ctx.restore();
             }
         }
+
+        tmp = new Date().getTime() - tmp;
+        if(tmp > 15){
+            console.log('time' + tmp);
+        }
     };
 
     that.beat_ease = function(dur,max,off){
diff --git a/src/sqmod/sqmod_test/py/sqmod_test.py b/src/sqmod/sqmod_test/py/sqmod_test.py
new file mode 100644
index 0000000..a209892
--- /dev/null
+++ b/src/sqmod/sqmod_test/py/sqmod_test.py
@@ -0,0 +1,88 @@
+from tojauth import TOJAuth
+from asyncdb import AsyncDB
+import mod
+import com
+import config
+import imc.async
+from imc.proxy import Proxy
+from square import Square
+
+class sqmod_test(Square):
+    _sqmod_name = 'sqmod_test'
+
+    def __init__(self, mod_idendesc, get_link_fn, sqid):
+        self._sqid = sqid;
+        self._idendesc = mod_idendesc
+        self.get_link = get_link_fn
+        
+        self._accessid = mod.SquareMg.get_accessid_by_sqid(self._sqid)
+
+        self.db = AsyncDB(config.MOD_DBNAME, config.MOD_DBUSER, 
+                          config.MOD_DBPASSWORD)
+
+        self._reg_path = 'sq/' + str(self._sqid) + '/'
+
+        Proxy.instance.register_call(
+            self._reg_path,'list_jurank',self.list_jurank)
+        Proxy.instance.register_call(
+            self._reg_path,'update_result',self.update_result)
+
+    def unload(self):
+        pass
+
+    def join_square(self,uid):
+        return mod.SquareMg.JOIN_ACCEPT
+
+    def quit_square(self,uid):
+        pass
+
+    @staticmethod
+    def create_square_data():
+        pass
+    
+    @staticmethod
+    def delete_square_data():
+        pass
+
+
+    @imc.async.caller
+    def list_jurank(self):
+        #TOJAuth.check_access_func(self._accessid, TOJAuth.ACCESS_READ)
+
+        cur = self.db.cursor();
+        cur.execute('SELECT "name","song","score","maxcombo" FROM "SQMOD_TEST_JURANK" ORDER BY "score" DESC')
+
+        ret = []
+        for data in cur:
+            ret.append({
+                'name':data[0],
+                'song':data[1],
+                'score':data[2],
+                'maxcombo':data[3],
+            })
+
+        return ret
+
+    @imc.async.caller
+    def update_result(self,name,song,score,maxcombo):
+        #TOJAuth.check_access_func(self._accessid, TOJAuth.ACCESS_READ)
+
+        cur = self.db.cursor();
+        cur.execute('SELECT "score" FROM "SQMOD_TEST_JURANK" WHERE "name"=%s AND "song"=%s',
+                    (name,song))
+
+        if cur.rowcount == 1:
+            if cur.fetchone()[0] > score:
+                return 'Success'
+
+        cur.upsert('SQMOD_TEST_JURANK',
+                   {'name':name,'song':song},
+                   {'score':score,'maxcombo':maxcombo})
+
+        client_links = self.get_link('client')
+        subpath = 'sq/' + str(self._sqid) + '/'
+        for link in client_links:
+            Proxy.instance.call_async(
+                link + subpath, 'update_jurank', 10000, None)
+
+        return 'Success'