diff --git a/icon.png b/images/icon.png similarity index 100% rename from icon.png rename to images/icon.png diff --git a/images/loading.png b/images/loading.png new file mode 100644 index 00000000..dec9629f Binary files /dev/null and b/images/loading.png differ diff --git a/images/project file/loading.fw.png b/images/project file/loading.fw.png new file mode 100644 index 00000000..d609dbc4 Binary files /dev/null and b/images/project file/loading.fw.png differ diff --git a/index.html b/index.html index 098b6cbc..6d9d28c4 100644 --- a/index.html +++ b/index.html @@ -3,7 +3,7 @@ 智龙迷城队伍图制作工具 - + diff --git a/languages/en.css b/languages/en.css index 9fe6de05..d88bb989 100644 --- a/languages/en.css +++ b/languages/en.css @@ -1,4 +1,7 @@ @charset "utf-8"; +.status.loading-mon-info .text::before{ + content: "Please wait while the monster data is being loaded."; +} .delay .monster::before{ content: "Prevent\A Delay"; font-size: 22px; diff --git a/languages/ja.css b/languages/ja.css index 957b0dc8..607bfb30 100644 --- a/languages/ja.css +++ b/languages/ja.css @@ -1,4 +1,7 @@ @charset "utf-8"; +.status.loading-mon-info .text::before{ + content: "モンスターデータを読み込んでいます。"; +} .delay .monster::before{ content: "遅 延\A対 策"; } diff --git a/languages/ko.css b/languages/ko.css index 924e85d0..2391ef8d 100644 --- a/languages/ko.css +++ b/languages/ko.css @@ -1,4 +1,7 @@ @charset "utf-8"; +.status.loading-mon-info .text::before{ + content: "몬스터 데이터를 로드 하 고 있습니다."; +} .delay .monster::before{ content: "지 연\A방 지"; } diff --git a/languages/zh-TW.css b/languages/zh-TW.css index 42bdf659..b212a7d3 100644 --- a/languages/zh-TW.css +++ b/languages/zh-TW.css @@ -1,4 +1,7 @@ @charset "utf-8"; +.status.loading-mon-info .text::before{ + content: "正在載入怪物數據,請稍候。"; +} .delay .monster::before{ content: "應 對\A威 嚇"; } diff --git a/languages/zh.css b/languages/zh.css index 2ea29070..ada408a2 100644 --- a/languages/zh.css +++ b/languages/zh.css @@ -1,4 +1,7 @@ @charset "utf-8"; +.status.loading-mon-info .text::before{ + content: "正在加载怪物数据,请稍候。"; +} .delay .monster::before{ content: "应 对\A威 吓"; } diff --git a/multi.html b/multi.html index 835c934f..4ca5b4aa 100644 --- a/multi.html +++ b/multi.html @@ -3,7 +3,7 @@ 智龙迷城车队阵型图制作工具 - + @@ -29,7 +29,7 @@ var formation = new Formation(2,5); -
+
diff --git a/script.js b/script.js index 3585fc8e..28ec39ab 100644 --- a/script.js +++ b/script.js @@ -226,16 +226,17 @@ window.onload = function() { interchangeSVG = document.querySelector("#interchange-line"); interchangePath = interchangeSVG.querySelector("g line"); - let controlBox = document.querySelector(".control-box"); + const controlBox = document.querySelector(".control-box"); + const statusLine = controlBox.querySelector(".status"); //显示当前状态的 //▼添加语言列表开始 - let langSelectDom = controlBox.querySelector(".languages"); + const langSelectDom = controlBox.querySelector(".languages"); languageList.forEach(function(l){ langSelectDom.options.add(new Option(l.name,l.i18n)); }); - let parameter_i18n = getQueryString("l") || getQueryString("lang"); //获取参数指定的语言 - let browser_i18n = (navigator.language || navigator.userLanguage); //获取浏览器语言 + const parameter_i18n = getQueryString("l") || getQueryString("lang"); //获取参数指定的语言 + const browser_i18n = (navigator.language || navigator.userLanguage); //获取浏览器语言 let havingLanguage = languageList.filter(function(l){ //筛选出符合的语言 if (parameter_i18n) //如果已指定就用指定的语言 return parameter_i18n.indexOf(l.i18n)>=0; @@ -257,11 +258,11 @@ window.onload = function() }); //▲添加语言列表结束 //▼添加数据来源列表开始 - let dataSelectDom = controlBox.querySelector(".datasource"); + const dataSelectDom = controlBox.querySelector(".datasource"); dataSourceList.forEach(function(ds){ dataSelectDom.options.add(new Option(ds.source,ds.code)); }); - let parameter_dsCode = getQueryString("s"); //获取参数指定的数据来源 + const parameter_dsCode = getQueryString("s"); //获取参数指定的数据来源 let havingDataSource = dataSourceList.filter(function(ds){ //筛选出符合的数据源 return ds.code == parameter_dsCode; }); @@ -287,9 +288,11 @@ window.onload = function() return; } initialize();//初始化 + statusLine.classList.remove("loading-mon-info"); //如果通过的话就载入URL中的怪物数据 reloadFormationData(); } + statusLine.classList.add("loading-mon-info"); GM_xmlhttpRequest({ method: "GET", url:`monsters-info/mon_${currentDataSource.code}.json`, //Cards数据文件 diff --git a/solo.html b/solo.html index 537f15b4..938f7365 100644 --- a/solo.html +++ b/solo.html @@ -3,7 +3,7 @@ 智龙迷城车队阵型图制作工具 - + @@ -33,7 +33,7 @@ var formation = new Formation(1,6);
-
+
diff --git a/style.css b/style.css index 5cf11955..276aa99a 100644 --- a/style.css +++ b/style.css @@ -9,7 +9,14 @@ url("fonts/FOT-KurokaneStd-EB.eot") format('embedded-opentype'), url("fonts/FOT-KurokaneStd-EB.svg") format('svg'); } - +@keyframes loading-animate{ + from { + transform: rotate(0deg); + } + to { + transform: rotate(3600deg); + } +} body{ font-family: "Microsoft Yahei","Source Han Sans",Arial, Helvetica, sans-serif; --search-icon-unchecked: 0.4; @@ -43,6 +50,17 @@ body{ background-color: #eee; padding: 0; } +/*.status.loading-mon-info .text::before{ + content: "正在加载怪物数据"; +}*/ +.status.loading-mon-info .icon{ + display: inline-block; + width: 16px; + height: 16px; + background-image: url(images/loading.png); + background-size: cover; + animation: loading-animate 10s infinite linear; +} ul{ margin: 0; padding: 0;