function afterLoadDevice(data) {
    $.unblockUI();
    if (typeof data == 'object') {
        devices = data[ajaxReturnResultKey];
    } else if (typeof data != 'undefined' && data.indexOf(ajaxReturnResultKey) >= 0) {
        try {
             devices = eval("(" + data + ")")[ajaxReturnResultKey];
        } catch (e) {}
    } else {
        showErrorMessage(data);
    }
    if (devices && devices.length > 0) {
        for (var i = 0; i < devices.length; i++) {
            var h = "<tr id='" + i + "'>";
            h += "<td class='uncheck' style='padding-left:40px;width:120px'>" + devices[i].product + "</td>";
            h += "<td>" + devices[i].sn + "</td>";
            h += "<td>" + devices[i].rdate + "&nbsp;</td>";
            h += "<td>" + devices[i].desc + "&nbsp;</td>";
            h += "</tr>";
            $('#deviceList').find('tbody').append(h);
        }
        $('#deviceList').find('tbody').find('tr').each(function() {  //each(function(){...})  each: takes a function as argument
            $(this).hover(function() {
                $(this).addClass('rowHover');
                $(this).find('td:first').addClass('checked');
            }, function() {
                $(this).removeClass('rowHover');
                $(this).find('td:first').removeClass('checked');
            });
            $(this).click(function() {  // $(this) 即為該列<tr>..</tr>
                currentDevice = devices[$(this).attr('id')];
                $('#instanceId').val(currentDevice.sn);
                $('#sdContent').html('');
                var i = (currentDevice.img ? currentDevice.img : defaultGPSIconURL);
                var h = "<td class='aln-c' style='width:100px;'><img src='" + i + "' width='50'/></td>";
                h += "<td style='vertical-align:middle;'>" + currentDevice.product + "</td>";
                h += "<td style='vertical-align:middle;'>" + currentDevice.sn + "</td>";
                h += "<td style='vertical-align:middle;'>" + currentDevice.rdate + "&nbsp;</td>";
                h += "<td style='vertical-align:middle;'>" + currentDevice.desc + "&nbsp;</td>";
                h += "<td class='aln-r' style='vertical-align:middle;'><input class='button' type='button' value='" + strCDevice + "' onclick='toStep(1);'/></td>";
                $('#sdContent').html(h);
                //
                toStep(2);
            });
        });
    } else {
        $('#deviceList').hide();
        $('#noApplicable').fadeIn('slow');
    }
}

function unlockMapsource() {
    if (!$('#cpc').val()) {
        $('.validationError').find('b').html("");
        $('.validationError').find('b').addClass("error-highlight");
        $('.validationError').find('b').append(requiredFiled);
        return false;
    } else if ($('#cpc').val().length != 8) {
        $('.validationError').find('b').html("");
        $('.validationError').find('b').addClass("error-highlight");
        $('.validationError').find('b').append(lengthFormat);
        return false;
    } else {
        $('.validationError').find('b').html("");
        $('#confirmCpc').html($('#cpc').val());
        $('#confirmDevice').html(currentDevice.product);
        $('#confirmSN').html(currentDevice.sn);
        $.blockUI({message: $('#confirmContent'), css:{backgroundColor:'#fff', padding:0,margin:0, border:'0px solid #aaa'}, overlayCSS:{backgroundColor:'#000', opacity:'0.6'}});
    }
}

function confirmUnlock() {
    $.blockUI(spinning);
    $.post(unlockMpsUrl, {'cpc': $("#cpc").val(), 'instanceId': $("#instanceId").val()}, afterUnlockMps, null);
}

function rejectUnlock() {
    $.unblockUI();
    return false;
}

function afterUnlockMps(data) {
    $.unblockUI();
    var result;
    if (typeof data == 'object') {
        result = data[ajaxReturnResultKey];
    } else if (typeof data != 'undefined' && data.indexOf(ajaxReturnResultKey) >= 0) {
        try {
             result = eval("(" + data + ")")[ajaxReturnResultKey];
        } catch (e) {}
    } else {
        showErrorMessage(data);
    }
    if (result["result"] == rpcConstSuccess) {
        $('#pName').html(result['pName']);
        $('#uCode').html(result['code']);
        toStep(3);
    } else if (result["result"] == rpcConstUsed  || result["result"] == rpcConstError) {
        $.unblockUI();
        toStep(2);
        showErrorMessage(result["message"]);
    }
}

function toStep(index) {
    switch (index) {
        case 1:
                $('#notice').hide();
                $('#step2').hide();
                $('#step3').hide();
                $('#sd').hide();
                $('#checkVersion').hide()
                $('#step1').fadeIn('slow');
                $('#introduction').fadeIn('slow');
            break;
        case 2:
                $('.validationError').find('b').html("");
                $('#cpc').val('');
                $('#notice').hide();
                $('#step1').hide();
                $('#step3').hide();
                $('#checkVersion').hide();
                $('#step2').fadeIn('slow');
                $('#sd').fadeIn('slow');
                $('#introduction').fadeIn('slow');
            break;
        case 3:
                $('#notice').hide();
                $('#step1').hide();
                $('#step2').hide();
                $('#introduction').hide();
                $('#step3').fadeIn('slow');
                $('#checkVersion').fadeIn('slow');
            break;
    }
}
