removed jquery dependency

This commit is contained in:
huangjx
2021-10-22 20:20:33 +08:00
parent 7143468cde
commit 0bd6c81157
7 changed files with 76 additions and 52 deletions

View File

@@ -1,5 +1,3 @@
import $ from 'jquery'
/**
* A little class to manage a status field for a "saving" process.
* It can be used to display a starting message (e.g. "Saving...") and then
@@ -24,11 +22,9 @@ export default {
* @param {string} message Plain text message to display (no HTML allowed)
*/
startAction(selector, message) {
$(selector).text(message)
.removeClass('success')
.removeClass('error')
.stop(true, true)
.show()
let el = document.querySelector(selector);
el.textContent = message;
el.style.removeProperty("display")
},
/**
@@ -70,13 +66,11 @@ export default {
* @param {string} message Plain text success message to display (no HTML allowed)
*/
finishedSuccess(selector, message) {
$(selector).text(message)
.addClass('success')
.removeClass('error')
.stop(true, true)
.delay(3000)
.fadeOut(900)
.show()
let el = document.querySelector(selector);
el.textContent = message;
if (el.classList.contains("error")) el.classList.remove("error");
el.classList.add("success");
this.fadeOut(el);
},
/**
@@ -86,9 +80,41 @@ export default {
* @param {string} message Plain text error message to display (no HTML allowed)
*/
finishedError(selector, message) {
$(selector).text(message)
.addClass('error')
.removeClass('success')
.show()
let el = document.querySelector(selector);
el.textContent = message;
if (el.classList.contains("success")) el.classList.remove("success");
el.classList.add("error");
},
fadeIn(element, duration = 1000) {
(function increment() {
element.style.opacity = String(0);
element.style.removeProperty("display")
let opacity = parseFloat(element.style.opacity);
if (opacity !== 1) {
setTimeout(() => {
increment(opacity + 0.1);
}, duration / 10);
}
})();
},
fadeOut(element, duration = 1000) {
let opacity = parseFloat(element.style.opacity) || 1;
(function decrement() {
if ((opacity -= 0.1) < 0) {
element.style.display = 'none'
element.style.removeProperty('opacity');
} else {
setTimeout(() => {
decrement();
}, duration / 10);
}
})();
},
show(el) {
el.style.display = '';
},
hide(el) {
el.style.display = 'none';
}
}

View File

@@ -1,6 +1,6 @@
import $ from 'jquery'
import Http from './http'
import helper from './helper'
import eventHandler from './eventHandler'
const buttonHandler = (event, type) => {
let element = event.target;
event.stopPropagation();
@@ -37,6 +37,6 @@ const buttonHandler = (event, type) => {
}
export default {
run: function () {
$("#ncdownloader-table-wrapper").on("click", ".table-cell-action-item .button-container button", e => buttonHandler(e, ''));
eventHandler.add("click", "#ncdownloader-table-wrapper", ".table-cell-action-item .button-container button", e => buttonHandler(e, ''));
}
}

View File

@@ -179,7 +179,7 @@ div .number {
@media only screen and (min-width: 800px) {}
@media only screen and (max-width: 1024px) {
#ncdownloader-form-wrapper {
#ncdownloader-body-wrapper {
position : relative;
margin-top: 2em;
}

View File

@@ -1,4 +1,3 @@
import $ from 'jquery'
import {
generateUrl
} from '@nextcloud/router'
@@ -74,12 +73,14 @@ const helper = {
if (!data.status && data.error) {
return;
}
let $element = $("#start-aria2 button");
let aria2 = $element.attr("data-aria2");
let element = document.querySelector("#start-aria2 button");
let aria2 = element.getAttribute("data-aria2");
if (aria2 === 'on') {
$element.attr("data-aria2", "off").html(t("ncdownloader", "Start Aria2"));
element.setAttribute("data-aria2", "off");
element.textContent = t("ncdownloader", "Start Aria2");
} else {
$element.attr("data-aria2", "on").html(t("ncdownloader", "Stop Aria2"));
element.setAttribute("data-aria2", "on");
element.textContent = t("ncdownloader", "Stop Aria2");
}
},
getPathLast: function (path) {
@@ -179,4 +180,5 @@ const helper = {
container.style.width = "100%";
}
}
export default helper

View File

@@ -1,5 +1,5 @@
import helper from './helper'
import $ from 'jquery'
import eventHandler from './eventHandler'
import Http from './http'
import { translate as t, translatePlural as n } from '@nextcloud/l10n'
import updatePage from './updatePage'
@@ -11,37 +11,29 @@ import App from './App';
'use strict'
const basePath = "/apps/ncdownloader";
$(document).on('ajaxSend', function (elm, xhr, settings) {
let token = document.getElementsByTagName('head')[0].getAttribute('data-requesttoken')
if (settings.crossDomain === false) {
xhr.setRequestHeader('requesttoken', token)
xhr.setRequestHeader('OCS-APIREQUEST', 'true')
}
})
window.addEventListener('DOMContentLoaded', function () {
// inputAction.run();
updatePage.run();
buttonActions.run();
let container = 'ncdownloader-form-container';
let container = 'ncdownloader-form-wrapper';
let app = createApp(App);
let vm = app.mount('#' + container);
helper.addVue(vm.$options.name, vm);
$("#start-aria2").on("click", function (e) {
eventHandler.add("click","#start-aria2 button", function (e) {
const path = basePath + "/aria2/start";
let url = helper.generateUrl(path);
Http.getInstance(url).setHandler(function (data) {
helper.aria2Toggle(data);
}).send();
})
$('#ncdownloader-user-settings button').on("click", function (e) {
eventHandler.add("click", '#ncdownloader-user-settings button', function (e) {
let link = helper.generateUrl(e.target.getAttribute('path'));
window.location.href = link;
})
$("#app-navigation").on("click", "#search-download", helper.showDownload);
eventHandler.add("click", "#app-navigation", "#search-download", helper.showDownload);
});

View File

@@ -9,13 +9,15 @@ import eventHandler from './eventHandler';
import aria2Options from './aria2Options';
import helper from './helper';
import './css/autoComplete.css'
import './css/style.scss'
'use strict';
window.addEventListener('DOMContentLoaded', function () {
eventHandler.add('click', '.ncdownloader-admin-settings', 'input[type="button"]', function (event) {
event.stopPropagation();
OC_msg.startSaving('#ncdownloader-message-banner');
OC_msg.startSaving('#ncdownloader-message-banner',"Saving");
const target = this.getAttribute("data-rel");
let inputData = helper.getData(target);
const path = inputData.url || "/apps/ncdownloader/admin/save";

View File

@@ -1,5 +1,5 @@
import helper from './helper'
import $ from 'jquery'
import eventHandler from './eventHandler';
import Http from './http'
const basePath = "/apps/ncdownloader/status/";
const tableContainer = ".table";
@@ -9,31 +9,33 @@ export default {
const clickHandler = (event, type) => {
event.preventDefault();
helper.hideDownload();
let container = document.querySelector(tableContainer);
let currentType = container.getAttribute("type");
let path = basePath + type;
if (type === "youtube-dl") {
path = "/apps/ncdownloader/youtube/get";
}
let name = type + "-downloads";
//avoid repeated click
if ($(tableContainer).attr("type") === name && helper.enabledPolling) {
if (currentType === name && helper.enabledPolling) {
return;
}
helper.enabledPolling = 1;
$(tableContainer).removeClass().addClass("table " + name);
$(tableContainer).attr("type", name);
//$(tableContainer).removeClass().addClass("table " + name);
container.setAttribute("type", name);
container.className = "table " + name;
let delay = 15000;
if (['active', 'youtube-dl'].includes(type)) {
delay = 1500;
}
helper.loop(helper.refresh, delay, ...[path])
};
$(".waiting-downloads").on("click", event => clickHandler(event, 'waiting'));
$(".complete-downloads").on("click", event => clickHandler(event, 'complete'));
$(".active-downloads").on("click", event => clickHandler(event, 'active'));
$(".fail-downloads").on("click", event => clickHandler(event, 'fail'));
$(".youtube-dl-downloads").on("click", event => clickHandler(event, 'youtube-dl'));
$("#ncdownloader-table-wrapper").on("click", ".download-file-folder", function (event) {
eventHandler.add("click",".waiting-downloads a",event => clickHandler(event, 'waiting'));
eventHandler.add("click",".complete-downloads a",event => clickHandler(event, 'complete'));
eventHandler.add("click",".active-downloads a",event => clickHandler(event, 'active'));
eventHandler.add("click",".fail-downloads a",event => clickHandler(event, 'fail'));
eventHandler.add("click",".youtube-dl-downloads a",event => clickHandler(event, 'youtube-dl'));
eventHandler.add("click", "#ncdownloader-table-wrapper",".download-file-folder", function (event) {
event.stopPropagation();
const path = "/apps/ncdownloader/update";
let url = helper.generateUrl(path);