up

2026-09-17 13:44:24 +08:00 · 2026-09-17 13:44:24 +08:00 · 86917ef716
parent c5d8bb1cdb
commit 86917ef716
9 changed files with 262 additions and 33 deletions
--- a/assets/javascripts/app.js
+++ b/assets/javascripts/app.js
@ -2126,27 +2126,68 @@ $(function() {
  });
  //rucaptcha-image
  $(document).ready(function () {
-      $('.rucaptcha-image').removeAttr('onload');
-    
-      // 檢查是否已插入過
-      if (!$('#captcha_audio').length) {
-        const audioButton = $(`
-          <button 
-            title="播放驗證碼語音" 
-            type="button" 
-            onclick="document.getElementById('captcha_audio').play();" 
-            class="fas fa-volume-up" 
-            aria-label="播放驗證碼語音"
-            role="button"
-            style="font-size: 1.5em; color: #333; cursor: pointer; border: 2px solid #333; padding: 0.2em;">
-            <span class="sr-only">播放驗證碼語音</span>
-          </button>
-        `);
-    
-        const audio = $('<audio id="captcha_audio" src="/rucaptcha/?format=wav&amp;locale=zh_tw"></audio>');
-    
-        $('.rucaptcha-image').after(audioButton, audio);
+      function fixCaptchaImgA11y() {
+          setTimeout(function () {
+              // ✅ 先確認頁面上真的有驗證碼圖片，再往下執行
+              if (!$('.rucaptcha-image').length) return;
+
+              var pageLang = ($('html').attr('lang') || 'zh-Hant').toLowerCase();
+              var isEn = pageLang.startsWith('en');
+
+              var i18n = {
+                  alt:      isEn ? 'Captcha image, click to refresh' : '驗證碼圖片，點擊可更換',
+                  title:    isEn ? 'Captcha image, click to refresh' : '驗證碼圖片，點擊可更換',
+                  label:    isEn ? 'Click to refresh captcha'        : '點擊更換驗證碼',
+                  audioBtn: isEn ? 'Play captcha audio'              : '播放驗證碼語音',
+                  audioSrc: isEn ? '/rucaptcha/?format=wav&locale=en' : '/rucaptcha/?format=wav&locale=zh_tw'
+              };
+
+              var $captchaImg = $('.rucaptcha-image');
+
+              // ✅ 移除 onload
+              $captchaImg.removeAttr('onload');
+
+              // ✅ 補上有意義的 alt、role、tabindex、title
+              $captchaImg.attr({
+                  'alt':        i18n.alt,
+                  'title':      i18n.title,
+                  'role':       'button',
+                  'tabindex':   '0',
+                  'aria-label': i18n.label
+              });
+
+              // ✅ Enter / Space 觸發更換驗證碼
+              $captchaImg.off('keydown.captchaA11y').on('keydown.captchaA11y', function (e) {
+                  if (e.which === 13 || e.which === 32) {
+                      e.preventDefault();
+                      $(this).trigger('click');
+                  }
+              });
+
+              // ✅ 插入語音按鈕和 audio（若還沒插入過）
+              if (!$('#captcha_audio').length) {
+                  var $audioButton = $(
+                      '<button ' +
+                          'title="' + i18n.audioBtn + '" ' +
+                          'type="button" ' +
+                          'onclick="document.getElementById(\'captcha_audio\').play();" ' +
+                          'class="fas fa-volume-up" ' +
+                          'aria-label="' + i18n.audioBtn + '" ' +
+                          'role="button" ' +
+                          'style="font-size: 1.5em; color: #333; cursor: pointer; border: 2px solid #333; padding: 0.2em;">' +
+                          '<span class="sr-only">' + i18n.audioBtn + '</span>' +
+                      '</button>'
+                  );
+
+                  var $audio = $('<audio id="captcha_audio" src="' + i18n.audioSrc + '"></audio>');
+
+                  $captchaImg.after($audioButton, $audio);
+              }
+
+          }, 500);
      }
+
+      fixCaptchaImgA11y();
  });

  //萬用表格searchbtn2
@ -3348,4 +3389,178 @@ $(document).ready(function () {

    fixBannerA11yByLang();
  });
+//bannercontrolplay
+$(function() {
+    function fixBannerPlayPauseA11y() {
+        setTimeout(function() {
+            var pageLang = ($('html').attr('lang') || 'zh-Hant').toLowerCase();
+            var isEn = pageLang.startsWith('en');
+
+            var i18n = {
+                resume: isEn ? 'Play' : '繼續播放',
+                pause:  isEn ? 'Pause' : '暫停播放'
+            };
+
+            $('.w-ba-banner').each(function() {
+                var $banner = $(this);
+                var $controlplay = $banner.find('.controlplay');
+
+                // ✅ 把 radiogroup 改為一般容器
+                $controlplay.removeAttr('role aria-label');
+
+                // ✅ 繼續播放按鈕
+                var $resume = $banner.find('.resume-slide');
+                $resume
+                    .attr('role', 'button')
+                    .attr('aria-pressed', $resume.hasClass('active') ? 'true' : 'false')
+                    .attr('aria-label', i18n.resume)
+                    .attr('title', i18n.resume)
+                    .removeAttr('aria-checked aria-live');
+
+                // ✅ 暫停播放按鈕
+                var $pause = $banner.find('.pause-slide');
+                $pause
+                    .attr('role', 'button')
+                    .attr('aria-pressed', $pause.hasClass('active') ? 'true' : 'false')
+                    .attr('aria-label', i18n.pause)
+                    .attr('title', i18n.pause)
+                    .removeAttr('aria-checked aria-live');
+
+                // ✅ 點擊後同步 aria-pressed
+                $resume.off('click.bannerA11y').on('click.bannerA11y', function() {
+                    $resume.attr('aria-pressed', 'true');
+                    $pause.attr('aria-pressed', 'false');
+                });
+
+                $pause.off('click.bannerA11y').on('click.bannerA11y', function() {
+                    $pause.attr('aria-pressed', 'true');
+                    $resume.attr('aria-pressed', 'false');
+                });
+            });
+
+        }, 800);
+    }
+
+    fixBannerPlayPauseA11y();
+});
+//會員tab邏輯
+$(document).ready(function () {
+    setTimeout(function () {
+      $('.dtr-control').removeAttr('tabindex');
+    }, 500);
+});
+function fixTabKeyboardNav() {
+    setTimeout(function () {
+        var $tablist = $('.member-plugins[role="tablist"]');
+        var $tabs = $tablist.find('a[role="tab"]');
+
+        // 初始化 roving tabindex 和 aria-selected
+        $tabs.each(function (i) {
+            var $tab = $(this);
+            var isActive = $tab.closest('li').hasClass('active');
+            $tab.attr({
+                'tabindex': isActive ? '0' : '-1',
+                'aria-selected': isActive ? 'true' : 'false'
+            });
+        });
+
+        // 方向鍵切換頁籤
+        $tabs.on('keydown', function (e) {
+            var $current = $(this);
+            var currentIndex = $tabs.index($current);
+            var $target;
+
+            if (e.keyCode === 39 || e.keyCode === 40) {
+                // 右鍵或下鍵：下一個
+                e.preventDefault();
+                $target = $tabs.eq((currentIndex + 1) % $tabs.length);
+            } else if (e.keyCode === 37 || e.keyCode === 38) {
+                // 左鍵或上鍵：上一個
+                e.preventDefault();
+                $target = $tabs.eq((currentIndex - 1 + $tabs.length) % $tabs.length);
+            } else if (e.keyCode === 36) {
+                // Home：第一個
+                e.preventDefault();
+                $target = $tabs.first();
+            } else if (e.keyCode === 35) {
+                // End：最後一個
+                e.preventDefault();
+                $target = $tabs.last();
+            } else {
+                return;
+            }
+
+            // 更新 roving tabindex 和 aria-selected
+            $tabs.attr({ 'tabindex': '-1', 'aria-selected': 'false' });
+            $target.attr({ 'tabindex': '0', 'aria-selected': 'true' });
+            $target.focus().trigger('click');
+        });
+
+        // 點擊頁籤時同步更新狀態
+        $tabs.on('click', function () {
+            $tabs.attr({ 'tabindex': '-1', 'aria-selected': 'false' });
+            $(this).attr({ 'tabindex': '0', 'aria-selected': 'true' });
+        });
+
+    }, 500);
+}
+$(document).ready(function () {
+    fixTabKeyboardNav();
+});
+function removeBareUrlLinks() {
+  setTimeout(function() {
+    $('.dataTables_wrapper a').each(function() {
+      var $a   = $(this);
+      var text = $a.text().trim();
+
+      if (/^https?:\/\//i.test(text)) {
+        $a.replaceWith(text);
+      }
+    });
+  }, 500);
+}
+$(document).ready(function() {
+  removeBareUrlLinks();
+});
+//麵包屑無障礙
+$(document).ready(function () {
+    var pageLang = ($('html').attr('lang') || 'zh-Hant').toLowerCase();
+    var isEn = pageLang.startsWith('en');
+
+    var navLabel = isEn ? 'Breadcrumb navigation' : '麵包屑導覽';
+
+    $('.widget-breadcrumb .breadcrumb li:last-child a').attr('aria-current', 'page');
+
+    $('.widget-breadcrumb .breadcrumb').each(function () {
+        if (!$(this).closest('nav').length) {
+            $(this).wrap('<nav aria-label="' + navLabel + '"></nav>');
+        }
+    });
+});
+//gallery view
+function fixGalleryViewLinkA11y() {
+  $('a.btn.view').each(function () {
+    var $a = $(this);
+
+    $a.find('span').each(function () {
+      var $span = $(this);
+
+      // 避免重複處理
+      if ($span.hasClass('sr-only')) return;
+
+      var style = $span.attr('style') || '';
+      if (style.indexOf('display: none') !== -1 || style.indexOf('display:none') !== -1) {
+        $span.removeAttr('style').addClass('sr-only');
+      }
+    });
+
+    $a.find('i, svg').attr('aria-hidden', 'true');
+  });
+}
+$(document).ready(function () {
+  // 比 fixAccessibilityAll 的 800ms 晚，確保最後執行
+  setTimeout(fixGalleryViewLinkA11y, 2000);
+});
+
+
 }(jQuery, window));
--- a/assets/stylesheets/template/base/_variables.scss
+++ b/assets/stylesheets/template/base/_variables.scss
@ -16,8 +16,8 @@ $theme-red: #d20001;
 $theme-blue: #003d7e;

 $theme-color-main: #333333;
-$theme-color-second:#4e7a4e;
-$theme-color-third: #4e7a4e;
+$theme-color-second:#406d40;
+$theme-color-third: #406d40;
 $theme-color-green: #32D9C3;
 $theme-color-hover:#0e7713;

--- a/assets/stylesheets/template/modules/ad_banner.scss
+++ b/assets/stylesheets/template/modules/ad_banner.scss
@ -35,6 +35,7 @@ ul.button-mid{
    width: 100%;
    height: 0;
    top: 50%;
+    z-index: 201;
 }
 .banner-pager .active-slide button{
  background: $theme-color-second!important;
@ -44,6 +45,7 @@ ul.button-mid{
    width: 100%;
    height: 0;
    top: 50%;
+    z-index: 201;
 }
 .next-button, .prev-button {
    cursor: pointer;
--- a/assets/stylesheets/template/modules/archives.scss
+++ b/assets/stylesheets/template/modules/archives.scss
@ -7,6 +7,11 @@
 //
 // Widget
 // ## gerenral styles
+.widget-archive-files-item, .i-archive-files-item, .i-archive__file-name {
+    display: block;
+    white-space: normal;
+    padding: 0.5em;
+}
 .archive-description {
    color: #616161!important;
 }
--- a/assets/stylesheets/template/modules/menu.scss
+++ b/assets/stylesheets/template/modules/menu.scss
@ -492,6 +492,18 @@
          margin-left: 0.5rem;
        }
      }
+      @media (max-width: 768px){
+        & > a {
+          color:#333;
+        }
+        &:hover {
+          background-color:transparent ;
+          a{
+            color: #333;
+          }
+        }
+      
+      }
    }

    @media (min-width: $screen-sm) {
--- a/home/index.html.erb
+++ b/home/index.html.erb
@ -81,13 +81,7 @@
      </div>

      <div class="contentwrap2">
-       <div class="marqueeken">
-                    <div class="scroll">
-                        <div class="text1">
-                            NATIONAL FORMOSA UNIVERSITY
-                        </div>
-                    </div>
-       </div>
+
          <div class="layout-content-inner container">
            <div class="column row">
              <section class="two-column col-sm-9" data-pp="39"></section>
--- a/modules/archive/archive_index13.html.erb
+++ b/modules/archive/archive_index13.html.erb
@ -15,8 +15,9 @@
            <span data-list="statuses" data-level="2">
              <span class="label status {{status-class}}">{{status}}</span>
            </span>
-            <a href="{{archive-file-url}}" target="{{target}}" title="{{archive-title}}">
-              {{archive-title}}            <span class="i-archive-files-list" data-list="files" data-level="2">
+            {{archive-title}}  
+            <a href="{{archive-file-url}}" target="{{target}}" title="{{archive-title}}">     
+              <span class="i-archive-files-list" data-list="files" data-level="2">
              <span class="i-archive-files-item">
                <span class="label label-primary {{file-type}}">{{file-type}}</span>
              </span>
--- a/modules/web_resource/web_res_index1.html.erb
+++ b/modules/web_resource/web_res_index1.html.erb
@ -4,7 +4,7 @@
  </h3>
  <ul class="list-unstyled" data-list="web_link" data-level="0">
    <li class="index-content">
-      <a class="index-content-title" href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">
+      <a class="" href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">
        <div class="link-img-wrap{{display_image}}">
          <img src="{{img_src}}" alt="{{img_description}}">
        </div>
--- a/modules/web_resource/web_res_index2.html.erb
+++ b/modules/web_resource/web_res_index2.html.erb
@ -4,7 +4,7 @@
  </h3>
  <ul class="list-unstyled" data-list="web_link" data-level="0">
    <li class="index-content col-md-4 col-sm-4">
-      <a class="index-content-title" href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">
+      <a class="" href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">
        <div class="link-img-wrap{{display_image}}">
          <img src="{{img_src}}" alt="{{img_description}}">
        </div>