Replace jquery-datetimepicker with native date input (#11684)

This removes the jQuery plugin as well as the associated config options.
Native input[type=date] does not require a language attribute as it is
localized by default, except for the placeholder attribute for which I
currently piggy-back the repo.issues.due_date_form localization option.

Implementation should pretty much match GH. Of note is that Safari does
not provide a UI for this input type, but I don't think providing one is
neccessary and GH did not bother either.

Co-authored-by: techknowlogick <techknowlogick@gitea.io>
This commit is contained in:
silverwind 2020-06-10 20:35:27 +02:00 committed by GitHub
parent 42752f3902
commit 628ee1d82e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
17 changed files with 10 additions and 232 deletions

View file

@ -17,7 +17,7 @@ SCRIPT_TYPE = bash
; DETECTED_CHARSETS_ORDER tie-break order for detected charsets.
; If the charsets have equal confidence, tie-breaking will be done by order in this list
; with charsets earlier in the list chosen in preference to those later.
; Adding "defaults" will place the unused charsets at that position.
; Adding "defaults" will place the unused charsets at that position.
DETECTED_CHARSETS_ORDER=UTF-8, UTF-16BE, UTF-16LE, UTF-32BE, UTF-32LE, ISO-8859, windows-1252, ISO-8859, windows-1250, ISO-8859, ISO-8859, ISO-8859, windows-1253, ISO-8859, windows-1255, ISO-8859, windows-1251, windows-1256, KOI8-R, ISO-8859, windows-1254, Shift_JIS, GB18030, EUC-JP, EUC-KR, Big5, ISO-2022, ISO-2022, ISO-2022, IBM424_rtl, IBM424_ltr, IBM420_rtl, IBM420_ltr
; Default ANSI charset to override non-UTF-8 charsets to
ANSI_CHARSET =
@ -634,8 +634,8 @@ SUBJECT_PREFIX =
; Mail server
; Gmail: smtp.gmail.com:587
; QQ: smtp.qq.com:465
; Using STARTTLS on port 587 is recommended per RFC 6409.
; Note, if the port ends with "465", SMTPS will be used.
; Using STARTTLS on port 587 is recommended per RFC 6409.
; Note, if the port ends with "465", SMTPS will be used.
HOST =
; Disable HELO operation when hostnames are different.
DISABLE_HELO =
@ -950,32 +950,6 @@ MAX_TOKEN_LENGTH=32767
LANGS = en-US,zh-CN,zh-HK,zh-TW,de-DE,fr-FR,nl-NL,lv-LV,ru-RU,uk-UA,ja-JP,es-ES,pt-BR,pt-PT,pl-PL,bg-BG,it-IT,fi-FI,tr-TR,cs-CZ,sr-SP,sv-SE,ko-KR
NAMES = English,简体中文,繁體中文(香港),繁體中文(台灣),Deutsch,français,Nederlands,latviešu,русский,Українська,日本語,español,português do Brasil,Português de Portugal,polski,български,italiano,suomi,Türkçe,čeština,српски,svenska,한국어
; Used for datetimepicker
[i18n.datelang]
en-US = en
zh-CN = zh
zh-HK = zh-HK
zh-TW = zh-TW
de-DE = de
fr-FR = fr
nl-NL = nl
lv-LV = lv
ru-RU = ru
uk-UA = uk
ja-JP = ja
es-ES = es
pt-BR = pt-BR
pt-PT = pt
pl-PL = pl
bg-BG = bg
it-IT = it
fi-FI = fi
tr-TR = tr
cs-CZ = cs-CZ
sr-SP = sr
sv-SE = sv
ko-KR = ko
[U2F]
; NOTE: THE DEFAULT VALUES HERE WILL NEED TO BE CHANGED
; Two Factor authentication with security keys

View file

@ -614,32 +614,6 @@ NB: You must `REDIRECT_MACARON_LOG` and have `DISABLE_ROUTER_LOG` set to `false`
- `LANGS`: **en-US,zh-CN,zh-HK,zh-TW,de-DE,fr-FR,nl-NL,lv-LV,ru-RU,ja-JP,es-ES,pt-BR,pt-PT,pl-PL,bg-BG,it-IT,fi-FI,tr-TR,cs-CZ,sr-SP,sv-SE,ko-KR**: List of locales shown in language selector
- `NAMES`: **English,简体中文,繁體中文(香港),繁體中文(台灣),Deutsch,français,Nederlands,latviešu,русский,日本語,español,português do Brasil,Português de Portugal,polski,български,italiano,suomi,Türkçe,čeština,српски,svenska,한국어**: Visible names corresponding to the locales
### i18n - Datepicker Language (`i18n.datelang`)
Maps locales to the languages used by the datepicker plugin
- `en-US`: **en**
- `zh-CN`: **zh**
- `zh-HK`: **zh-HK**
- `zh-TW`: **zh-TW**
- `de-DE`: **de**
- `fr-FR`: **fr**
- `nl-NL`: **nl**
- `lv-LV`: **lv**
- `ru-RU`: **ru**
- `ja-JP`: **ja**
- `es-ES`: **es**
- `pt-BR`: **pt-BR**
- `pt-PT`: **pt**
- `pl-PL`: **pl**
- `bg-BG`: **bg**
- `it-IT`: **it**
- `fi-FI`: **fi**
- `tr-TR`: **tr**
- `cs-CZ`: **cs-CZ**
- `sr-SP`: **sr**
- `sv-SE`: **sv**
- `ko-KR`: **ko**
## U2F (`U2F`)
- `APP_ID`: **`ROOT_URL`**: Declares the facet of the application. Requires HTTPS.
- `TRUSTED_FACETS`: List of additional facets which are trusted. This is not support by all browsers.

View file

@ -276,7 +276,6 @@ Windows, on architectures like amd64, i386, ARM, PowerPC, and others.
* [Highlight](https://highlightjs.org/)
* [Clipboard](https://zenorocha.github.io/clipboard.js/)
* [CodeMirror](https://codemirror.net/)
* [jQuery Date Time Picker](https://github.com/xdan/datetimepicker)
* [jQuery MiniColors](https://github.com/claviska/jquery-minicolors)
* Database drivers:
* [github.com/go-sql-driver/mysql](https://github.com/go-sql-driver/mysql)

View file

@ -264,7 +264,6 @@ Le but de ce projet est de fournir de la manière la plus simple, la plus rapide
* [Highlight](https://highlightjs.org/)
* [Clipboard](https://zenorocha.github.io/clipboard.js/)
* [CodeMirror](https://codemirror.net/)
* [jQuery Date Time Picker](https://github.com/xdan/datetimepicker)
* [jQuery MiniColors](https://github.com/claviska/jquery-minicolors)
* Connecteurs de base de données :
* [github.com/go-sql-driver/mysql](https://github.com/go-sql-driver/mysql)

View file

@ -57,7 +57,6 @@ Gitea的首要目标是创建一个极易安装运行非常快速安装和
* [Highlight](https://highlightjs.org/)
* [Clipboard](https://zenorocha.github.io/clipboard.js/)
* [CodeMirror](https://codemirror.net/)
* [jQuery Date Time Picker](https://github.com/xdan/datetimepicker)
* [jQuery MiniColors](https://github.com/claviska/jquery-minicolors)
* 数据库驱动:
* [github.com/go-sql-driver/mysql](https://github.com/go-sql-driver/mysql)

View file

@ -57,7 +57,6 @@ Gitea 的首要目標是建立一個容易安裝,運行快速,安装和使
* [Highlight](https://highlightjs.org/)
* [Clipboard](https://zenorocha.github.io/clipboard.js/)
* [CodeMirror](https://codemirror.net/)
* [jQuery Date Time Picker](https://github.com/xdan/datetimepicker)
* [jQuery MiniColors](https://github.com/claviska/jquery-minicolors)
* 資料庫:
* [github.com/go-sql-driver/mysql](https://github.com/go-sql-driver/mysql)

View file

@ -367,9 +367,8 @@ var (
}
// I18n settings
Langs []string
Names []string
dateLangs map[string]string
Langs []string
Names []string
// Highlight settings are loaded in modules/template/highlight.go
@ -394,15 +393,6 @@ var (
UILocation = time.Local
)
// DateLang transforms standard language locale name to corresponding value in datetime plugin.
func DateLang(lang string) string {
name, ok := dateLangs[lang]
if ok {
return name
}
return "en"
}
func getAppPath() (string, error) {
var appPath string
var err error
@ -1012,7 +1002,6 @@ func NewContext() {
"español", "português do Brasil", "Português de Portugal", "polski", "български",
"italiano", "suomi", "Türkçe", "čeština", "српски", "svenska", "한국어"}
}
dateLangs = Cfg.Section("i18n.datelang").KeysHash()
ShowFooterBranding = Cfg.Section("other").Key("SHOW_FOOTER_BRANDING").MustBool(false)
ShowFooterVersion = Cfg.Section("other").Key("SHOW_FOOTER_VERSION").MustBool(true)

36
package-lock.json generated
View file

@ -7157,22 +7157,6 @@
"resolved": "https://registry.npmjs.org/import-regex/-/import-regex-1.1.0.tgz",
"integrity": "sha1-pVxS5McFx2XKIQ6SQqBrvMiqf2Y="
},
"imports-loader": {
"version": "0.8.0",
"resolved": "https://registry.npmjs.org/imports-loader/-/imports-loader-0.8.0.tgz",
"integrity": "sha512-kXWL7Scp8KQ4552ZcdVTeaQCZSLW+e6nJfp3cwUMB673T7Hr98Xjx5JK+ql7ADlJUvj1JS5O01RLbKoutN5QDQ==",
"requires": {
"loader-utils": "^1.0.2",
"source-map": "^0.6.1"
},
"dependencies": {
"source-map": {
"version": "0.6.1",
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
"integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g=="
}
}
},
"imurmurhash": {
"version": "0.1.4",
"resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz",
@ -7745,21 +7729,6 @@
"resolved": "https://registry.npmjs.org/jquery/-/jquery-3.5.1.tgz",
"integrity": "sha512-XwIBPqcMn57FxfT+Go5pzySnm4KWkT1Tv7gjrpT1srtf8Weynl6R273VJ5GjkRb51IzMp5nbaPjJXMWeju2MKg=="
},
"jquery-datetimepicker": {
"version": "2.5.21",
"resolved": "https://registry.npmjs.org/jquery-datetimepicker/-/jquery-datetimepicker-2.5.21.tgz",
"integrity": "sha512-wDTpZ4f1PWd1XGaIIE0n6jLynlm+akBJ7/NjaB1bk2UJSS593CHJPZ3+FNEXoyvNVUeBlBC0oX6WTfCyfUhX/w==",
"requires": {
"jquery": ">= 1.7.2",
"jquery-mousewheel": ">= 3.1.13",
"php-date-formatter": "^1.3.4"
}
},
"jquery-mousewheel": {
"version": "3.1.13",
"resolved": "https://registry.npmjs.org/jquery-mousewheel/-/jquery-mousewheel-3.1.13.tgz",
"integrity": "sha1-BvAzXxbjU6aV5yBr9QUDy1I6buU="
},
"jquery.are-you-sure": {
"version": "1.9.0",
"resolved": "https://registry.npmjs.org/jquery.are-you-sure/-/jquery.are-you-sure-1.9.0.tgz",
@ -9845,11 +9814,6 @@
"resolved": "https://registry.npmjs.org/performance-now/-/performance-now-2.1.0.tgz",
"integrity": "sha1-Ywn04OX6kT7BxpMHrjZLSzd8nns="
},
"php-date-formatter": {
"version": "1.3.4",
"resolved": "https://registry.npmjs.org/php-date-formatter/-/php-date-formatter-1.3.4.tgz",
"integrity": "sha1-CaFa4HZroL6xkAwnwewxnvLkVj4="
},
"picomatch": {
"version": "2.2.2",
"resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.2.2.tgz",

View file

@ -22,9 +22,7 @@
"file-loader": "6.0.0",
"fomantic-ui": "2.8.5",
"highlight.js": "10.0.3",
"imports-loader": "0.8.0",
"jquery": "3.5.1",
"jquery-datetimepicker": "2.5.21",
"jquery.are-you-sure": "1.9.0",
"less-loader": "6.1.0",
"mini-css-extract-plugin": "0.9.0",

View file

@ -60,11 +60,6 @@
<td><a href="https://github.com/highlightjs/highlight.js/blob/master/LICENSE">BSD 3-Clause</a></td>
<td><a href="https://github.com/highlightjs/highlight.js/archive/9.18.0.tar.gz">highlight.js.tar.gz</a></td>
</tr>
<tr>
<td><a href="../js/datetimepicker.js">jQuery DateTimePicker</a></td>
<td><a href="https://github.com/xdan/datetimepicker/blob/master/MIT-LICENSE.txt">MIT</a></td>
<td><a href="https://github.com/xdan/datetimepicker/archive/master.zip">jquery.datetimepicker.tar.gz</a></td>
</tr>
<tr>
<td><a href="./plugins/jquery.minicolors/jquery.minicolors.min.js">jquery.minicolors.min.js</a></td>
<td><a href="https://github.com/claviska/jquery-minicolors/blob/master/LICENSE.md">Expat</a></td>

View file

@ -90,7 +90,6 @@ func NewMilestone(ctx *context.Context) {
ctx.Data["Title"] = ctx.Tr("repo.milestones.new")
ctx.Data["PageIsIssueList"] = true
ctx.Data["PageIsMilestones"] = true
ctx.Data["DateLang"] = setting.DateLang(ctx.Locale.Language())
ctx.HTML(200, tplMilestoneNew)
}
@ -99,7 +98,6 @@ func NewMilestonePost(ctx *context.Context, form auth.CreateMilestoneForm) {
ctx.Data["Title"] = ctx.Tr("repo.milestones.new")
ctx.Data["PageIsIssueList"] = true
ctx.Data["PageIsMilestones"] = true
ctx.Data["DateLang"] = setting.DateLang(ctx.Locale.Language())
if ctx.HasError() {
ctx.HTML(200, tplMilestoneNew)
@ -136,7 +134,6 @@ func EditMilestone(ctx *context.Context) {
ctx.Data["Title"] = ctx.Tr("repo.milestones.edit")
ctx.Data["PageIsMilestones"] = true
ctx.Data["PageIsEditMilestone"] = true
ctx.Data["DateLang"] = setting.DateLang(ctx.Locale.Language())
m, err := models.GetMilestoneByRepoID(ctx.Repo.Repository.ID, ctx.ParamsInt64(":id"))
if err != nil {
@ -160,7 +157,6 @@ func EditMilestonePost(ctx *context.Context, form auth.CreateMilestoneForm) {
ctx.Data["Title"] = ctx.Tr("repo.milestones.edit")
ctx.Data["PageIsMilestones"] = true
ctx.Data["PageIsEditMilestone"] = true
ctx.Data["DateLang"] = setting.DateLang(ctx.Locale.Language())
if ctx.HasError() {
ctx.HTML(200, tplMilestoneNew)

View file

@ -23,26 +23,21 @@
{{template "base/alert" .}}
<form class="ui form grid" action="{{.Link}}" method="post">
{{.CsrfTokenHtml}}
<div class="eleven wide column">
<div class="twelve wide column">
<div class="field {{if .Err_Title}}error{{end}}">
<label>{{.i18n.Tr "repo.milestones.title"}}</label>
<input name="title" placeholder="{{.i18n.Tr "repo.milestones.title"}}" value="{{.title}}" autofocus required maxlength="50">
</div>
<div class="field">
<label>{{.i18n.Tr "repo.milestones.desc"}}</label>
<textarea name="content">{{.content}}</textarea>
</div>
</div>
<div class="four wide column">
<div class="field {{if .Err_Deadline}}error{{end}}">
<label>
{{.i18n.Tr "repo.milestones.due_date"}}
<a id="clear-date" href="#">{{.i18n.Tr "repo.milestones.clear"}}</a>
<a id="clear-date">{{.i18n.Tr "repo.milestones.clear"}}</a>
</label>
<input id="deadline" name="deadline" value="{{.deadline}}">
<input type="date" id="deadline" name="deadline" value="{{.deadline}}" placeholder="{{.i18n.Tr "repo.issues.due_date_form"}}">
</div>
<div class="field">
<input class="milestone datepicker" data-lang="{{.DateLang}}" data-start-date="{{.deadline}}">
<label>{{.i18n.Tr "repo.milestones.desc"}}</label>
<textarea name="content">{{.content}}</textarea>
</div>
</div>
<div class="ui container">

View file

@ -1,8 +0,0 @@
export default async function initDateTimePicker(locale) {
await Promise.all([
import(/* webpackChunkName: "datetimepicker" */'jquery-datetimepicker'),
import(/* webpackChunkName: "datetimepicker" */'jquery-datetimepicker/build/jquery.datetimepicker.min.css'),
]);
$.datetimepicker.setLocale(locale);
}

View file

@ -12,7 +12,6 @@ import initContextPopups from './features/contextpopup.js';
import initGitGraph from './features/gitgraph.js';
import initClipboard from './features/clipboard.js';
import initUserHeatmap from './features/userheatmap.js';
import initDateTimePicker from './features/datetimepicker.js';
import initServiceWorker from './features/serviceworker.js';
import attachTribute from './features/tribute.js';
import createDropzone from './features/dropzone.js';
@ -755,18 +754,6 @@ async function initRepository() {
// Milestones
if ($('.repository.new.milestone').length > 0) {
const $datepicker = $('.milestone.datepicker');
await initDateTimePicker($datepicker.data('lang'));
$datepicker.datetimepicker({
inline: true,
timepicker: false,
startDate: $datepicker.data('start-date'),
onSelectDate(date) {
$('#deadline').val(date.toISOString().substring(0, 10));
},
});
$('#clear-date').on('click', () => {
$('#deadline').val('');
return false;

View file

@ -1309,10 +1309,6 @@
textarea {
height: 200px;
}
#deadline {
width: 150px;
}
}
&.compare.pull {

View file

@ -1395,80 +1395,6 @@ a.ui.labels .label:hover {
}
}
body .xdsoft_datetimepicker {
background: #2a2e39;
border: 1px solid #4c505c;
color: #9e9e9e;
.xdsoft_monthpicker {
height: 36px;
background: #464c5d;
margin: -2px -8px 2px;
padding: 2px 8px 0;
button {
background-image: none;
text-indent: 0;
text-align: center;
color: #9e9e9e;
&.xdsoft_prev::before {
content: "\f0d9";
font: normal normal normal 14px/1 FontAwesome, serif;
font-size: 1.7em;
}
&.xdsoft_next::before {
content: "\f0da";
font: normal normal normal 14px/1 FontAwesome, serif;
font-size: 1.7em;
}
&.xdsoft_today_button::before {
content: "\f015";
font: normal normal normal 14px/1 FontAwesome, serif;
font-size: 1.4em;
}
}
& > div.xdsoft_label {
background: #464c5d;
i {
line-height: 14px;
background-image: none;
text-indent: 0;
text-align: center;
::before {
content: "\f0dd";
font: normal normal normal 14px/1 FontAwesome, serif;
font-size: .7em;
}
}
.xdsoft_select {
background: #353945;
}
}
}
.xdsoft_datepicker .xdsoft_calendar {
td,
th {
border-color: #4c505c;
background-color: #2a2e39;
}
td.xdsoft_other_month,
td.xdsoft_disabled {
opacity: .8;
background: #a0cc75;
color: #000000;
}
}
}
.heatmap(@heat) {
@heatmap-cold: #2d303b;
@heatmap-hot: #a0cc75;

View file

@ -101,10 +101,6 @@ module.exports = {
exclude: /node_modules/,
loader: 'vue-loader',
},
{
test: require.resolve('jquery-datetimepicker'),
use: 'imports-loader?define=>false,exports=>false',
},
{
test: /\.worker\.js$/,
exclude: /monaco/,