mirror of
https://github.com/jugeeya/UltimateTrainingModpack.git
synced 2024-11-24 02:44:17 +00:00
Change from remote to local resource files (#315)
* Extract css into standalone file * Move images to static folder * Add fonts, fix focus animation * Remove Nintendo JS dependencies * Remove unused sliders templating * Fix shadows * Fix back button * Work on Sound Effects * Change htdocs folder * Move fonts to a folder * Refactor JS to remove jquery as a dependency * Fix broken JS * Update rust.yml
This commit is contained in:
asimon-1
GitHub
parent
720f904985
commit
e2a5620ee3
44 changed files with 1361 additions and 1056 deletions
11
.github/workflows/rust.yml
vendored
11
.github/workflows/rust.yml
vendored
|
|
@ -47,11 +47,11 @@ jobs:
|
|||
with:
|
||||
name: plugin
|
||||
path: target/aarch64-skyline-switch/release/libtraining_modpack.nro
|
||||
- name: Upload menu icons
|
||||
- name: Upload static files
|
||||
uses: actions/upload-artifact@v2
|
||||
with:
|
||||
name: svg
|
||||
path: src/templates/*.svg
|
||||
name: static
|
||||
path: src/static
|
||||
plugin_outside_training_mode:
|
||||
if: github.ref == 'refs/heads/master'
|
||||
runs-on: ubuntu-latest
|
||||
|
|
@ -81,7 +81,7 @@ jobs:
|
|||
env:
|
||||
SKYLINE_DIR: atmosphere/contents/01006A800016E000
|
||||
SMASH_PLUGIN_DIR: atmosphere/contents/01006A800016E000/romfs/skyline/plugins
|
||||
SMASH_WEB_DIR: atmosphere/contents/01006A800016E000/manual_html/html-document/contents.htdocs
|
||||
SMASH_WEB_DIR: atmosphere/contents/01006A800016E000/manual_html/html-document/training_modpack.htdocs
|
||||
run: |
|
||||
mkdir -p ${{env.SKYLINE_DIR}}
|
||||
mkdir -p ${{env.SMASH_PLUGIN_DIR}}
|
||||
|
|
@ -96,7 +96,8 @@ jobs:
|
|||
cp libparam_hook.nro ${{env.SMASH_PLUGIN_DIR}}/libparam_hook.nro
|
||||
cp libnro_hook.nro ${{env.SMASH_PLUGIN_DIR}}/libnro_hook.nro
|
||||
cp libnn_hid_hook.nro ${{env.SMASH_PLUGIN_DIR}}/libnn_hid_hook.nro
|
||||
ls -1 svg/*.svg | xargs -n 1 basename | xargs -L1 -I{} cp svg/{} ${{env.SMASH_WEB_DIR}}/{}
|
||||
cp -r static/* ${{env.SMASH_WEB_DIR}}
|
||||
rm ${{env.SMASH_WEB_DIR}}/fonts -r
|
||||
zip -r training_modpack_beta.zip atmosphere
|
||||
- name: Update Release
|
||||
uses: meeDamian/github-release@2.0
|
||||
|
|
|
|||
71
README.md
71
README.md
|
|
@ -141,39 +141,44 @@ SD Card Root
|
|||
└── 01006A800016E000
|
||||
├── manual_html
|
||||
│ └── html-document
|
||||
│ └── contents.htdocs
|
||||
│ ├── aerial_delay.svg
|
||||
│ ├── air_dodge_dir.svg
|
||||
│ ├── attack_angle.svg
|
||||
│ ├── buff_state.svg
|
||||
│ ├── check.svg
|
||||
│ ├── defensive_state.svg
|
||||
│ ├── di_state.svg
|
||||
│ ├── falling_aerials.svg
|
||||
│ ├── fast_fall.svg
|
||||
│ ├── fast_fall_delay.svg
|
||||
│ ├── follow_up.svg
|
||||
│ ├── frame_advantage.svg
|
||||
│ ├── full_hop.svg
|
||||
│ ├── input_delay.svg
|
||||
│ ├── ledge_delay.svg
|
||||
│ ├── ledge_state.svg
|
||||
│ ├── mash_in_neutral.svg
|
||||
│ ├── mash_state.svg
|
||||
│ ├── miss_tech_state.svg
|
||||
│ ├── oos_offset.svg
|
||||
│ ├── pummel_delay.svg
|
||||
│ ├── reaction_time.svg
|
||||
│ ├── save_damage.svg
|
||||
│ ├── save_state_mirroring.svg
|
||||
│ ├── sdi_state.svg
|
||||
│ ├── sdi_strength.svg
|
||||
│ ├── shield_state.svg
|
||||
│ ├── shield_tilt.svg
|
||||
│ ├── stage_hazards.svg
|
||||
│ ├── tech_state.svg
|
||||
│ ├── throw_delay.svg
|
||||
│ └── throw_state.svg
|
||||
│ └── training_modpack.htdocs
|
||||
│ ├── css
|
||||
│ │ └── training_modpack.css
|
||||
│ ├── img
|
||||
│ │ ├── aerial_delay.svg
|
||||
│ │ ├── air_dodge_dir.svg
|
||||
│ │ ├── attack_angle.svg
|
||||
│ │ ├── buff_state.svg
|
||||
│ │ ├── check.svg
|
||||
│ │ ├── defensive_state.svg
|
||||
│ │ ├── di_state.svg
|
||||
│ │ ├── falling_aerials.svg
|
||||
│ │ ├── fast_fall.svg
|
||||
│ │ ├── fast_fall_delay.svg
|
||||
│ │ ├── follow_up.svg
|
||||
│ │ ├── frame_advantage.svg
|
||||
│ │ ├── full_hop.svg
|
||||
│ │ ├── input_delay.svg
|
||||
│ │ ├── ledge_delay.svg
|
||||
│ │ ├── ledge_state.svg
|
||||
│ │ ├── mash_in_neutral.svg
|
||||
│ │ ├── mash_state.svg
|
||||
│ │ ├── miss_tech_state.svg
|
||||
│ │ ├── oos_offset.svg
|
||||
│ │ ├── pummel_delay.svg
|
||||
│ │ ├── reaction_time.svg
|
||||
│ │ ├── save_damage.svg
|
||||
│ │ ├── save_state_mirroring.svg
|
||||
│ │ ├── sdi_state.svg
|
||||
│ │ ├── sdi_strength.svg
|
||||
│ │ ├── shield_state.svg
|
||||
│ │ ├── shield_tilt.svg
|
||||
│ │ ├── stage_hazards.svg
|
||||
│ │ ├── tech_state.svg
|
||||
│ │ ├── throw_delay.svg
|
||||
│ │ └── throw_state.svg
|
||||
│ └── js
|
||||
│ └── training_modpack.js
|
||||
└── romfs
|
||||
└── skyline
|
||||
└── plugins
|
||||
|
|
|
|||
|
|
@ -573,7 +573,7 @@ pub unsafe fn write_menu() {
|
|||
// Now that we have the html, write it to file
|
||||
// From skyline-web
|
||||
let program_id = get_program_id();
|
||||
let htdocs_dir = "contents";
|
||||
let htdocs_dir = "training_modpack";
|
||||
let path = Path::new("sd:/atmosphere/contents")
|
||||
.join(&format!("{:016X}", program_id))
|
||||
.join(&format!("manual_html/html-document/{}.htdocs/", htdocs_dir))
|
||||
|
|
@ -593,7 +593,7 @@ pub fn spawn_menu() {
|
|||
let params = unsafe { MENU.to_url_params() };
|
||||
let page_response = Webpage::new()
|
||||
.background(Background::BlurredScreenshot)
|
||||
.htdocs_dir("contents")
|
||||
.htdocs_dir("training_modpack")
|
||||
.boot_display(BootDisplay::BlurredScreenshot)
|
||||
.boot_icon(true)
|
||||
.start_page(&format!("{}{}", fname, params))
|
||||
|
|
|
|||
356
src/static/css/training_modpack.css
Normal file
356
src/static/css/training_modpack.css
Normal file
|
|
@ -0,0 +1,356 @@
|
|||
@-moz-document url-prefix() {
|
||||
@font-face {
|
||||
font-family: "nintendo_udsgr_std_003";
|
||||
src: url("../fonts/nintendo_udsgr_std_003.ttf");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "nintendo_ext_003";
|
||||
src: url("../fonts/nintendo_ext_003.ttf");
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes background-slide {
|
||||
0% {
|
||||
background-position-x: 0px;
|
||||
}
|
||||
|
||||
100% {
|
||||
background-position-x: 422.4px;
|
||||
}
|
||||
}
|
||||
|
||||
.answer-border-outer {
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.button-icon {
|
||||
height: 53px;
|
||||
margin-left: 4px;
|
||||
width: 53px;
|
||||
}
|
||||
|
||||
.button-icon-wrapper {
|
||||
align-items: center;
|
||||
background: #000000;
|
||||
display: flex;
|
||||
height: 58px;
|
||||
margin-left: -1px;
|
||||
width: 80px;
|
||||
}
|
||||
|
||||
.button-msg-wrapper {
|
||||
width: 259px;
|
||||
}
|
||||
|
||||
.checkbox-display {
|
||||
margin: 10px 70px;
|
||||
}
|
||||
|
||||
.checkbox-display::after {
|
||||
/* Displayed Checkbox (unchecked) */
|
||||
color: white;
|
||||
content: "\E14C";
|
||||
}
|
||||
|
||||
.defaults-checkbox-container {
|
||||
/* Save Defaults Container */
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
margin-top: 10px;
|
||||
position: fixed;
|
||||
right: 50px;
|
||||
}
|
||||
|
||||
.flex-button {
|
||||
align-items: center;
|
||||
display: inline-flex;
|
||||
flex: 1;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.footer {
|
||||
align-items: center;
|
||||
background: #000000;
|
||||
display: flex;
|
||||
height: 73px;
|
||||
justify-content: center;
|
||||
position: fixed;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.header {
|
||||
align-items: center;
|
||||
background: #000000;
|
||||
border-bottom: 7px solid #000000;
|
||||
display: flex;
|
||||
height: 65px;
|
||||
}
|
||||
|
||||
.header-decoration {
|
||||
align-items: center;
|
||||
background: #a80114;
|
||||
display: inline-flex;
|
||||
height: 65px;
|
||||
padding-left: 21px;
|
||||
width: 101px;
|
||||
}
|
||||
|
||||
.header-desc {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.header-title {
|
||||
color: #f46264;
|
||||
font-size: 26px;
|
||||
line-height: 2.5;
|
||||
}
|
||||
|
||||
.is-appear {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.is-focused .question-border::before {
|
||||
background: #000000;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.is-focused .question-message {
|
||||
color: #FFFFFF;
|
||||
text-shadow: 2px 0 0 #000, -2px 0 0 #000, 0 2px 0 #000, 0 -2px 0 #000, 1px 1px #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000;
|
||||
}
|
||||
|
||||
.is-focused .question.scuffle-thema {
|
||||
background: #df1624;
|
||||
}
|
||||
|
||||
.is-focused .scuffle-thema {
|
||||
background: #df1624;
|
||||
}
|
||||
|
||||
.is-hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.is-opened .question {
|
||||
bottom: 11px;
|
||||
}
|
||||
|
||||
.is-opened .question-border::before {
|
||||
background: #000000;
|
||||
bottom: 5px;
|
||||
}
|
||||
|
||||
.is-opened .question-outer {
|
||||
height: 86px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.keyword-button {
|
||||
background: #d9e4ea;
|
||||
border: solid 4px #2e3c45;
|
||||
box-shadow: 1px 1px 6px rgba(24, 24, 24, 0.6);
|
||||
box-sizing: border-box;
|
||||
height: 66px;
|
||||
justify-content: flex-start;
|
||||
position: relative;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.keyword-button-outer {
|
||||
border: 5px solid transparent;
|
||||
will-change: transform;
|
||||
}
|
||||
|
||||
.keyword-message {
|
||||
color: #2b3940;
|
||||
font-size: 22px;
|
||||
padding: 0px 5px;
|
||||
}
|
||||
|
||||
.l-footer {
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.l-grid {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.l-header {
|
||||
box-shadow: 0px 1px 1px #000000;
|
||||
display: flex;
|
||||
left: 0px;
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
width: 100%;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.l-header-title {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
height: 100%;
|
||||
justify-content: center;
|
||||
left: 0px;
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
width: 1280px;
|
||||
}
|
||||
|
||||
.l-item {
|
||||
margin: 0px 13px;
|
||||
}
|
||||
|
||||
.l-main-content {
|
||||
/* Overwrite padding from keyword stuff. */
|
||||
padding: 0px 0px 0px;
|
||||
}
|
||||
|
||||
.l-qa {
|
||||
/* Column size */
|
||||
flex-basis: 33%;
|
||||
}
|
||||
|
||||
.l-qa:last-child .qa {
|
||||
/* Overwrite margin on the last child to avoid overlap with footer */
|
||||
margin-bottom: 75px;
|
||||
}
|
||||
|
||||
.l-qa:last-child .qa.is-opened {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
|
||||
.qa {
|
||||
display: block;
|
||||
will-change: scroll-position;
|
||||
}
|
||||
|
||||
.is-focused {
|
||||
background: linear-gradient(90deg, rgb(255, 109, 0) 0%, rgb(255, 255, 0) 65%, rgb(255, 109, 0) 70%);
|
||||
will-change: animation;
|
||||
animation: background-slide 650ms linear infinite normal;
|
||||
}
|
||||
|
||||
.question {
|
||||
align-items: center;
|
||||
background: #d9e4ea;
|
||||
bottom: 11px;
|
||||
display: flex;
|
||||
left: 11px;
|
||||
padding: 0px 30px 0px 94px;
|
||||
position: absolute;
|
||||
right: 28px;
|
||||
top: 11px;
|
||||
}
|
||||
|
||||
.question-border::before {
|
||||
background: #2e3c45;
|
||||
bottom: 6px;
|
||||
box-shadow: 3px 3px 3px rgba(24, 24, 24, 0.5);
|
||||
content: '';
|
||||
left: 6px;
|
||||
position: absolute;
|
||||
right: 6px;
|
||||
top: 6px;
|
||||
}
|
||||
|
||||
.question-icon {
|
||||
bottom: 0px;
|
||||
height: 60px;
|
||||
left: 2px;
|
||||
position: absolute;
|
||||
top: 2px;
|
||||
transition: opacity 0.2s ease;
|
||||
width: 60px;
|
||||
}
|
||||
|
||||
.question-message {
|
||||
color: #2b3940;
|
||||
font-size: 23px;
|
||||
width: 100%;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.question-message span {
|
||||
display: block;
|
||||
letter-spacing: normal;
|
||||
}
|
||||
|
||||
.question-outer {
|
||||
height: 86px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.question::before {
|
||||
width: 70px;
|
||||
background: #000000;
|
||||
bottom: 0px;
|
||||
content: '';
|
||||
left: 0px;
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
}
|
||||
|
||||
.ret-icon {
|
||||
display: inline-block;
|
||||
height: 58px;
|
||||
transition: opacity 0.2s ease;
|
||||
width: 58px;
|
||||
}
|
||||
|
||||
.ret-icon-wrapper {
|
||||
margin-left: -4px;
|
||||
position: relative;
|
||||
will-change: transform;
|
||||
}
|
||||
|
||||
#saveDefaults {
|
||||
/* Checkbox element (hidden) */
|
||||
left: -100vw;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
#saveDefaults:checked~.checkbox-display::after {
|
||||
/* Displayed Checkbox (checked) */
|
||||
content: "\E14B";
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
body {
|
||||
background: none;
|
||||
width: 1280px;
|
||||
}
|
||||
|
||||
body, div, th, td, p, ul, ol, dl, dt, dd, img, h1, h2, h3, h4, h5, h6, footer, header, nav, p, section, span, figure {
|
||||
margin: 0px;
|
||||
overflow-wrap: break-word;
|
||||
padding: 0px;
|
||||
word-break: normal;
|
||||
font-family: "nintendo_ext_003", "nintendo_udsgr_std_003";
|
||||
}
|
||||
|
||||
img, svg {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
img.question-icon:not(.toggle) {
|
||||
/* Fade icons slightly */
|
||||
opacity: 0.75;
|
||||
}
|
||||
|
||||
span {
|
||||
letter-spacing: 0.01px;
|
||||
}
|
||||
|
||||
ul, ol {
|
||||
list-style-type: none;
|
||||
}
|
||||
BIN
src/static/fonts/nintendo_ext_003.ttf
Normal file
BIN
src/static/fonts/nintendo_ext_003.ttf
Normal file
Binary file not shown.
BIN
src/static/fonts/nintendo_udsgr_std_003.ttf
Normal file
BIN
src/static/fonts/nintendo_udsgr_std_003.ttf
Normal file
Binary file not shown.
|
Before Width: | Height: | Size: 98 KiB After Width: | Height: | Size: 98 KiB |
|
Before Width: | Height: | Size: 2.8 KiB After Width: | Height: | Size: 2.8 KiB |
|
Before Width: | Height: | Size: 2.4 KiB After Width: | Height: | Size: 2.4 KiB |
|
|
@ -1,82 +1,82 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
width="80.0px"
|
||||
height="80.0px"
|
||||
viewBox="0 0 80.0 80.0"
|
||||
version="1.1"
|
||||
id="SVGRoot"
|
||||
sodipodi:docname="buff_state.svg"
|
||||
inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/">
|
||||
<defs
|
||||
id="defs5503" />
|
||||
<sodipodi:namedview
|
||||
id="base"
|
||||
pagecolor="#000000"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1.0"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:zoom="8"
|
||||
inkscape:cx="52.625"
|
||||
inkscape:cy="33.6875"
|
||||
inkscape:document-units="px"
|
||||
inkscape:current-layer="layer1"
|
||||
inkscape:document-rotation="0"
|
||||
showgrid="true"
|
||||
inkscape:window-width="1431"
|
||||
inkscape:window-height="1041"
|
||||
inkscape:window-x="256"
|
||||
inkscape:window-y="0"
|
||||
inkscape:window-maximized="0"
|
||||
inkscape:pagecheckerboard="1">
|
||||
<inkscape:grid
|
||||
type="xygrid"
|
||||
id="grid6073"
|
||||
spacingx="0.1"
|
||||
spacingy="0.1" />
|
||||
</sodipodi:namedview>
|
||||
<metadata
|
||||
id="metadata5506">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<g
|
||||
inkscape:label="Layer 1"
|
||||
inkscape:groupmode="layer"
|
||||
id="layer1">
|
||||
<g
|
||||
id="g243"
|
||||
style="fill:#ffffea;fill-opacity:1"
|
||||
transform="matrix(0.54490954,0,0,-0.44245854,-24.388508,217.32339)">
|
||||
<g
|
||||
id="g245"
|
||||
style="fill:#ffffea;fill-opacity:1">
|
||||
<g
|
||||
id="g251"
|
||||
style="fill:#ffffea;fill-opacity:1">
|
||||
<g
|
||||
id="g253"
|
||||
style="fill:#ffffea;fill-opacity:1">
|
||||
<path
|
||||
d="m 58.348,376.03 c 3.332,-50.936 45.698,-55.695 45.698,-55.695 v 0 c -36.178,20.944 -24.437,58.551 -1.666,79.495 v 0 c 13.625,12.533 9.71,21.5 9.313,22.314 v 0 c 7.57,-14.95 1.868,-19.957 -2.411,-37.546 v 0 c -4.284,-17.614 6.188,-36.178 17.613,-33.44 v 0 c 11.424,2.737 5.95,17.969 5.95,17.969 v 0 c 26.419,-26.896 0.952,-44.746 0.952,-44.746 v 0 c 0,0 39.034,10.948 42.604,47.365 v 0 c 3.571,36.415 -25.705,51.411 -25.705,51.411 v 0 c 9.758,-8.093 9.283,-23.327 -1.904,-24.279 v 0 c -11.187,-0.951 -18.089,3.333 -10.71,35.464 v 0 c 7.378,32.132 -34.036,50.457 -34.036,50.457 v 0 C 124.039,438.387 55.015,426.963 58.348,376.03 m 53.314,46.174 c 0,0 0,0 0,0 v 0 c 0,0 0,0 0,0"
|
||||
style="fill:#ffffea;stroke:none;fill-opacity:1"
|
||||
id="path267" />
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
width="80.0px"
|
||||
height="80.0px"
|
||||
viewBox="0 0 80.0 80.0"
|
||||
version="1.1"
|
||||
id="SVGRoot"
|
||||
sodipodi:docname="buff_state.svg"
|
||||
inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/">
|
||||
<defs
|
||||
id="defs5503" />
|
||||
<sodipodi:namedview
|
||||
id="base"
|
||||
pagecolor="#000000"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1.0"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:zoom="8"
|
||||
inkscape:cx="52.625"
|
||||
inkscape:cy="33.6875"
|
||||
inkscape:document-units="px"
|
||||
inkscape:current-layer="layer1"
|
||||
inkscape:document-rotation="0"
|
||||
showgrid="true"
|
||||
inkscape:window-width="1431"
|
||||
inkscape:window-height="1041"
|
||||
inkscape:window-x="256"
|
||||
inkscape:window-y="0"
|
||||
inkscape:window-maximized="0"
|
||||
inkscape:pagecheckerboard="1">
|
||||
<inkscape:grid
|
||||
type="xygrid"
|
||||
id="grid6073"
|
||||
spacingx="0.1"
|
||||
spacingy="0.1" />
|
||||
</sodipodi:namedview>
|
||||
<metadata
|
||||
id="metadata5506">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<g
|
||||
inkscape:label="Layer 1"
|
||||
inkscape:groupmode="layer"
|
||||
id="layer1">
|
||||
<g
|
||||
id="g243"
|
||||
style="fill:#ffffea;fill-opacity:1"
|
||||
transform="matrix(0.54490954,0,0,-0.44245854,-24.388508,217.32339)">
|
||||
<g
|
||||
id="g245"
|
||||
style="fill:#ffffea;fill-opacity:1">
|
||||
<g
|
||||
id="g251"
|
||||
style="fill:#ffffea;fill-opacity:1">
|
||||
<g
|
||||
id="g253"
|
||||
style="fill:#ffffea;fill-opacity:1">
|
||||
<path
|
||||
d="m 58.348,376.03 c 3.332,-50.936 45.698,-55.695 45.698,-55.695 v 0 c -36.178,20.944 -24.437,58.551 -1.666,79.495 v 0 c 13.625,12.533 9.71,21.5 9.313,22.314 v 0 c 7.57,-14.95 1.868,-19.957 -2.411,-37.546 v 0 c -4.284,-17.614 6.188,-36.178 17.613,-33.44 v 0 c 11.424,2.737 5.95,17.969 5.95,17.969 v 0 c 26.419,-26.896 0.952,-44.746 0.952,-44.746 v 0 c 0,0 39.034,10.948 42.604,47.365 v 0 c 3.571,36.415 -25.705,51.411 -25.705,51.411 v 0 c 9.758,-8.093 9.283,-23.327 -1.904,-24.279 v 0 c -11.187,-0.951 -18.089,3.333 -10.71,35.464 v 0 c 7.378,32.132 -34.036,50.457 -34.036,50.457 v 0 C 124.039,438.387 55.015,426.963 58.348,376.03 m 53.314,46.174 c 0,0 0,0 0,0 v 0 c 0,0 0,0 0,0"
|
||||
style="fill:#ffffea;stroke:none;fill-opacity:1"
|
||||
id="path267" />
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 3 KiB After Width: | Height: | Size: 2.9 KiB |
|
Before Width: | Height: | Size: 1.5 KiB After Width: | Height: | Size: 1.5 KiB |
|
Before Width: | Height: | Size: 3.3 KiB After Width: | Height: | Size: 3.3 KiB |
|
Before Width: | Height: | Size: 6.6 KiB After Width: | Height: | Size: 6.6 KiB |
|
Before Width: | Height: | Size: 98 KiB After Width: | Height: | Size: 98 KiB |
|
Before Width: | Height: | Size: 2.6 KiB After Width: | Height: | Size: 2.6 KiB |
|
Before Width: | Height: | Size: 3.3 KiB After Width: | Height: | Size: 3.3 KiB |
|
Before Width: | Height: | Size: 2.6 KiB After Width: | Height: | Size: 2.6 KiB |
|
Before Width: | Height: | Size: 2.3 KiB After Width: | Height: | Size: 2.3 KiB |
|
Before Width: | Height: | Size: 2.7 KiB After Width: | Height: | Size: 2.7 KiB |
|
Before Width: | Height: | Size: 3.2 KiB After Width: | Height: | Size: 3.2 KiB |
|
Before Width: | Height: | Size: 68 KiB After Width: | Height: | Size: 68 KiB |
|
Before Width: | Height: | Size: 2.3 KiB After Width: | Height: | Size: 2.3 KiB |
|
Before Width: | Height: | Size: 1.9 KiB After Width: | Height: | Size: 1.9 KiB |
9
src/static/img/m_retnormal.svg
Normal file
9
src/static/img/m_retnormal.svg
Normal file
|
|
@ -0,0 +1,9 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 18.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg version="1.1" id="レイヤー_2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
|
||||
y="0px" viewBox="0 0 80 80" enable-background="new 0 0 80 80" xml:space="preserve">
|
||||
<g>
|
||||
<path fill="#FFFFFF" d="M41.5,69.9V51.5h7.2c2.4-0.1,4.3-2.1,4.3-4.5c0-2.4-2-4.5-4.4-4.6l-14.9,0v13.9L8,33.1L33.7,10v13.9l15.3,0
|
||||
c12.6,0.3,22.8,10.7,22.8,23.1c0,12.6-10,22.7-22.7,23l-0.1,0H41.5z"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 2.6 KiB After Width: | Height: | Size: 2.6 KiB |
|
Before Width: | Height: | Size: 2.1 KiB After Width: | Height: | Size: 2.1 KiB |
|
Before Width: | Height: | Size: 4.3 KiB After Width: | Height: | Size: 4.3 KiB |
|
Before Width: | Height: | Size: 4.8 KiB After Width: | Height: | Size: 4.8 KiB |
File diff suppressed because one or more lines are too long
|
Before Width: | Height: | Size: 27 KiB After Width: | Height: | Size: 27 KiB |
|
Before Width: | Height: | Size: 2.4 KiB After Width: | Height: | Size: 2.4 KiB |
|
Before Width: | Height: | Size: 2.4 KiB After Width: | Height: | Size: 2.4 KiB |
|
Before Width: | Height: | Size: 2.3 KiB After Width: | Height: | Size: 2.3 KiB |
|
Before Width: | Height: | Size: 2.3 KiB After Width: | Height: | Size: 2.3 KiB |
|
Before Width: | Height: | Size: 1.9 KiB After Width: | Height: | Size: 1.9 KiB |
|
Before Width: | Height: | Size: 2.6 KiB After Width: | Height: | Size: 2.6 KiB |
|
Before Width: | Height: | Size: 2.3 KiB After Width: | Height: | Size: 2.3 KiB |
|
Before Width: | Height: | Size: 2.8 KiB After Width: | Height: | Size: 2.8 KiB |
|
Before Width: | Height: | Size: 28 KiB After Width: | Height: | Size: 28 KiB |
|
Before Width: | Height: | Size: 3.9 KiB After Width: | Height: | Size: 3.9 KiB |
File diff suppressed because one or more lines are too long
|
Before Width: | Height: | Size: 42 KiB After Width: | Height: | Size: 42 KiB |
File diff suppressed because one or more lines are too long
|
Before Width: | Height: | Size: 45 KiB After Width: | Height: | Size: 45 KiB |
304
src/static/js/training_modpack.js
Normal file
304
src/static/js/training_modpack.js
Normal file
|
|
@ -0,0 +1,304 @@
|
|||
var isNx = (typeof window.nx !== 'undefined');
|
||||
var prevQuestionMsg = null;
|
||||
var prevFocusedElm = null;
|
||||
|
||||
if (isNx) {
|
||||
window.nx.footer.setAssign('B', '', goBackHook, {se: ''});
|
||||
window.nx.footer.setAssign('X', '', resetSubmenu, {se: ''});
|
||||
window.nx.footer.setAssign('L', '', resetAllSubmenus, {se: ''});
|
||||
window.nx.footer.setAssign('R', '', toggleSaveDefaults, {se: ''});
|
||||
} else {
|
||||
document.getElementById("body").addEventListener('keypress', (event) => {
|
||||
switch (event.key) {
|
||||
case "b":
|
||||
console.log("b");
|
||||
goBackHook();
|
||||
break;
|
||||
case "x":
|
||||
console.log("x");
|
||||
resetSubmenu();
|
||||
break;
|
||||
case "l":
|
||||
console.log("l");
|
||||
resetAllSubmenus();
|
||||
break;
|
||||
case "r":
|
||||
console.log("r");
|
||||
toggleSaveDefaults();
|
||||
break;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
window.onload = setSettings;
|
||||
|
||||
function isTextNode(node) {
|
||||
return node.nodeType == Node.TEXT_NODE
|
||||
}
|
||||
|
||||
function closestClass(elem, class_) {
|
||||
// Returns the closest anscestor (including self) with the given class
|
||||
if (!elem) {
|
||||
// Reached the end of the DOM
|
||||
return null
|
||||
} else if (elem.classList.contains(class_)) {
|
||||
// Found it
|
||||
return elem
|
||||
} else {
|
||||
// Didn't find it, go up a level
|
||||
return closestClass(elem.parentElement, class_);
|
||||
}
|
||||
}
|
||||
|
||||
function getElementByXpath(path) {
|
||||
return document.evaluate(path, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
|
||||
}
|
||||
|
||||
function focusQA(e) {
|
||||
playSound("SeSelectUncheck");
|
||||
prevFocusedElm = e;
|
||||
e.classList.add("is-focused");
|
||||
}
|
||||
|
||||
function defocusQA(e) {
|
||||
if (prevFocusedElm) {
|
||||
prevFocusedElm.classList.remove('is-focused');
|
||||
|
||||
}
|
||||
if (prevQuestionMsg) {
|
||||
prevQuestionMsg.remove();
|
||||
prevQuestionMsg = null;
|
||||
}
|
||||
}
|
||||
|
||||
function toggleAnswer(e) {
|
||||
playSound("SeToggleBtnOn");
|
||||
e.classList.toggle("is-opened");
|
||||
|
||||
// Toggle visibility of child answers
|
||||
[].forEach.call(e.childNodes, function (child) {
|
||||
if (!isTextNode(child) && child.classList.contains("answer-border-outer")) {
|
||||
child.classList.toggle("is-hidden");
|
||||
}
|
||||
});
|
||||
|
||||
// Toggle visibility of sibling answers
|
||||
var sibling = e.nextElementSibling;
|
||||
if (sibling.classList.contains("answer-border-outer")) {
|
||||
sibling.classList.toggle("is-hidden");
|
||||
}
|
||||
}
|
||||
|
||||
function playSound(label) {
|
||||
// Valid labels:
|
||||
// SeToggleBtnFocus
|
||||
// SeToggleBtnOn
|
||||
// SeToggleBtnOff
|
||||
// SeCheckboxFocus
|
||||
// SeCheckboxOn
|
||||
// SeCheckboxOff
|
||||
// SeRadioBtnFocus
|
||||
// SeRadioBtnOn
|
||||
// SeSelectCheck
|
||||
// SeSelectUncheck
|
||||
// SeBtnDecide
|
||||
// SeTouchUnfocus
|
||||
// SeBtnFocus
|
||||
// SeKeyError
|
||||
// SeDialogOpen
|
||||
// SeWebZoomOut
|
||||
// SeWebZoomIn
|
||||
// SeWebNaviFocus
|
||||
// SeWebPointerFocus
|
||||
// SeFooterFocus
|
||||
// SeFooterDecideBack
|
||||
// SeFooterDecideFinish
|
||||
// SeWebChangeCursorPointer
|
||||
// SeWebTouchFocus
|
||||
// SeWebLinkDecide
|
||||
// SeWebTextboxStartEdit
|
||||
// SeWebButtonDecide
|
||||
// SeWebRadioBtnOn
|
||||
// SeWebCheckboxUncheck
|
||||
// SeWebCheckboxCheck
|
||||
// SeWebMenuListOpen
|
||||
if (isNx) {
|
||||
window.nx.playSystemSe(label);
|
||||
} else {
|
||||
console.log("Sound Effect: " + label);
|
||||
}
|
||||
}
|
||||
|
||||
function goBackHook() {
|
||||
// If any submenus are open, close them
|
||||
// Otherwise if all submenus are closed, exit the menu and return to the game
|
||||
|
||||
if (document.querySelectorAll(".qa.is-opened").length == 0) {
|
||||
// If all submenus are closed, exit and return through localhost
|
||||
playSound("SeFooterDecideBack");
|
||||
var url = "http://localhost/";
|
||||
|
||||
var settings = new Map();
|
||||
|
||||
// Collect settings for toggles
|
||||
|
||||
[].forEach.call(document.querySelectorAll("ul.l-grid"), function (toggle) {
|
||||
var section = toggle.id;
|
||||
var val = "";
|
||||
|
||||
[].forEach.call(toggle.childNodes, function (child) {
|
||||
if (!isTextNode(child) && child.querySelectorAll(".is-appear").length) {
|
||||
val += child.getAttribute("val") + ",";
|
||||
};
|
||||
});
|
||||
|
||||
settings.set(section,val);
|
||||
});
|
||||
|
||||
// Collect settings for OnOffs
|
||||
[].forEach.call(document.querySelectorAll("div.onoff"), function (onoff) {
|
||||
var section = onoff.id;
|
||||
var val = "";
|
||||
if (onoff.querySelectorAll(".is-appear").length) {
|
||||
val = "1";
|
||||
} else {
|
||||
val = "0";
|
||||
}
|
||||
settings.set(section,val);
|
||||
});
|
||||
|
||||
url += "?";
|
||||
settings.forEach((val, section) => { url += section + "=" + val + "&" } );
|
||||
|
||||
if (document.getElementById("saveDefaults").checked) {
|
||||
url += "save_defaults=1";
|
||||
} else {
|
||||
url = url.slice(0, -1);
|
||||
}
|
||||
|
||||
if (isNx) {
|
||||
window.location.href = url;
|
||||
} else {
|
||||
console.log(url);
|
||||
}
|
||||
} else {
|
||||
// Close any open submenus
|
||||
[].forEach.call(document.querySelectorAll(".qa.is-opened"), function (submenu) { toggleAnswer(submenu); });
|
||||
}
|
||||
}
|
||||
|
||||
function clickToggle(e) {
|
||||
playSound("SeCheckboxOn");
|
||||
var toggleOptions = e.querySelector(".toggle");
|
||||
if (e.querySelector(".is-single-option")) { // Single-option submenu
|
||||
// Deselect all submenu options
|
||||
closestClass(e, "l-qa").querySelector(".toggle").classList.remove("is-appear");
|
||||
closestClass(e, "l-qa").querySelector(".toggle").classList.add("is-hidden");
|
||||
// Then set the current one as the active setting
|
||||
toggleOptions.classList.add("is-appear");
|
||||
toggleOptions.classList.remove("is-hidden");
|
||||
} else { // Multi-option submenu
|
||||
toggleOptions.classList.toggle("is-appear");
|
||||
toggleOptions.classList.toggle("is-hidden");
|
||||
}
|
||||
}
|
||||
|
||||
function getParams(url) {
|
||||
var regex = /[?&]([^=#]+)=([^&#]*)/g,
|
||||
params = {},
|
||||
match;
|
||||
while (match = regex.exec(url)) {
|
||||
params[match[1]] = match[2];
|
||||
}
|
||||
return params;
|
||||
}
|
||||
|
||||
function setSettings() {
|
||||
// Get settings from the URL GET parameters
|
||||
const settings = getParams(document.URL);
|
||||
|
||||
// Set Toggles
|
||||
[].forEach.call(document.querySelectorAll("ul.l-grid"), function (toggle) {
|
||||
var section = toggle.id;
|
||||
var section_setting = decodeURIComponent(settings[section]);
|
||||
|
||||
[].forEach.call(toggle.querySelectorAll("li"), function (child) {
|
||||
var e = child.querySelector("img.toggle");
|
||||
if (section_setting.split(",").includes(child.getAttribute("val"))) {
|
||||
e.classList.add("is-appear");
|
||||
e.classList.remove("is-hidden");
|
||||
} else {
|
||||
e.classList.remove("is-appear");
|
||||
e.classList.add("is-hidden");
|
||||
};
|
||||
});
|
||||
});
|
||||
|
||||
// Set OnOffs
|
||||
[].forEach.call(document.querySelectorAll("div.onoff"), function (onOff) {
|
||||
var section = onOff.id;
|
||||
var section_setting = decodeURIComponent(settings[section]);
|
||||
var e = onOff.querySelector("img.toggle");
|
||||
if (section_setting == "1") {
|
||||
e.classList.add("is-appear");
|
||||
e.classList.remove("is-hidden");
|
||||
} else {
|
||||
e.classList.remove("is-appear");
|
||||
e.classList.add("is-hidden");
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
function resetSubmenu() {
|
||||
// Resets any open or focused submenus to the default values
|
||||
playSound("SeToggleBtnOff");
|
||||
[].forEach.call(document.querySelectorAll("[default*='is-appear']"), function (item) {
|
||||
if (isSubmenuFocused(item)) {
|
||||
item.classList.add("is-appear");
|
||||
item.classList.remove("is-hidden");
|
||||
}
|
||||
});
|
||||
|
||||
[].forEach.call(document.querySelectorAll("[default*='is-hidden']"), function (item) {
|
||||
if (isSubmenuFocused(item)) {
|
||||
item.classList.remove("is-appear");
|
||||
item.classList.add("is-hidden");
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function isSubmenuFocused(elem) {
|
||||
// Return true if the element is in a submenu which is either focused or opened
|
||||
return (
|
||||
closestClass(elem, "l-qa").querySelectorAll(".is-opened, .is-focused").length
|
||||
|| closestClass(elem, "is-focused")
|
||||
)
|
||||
}
|
||||
|
||||
function resetAllSubmenus() {
|
||||
// Resets all submenus to the default values
|
||||
if (confirm("Are you sure that you want to reset all menu settings to the default?")) {
|
||||
playSound("SeToggleBtnOff");
|
||||
[].forEach.call(document.querySelectorAll("[default*='is-appear']"), function (item) {
|
||||
item.classList.add("is-appear");
|
||||
item.classList.remove("is-hidden");
|
||||
});
|
||||
|
||||
[].forEach.call(document.querySelectorAll("[default*='is-hidden']"), function (item) {
|
||||
item.classList.remove("is-appear");
|
||||
item.classList.add("is-hidden");
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function setHelpText(text) {
|
||||
// Modify the help text in the footer
|
||||
document.getElementById("help-text").innerText = text;
|
||||
}
|
||||
|
||||
function toggleSaveDefaults() {
|
||||
// Change the status of the Save Defaults checkbox
|
||||
playSound("SeCheckboxOn");
|
||||
var saveDefaultsCheckbox = document.getElementById("saveDefaults");
|
||||
saveDefaultsCheckbox.checked = !saveDefaultsCheckbox.checked;
|
||||
}
|
||||
|
|
@ -1,487 +1,117 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
|
||||
<title>Document</title>
|
||||
<link rel="stylesheet" href="./help/css/common.css" />
|
||||
<link rel="stylesheet" href="./help/css/qa.css" />
|
||||
<link rel="stylesheet" href="./help/css/top.css" />
|
||||
<link id="font-stylesheet" rel="stylesheet" href="./help/css/font.css">
|
||||
<link rel="stylesheet" href="./help/css/keyword.css">
|
||||
<link href="./nouislider.min.css" rel="stylesheet">
|
||||
<style>
|
||||
@-moz-document url-prefix() {
|
||||
@font-face {
|
||||
font-family: '-webkit-standard';
|
||||
src: url('nintendo_udsg-r_std_003.ttf');
|
||||
}
|
||||
}
|
||||
|
||||
body {
|
||||
background: none;
|
||||
}
|
||||
|
||||
/* Overwrite padding from keyword stuff. */
|
||||
.l-main-content {
|
||||
padding: 0px 0px 0px;
|
||||
}
|
||||
|
||||
/* Somehow isn't getting passed through from default css. */
|
||||
.ret-icon-shadow {
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
top: 3px;
|
||||
left: 2px;
|
||||
display: inline-block;
|
||||
width: 58px;
|
||||
height: 58px;
|
||||
opacity: 0;
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
/* Column size */
|
||||
.l-qa {
|
||||
flex-basis: 33%;
|
||||
}
|
||||
|
||||
/* Full width for opened lists */
|
||||
.is-opened .question-outer {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* Overwrite margin on the last child to avoid overlap with footer */
|
||||
.l-qa:last-child .qa {
|
||||
margin-bottom: 75px;
|
||||
}
|
||||
|
||||
.l-qa:last-child .qa.is-opened {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
|
||||
/* Fade icons slightly */
|
||||
img.question-icon:not(.toggle) {
|
||||
opacity: 0.75;
|
||||
}
|
||||
|
||||
/* Override excessive question width on focus */
|
||||
.is-focused .question-message span:nth-child(1) {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
/* Handle alignment of items in the header */
|
||||
.l-header {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
/* Set menu description color */
|
||||
.header-desc {
|
||||
color: white;
|
||||
}
|
||||
|
||||
/* Center Icons */
|
||||
.question::before {
|
||||
width: 70px;
|
||||
}
|
||||
|
||||
/* Footer */
|
||||
.footer {
|
||||
position: fixed;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
/* Save Defaults Container */
|
||||
.defaults-checkbox-container {
|
||||
position: fixed;
|
||||
right: 50px;
|
||||
margin-top: 10px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
/* Checkbox element (hidden) */
|
||||
#saveDefaults {
|
||||
position: absolute;
|
||||
left: -100vw;
|
||||
}
|
||||
|
||||
.checkbox-display {
|
||||
margin: 10px 70px;
|
||||
}
|
||||
|
||||
/* Displayed Checkbox (unchecked) */
|
||||
.checkbox-display::after {
|
||||
content: "\E14C";
|
||||
color: white;
|
||||
}
|
||||
|
||||
/* Displayed Checkbox (checked) */
|
||||
#saveDefaults:checked ~ .checkbox-display::after {
|
||||
content: "\E14B";
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<script src="./help/js/jquery-3.3.1.min.js"></script>
|
||||
<script src="./help/common/js/wsnd.min.js"></script>
|
||||
<script src="./help/common/js/keyhelp.js"></script>
|
||||
<script src="./help/js/common.js"></script>
|
||||
<script src="./help/js/qa.js"></script>
|
||||
<script src="./nouislider.min.js"></script>
|
||||
|
||||
<div class="l-header">
|
||||
<div class="l-header-title">
|
||||
<div class="header-title f-u-bold"><span data-msgcom="true" data-msgid="textbox_id-10020">Ultimate
|
||||
Training
|
||||
Modpack Menu</span></div>
|
||||
</div>
|
||||
<div class="header" style="flex-grow: 1;">
|
||||
<a id="ret-button" tabindex="-1" class="header-decoration" href="javascript:goBackHook();" nx-se-disabled="">
|
||||
<div class="ret-icon-wrapper">
|
||||
<img class="ret-icon-shadow is-appear" ref="./help/img/icon/m_retnormal.svg" src="./help/img/icon/m_retnormal.svg">
|
||||
<img class="ret-icon is-appear" ref="./help/img/icon/m_retnormal.svg" src="./help/img/icon/m_retnormal.svg">
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="header f-u-bold" style="flex-direction: column; justify-content: center; align-items: end;">
|
||||
<p class="header-desc">Reset Current Menu: </p>
|
||||
<p class="header-desc">Reset All Menus: </p>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
|
||||
<div class="l-grid">
|
||||
|
||||
<!--
|
||||
Script the part below via templating. Overall structure is perhaps
|
||||
[
|
||||
l-qa qa [id=qa-{{menuName}} tabindex="{{index}}"] {
|
||||
// make question for {{menuName}}
|
||||
// make answer with l-grid : l-item list for options
|
||||
},
|
||||
...
|
||||
]
|
||||
|
||||
|
||||
Remember to set make max keyword size greater than 23!
|
||||
-->
|
||||
{{#sub_menus}}
|
||||
<div class="l-qa">
|
||||
{{^onoffselector}}
|
||||
<a id="qa-{{id}}" class="qa" tabindex="{{index}}" href="javascript:void(0);" onfocus="focusQA(this);setHelpText({{help_text}})" onblur="defocusQA(this)" onclick="openAnswer(this)" nx-se-disabled="">
|
||||
<div class="question-outer">
|
||||
<div class="question-border">
|
||||
<div id="question-{{id}}" class="question scuffle-thema">
|
||||
<img class="question-icon" ref="./{{id}}.svg" src="./{{id}}.svg" />
|
||||
<p class="question-message f-u-bold">
|
||||
<span data-msgid="textbox_id-7">{{title}}</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="answer-border-{{id}}" class="answer-border-outer is-hidden">
|
||||
<div class="l-main">
|
||||
<ul class="l-grid" id="{{id}}">
|
||||
{{#toggles}}
|
||||
<li class="l-item" val="{{value}}">
|
||||
<div class="keyword-button-outer">
|
||||
<a tabindex="{{index}}" class="flex-button keyword-button scuffle-thema" href="javascript:void(0)" onclick="clickToggle(this);" nx-se-disabled="">
|
||||
<div class="button-icon-wrapper">
|
||||
<img class="button-icon toggle {{checked}} {{#is_single_option}}is-single-option{{/is_single_option}}" ref="./check.svg" src="./check.svg" default="{{default}}">
|
||||
</div>
|
||||
<div class="button-msg-wrapper">
|
||||
<div class="keyword-message f-u-bold">
|
||||
{{title}}
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</li>
|
||||
{{/toggles}}
|
||||
{{#sliders}}
|
||||
<li class="l-item" val="{{value}}">
|
||||
<div class="keyword-button-outer">
|
||||
<a tabindex="{{index}}" class="flex-button keyword-button scuffle-thema" href="javascript:void(0)" onclick="clickToggle(this);" nx-se-disabled="">
|
||||
<div class="button-icon-wrapper">
|
||||
<img class="button-icon toggle {{checked}}" ref="./check.svg" src="./check.svg">
|
||||
</div>
|
||||
<div class="button-msg-wrapper">
|
||||
<div class="keyword-message f-u-bold">
|
||||
<div name='range_slider' oninput="this.nextElementSibling.value = this.value">
|
||||
</div>
|
||||
<output>{{value}}</output>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</li>
|
||||
{{/sliders}}
|
||||
{{#range_sliders}}
|
||||
<li class="l-item" val="{{value}}">
|
||||
<div class="keyword-button-outer">
|
||||
<a tabindex="{{index}}" class="flex-button keyword-button scuffle-thema" href="javascript:void(0)" onclick="clickToggle(this);" nx-se-disabled="">
|
||||
<div class="button-icon-wrapper">
|
||||
<img class="button-icon toggle {{checked}}" ref="./check.svg" src="./check.svg">
|
||||
</div>
|
||||
<div class="button-msg-wrapper">
|
||||
<div class="keyword-message f-u-bold">
|
||||
<div name="{{id}}">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</li>
|
||||
{{/range_sliders}}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
{{/onoffselector}}
|
||||
{{#onoffselector}}
|
||||
<a id="qa-{{id}}" class="qa" tabindex="{{index}}" href="javascript:void(0);" onfocus="focusQA(this);setHelpText({{help_text}})" onblur="defocusQA(this)" onclick="clickToggle(this)" nx-se-disabled="">
|
||||
<div class="question-outer">
|
||||
<div class="question-border">
|
||||
<div id="question-{{id}}" class="question scuffle-thema">
|
||||
<div id="{{id}}" class="onoff">
|
||||
<img class="question-icon" style="z-index: 1;" ref="./{{id}}.svg" src="./{{id}}.svg" />
|
||||
<div><img class="question-icon toggle {{checked}}" style="z-index: 2;" ref="./check.svg" src="./check.svg" default="{{default}}"/></div>
|
||||
<p class="keyword-message f-u-bold">
|
||||
{{title}}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
{{/onoffselector}}
|
||||
</div>
|
||||
{{/sub_menus}}
|
||||
</div>
|
||||
{{#sub_menus}}
|
||||
{{#sliders}}
|
||||
<script>
|
||||
// todo: loop through
|
||||
noUiSlider.create(document.getElementsByName('range_slider')[0], {
|
||||
start: {{ value }},
|
||||
range: {
|
||||
'min': {{ min }},
|
||||
'max': {{ max }}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
{{/sliders}}
|
||||
{{/sub_menus}}
|
||||
<footer id="footer" class="footer l-footer f-u-bold">
|
||||
<p id="help-text" class="header-desc"></p>
|
||||
<div class="defaults-checkbox-container">
|
||||
<label class="header-desc" for="saveDefaults">Save defaults: </label>
|
||||
<input type="checkbox" id="saveDefaults">
|
||||
<div class="checkbox-display"></div>
|
||||
</div>
|
||||
</footer>
|
||||
<script>
|
||||
if (isNx) {
|
||||
window.nx.footer.setAssign('B', '', goBackHook, {
|
||||
se: ''
|
||||
})
|
||||
window.nx.footer.setAssign('X', '', resetSubmenu, {
|
||||
se: ''
|
||||
})
|
||||
window.nx.footer.setAssign('L', '', resetAllSubmenus, {
|
||||
se: ''
|
||||
})
|
||||
window.nx.footer.setAssign('R', '', toggleSaveDefaults, {
|
||||
se: ''
|
||||
})
|
||||
}
|
||||
function goBackHook() {
|
||||
// If any submenus are open, close them
|
||||
// Otherwise if all submenus are closed, exit the menu and return to the game
|
||||
if ($(".qa.is-opened").length == 0) {
|
||||
// If all submenus are closed, exit and return through localhost
|
||||
$('.is-focused').addClass('is-pause-anim')
|
||||
$('#ret-button').addClass('is-focus')
|
||||
|
||||
disabledOtherLink()
|
||||
|
||||
playSound('cancel')
|
||||
|
||||
var url = "http://localhost/"
|
||||
|
||||
var settings = [];
|
||||
|
||||
// Collect settings for toggles
|
||||
$("ul.l-grid").each(function () {
|
||||
var section = this.id;
|
||||
var val = "";
|
||||
|
||||
var children = this.children;
|
||||
for (var i = 0; i < children.length; i++) {
|
||||
var child = children[i];
|
||||
if ($(child).find(".is-appear").length) {
|
||||
val += child.getAttribute("val") + ",";
|
||||
};
|
||||
}
|
||||
|
||||
settings.push({
|
||||
name: section,
|
||||
value: val
|
||||
});
|
||||
});
|
||||
|
||||
// Collect settings for OnOffs
|
||||
$("div.onoff").each(function () {
|
||||
var section = this.id;
|
||||
var val = "";
|
||||
if ($(this).find(".is-appear").length) {
|
||||
val = "1"
|
||||
} else {
|
||||
val = "0"
|
||||
}
|
||||
settings.push({
|
||||
name: section,
|
||||
value: val
|
||||
});
|
||||
});
|
||||
|
||||
url += "?" + decodeURIComponent($.param(settings));
|
||||
if ($("#saveDefaults").prop("checked")) {
|
||||
url += "&save_defaults=1";
|
||||
}
|
||||
// console.log(url);
|
||||
location.href = url;
|
||||
|
||||
fadeOutPage(function () {
|
||||
window.history.back()
|
||||
})
|
||||
} else {
|
||||
// Close any open submenus
|
||||
$(".qa.is-opened").each(function () { openAnswer(this); });
|
||||
}
|
||||
}
|
||||
|
||||
function clickToggle(e) {
|
||||
var toggleOptions = $(e).find(".toggle");
|
||||
if ($(e).find(".is-single-option").length) { // Single-option submenu
|
||||
// Deselect all submenu options
|
||||
$(e).closest(".l-qa").find(".toggle").removeClass("is-appear");
|
||||
$(e).closest(".l-qa").find(".toggle").addClass("is-hidden");
|
||||
// Then set the current one as the active setting
|
||||
toggleOptions.addClass("is-appear");
|
||||
toggleOptions.removeClass("is-hidden");
|
||||
} else { // Multi-option submenu
|
||||
toggleOptions.toggleClass("is-appear");
|
||||
toggleOptions.toggleClass("is-hidden");
|
||||
}
|
||||
}
|
||||
|
||||
function getParams(url) {
|
||||
var regex = /[?&]([^=#]+)=([^&#]*)/g,
|
||||
params = {},
|
||||
match;
|
||||
while(match = regex.exec(url)) {
|
||||
params[match[1]] = match[2];
|
||||
}
|
||||
return params;
|
||||
}
|
||||
|
||||
function setSettings() {
|
||||
// Get settings from the URL GET parameters
|
||||
const settings = getParams(document.URL);
|
||||
|
||||
// Set Toggles
|
||||
$("ul.l-grid").each(function () {
|
||||
var section = this.id;
|
||||
var section_setting = decodeURIComponent(settings[section]);
|
||||
|
||||
var children = $(this).children("li");
|
||||
for (var i = 0; i < children.length; i++) {
|
||||
var child = children[i];
|
||||
var e = $(child).find("img.toggle");
|
||||
if (section_setting.split(",").includes(child.getAttribute("val"))) {
|
||||
e.addClass("is-appear");
|
||||
e.removeClass("is-hidden");
|
||||
} else {
|
||||
e.removeClass("is-appear");
|
||||
e.addClass("is-hidden");
|
||||
};
|
||||
}
|
||||
});
|
||||
|
||||
// Set OnOffs
|
||||
$("div.onoff").each(function () {
|
||||
var section = this.id;
|
||||
var section_setting = decodeURIComponent(settings[section]);
|
||||
var e = $(this).find("img.toggle");
|
||||
if (section_setting == "1") {
|
||||
e.addClass("is-appear");
|
||||
e.removeClass("is-hidden");
|
||||
} else {
|
||||
e.removeClass("is-appear");
|
||||
e.addClass("is-hidden");
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
function resetSubmenu() {
|
||||
// Resets any open or focused submenus to the default values
|
||||
$("[default*='is-appear']").each(function () {
|
||||
if (isSubmenuFocused(this)) {
|
||||
$(this).addClass("is-appear");
|
||||
$(this).removeClass("is-hidden");
|
||||
}
|
||||
});
|
||||
$("[default*='is-hidden']").each(function() {
|
||||
if (isSubmenuFocused(this)) {
|
||||
$(this).removeClass("is-appear");
|
||||
$(this).addClass("is-hidden");
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function isSubmenuFocused(elem) {
|
||||
// Return true if the element is in a submenu which is either focused or opened
|
||||
return (
|
||||
$(elem).closest(".l-qa").children(".is-opened, .is-focused").length
|
||||
|| $(elem).closest(".is-focused").length
|
||||
)
|
||||
}
|
||||
|
||||
function resetAllSubmenus() {
|
||||
// Resets all submenus to the default values
|
||||
if (confirm("Are you sure that you want to reset all menu settings to the default?")) {
|
||||
$("[default*='is-appear']").addClass("is-appear");
|
||||
$("[default*='is-appear']").removeClass("is-hidden");
|
||||
|
||||
$("[default*='is-hidden']").removeClass("is-appear");
|
||||
$("[default*='is-hidden']").addClass("is-hidden");
|
||||
}
|
||||
}
|
||||
|
||||
function setHelpText(text) {
|
||||
// Modify the help text in the footer
|
||||
$("#help-text").text(text);
|
||||
}
|
||||
|
||||
function toggleSaveDefaults() {
|
||||
// Change the status of the Save Defaults checkbox
|
||||
var saveDefaultsCheckbox = $("#saveDefaults");
|
||||
saveDefaultsCheckbox.prop(
|
||||
"checked",
|
||||
!saveDefaultsCheckbox.prop("checked")
|
||||
);
|
||||
}
|
||||
</script>
|
||||
<script>
|
||||
window.onload = setSettings;
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
|
||||
<title>Document</title>
|
||||
<link rel="stylesheet" href="./css/training_modpack.css" />
|
||||
</head>
|
||||
|
||||
<body id="body">
|
||||
<script defer src="./js/training_modpack.js"></script>
|
||||
<div class="l-header">
|
||||
<div class="l-header-title">
|
||||
<div class="header-title"><span>Ultimate Training Modpack Menu</span></div>
|
||||
</div>
|
||||
<div class="header" style="flex-grow: 1;">
|
||||
<a id="ret-button" tabindex="-1" class="header-decoration" href="javascript:goBackHook();">
|
||||
<div class="ret-icon-wrapper">
|
||||
<img class="ret-icon is-appear" src="./img/m_retnormal.svg">
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="header" style="flex-direction: column; justify-content: center; align-items: end; padding-right: 10px;">
|
||||
<p class="header-desc">Reset Current Menu: </p>
|
||||
<p class="header-desc">Reset All Menus: </p>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
|
||||
<div class="l-grid">
|
||||
|
||||
<!--
|
||||
Script the part below via templating. Overall structure is perhaps
|
||||
[
|
||||
l-qa qa [id=qa-{{menuName}} tabindex="{{index}}"] {
|
||||
// make question for {{menuName}}
|
||||
// make answer with l-grid : l-item list for options
|
||||
},
|
||||
...
|
||||
]
|
||||
|
||||
|
||||
Remember to set make max keyword size greater than 23!
|
||||
-->
|
||||
{{#sub_menus}}
|
||||
<div class="l-qa">
|
||||
{{^onoffselector}}
|
||||
<a id="qa-{{id}}" class="qa" tabindex="{{index}}" href="javascript:void(0);" onfocus="focusQA(this);setHelpText({{help_text}})" onblur="defocusQA(this)" onclick="toggleAnswer(this)">
|
||||
<div class="question-outer">
|
||||
<div class="question-border">
|
||||
<div id="question-{{id}}" class="question scuffle-thema">
|
||||
<img class="question-icon" src="./img/{{id}}.svg" />
|
||||
<p class="question-message">
|
||||
<span>{{title}}</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
<div id="answer-border-{{id}}" class="answer-border-outer is-hidden">
|
||||
<div class="l-main">
|
||||
<ul class="l-grid" id="{{id}}">
|
||||
{{#toggles}}
|
||||
<li class="l-item" val="{{value}}">
|
||||
<div class="keyword-button-outer">
|
||||
<a tabindex="{{index}}" class="flex-button keyword-button scuffle-thema" href="javascript:void(0)" onclick="clickToggle(this);">
|
||||
<div class="button-icon-wrapper">
|
||||
<img class="button-icon toggle {{checked}} {{#is_single_option}}is-single-option{{/is_single_option}}" src="./img/check.svg" default="{{default}}">
|
||||
</div>
|
||||
<div class="button-msg-wrapper">
|
||||
<div class="keyword-message">
|
||||
{{title}}
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</li>
|
||||
{{/toggles}}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
{{/onoffselector}}
|
||||
{{#onoffselector}}
|
||||
<a id="qa-{{id}}" class="qa" tabindex="{{index}}" href="javascript:void(0);" onfocus="focusQA(this);setHelpText({{help_text}})" onblur="defocusQA(this)" onclick="clickToggle(this)">
|
||||
<div class="question-outer">
|
||||
<div class="question-border">
|
||||
<div id="question-{{id}}" class="question scuffle-thema">
|
||||
<div id="{{id}}" class="onoff">
|
||||
<img class="question-icon" style="z-index: 1;" src="./img/{{id}}.svg" />
|
||||
<div><img class="question-icon toggle {{checked}}" style="z-index: 2;" src="./img/check.svg" default="{{default}}"/></div>
|
||||
<p class="question-message">
|
||||
<span>{{title}}</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
{{/onoffselector}}
|
||||
</div>
|
||||
{{/sub_menus}}
|
||||
</div>
|
||||
<footer id="footer" class="footer l-footer">
|
||||
<p id="help-text" class="header-desc"></p>
|
||||
<div class="defaults-checkbox-container">
|
||||
<label class="header-desc" for="saveDefaults">Save defaults: </label>
|
||||
<input type="checkbox" id="saveDefaults">
|
||||
<div class="checkbox-display"></div>
|
||||
</div>
|
||||
</footer>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -9,12 +9,12 @@ fn write_menu() {
|
|||
use crate::common::menu::write_menu;
|
||||
use std::process::Command;
|
||||
|
||||
let folder_path = "../contents.htdocs";
|
||||
let path = "../contents.htdocs/training_menu.html";
|
||||
let folder_path = "../training_modpack.htdocs";
|
||||
let path = "../training_modpack.htdocs/training_menu.html";
|
||||
|
||||
assert!(
|
||||
std::path::Path::new(folder_path).exists(),
|
||||
"Needs required folder: ../contents.htdocs!"
|
||||
"Needs required folder: ../training_modpack.htdocs!"
|
||||
);
|
||||
|
||||
std::fs::write(path, write_menu()).unwrap();
|
||||
|
|
|
|||
Loading…
Reference in a new issue