Weishen/Hydro
2
0 Fork 0
mirror of https://gitcode.com/gh_mirrors/hy/Hydro.git synced 2026-10-20 01:38:19 +08:00
Code Issues Packages Projects Releases Wiki Activity

ui: enhance language selection

Browse Source
This commit is contained in:
undefined committed 2021-05-07 22:22:24 +08:00
1 parent 377ef55d49
commit 80ac44d98e
17 files changed
+201 -70
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

packages/ui-default/handler.js
+11 -17
View File
@@ -2,12 +2,13 @@
const { readdirSync, readFileSync } = require('fs');
const { join } = require('path');
const crypto = require('crypto');
const yaml = require('js-yaml');
const { tmpdir } = require('os');
const bus = require('hydrooj/dist/service/bus');
const markdown = require('./backendlib/markdown.js');
const { system, domain, user } = global.Hydro.model;
const {
system, domain, user, setting,
} = global.Hydro.model;
const { Route, Handler, UiContextBase } = global.Hydro.service.server;
class WikiHelpHandler extends Handler {
@@ -17,20 +18,13 @@ class WikiHelpHandler extends Handler {
}
async get() {
const [langstr, langtexts] = system.getMany(['hydrojudge.langs', 'lang.texts']);
if (langstr) {
const languages = {};
const LANGS = yaml.load(langstr);
const TEXTS = yaml.load(langtexts);
// eslint-disable-next-line guard-for-in
for (const key in LANGS) {
const name = TEXTS[key] || key;
languages[name] = LANGS[key].type === 'compiler'
? LANGS[key].compile
: LANGS[key].execute;
}
this.response.body = { languages };
const LANGS = system.get('hydrooj.langs');
const languages = {};
// eslint-disable-next-line guard-for-in
for (const key in LANGS) {
languages[LANGS[key].display] = LANGS[key].compile || LANGS[key].execute;
}
this.response.body = { languages };
this.response.template = 'wiki_help.html';
}
}
@@ -53,7 +47,7 @@ class UiConstantsHandler extends Handler {
}
async get() {
this.response.body = `window.LANGS=${JSON.stringify(system.langs)}`;
this.response.body = `window.LANGS=${JSON.stringify(setting.langs)}`;
this.response.type = 'text/javascript';
this.ctx.set('nolog', '1');
}
@@ -71,7 +65,7 @@ class UiSettingsHandler extends Handler {
nav_logo_dark, nav_logo_light,
nav_logo_dark_2x, nav_logo_light_2x,
header_background, header_background_2x,
] = await system.getMany([
] = system.getMany([
'ui-default.header_logo', 'ui-default.header_logo_2x',
'ui-default.nav_logo_dark', 'ui-default.nav_logo_light',
'ui-default.nav_logo_dark_2x', 'ui-default.nav_logo_light_2x',
packages/ui-default/package.json
+2 -2
View File
@@ -1,6 +1,6 @@
{
"name": "@hydrooj/ui-default",
"version": "4.8.0",
"version": "4.8.1",
"author": "undefined <i@undefined.moe>",
"license": "AGPL-3.0",
"main": "hydro.js",
@@ -22,7 +22,7 @@
"@babel/preset-react": "^7.13.13",
"@babel/register": "^7.13.14",
"@babel/runtime-corejs2": "^7.14.0",
"@hydrooj/utils": "^1.0.14",
"@hydrooj/utils": "^1.0.15",
"ansi_up": "^5.0.1",
"autoprefixer": "^9.8.6",
"babel-loader": "^8.2.2",
packages/ui-default/pages/home_preference.page.jsx
+61
View File
@@ -2,6 +2,7 @@ import { NamedPage } from 'vj/misc/Page';
import load from 'vj/components/wastyle/index';
import code from 'vj/components/highlighter/code-example';
import i18n from 'vj/utils/i18n';
import tpl from 'vj/utils/tpl';
const page = new NamedPage('home_preference', async () => {
async function mountComponent() {
@@ -60,6 +61,66 @@ const page = new NamedPage('home_preference', async () => {
}
}
function setOptions($el, options) {
$el.empty();
$.each(options, (key, value) => {
$el.append($('<option></option>').attr('value', key).text(value));
});
}
const $el = $(tpl`\
<div class="row">
<div class="medium-5 columns form__item end">
<label>
${i18n('Code language')}
<div name="form_item_lang" class="select-container">
<select id="codelang-main-select" class="select"></select>
</div>
</label>
</div>
<div class="medium-5 columns form__item end" style="display: none" id="codelang-sub-container">
<label>
${i18n('Code language')}
<div name="form_item_lang" class="select-container">
<select id="codelang-sub-select" class="select"></select>
</div>
</label>
</div>
</div>
`);
$('[name="codeLang"]')
.parent().parent().parent()
.parent()
.hide()
.after($el);
$('#codelang-main-select').on('change', function () {
$('[name="codeLang"]').val(this.value);
const options = {};
for (const key in window.LANGS) {
if (`${key.startsWith(this.value)}.` && key !== this.value) options[key] = window.LANGS[key].display;
}
if (Object.keys(options).length > 1) {
setOptions($('#codelang-sub-select'), options);
$('#codelang-sub-container').show();
} else $('#codelang-sub-container').hide();
});
$('#codelang-sub-select').on('change', function () {
$('[name="codeLang"]').val(this.value);
});
const main = {};
for (const key in window.LANGS) {
if (!key.includes('.')) main[key] = window.LANGS[key].display;
}
setOptions($('#codelang-main-select'), main);
const current = $('[name="codeLang"]').val();
console.log(current);
if (current.includes('.')) {
const [m, s] = current.split('.');
$('#codelang-main-select').val(m);
$('#codelang-sub-select').val(s);
} else $('#codelang-main-select').val(current);
if (success) {
render(
<AstylePreview></AstylePreview>,
packages/ui-default/pages/problem_submit.page.js
+33
View File
@@ -1,10 +1,43 @@
import { NamedPage } from 'vj/misc/Page';
function setOptions($el, options) {
$el.empty();
$.each(options, (key, value) => {
$el.append($('<option></option>').attr('value', key).text(value));
});
}
const page = new NamedPage('problem_submit', async () => {
$(document).on('click', '[name="problem-sidebar__show-category"]', (ev) => {
$(ev.currentTarget).hide();
$('[name="problem-sidebar__categories"]').show();
});
$('#codelang-main-select').on('change', function () {
$('[name="lang"]').val(this.value);
const options = {};
for (const key in window.LANGS) {
if (`${key.startsWith(this.value)}.` && key !== this.value) options[key] = window.LANGS[key].display;
}
if (Object.keys(options).length > 1) {
setOptions($('#codelang-sub-select'), options);
$('#codelang-sub-container').show();
} else $('#codelang-sub-container').hide();
});
$('#codelang-sub-select').on('change', function () {
$('[name="lang"]').val(this.value);
});
const main = {};
for (const key in window.LANGS) {
if (!key.includes('.')) main[key] = window.LANGS[key].display;
}
setOptions($('#codelang-main-select'), main);
const current = $('[name="lang"]').val();
console.log(current);
if (current.includes('.')) {
const [m, s] = current.split('.');
$('#codelang-main-select').val(m);
$('#codelang-sub-select').val(s);
} else $('#codelang-main-select').val(current);
});
export default page;
packages/ui-default/templates/components/form.html
+2
View File
@@ -50,6 +50,7 @@
{% set noAutocomplete = args.noAutocomplete or false %}
{% set extra_style = args.extra_style or false %}
{% set extra_class = args.extra_class %}
{% set extra_attr = args.extra_attr %}
{% set date = args.date or false %}
{% set time = args.time or false %}
class="{{ form_class }}{% if extra_class %} {{ extra_class }}{% endif %}"
@@ -59,6 +60,7 @@
{% if noAutocomplete %}autocomplete="off"{% endif %}
{% if date %}data-pick-date{% endif %}
{% if time %}data-pick-time{% endif %}
{% if extra_attr %}{{ extra_attr }}{% endif %}
{% if extra_style %}style="{{extra_style}}"{% endif %}
{% endmacro %}
packages/ui-default/templates/problem_submit.html
+26 -6
View File
@@ -42,12 +42,32 @@
</div>
<div class="section__body">
<form method="post">
{{ form.form_select({
label:'Code language',
options:model.system.get('lang.texts')|parseYaml,
name:'lang',
value:handler.user.codeLang
}) }}
<div class="hasjs--hide">
{{ form.form_select({
label:'Code language',
options:model.setting.SETTINGS_BY_KEY['codeLang'].range,
name:'lang',
value:handler.user.codeLang
}) }}
</div>
<div class="row nojs--hide">
<div class="medium-5 columns form__item end">
<label>
{{ _('Code language') }}
<div name="form_item_lang" class="select-container">
<select id="codelang-main-select" class="select"></select>
</div>
</label>
</div>
<div class="medium-5 columns form__item end" style="display: none" id="codelang-sub-container">
<label>
{{ _('Code language') }}
<div name="form_item_lang" class="select-container">
<select id="codelang-sub-select" class="select"></select>
</div>
</label>
</div>
</div>
{{ form.form_textarea({label:'Code', columns:12, name:'code', extra_class:'monospace', autofocus:true}) }}
<div class="row"><div class="columns">
<input type="hidden" name="csrfToken" value="{{ handler.csrfToken }}">
packages/ui-default/templates/record_detail.html
+1 -1
View File
@@ -63,7 +63,7 @@
{% endif %}
<dt>{{ _('Language') }}</dt>
<dd>
{{ (model.system.get('lang.texts')|parseYaml)[rdoc['lang']] }}
{{ model.setting.langs[rdoc.lang].display }}
</dd>
<dt>
{{ _('Submit At') }}
packages/ui-default/templates/record_main_tr.html
+1 -1
View File
@@ -30,6 +30,6 @@
</td>
<td class="col--time">{% if rdoc['status'] == STATUS.STATUS_TIME_LIMIT_EXCEEDED or rdoc['status'] == STATUS.STATUS_MEMORY_LIMIT_EXCEEDED or rdoc['status'] == STATUS.STATUS_OUTPUT_LIMIT_EXCEEDED %}&ge;{% endif %}{{ rdoc.time|round|int }}ms</td>
<td class="col--memory">{% if rdoc['status'] == STATUS.STATUS_TIME_LIMIT_EXCEEDED or rdoc['status'] == STATUS.STATUS_MEMORY_LIMIT_EXCEEDED or rdoc['status'] == STATUS.STATUS_OUTPUT_LIMIT_EXCEEDED %}&ge;{% endif %}{{ size(rdoc.memory, 1024) }}</td>
<td class="col--lang">{{ (model.system.get('lang.texts')|parseYaml)[rdoc['lang']] }}</td>
<td class="col--lang">{{ model.setting.langs[rdoc['lang']].display }}</td>
<td class="col--submit-at">{{ datetimeSpan(rdoc['_id'])|safe }}</td>
</tr>