$(document).ready(function(){
  $('a[act="tofacebook"]').on('click', function() {
    stats('sharef',$('#resources_id').val());
  });
  $('a[act="totwitter"]').on('click', function() {
    stats('sharet',$('#resources_id').val());
  });

  $('#cacelEditBtn').on('click', function() {
    mevent('CollaborativeEdit_Cancel',$('#title').val(),$('#resources_id').val());
    location.reload();
  });

  $(document).on('change', 'select[name*="level"]', function() {
    getLevel($(this));
  });

  let fontPercent = 1.125;
  function updateButtonState() {
      if (fontPercent <= 0.8) {
          $('#lessFontBtn').addClass('disabled');
      } else {
          $('#lessFontBtn').removeClass('disabled');
      }
      if (fontPercent >= 2.5) {
          $('#plusFontBtn').addClass('disabled');
      } else {
          $('#plusFontBtn').removeClass('disabled');
      }
  }
  function updateFontStyle() { //根據字體大小加上class，改變col-xl-2的flex和width
      const targetElement = $('.col-xl-2');
              
      if (fontPercent >= 1.28 && fontPercent <= 1.48) {
          targetElement.addClass('widthChange148');
      } else {
          targetElement.removeClass('widthChange148');
      }
      if (fontPercent >= 1.49 && fontPercent <= 1.83) {
          targetElement.addClass('widthChange183');
      } else {
          targetElement.removeClass('widthChange183');
      }
      if (fontPercent >= 1.84 && fontPercent <= 2.18) {
          targetElement.addClass('widthChange218');
      } else {
          targetElement.removeClass('widthChange218');
      }
      if (fontPercent >= 2.19 && fontPercent <= 2.5) {
          targetElement.addClass('widthChange250');
      } else {
          targetElement.removeClass('widthChange250');
      }
  }
  function leftFontClass() {  //左邊點閱數等內容，根據字體大小判斷
      const leftElement = $('.col-12.sns-info.d-none.d-md-block.clearfix .col-lg-8');
      
      if (fontPercent >= 1.98 && fontPercent <=2.5) {
          leftElement.addClass('leftWidthChange');
      } else {
          leftElement.removeClass('leftWidthChange');
      }
  }
  function updateFontClass() { //根據字體大小判斷移除或增加col-xl-9
      const element = $('#info_table .col-lg-8.col-md-8.col-12');
      
      if (fontPercent >= 1.88 && fontPercent <= 2.5) {
          if (element.hasClass('col-xl-9')) {
              element.removeClass('col-xl-9');
          }
      } else {
          if (!element.hasClass('col-xl-9')) {
              element.addClass('col-xl-9');
          }
      }
  }
  $('#btnlist button').on('click', function() {
    $('#info_table .row').each(function(){
       $(this).find('div').first().removeClass('plus_font_label');
    });
    $('.res_desc').removeClass('plus_font_desc');
    
    if ($(this).attr('id') == 'lessFontBtn') {
        if (fontPercent > 0.8) {
            fontPercent = parseFloat((fontPercent - 0.1).toFixed(2));
            resizeText(fontPercent);
        }
    } else if ($(this).attr('id') == 'normalFontBtn') {
        fontPercent = 1.125;
        resizeText(fontPercent);
    } else if ($(this).attr('id') == 'plusFontBtn') {
        if (fontPercent < 2.5) {  //最多250%，每次+35%
            fontPercent = Math.min(2.5, parseFloat((fontPercent + 0.35).toFixed(2)));
            resizeText(fontPercent);
        }   
    }
    updateButtonState();  //更新按鈕狀態
    updateFontClass();
    leftFontClass();
    updateFontStyle();    //更新樣式狀態
  });
  updateButtonState();  //初始化按鈕狀態

  $('#files a').mousedown(function(){
    var type = $(this).attr('type');
    var filename = $(this).attr('filename');
    var resources_id = $(this).attr('resources_id');
    mevent(type,filename,resources_id);
  });

  $('#files button').on('click', function() {
    var path = $(this).attr('path');
    var filename = $(this).attr('filename');
    var filetype = $(this).attr('filetype');
    if ($(this).hasClass('img-preview') == false) {
        filePreview(path, filename, filetype);
    }
  });
  
/*
  $('td[name="keyword"] a').mousedown(function(){
    var keyword = $(this).attr('keyword');
    var resources_id = $(this).attr('resources_id');
    mevent('RK',keyword,resources_id);
  });

  $('td[name="author"] a').mousedown(function(){
    var author = $(this).attr('author');
    var resources_id = $(this).attr('resources_id');
    mevent('AU',author,resources_id);
  });

  $('td[name="author"] span a').mousedown(function(){
    var org = $(this).attr('org');
    var resources_id = $(this).attr('resources_id');
    mevent('AU',org,resources_id);
  });
*/
  $('#editHistoryBtn').click(function(){ /* 按下共筆"編輯歷程"鈕 */
    $.ajax({
      type: 'GET',
      url: '/common/editRecord.jsp',
      data:{
        resource_id: $('#resources_id').val()
      },
      timeout: 10000,
      async:false,
      success: function( msg ) {
        mevent('CollaborativeEdit_History',$('#title_input').val(),$('#resources_id').val());
        $('#editRecordDiv').html(msg);
        $('#editRecordModal').modal('show');
      },
      error: function( request ) {}
    });
  });
  if ($('#modifyRes').val() == 'true') {
      $('#editBtn').click(function(){ /* 按下共筆"編輯"鈕 */
        $('.content-display-area').hide();
        $('.content-edit-area').show();
        mevent('CollaborativeEdit',$('#title_input').val(),$('#resources_id').val());
        var knowledgeBLocks = $('.knowledge-block');
        for (var i = 0; i < knowledgeBLocks.length; i++) {
             //alert($(knowledgeBLocks[i]).attr('data-id'))
             queryLevelData($(knowledgeBLocks[i]), "", "", "", 1);
        }
        $('.knowledge-block').each(function(i , obj) {
          $(this).children('#level2_def').selectBoxIt({ autoWidth: false });
          $(this).children('#level3_def').selectBoxIt({ autoWidth: false });
          $(this).children('#level4_def').selectBoxIt({ autoWidth: false });
        });
        $(this).attr('disabled', 'disabled');
      });
      $("#openKeywordInput").on("click keydown", function(e){
        if (e.type == 'click' || (event.type == 'keydown' && e.which == 13)) {
            $(this).hide();
            $("#keywordInputArea").show();
            $("#addkeyword_def").focus();
        }
      });
      $("#keywordInputArea > input").keypress(function (event) {
        if (event.keyCode == 13) {
            $("#addKeywordBtn").click();
        }
      });
      $("#addKeywordBtn").click(function(){
        var input = $(this).siblings('input');
        var value = input.val();
        if (value == '') {
            return;
        }
        var html = '<div class="keyword-block" data-val="'+value+'">' + value + '<button type="button"><span aria-hidden="true"><i class="fa fa-times-circle"></i><span class="display-none">刪除</span></span></button></div>';
        $('#keywordInputArea').before(html);
        $('#keywordInputArea, .error-msg.keyword-msg').hide();
        $("#openKeywordInput").show();
        input.val('');
      });
                            
      $("#newKnowledgeInput").on("click keydown", function(e){
        if (e.type == 'click' || (event.type == 'keydown' && e.which == 13)) {
            var _num = $('.knowledge-block').length+1;
            var html = '<div class="knowledge-block">'+
                       '<label for="level1_'+_num+'">領域：</label><select name="level1" id="level1_'+_num+'"><option value="">請選擇</option></select><br>'+
                       '<label for="level2_'+_num+'" >學習階段：</label><select name="level2" id="level2_'+_num+'"><option value="">請選擇</option></select><br>'+
                       '<div clas="clearfix"></div>'+
                       '<label for="level3_'+_num+'">學習內容：</label><select name="level3" id="level3_'+_num+'"><option value="">請選擇</option></select><br>'+
                       '<label for="level4_'+_num+'" >學習表現：</label><select name="level4" id="level4_'+_num+'"><option value="">請選擇</option></select>'+
                       '<a href="####"><span aria-hidden="true"><i class="fa fa-times-circle"></i><span class="display-none">刪除</span></span></a></div>';
            $(this).before(html);
            $(".knowledge-block > a").click(function(){
              $(this).parent().remove();
            });

            $('#level2_' + _num).selectBoxIt({ autoWidth: false });
            $('#level3_' + _num).selectBoxIt({ autoWidth: false });
            $('#level4_' + _num).selectBoxIt({ autoWidth: false });

            queryLevelData($('.knowledge-block').last(), "", "", "", 1);
            $('.knowledge-block').find('select[name="level1"]').last().focus();
        }
      });
                            
      $("#newTopicInput").on("click keydown", function(e){
        if (e.type == 'click' || (event.type == 'keydown' && e.which == 13)) {
            var _num = $('.topic-block').length+1;
            var _topicDefaultSelectStr = $('#topicDefaultSelectStr').val();
            _topicDefaultSelectStr = _topicDefaultSelectStr.replace(/topic_/g, 'topic_'+_num); /* 因應無障礙判斷規則才加上的處理 */
            $(this).before(_topicDefaultSelectStr);
            disabledTopicOption($('.topic-block > select'));
            $('.topic-block').find('select').last().focus();
        }
      });
                            
      $("#newCoreliteracyInput").on("click keydown", function(e){
        if (e.type == 'click' || (event.type == 'keydown' && e.which == 13)) {
            var _num = $('.coreliteracy-block').length+1;
            var _coreliteracyDefaultSelectStr = $('#coreliteracyDefaultSelectStr').val();
            _coreliteracyDefaultSelectStr = _coreliteracyDefaultSelectStr.replace(/coreliteracy_/g, 'coreliteracy_'+_num); /* 因應無障礙判斷規則才加上的處理 */
            $(this).before(_coreliteracyDefaultSelectStr);
            disabledTopicOption($('.coreliteracy-block > select'));
            $('.coreliteracy-block').find('select').last().focus();
        }
      });
      $(document).on('click','.topic-block > a',function(){
        var parent = $(this).parent();
        parent.remove();
        disabledTopicOption($('.topic-block > select'));
      }).on('change', '.topic-block > select', function(){
        disabledTopicOption($('.topic-block > select'));
      }).on('click','.coreliteracy-block > a',function(){
        var parent = $(this).parent();
        parent.remove();
        disabledTopicOption($('.coreliteracy-block > select'));
      }).on('change', '.coreliteracy-block > select', function(){
        disabledTopicOption($('.coreliteracy-block > select'));
      }).on('click','.keyword-block > button',function(){
        var parent = $(this).parent();
        parent.remove();
      }).on('click','.knowledge-block > a',function(){
        var parent = $(this).parent();
        parent.remove();
      });
                            
      $('#saveEditBtn').on('click', function() {
        var descText = $('#descText').val().trim();
        var keywordBlocks = $('.keyword-block');
        var keywords = '';
        for (var i = 0; i < keywordBlocks.length; i++) {
             if (keywords.length != 0) {
                 keywords += ';';
             }
             keywords += $(keywordBlocks[i]).attr('data-val');
        }
        var hasError = false;

        var knowledgeBlocks = $('.knowledge-block');
        var knowledges = '';
        for (var i = 0; i < knowledgeBlocks.length; i++) {
             if (knowledges.length != 0) {
                 knowledges += ';';
             }
             var knowledgeBlock = $(knowledgeBlocks[i]);
             var level1Value = knowledgeBlock.children('[name="level1"]').val();
             var level2Value = knowledgeBlock.children('[name="level2"]').val();
             if (level1Value != '' && level2Value != '') {
                 knowledges += knowledgeBlock.children('[name="level1"]').val();
                 knowledges += '-';
                 knowledges += knowledgeBlock.children('[name="level1"]').find(":selected").attr('dis_id');
                 knowledges += ',';
                 knowledges += knowledgeBlock.children('[name="level2"]').val();
                 knowledges += ',';
                 if (knowledgeBlock.children('[name="level3"]').val() != '請選擇') {
                     knowledges += knowledgeBlock.children('[name="level3"]').val();
                 }
                 knowledges += ',';
                 if (knowledgeBlock.children('[name="level4"]').val() != '請選擇') {
                     knowledges += knowledgeBlock.children('[name="level4"]').val();
                 }
             } else if(level1Value != '' && level2Value == ''){
                 $('.error-msg.level-msg').html('知識架構最少須選擇領域、學習階段').show();
                   hasError = true;
                   break;
            }
        }
        //console.log(knowledges);

        var topicBlocks = $('.topic-block > select');
        var topics = '';
        for (var i = 0; i < topicBlocks.length; i++) {
             var topicValue = $(topicBlocks[i]).val();
             if (topicValue != '') {
                 if (topics.length != 0) {
                     topics += ';';
                 }
                 topics += topicValue;
             }
        }

        var coreliteracyBlocks = $('.coreliteracy-block > select');
        var coreliteracys = '';
        for (var i = 0; i < coreliteracyBlocks.length; i++) {
             var coreliteracyValue = $(coreliteracyBlocks[i]).val();
             if (coreliteracyValue != '') {
                 if (coreliteracys.length != 0) {
                     coreliteracys += ';';
                 }
                 coreliteracys += coreliteracyValue;
             }
        }
                                                      
        if (descText == '') {
            $('.error-msg.desc-msg').html('請填寫描述').show();
            hasError = true;
        }
        if (keywords == '') {
            $('.error-msg.keyword-msg').html('請加入關鍵字').show();
            hasError = true;
        }
/*
        if(knowledges == ''){
          $('.error-msg.level-msg').html('請加入知識架構').show();
          hasError = true;
        }
        if(topics == ''){
          $('.error-msg.topic-msg').html('請加入課題').show();
          hasError = true;
        }
        if(coreliteracys == ''){
          $('.error-msg.coreliteracy-msg').html('請加入核心素養').show();
          hasError = true;
        }
*/
        if (hasError) {
            return;
        } 
                                
        $.ajax({
          type: 'POST',
          url: '/common/updateResource.jsp',
          data:{
            resource_id: $('#resources_id').val(),
            desc: descText,
            keyword: keywords,
            level: knowledges,
            topic: topics,
            coreliteracy: coreliteracys,
            resource_type: $('#resourceTypeSelect').val(),
            activity_type: $('#activityTypeSelect').val()
          },
          timeout: 10000,
          dataType: 'json',
          async:false,
          success: function( msg ) {
            if (msg == '-1') {
                alert('發生錯誤');
            } else {
                mevent('CollaborativeEdit_UpdateSuccess',$('#title_input').val(),$('#resources_id').val());
                alert('更新成功');
                location.reload();
            }
          },
          error: function( request ) {}
        });
      });
      disabledTopicOption($('.topic-block > select'));
      disabledTopicOption($('.coreliteracy-block > select'));

      function disabledTopicOption(selects){
        selects.children('option').removeAttr('disabled');
        for (var i = 0; i < selects.length; i++) {
             var elem = $(selects[i]);
             var selectValue = elem.val();
             selects.children('option[value="' + selectValue + '"]').attr('disabled', 'disabled');
             var selectedOptionElem = elem.children('option[value="' + selectValue + '"]');
             selectedOptionElem.removeAttr('disabled');
             elem.val(selectValue);
        }
      }
      function getLevel(e){
        var currentLevel = e;
        var level = parseInt(currentLevel.attr('name').replace('level', ''));
        var parent = currentLevel.parent();
        var level1Id = "", level2Id = "",  level3Id = "", level4Id = "";
        if (level > 0) {
            level1Id = parseInt(parent.children('[name="level1"]').val());
            //level1Id -> 7
        }
        if (level > 1) {
            level2Id = parseInt(parent.children('[name="level2"]').val());
            //level1Id -> 24
        }
        if (level > 2) {
            level3Id = parseInt(parent.children('[name="level3"]').val());
            //level1Id -> 1343
        }
                           
        var defaultHtml = '<option value="">請選擇</option>';
                            
        if (level == 2 && level1Id != 7) {
            //query for level4
            parent.children('[name="level4"]').html(defaultHtml);
            queryLevelData(parent, level1Id, level2Id, '', 4);  /* 目前是操作第二層選單時即取出第四層, 領域為"自然科學", "藝術領域"時為空值 */
        }
        if (level != 3 || (level == 3 && level1Id == 7)) {
            var emptyLevel = 4;
            if (level == 2 &&level1Id != 7) {
                emptyLevel = 3;
            }
            for (let x = level + 1; x <= emptyLevel; x++) {
                 parent.children('[name="level'+x+'"]').html(defaultHtml);
            }
            queryLevelData(parent, level1Id, level2Id, level3Id, level + 1); /* 取出第三層, 領域為"綜合活動"時為空值 */
        }
        currentLevel.removeAttr('data-id');
      }

      function queryLevelData(parentElem, level1Id, level2Id, level3Id, queryLevel){
        let queryLevelId = parentElem.children('[name=level' + queryLevel + ']').attr('id');
        let groupChar = queryLevelId.substr(queryLevelId.length - 3);
        let checkElement = parentElem.children('[name=level' + queryLevel + ']');
        if (hasAttr(checkElement.attr('data-id'))){  // 第一次load畫面
            $.ajax({
                type: 'POST',
                url: '/common/kmLevel.jsp',
                data:{
                    level1Id: level1Id,
                    level2Id: level2Id,
                    level3Id: level3Id,
                    queryLevel: queryLevel,
                    op: "queryLevel",
                    version: "commonEdit"
                },
                timeout: 10000,
                dataType: 'json',
                async:false,
                success: function( msg ) {
                    let html = '<option value="" selected>請選擇</option>';
                    for(var i = 0; i < msg.length; i++){
                        html += '<option value="'+msg[i].id+'" data-value="'+msg[i].name+'" dis_id="'+msg[i].discipline_id+'">' + msg[i].name + '</option>';
                    }
                    var targetElem = $(parentElem).children('[name="level'+queryLevel+'"]');
                    targetElem.html(html);

                    //for initial
                    if (hasAttr(targetElem.attr('data-id'))) {
                        if (hasAttr(targetElem.attr('dis_id'))) {
                            if (targetElem.attr('dis_id') != "") { //新版課綱
                                targetElem.val(targetElem.attr('data-id'));
                                getLevel(targetElem);
                                targetElem.removeAttr('data-id');
                                                
                                let dis_id = targetElem.attr('dis_id');
                                targetElem.children('option').filter(function() {
                                    return $(this).attr('dis_id') == dis_id;
                                }).prop('selected', true);
                            } else if (targetElem.attr('dis_id') == "") {
                                targetElem.val(targetElem.attr('data-id'));
                                if (queryLevel != '4')
                                    getLevel(targetElem);
                                else
                                    targetElem.removeAttr('data-id');
                            }
                        } else {
                            targetElem.val(targetElem.attr('data-id'));
                            if (queryLevel != '4')
                                getLevel(targetElem);
                            else
                                targetElem.removeAttr('data-id');
                        }
                    }
                },
                error: function( request ) {}
            });
        } else {
            if (groupChar == 'def') {
                if (queryLevel == 2) {
                    $(parentElem).children('#level3_def').data('selectBox-selectBoxIt').remove();
                    $(parentElem).children('#level4_def').data('selectBox-selectBoxIt').remove();
                    $(parentElem).children('#level3_def').data('selectBox-selectBoxIt').add([{val: '請選擇', text: '請選擇'}]);
                    $(parentElem).children('#level4_def').data('selectBox-selectBoxIt').add([{val: '請選擇', text: '請選擇'}]);
                }

                $(parentElem).children('#level' + queryLevel + '_def').data('selectBox-selectBoxIt').remove();
                $(parentElem).children('#level' + queryLevel + '_def').data('selectBox-selectBoxIt').add([{val: '請選擇', text: '請選擇'}]);

                $.ajax({
                    type: 'POST',
                    url: '/common/kmLevel.jsp',
                    data:{
                        level1Id: level1Id,
                        level2Id: level2Id,
                        level3Id: level3Id,
                        queryLevel: queryLevel,
                        op: "queryLevel",
                        version: "commonEdit"
                    },
                    timeout: 10000,
                    dataType: 'json',
                    async:false,
                    success: function( msg ) {
                        for(var i = 0; i < msg.length; i++){
                            $(parentElem).children('#level' + queryLevel + '_def').data('selectBox-selectBoxIt').add([{val: msg[i].id, text: msg[i].name}]);
                        }
                    }, error: function( request ) { }
                });
            } else {
                let numChar = queryLevelId.substr(queryLevelId.length - 1);

                if (queryLevel == 1) {
                    $.ajax({
                        type: 'POST',
                        url: '/common/kmLevel.jsp',
                        data:{
                            level1Id: level1Id,
                            level2Id: level2Id,
                            level3Id: level3Id,
                            queryLevel: queryLevel,
                            op: "queryLevel",
                            version: "commonEdit"
                        },
                        timeout: 10000,
                        dataType: 'json',
                        async:false,
                        success: function( msg ) {
                            let html = '<option value="" selected>請選擇</option>';
                            for(var i = 0; i < msg.length; i++){
                                html += '<option value="'+msg[i].id+'" data-value="'+msg[i].name+'" dis_id="'+msg[i].discipline_id+'">' + msg[i].name + '</option>';
                            }
                            var targetElem = $(parentElem).children('[name="level'+queryLevel+'"]');
                            targetElem.html(html);
                        }, error: function( request ) { }
                    });
                } else {
                    if (queryLevel == 2) {
                        $('#level3_' + numChar).data('selectBox-selectBoxIt').remove();
                        $('#level4_' + numChar).data('selectBox-selectBoxIt').remove();
                        $('#level3_' + numChar).data('selectBox-selectBoxIt').add([{val: '請選擇', text: '請選擇'}]);
                        $('#level4_' + numChar).data('selectBox-selectBoxIt').add([{val: '請選擇', text: '請選擇'}]);
                    }

                    $('#level' + queryLevel + '_' + numChar).data('selectBox-selectBoxIt').remove();
                    $('#level' + queryLevel + '_' + numChar).data('selectBox-selectBoxIt').add([{val: '請選擇', text: '請選擇'}]);

                    $.ajax({
                        type: 'POST',
                        url: '/common/kmLevel.jsp',
                        data:{
                            level1Id: level1Id,
                            level2Id: level2Id,
                            level3Id: level3Id,
                            queryLevel: queryLevel,
                            op: "queryLevel",
                            version: "commonEdit"
                        },
                        timeout: 10000,
                        dataType: 'json',
                        async:false,
                        success: function( msg ) {
                            for(var i = 0; i < msg.length; i++){
                                $('#level' + queryLevel + '_' +　numChar).data('selectBox-selectBoxIt').add([{val: msg[i].id, text: msg[i].name}]);
                            }
                        }, error: function( request ) { }
                    });
                }
            }
        }
      }
      function hasAttr(attr){
        return typeof attr !== typeof undefined && attr !== false;
      }
  }

              ////產生qrcode
              //var qrcode_url = $('#ServiceURL').val() +'/rest/qrcode/resources?url=' + window.location.href;
              ////$('.qrcode').find('img').attr('src',qrcode_url);
              //let qrcode_title = $('.qrcode').attr('title');
              //$('.qrcode').append('<img class="img-fluid" src="' + qrcode_url + '" alt="教學資源 '+qrcode_title+' 網址">');
              
              /* header 預設的搜尋範圍, 只for"Web教學資源", 所以可以寫死 */
              $('#range').val('Web');
              $("#btn-range").html(function(i,t){
                  return t.replace($(this).text(), 'Web教學資源');
              });
              /* lightbox 會員登入訊息 */
              var _loginmsg = '請先<a href="/member/login/" title="大市集會員登入" class="a_link">登入</a>，才能使用此功能。';
              /* 按讚及取消讚 */
              $('button[act="edulike"]').on('click', function(){
                  let btn_edulike = $(this);
                  $.ajax({
                      url: '/common/good.jsp',
                      async: false,
                      dataType: "json",
                      data: {op:'setlike', rid:$('#resources_id').val()}, 
                      success: function(data) {
                          $('#count_good').text(data.good+data.like);
                          $('button[act="edulike"] > img').attr('src', '/images/'+(data.islike==false ? 'like-bt.png' : 'liked-bt.png')); //data.islike==true 表示已點讚, false 表示未點讚
                          
                          let cur_title = data.islike==false ? '給個讚' : '回收讚';
                          btn_edulike.attr('title', cur_title);
                          btn_edulike.find('img').attr('alt', cur_title).attr('title', cur_title);
                      }
                  });
              });
              /* 行動裝置瀏覽本頁才顯示line的分享鈕 */
              var ua = navigator.userAgent;
              if (ua.indexOf("iPhone")>0 || ua.indexOf("iPad")>0 || ua.indexOf("Android")>0) {
                  $('span[act="share2Line"]').show();
              }
              /* 檢查是否已登入大市集 */
              $('a[act="share2mail"], a[act="suggest"], a[act="harmful"], a[act="favorite"]').on('click', function(event){
                 event.preventDefault();
                 //var _item =  $(this).attr('id')=='share2mail' ? 'share' : $(this).attr('id'); 
                 let _item =  $(this).attr('act')=='share2mail' ? 'share' : $(this).attr('act');
                 if (membercheck()==true) { /* 檢查使用者目前是否已登入系統 */
                     $('#'+_item+'Modal').modal('show');
                 } else {
                     $('#'+_item+'Modal').modal('hide');
                     showMsgModal(_loginmsg, 'c');
                 }
              });
              /* 按下"加入追蹤"鈕 */
              $('a[act="follow"]').on('click', function(){
                 if (membercheck()==true) { /* 檢查使用者目前是否已登入系統 */
                     $.get('/common/follow.jsp', {rid:$('#resources_id').val(), 'status':$('a[act="follow"]').attr('act_status')}, function(d) {
                            if (d.code=="0") {
                                mevent('Resource_FollowCancel',$('#title_input').val(),$('#resources_id').val());
                                $('a[act="follow"]').css('background-color', '#2ca6e0').text('加入追蹤').attr('act_status', '');
                            } else if (d.code=="1") {
                                mevent('Resource_Follow',$('#title_input').val(),$('#resources_id').val());
                                $('a[act="follow"]').css('background-color', '#f5756b').text('取消追蹤').attr('act_status', '1');
                            }
                     }, 'json').fail(function() {});
                 } else {
                    showMsgModal(_loginmsg, 'c');
                 }
              });
              /* 開啟 分享-email light box 時 */
              $('#shareModal').on('show.bs.modal', function (event) { 
                  var maxinputlength = 300;//最大字數
                  var modal = $(this);
                  modal.find('#emailto, #sharetext').val('');// 清除所有欄位的值
                  $('#shareform input, #shareform textarea').fs_clear().closest('.form-group').fv_clear();// 清除input套上的顏色
                  modal.find('#sharetext').on("keyup", function() { // 輸入字數即時檢查
                      $(this).parent().fv_clear();
                      $(this).fs_clear().countLimit(maxinputlength);
                  });
                  /* 按下"傳送電子郵件"鈕 */
                  modal.find('.btn.btn-primary').on("click", function(){
                      if (modal.find('[name="emailto"]').checkEmail(true) == false)
                          return;
                      modal.find('#sharetext').val(modal.find('#sharetext').val().trim());
                      if ($('#shareform').validate()) {
                          $('#shareModal').modal('hide'); /* 先關閉目前自己 shareModal light box */
                          if (membercheck()==true) { /* 避免開啟本頁過久逾時, 按下"傳送電子郵件"鈕時仍再次檢查使用者目前是否已登入系統 */
                              $.post('/common/sendmail.jsp', $('#shareform').serialize(), function(d) {
                                  if (d.code == "1" ) {
                                      stats("sharem", $('#resources_id').val());
                                      mevent('SE',$('#title_input').val(),$('#resources_id').val());
                                      modal.find('.btn.btn-primary').off();
                                      showMsgModal('您所推薦分享的教學資源已寄出完成！', 'c');
                                  } else {
                                      showMsgModal('您所推薦分享的教學資源未能順利寄出，請再確認資料是否正確！');
                                  }
                              }, 'json').fail(function() {});
                          } else {
                              showMsgModal(_loginmsg, 'c');
                              $('#msgModal').modal('show');
                          }
                      }
                  })
              });
              // 開啟 問題回報/教學方法或心得 loght box 時 
              $('#suggestModal').on('show.bs.modal', function (event) {
                  var maxinputlength = 300;// 最大字數
                  var modal = $(this);
                  modal.find('#suggestform input, #suggestform textarea').val('');// 清除所有欄位的值
                  $('#suggestform input, #suggestform textarea').fs_clear().closest('.form-group').fv_clear();// 清除input套上的顏色
                  modal.find('#message').on("keyup", function() { // 輸入字數即時檢查
                      $(this).parent().fv_clear();
                      $(this).fs_clear().countLimit(maxinputlength);
                  });
          if ($('#session_memberid').val()>-1) { // 使用者已登入時才帶入預設值 
                  modal.find('#fullname').val($('#username').val());
                  modal.find('#email').val($('#useremail').val());
                  modal.find('#role').val($('#userunit').val());
          }
                  /* 按下"送出"鈕 */
                  modal.find('.btn.btn-primary').on("click", function(){ 
                     if (modal.find('[name="email"]').checkEmail(true) == false)
                         return;
                     modal.find('#message').val(modal.find('#message').val().trim());
                     modal.find('#faqtype').val('10');
                     if ($('#suggestform').validate()) {
                         $('#suggestModal').modal('hide'); /* 先關閉目前自己 suggestModal light box */
                         if (membercheck()==true) { /* 避免開啟本頁過久逾時, 按下"送出"鈕時仍再次檢查使用者目前是否已登入系統 */
                             if (modal.find("#title").val().indexOf("resources_id") ==-1) {
                                 modal.find("#title").val("(resources_id:"+$('#resources_id').val()+") "+modal.find("#title").val());
                             }
                             modal.find('input[name="fbtype"]').val('web_suggest');//網站內容錯誤回報寄信專用變數
                             modal.find('input[name="restitle"]').val($('#title').val());//網站內容錯誤回報寄信專用變數
                             $.post('/about/contact_func.jsp', $('#suggestform').serialize(), function(d) {
                                 modal.find('.btn.btn-primary').off();
                                 if (d.status == true) {
                                     $('#actSuccess').val("suggest");
                                     showMsgModal('感謝您的參與，我們已收到您的回報訊息！<br>我們將盡快處理您所回報的問題，並將回覆訊息透過系統直接寄送至您的電子信箱中。');
                                 } else if (d.status == false) {
                                     showMsgModal('系統發生錯誤！<br>很抱歉，系統發生錯誤！我們會盡快處理，請稍號再使用問題回報功能。');
                                 }
                             }, 'json').fail(function() {});
                         } else {
                             showMsgModal(_loginmsg, 'c');
                             $('#msgModal').modal('show');
                         }
                     }
                  });
              });
              /* 開啟檢舉教學資源 lightbox 時 */
              $('#harmfulModal').on('show.bs.modal', function (event) {
                  var maxinputlength = 300;// 最大字數
                  var modal = $(this);
                  modal.find('#harmfultext').val('');
                  modal.find('[name="harmful_id"]').prop('checked', false);// 清除所有欄位的值
                  $('#harmfulform input, #harmfulform textarea').fs_clear().closest('.form-group').fv_clear();// 清除input套上的顏色
                  modal.find('#harmfultext').on("keyup", function() { // 輸入字數即時檢查
                      $(this).parent().fv_clear();
                      $(this).fs_clear().countLimit(maxinputlength);
                  });
                  /* 按下"檢舉"鈕時 */
                  modal.find('.btn.btn-primary').on("click", function(){
                      modal.find('#harmfultext').val(modal.find('#harmfultext').val().trim());
                      if ($('#harmfulform').validate()) {
                          $('#harmfulModal').modal('hide'); /* 先關閉目前自己 harmfulModal light box */
                          if (membercheck()==true) { /* 避免開啟本頁過久逾時, 按下"檢舉"鈕時仍再次檢查使用者目前是否已登入系統 */
                              $.post('/common/harmful.jsp', $('#harmfulform').serialize(), function(d) {
                                  if (d.code == "1") {
                                      mevent('H',$("#harmfultext").val(), $('#resources_id').val());
                                      $('#actSuccess').val("harmful"); 
                                      $('#redirecturl').val("/web/");//回到web首頁
                                      showMsgModal($('#harmfulMsg').val());
                                  } else {
                                      showMsgModal('未順利送出檢舉處理,請再確認資料是否正確！');
                                  }
                              }, 'json').fail(function() {});
                          } else {
                              showMsgModal(_loginmsg, 'c');
                              $('#msgModal').modal('show');
                          }
                      }
                  });
              });
              /* 收藏 lightbox 相關處理 為確實載入module_favoritetree.jsp 才能取得dom物件, 改用'shown.bs.modal'處理 */
              $('#favoriteModal').on('shown.bs.modal', function (event) {
                  var modal = $(this);
                  modal.find('.modal-body').load("/common/module_favoritetree.jsp?rid="+$('#resources_id').val());
              });
              /* 資源(縮圖)為站內資源進行檔案下載; 外站連結開新視窗連至該網站 */
              if ($("#res_img").length > 0) {
                  $("#res_img").on("click", function(event){
                     var src = $(this).find(".pic_mini_share img").attr('src');
                     if (src.indexOf("icon_share")>0) {
                         event.preventDefault();
                         stats("urlclick",$('#resources_id').val());
                         checkoutgoing($(this).find(".pic_mini_share").attr('u'));//連到外站該筆資源
                     } else if (src.indexOf("icon_file")>0) {
                         if (membercheck()==true) { /* 檢查使用者目前是否已登入系統 */
                             stats("download",$('#resources_id').val());
                         } else {
                             event.preventDefault();
                             showMsgModal(_loginmsg, 'c');
                             $('#msgModal').modal('show');
                         }
                     }
                     mevent($('#log_type').val(),$('#filename').val(),$('#fileid').val());
                  }).on('focus', function(){/* 資源圖示, 動態套無障礙橘框效果 */
                     $(this).find('img').first().addClass("accessibility-line2");
                  }).on('blur', function(){
                     $(this).find('img').first().removeClass("accessibility-line2");
                  });
              }
              /* 按下 fb, twitter, line 分享時, 寫入log */
              $('a[act="tofacebook"], a[act="totwitter"], a[act="toline"]').on('click', function(){
                  mevent('S'+$(this).attr("shtype"),$('#title_input').val(),$('#resources_id').val());
              });
              
          if ($('#fileStr').val().length>0) { 
              /* 按下資源網址, 進行站內檔案下載時相關處理 */
              $("#files a").on("click", function(event){
                 event.preventDefault();
                 if (membercheck()==true) { /* 檢查使用者目前是否已登入系統 */
                     window.location.href = $(this).attr('href');
                     stats("download",$('#resources_id').val());
                 } else {
                     showMsgModal(_loginmsg, 'c');
                 }
              });

          }
          if ($('#fileUStr').val().length>0) { 
              /* 按下資源網址, 連至外站資源網站時相關處理 */
              $("#url a").on("click",function(event){
                 event.preventDefault();
                 if (membercheck()==true) { /* 檢查使用者目前是否已登入系統 */
                     stats("urlclick",$('#resources_id').val());
                     checkoutgoing($(this).attr('href'));
                 } else {
                     showMsgModal(_loginmsg, 'c');
                 }
              });
          } 
              /* 訊息lightbox */
              $('#msgModal').on('show.bs.modal', function (event) {
                  $(this).find('.btn.btn-primary').on("click", function(){      /* 在關閉本訊息lightbox後, 仍有特定動線時才會執以下 if 處理 */
                      if ($('#actSuccess').val()=="suggest" || $('#actSuccess').val()=="editres") {       /* "問題回報/開啟教學方法或心得", "共筆更新教學資源" 完成時, 重新reload本資源頁面 */
                          window.location.reload();
                      } else if ($('#actSuccess').val()=="harmful") {
                          window.location = $('#redirecturl').val(); /* "檢舉"完成時, $('#redirecturl')內容為 "/ebook/", 將畫面導回到ebook首頁 */
                      } else if ($('#actSuccess').val()=="outgoing") {
                          //var newwin = window.open();
                          //newwin.location = $('#redirecturl').val();
                          
                          window.open($('#redirecturl').val());      /* 點"外站連結", 連到外站該筆資源 */
                      }
                  });
              });
              /* Modal關閉時的背景處理 */
              $('#suggestModal, #shareModal, #harmfulModal, #favoriteModal, #msgModal').on('hidden.bs.modal', function(event) {
                  if ($(this).attr('id')=='msgModal') {              /* msgModal還原為初始值 */
                      $('#msgtitle').empty().html('提醒您');
                      $('#msgcancel').hide();
                      $('#actSuccess, #redirecturl').val("");
                      if ($('#msgbody').hasClass('text-center')==true) {
                          $('#msgbody').removeClass('text-center');  /* 只是視覺效果處理, 文字區域還原為預設置左 */
                      }
                      if ($(this).find('div[role="document"]').hasClass('modal-sm')==true) {
                          $(this).find('div[role="document"]').removeClass('modal-sm');  /* 只是視覺效果處理, modal還原中型的大小 */
                      }
                  } else if ($(this).attr('id')=='favoriteModal') {  /* 移除 Ext js 自己加上來的 id及css效果 */
                      /* <html id="ext-element-2" style="overflow: auto;" lang="zh-Hant-TW"> */
                      $('html').removeAttr('id').removeAttr("style");
                      /* <body style="padding-right: 17px;" class="modal-open x-body x-gecko" id="ext-element-1"> */
                      $('body').removeAttr('id').removeClass('x-body').removeClass('x-gecko');
                      $(event.currentTarget).off();                  /* 避免 bootstrap 每次開啟 light box 時重建 Ext js 物件, light box 關閉時即 unbind() 處理 */
                  }
                  $(this).find(".btn.btn-primary").off();      // Button that triggered the modal 
              });

              $(".img-preview").on("click",function(event){
                  var image = $(this).closest('div').find('img');
                  var url = image.attr('url');
                  image.attr('src', url);
                  const viewer = new Viewer(image[0], {
                      navbar: false, toolbar: false, keyboard: false, movable:false, title:false,
                      viewed: function() {
                          $('.viewer-close').attr('tabindex', 0).focus();
                      },
                      hidden: function() {
                          $('img[class="viewer-transition"]').attr('title', '');
                      }
                  });
                  
                  $('body').on('focus', '.viewer-close', function(){
                     $('.viewer-close').addClass('accessibility-line');
                  }).on('blur', '.viewer-close', function(){
                     $('.viewer-close').removeClass('accessibility-line');
                  }).on('keypress', '.viewer-close', function(){
                     viewer.hide();
                  });
                  $(document).on('keyup',function(evt) {
                     if (evt.keyCode == 27) {
                         if ($('.viewer-container').is(':visible')) {
                             viewer.hide();
                         }
                     }
                  });
                  
                  image.click();
              });
              
              let curScrollTop = 0; //記錄按下展開"詳細內容"時, 點擊的dom物件當時的Y值, 作為收合時捲回位置的參考
              $('.more-btn, .content-display-area').on('click', function(e) {
                if ($('.more-btn').is(":visible")) {
                    e.preventDefault();
                    if ($('.res_desc').hasClass('display-area-all')) {
                        $('.res_desc').removeClass('display-area-all');
                        $('.more-btn').attr('title', '顯示完整內容').html('顯示完整內容<span class="chevron-arrow-down"></span>');
                        $('#info_table').hide();
                        if (curScrollTop>0) {
                            $('html,body').animate({ // 有些瀏覽器只支援html，有些只支援body 所以兩個都寫進去
                              scrollTop: curScrollTop,
                            }, 0);
                        }
                    } else {
                        $('.res_desc').addClass('display-area-all');
                        $('.more-btn').attr('title', '顯示部份內容').html('顯示部份內容<span class="chevron-arrow-up"></span>');
                        $('#info_table').show();
                        curScrollTop = $(window).scrollTop();
                    }
                }
              });
          });
          /* 套入連到外站該筆資源的 light box 訊息 */
          function checkoutgoing(gotourl){
              var r = new RegExp("^" + $('#ServerName').val());
              if (!r.test(gotourl)) {
                  $('#msgtitle').empty().html('即將連往外部網站');
                  $('#msgcancel').show();
                  $('#actSuccess').val("outgoing"); 
                  $('#redirecturl').val(gotourl);//連到外站該筆資源
                  showMsgModal('此超連結是由上傳者提供，您點選後將離開 <span class="color_dred">教育大市集</span> 前往外部網站，本網站無法擔保外部網站內容的妥適性。若您發現有不適當或不安全的網站連結，請利用 <span class="color_dred">問題回報</span> 告知系統管理員。');
              } else {
                  if (membercheck()==false) { /* 檢查使用者目前是否已登入系統 */
                      event.preventDefault();
                      showMsgModal(_loginmsg, 'c');
                      $('#msgModal').modal('show');
                  }
              }
          }
          /* 設定 light box 內文字訊息並顯示 light box, _str:必填, 要顯示的訊息文字, 可直接傳含 html 的文字; _align:選填, 填入c表示文字置中 */
          function showMsgModal(_str, _align) {
              if (_str!='') {
                  $('#msgbody').empty().html(_str);
                  if (_align=='c') {
                      $('#msgbody').addClass('text-center');
                  }
                  $('#msgModal').modal('show');
              }
          }
          /* 檢查使用者目前是否已登入系統 */
          function membercheck(){
              var _check = false;
              $.ajax({
                  url: '/common/checklogins.jsp',
                  async: false,
                  dataType: "json",
                  success: function(data) {
                      _check = data.check; /* 格式: {"check": true or false } */
                  }
              });
              return _check;
          }
          function resizeText(multiplier) {
              $('h2, p').not('header *, footer *').css("font-size", multiplier*1.25 + "rem");
              $('th, td, ul, span, a, #change_form_size, #change_form_size1, .sns-info div, .res_desc, #pediavideo3 div').not('header *, footer *').css("font-size", multiplier*1 + "rem");
              $('div[act="res_title"], #info_table div, .modal table, .modal div, modal h5, .knowledge-block label').not('header *, footer *').css("font-size", multiplier*1 + "rem");
              $('div[sub_url]').prev().css("font-size", multiplier*1 + "rem");
              //$('header div div ul li a').css("font-size", multiplier*1.125 + "rem");
              $('header ul li a').not('header *, footer *').css("font-size", multiplier*1.125 + "rem");
              $('header div div div a').not('header *, footer *').css("font-size", multiplier*1 + "rem");
              //$('footer div ul li ul li a, main section div div div h2 span').css("font-size", multiplier*0.9375 + "rem");
              //$('footer div ul li a, main section div div div h2 span').css("font-size", multiplier*0.9375 + "rem");
              $('footer div article p').not('header *, footer *').css("font-size", multiplier*1 + "rem");
              $('main section div div div h2 span').not('header *, footer *').css("font-size", "1rem"); //從75%改為固定1rem
              $('header .search-content ul li a').not('header *, footer *').css("font-size", "1.625rem");//讓header不受縮放影響
              if (multiplier==1.125) {   //normal Font
                  $('h2').not('header *, footer *').css("font-size", "1.25rem");
                  $('p').not('header *, footer *').css("font-size", multiplier*1.25 + "rem");
                  $('footer div ul li a').not('header *, footer *').css("font-size", multiplier*0.9375 + "rem");
                  $('.title p, #commentitle p').not('header *, footer *').css("font-size", "1.25rem");
                  $('#sendcomment').not('header *, footer *').css("font-size", "1rem");
              } else {
                  if (multiplier>1.125) { //plus Font
                      //$('header .search-content ul li a').css("font-size", multiplier*1.15 + "rem");
                      $('#sendcomment').not('header *, footer *').css("font-size", "1.5rem");
                  } else {               //less Font
                      $('#sendcomment').not('header *, footer *').css("font-size", "0.91rem");
                      //$('header .search-content ul li a').css("font-size", "1.25rem");
                  }
                  $('h2, p').not('header *, footer *').css("font-size", multiplier*1.25 + "rem");
                  $('footer div ul li a').not('header *, footer *').css("font-size", multiplier*0.9375 + "rem");
              }
          }

          function filePreview(dataUrl, dataName, dataType){
              $('#docViewer').children().hide();
              
              $('#loadingMessage').show();
              mevent('FilePreview',dataUrl,$('#resources_id').val());
              if (dataType == 'pdf') {
                  if ($('#docViewer > iframe').length != 0)
                      $('#docViewer > iframe').remove();
                  $('#docViewer').append('<iframe class="doc-viewer display-none" id="docview"  title="預覽檔案內容" width="100%" height="100%" frameborder="0" allowfullscreen webkitallowfullscreen sandbox="allow-scripts allow-same-origin"><span class="display-none">預覽檔案內容</span></iframe>');
                  $('#docViewer > iframe').attr('src', '/ViewerJS/#..'+dataUrl);
                  $('#docViewer > iframe').on('load', function () {
                      $('#loadingMessage').hide();
                      $('#docViewer > iframe').show();
                  });
              } else if (dataType == 'image') {
                  var downloadingImage = new Image();
                  downloadingImage.onload = function(){
                      $('#loadingMessage').hide();
                      $('#imgContent > img').attr('src', this.src);
                      $('#imgContent, #imgContent > img').show();
                  };
                  downloadingImage.src = dataUrl;
              }
              
              $('#modalTitle').text(dataName);
              $('#docModal').modal('show');
          }