http://stdusfc.cn/skin/static_5213/js/index.js

1
2function updateStructure() {
3    const width = window.innerWidth;
4    const structureA = document.getElementById('structureA');
5    const structureB = document.getElementById('structureB');
6    const contentToMove = document.getElementById('contentToMove');
7    if (width < 1200) {
8        // 如果宽度小于 1200px，移动内容到结构 B  
9        // if (contentToMove.parentElement === structureB) {  
10        structureA !== null && contentToMove !==null && structureA.appendChild(contentToMove);
11        // }  
12    } else {
13        // 如果宽度大于等于 1200px，恢复初始结构  
14        // if (contentToMove.parentElement === structureA) {  
15        structureB !== null && contentToMove !==null && structureB.appendChild(contentToMove);
16        // }  
17    }
18}
19// 监听页面加载和窗口调整  
20window.addEventListener('load', updateStructure);
21window.addEventListener('resize', updateStructure);
22let currentIndex = 0;
23const items = document.querySelectorAll('.sp_carousel_item');
24const totalItems = items.length;
25let intervalId;
26function showSlide(index) {
27    if (index < 0) {
28        currentIndex = totalItems - 1;
29    } else if (index >= totalItems) {
30        currentIndex = 0;
31    } else {
32        currentIndex = index;
33    }
34
35    const offset = -currentIndex * 100;
36    document.querySelector('.sp_carousel_inner').style.transform = `translateX(${offset}%)`;
37
38    // 重置自动轮播
39    resetAutoPlay();
40}
41
42function nextSlide() {
43    showSlide(currentIndex + 1);
44}
45
46function prevSlide() {
47    showSlide(currentIndex - 1);
48}
49
50function resetAutoPlay() {
51    clearInterval(intervalId);
52    intervalId = setInterval(nextSlide, 2000);
53}
54
55// 初始化自动轮播
56resetAutoPlay();
57
58
59
60// 天气广播逻辑（支持模板数组，容错解析非标准 JSON）
61(function () {
62    var ticker = document.getElementById('sp_weather_ticker');
63    if (!ticker) return;
64    var track = document.getElementById('wt-track');
65
66    // 解析灵活的数组输入：JSON 或 非标准 JS 字面量（单引号、未加引号的键）
67    function tryParseFlexibleArray(src) {
68        if (!src) return null;
69        if (Array.isArray(src)) return src;
70        var s = String(src).trim();
71        // 如果被整体包裹在单/双引号里，去掉外层引号
72        if ((s.charAt(0) === '"' && s.charAt(s.length - 1) === '"') || (s.charAt(0) === "'" && s.charAt(s.length - 1) === "'")) {
73            s = s.slice(1, -1).trim();
74        }
75        try { return JSON.parse(s); } catch (e) { }
76
77        // 处理常见非标准格式：把单引号改为双引号，给键名加引号
78        try {
79            s = s.replace(/&quot;/g, '"').trim();
80            // 给键名加引号（匹配 { key: 或 , key:）
81            s = s.replace(/([\{,\s])(\w+)\s*:/g, function (_, a, b) { return a + '"' + b + '":'; });
82            // 把单引号中的内容替换为双引号
83            s = s.replace(/'(.*?)'/g, function (_, inner) { return '"' + inner.replace(/"/g, '\\"') + '"'; });
84            s = s.replace(/,\s*([\]}])/g, '$1');
85            return JSON.parse(s);
86        } catch (e) { return null; }
87    }
88
89    // 读取来源：优先 window.WEATHER_ITEMS（数组 或 字符串），其次模板标签 [!--weather_items--]，最后 ticker.title
90    var items = JSON.parse(ticker.title).data
91    if (window.WEATHER_ITEMS) items = tryParseFlexibleArray(window.WEATHER_ITEMS);
92    // if (!items) {
93    //     // 模板常把数组放在 title 属性中，优先从 title 解析；其次再尝试标签字段
94    //     var rawFromTitle = ticker.getAttribute('title') || '';
95    //     var rawTag = '[!--weather_items--]';
96    //     items = tryParseFlexibleArray(rawFromTitle) || tryParseFlexibleArray(rawTag);
97    // }
98
99    // 构建 DOM：将数组渲染为一份内容 + 一份克隆用于无缝滚动
100    function escapeHtml(str) {
101        return String(str || '').replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;').replace(/'/g, '&#39;');
102    }
103
104    function buildItemsFromArray(arr) {
105        if (!arr || !arr.length) return false;
106        // 构建原件 HTML
107        var html = '';
108        for (var i = 0; i < arr.length; i++) {
109            var it = arr[i] || {};
110            var title = escapeHtml(it.title || it.name || it.text || '');
111            var rawSrc = it.src || it.value || it.img || '';
112            // 如果是本地短名（不以 http(s):// 或 // 或 / 开头），则拼接本地路径并加 .png
113            var finalSrc = '';
114            if (rawSrc) {
115                var s = String(rawSrc).trim();
116
117                // 当作本地文件名，拼接目录与后缀
118                finalSrc = '/skin/default/common/image/' + s + '.png';
119
120            }
121            var src = escapeHtml(finalSrc);
122            html += '<div class="wt-item"><span class="wt-text">' + title + '</span>';
123            if (src) html += '<img src="' + src + '" alt="" style="width:20px;height:20px;vertical-align:middle;margin-left:8px;">';
124            html += '</div>';
125        }
126        // 克隆 HTML：把 class 替换为 wt-item wt-clone
127        var cloneHtml = html.replace(/class=\"wt-item\"/g, 'class="wt-item wt-clone"');
128        track.innerHTML = html + cloneHtml;
129        return true;
130    }
131
132    // 等待元素内所有图片加载完成再执行回调
133    function waitForImages(root, cb) {
134        var imgs = root.querySelectorAll('img');
135        if (!imgs || imgs.length === 0) { cb(); return; }
136        var loaded = 0, total = imgs.length;

137        imgs.forEach(function (img) {
138            if (img.complete) { loaded++; if (loaded === total) cb(); return; }
139            img.addEventListener('load', function () { loaded++; if (loaded === total) cb(); });
140            img.addEventListener('error', function () { loaded++; if (loaded === total) cb(); });
141        });
142    }
143
144    function configureAnimation() {
145        track.style.setProperty('--marquee-distance', '');
146        track.style.animationDuration = '';
147        track.classList.remove('animate', 'no-anim');
148
149        var viewport = ticker.querySelector('.wt-viewport');
150        var viewW = viewport ? viewport.offsetWidth : ticker.offsetWidth;
151
152        // 计算原件总宽（不含克隆部分）
153        var children = track.children;
154        if (!children || children.length === 0) { track.classList.add('no-anim'); return; }
155        // 假设原件占一半（原 + clone），若没有 clone 则取全部
156        var totalChildren = children.length;
157        var originalCount = Math.floor(totalChildren / 2) || totalChildren;
158        var originalWidth = 0;
159        for (var i = 0; i < originalCount; i++) { originalWidth += children[i].offsetWidth; }
160
161        if (originalWidth <= viewW) {
162            track.classList.add('no-anim');
163            // 隐藏克隆
164            for (var j = originalCount; j < totalChildren; j++) { children[j].style.display = 'none'; }
165            track.style.transform = 'translateX(0)';
166            return;
167        }
168
169        // 显示克隆
170        for (var j = originalCount; j < totalChildren; j++) { children[j].style.display = ''; }
171
172        var distance = originalWidth + 'px';
173        var speed = 80; var duration = Math.max(6, Math.round(originalWidth / speed));
174        track.style.setProperty('--marquee-distance', distance);
175        track.style.animationDuration = duration + 's';
176        track.classList.add('animate');
177    }
178
179    // 初始化：如果 items 存在则渲染；否则回退到 title 文本显示
180    if (items && items.length) {
181        buildItemsFromArray(items);
182        waitForImages(track, configureAnimation);
183    } else {
184        // 保持原有单文本回退逻辑
185        var defaultText = ticker.getAttribute('title') || '';
186        track.innerHTML = '';
187        var div = document.createElement('div'); div.className = 'wt-item'; div.textContent = window.WEATHER_TEXT || defaultText || '正在加载天气预报…';
188        var cloneNode = div.cloneNode(true); cloneNode.className = 'wt-item wt-clone';
189        track.appendChild(div); track.appendChild(cloneNode);
190        requestAnimationFrame(configureAnimation);
191    }
192
193    // 暂停交互（hover / touch）
194    ticker.addEventListener('mouseenter', function () { track.classList.add('paused'); });
195    ticker.addEventListener('mouseleave', function () { track.classList.remove('paused'); });
196    ticker.addEventListener('touchstart', function () { track.classList.add('paused'); }, { passive: true });
197    ticker.addEventListener('touchend', function () { track.classList.remove('paused'); }, { passive: true });
198
199    // 对外暴露：在外部设置 window.WEATHER_ITEMS 后可调用此方法重新渲染
200    window.renderWeatherItems = function (arr) {
201        var parsed = tryParseFlexibleArray(arr) || arr;
202        if (parsed && parsed.length) { items = parsed; buildItemsFromArray(items); waitForImages(track, configureAnimation); }
203    };
204
205    // 监听窗口大小变化重新计算
206    var to; window.addEventListener('resize', function () { clearTimeout(to); to = setTimeout(configureAnimation, 150); });
207})();