免Flash文件上传

无需调用Flash,从课程平台上传附件,不必为了传作业多装一个浏览器!

目前為 2021-09-07 提交的版本,檢視 最新版本

您需要先安裝使用者腳本管理器擴展,如 TampermonkeyGreasemonkeyViolentmonkey 之後才能安裝該腳本。

You will need to install an extension such as Tampermonkey to install this script.

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyUserscripts 後才能安裝該腳本。

你需要先安裝一款使用者腳本管理器擴展,比如 Tampermonkey,才能安裝此腳本

您需要先安裝使用者腳本管理器擴充功能後才能安裝該腳本。

(我已經安裝了使用者腳本管理器,讓我安裝!)

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

(我已經安裝了使用者樣式管理器,讓我安裝!)

// ==UserScript==
// @name              免Flash文件上传
// @name:en           Upload without Flash
// @namespace         https://greasyfork.org/zh-CN/users/605474
// @version           0.1
// @description       无需调用Flash,从课程平台上传附件,不必为了传作业多装一个浏览器!
// @description:en    No need to call Flash, upload accessories from the course platform, do not have to make multiple browsers for the homework!
// @author            Ziu
// @match             *://cc.bjtu.edu.cn:81/*
// @match             *://cc.bjtu.edu.cn:81/meol/common/hw/student/write.jsp?hwtid=*
// @icon              https://gitee.com/ziuc/utool-filebed/raw/master//20210907-173652-0524.png
// @require           http://libs.baidu.com/jquery/2.0.0/jquery.min.js
// @grant             none
// @license           MIT
// ==/UserScript==

(function() {
    'use strict';
    let frontTag = "<li><a id='add_button' title='上传作业' onclick=location='http://cc.bjtu.edu.cn:81/meol/common/hw/student/hwtask.jsp?tagbug=client&strStyle=new06'><span>上传作业</span></a></li>";
    $('#tmenu').append(frontTag);
    let uploadBox = "<tr><td><div style='margin-left: 10px'>上传附件:<div id='cssDiv' style='height: 100px; width: 300px; border: 1px dashed; border-radius:5px;'><div id='inputArea' title='拖拽文件以上传'><label for='currentFile'><div id='textShow' style='margin-top: 8px; text-align: center;'><p>&nbsp</p><p>选择文件</p><p>(支持拖拽)</p><p>&nbsp</p></div><input id='currentFile' type='file' multiple='multiple' style='display:none;' </input></label></div></div><div id='filenames' style='font-size: 13px; margin-top: 5px; margin-left: 10px'></div></div></td></tr>"
    $('.infotable:last>tbody>tr:first').after(uploadBox);
    // 文件点击上传
    $('#currentFile').change(fileChangedByInput);
    // 文件拖拽上传
    $('#inputArea').on('dragover',function(event){
        event.preventDefault()
    }).on('drop',function(event){
        event.preventDefault();
        // 数据在event的dataTransfer对象中
        for(let i=0;i<event.originalEvent.dataTransfer.files.length/2;i++){
            let oData = new FormData();
            let filelist = event.originalEvent.dataTransfer.files;
            // 加filenames
            for(let i=0;i<filelist.length;i++){
                let item = filelist[i];
                if(item.size<1000000){
                    $('#filenames').append('<div id="fileObject'+(i+1)+'"><a class="fileindex" style="background: #b5cce0">[*]</a><a class="filename" style="background: #b5cce0">'+item.name+' ('+(item.size/1024).toFixed(2)+'KB)'+'</a><p class="processBar" id="processBar'+(i+1)+'">上传进度:[0%]</p></div>');
                }
                else if(item.size>1000000&&item.size<1000000000){
                    $('#filenames').append('<div id="fileObject'+(i+1)+'"><a class="fileindex" style="background: #b5cce0">[*]</a><a class="filename" style="background: #b5cce0">'+item.name+' ('+(item.size/1048576).toFixed(2)+'MB)'+'</a><p class="processBar" id="processBar'+(i+1)+'">上传进度:[0%]</p></div>');
                }
            }
            // 加上传按钮
            $('#filenames').after("<div id='buttonDiv' style='font-size: 13px; margin-top: 10px'></div>");
            $('#buttonDiv').append("<a id='uploadtrigger' title='上传' style='padding-top: 2.5px; padding-bottom: 2.5px; padding-right: 5px; padding-left: 5px; background-color: #c6f062; border: 1px solid; margin-left: 10px'>上传</a>");
            $('#uploadtrigger').click(function (){
                // 构造请求
                let oData = new FormData();
                for(let i=0;i<filelist.length;i++){
                    let currentfile = filelist[i];
                    uploadFile(currentfile).then(function(result){
                        oData.append('Filename',currentfile.name);
                        oData.append('Filedata',currentfile);
                        // 执行文件上传
                        let oReq = new XMLHttpRequest();
                        oReq.addEventListener("load", reqListener);
                        oReq.open("POST", "http://cc.bjtu.edu.cn:81/meol/servlet/SerUpload");
                        oReq.upload.onprogress = progressFunction;
                        oReq.send(oData);
                    })
                }
                $('#buttonDiv').remove();
            })
        }
    })

    function fileChangedByInput(){
        // 文件缓存出现改变 读取文件 将文件加入到缓存列表
        let oData = new FormData();
        let filelist = $('#currentFile')[0].files;
        if($('#filenames>div').length>=1){
            $('#filenames').empty();
            for(let i=0;i<filelist.length;i++){
                let item = filelist[i];
                if(item.size<1000000){
                    $('#filenames').append('<div id="fileObject'+(i+1)+'"><a class="fileindex" style="background: #b5cce0">[*]</a><a class="filename" style="background: #b5cce0">'+item.name+' ('+(item.size/1024).toFixed(2)+'KB)'+'</a><p class="processBar" id="processBar'+(i+1)+'">上传进度:[0%]</p></div>');
                }
                else if(item.size>1000000&&item.size<1000000000){
                    $('#filenames').append('<div id="fileObject'+(i+1)+'"><a class="fileindex" style="background: #b5cce0">[*]</a><a class="filename" style="background: #b5cce0">'+item.name+' ('+(item.size/1048576).toFixed(2)+'MB)'+'</a><p class="processBar" id="processBar'+(i+1)+'">上传进度:[0%]</p></div>');
                }
            }
            $('#buttonDiv').remove();
        }
        else {
            for(let i=0;i<filelist.length;i++){
                let item = filelist[i];
                if(item.size<1000000){
                    $('#filenames').append('<div id="fileObject'+(i+1)+'"><a class="fileindex" style="background: #b5cce0">[*]</a><a class="filename" style="background: #b5cce0">'+item.name+' ('+(item.size/1024).toFixed(2)+'KB)'+'</a><p class="processBar" id="processBar'+(i+1)+'">上传进度:[0%]</p></div>');
                }
                else if(item.size>1000000&&item.size<1000000000){
                    $('#filenames').append('<div id="fileObject'+(i+1)+'"><a class="fileindex" style="background: #b5cce0">[*]</a><a class="filename" style="background: #b5cce0">'+item.name+' ('+(item.size/1048576).toFixed(2)+'MB)'+'</a><p class="processBar" id="processBar'+(i+1)+'">上传进度:[0%]</p></div>');
                }
            }
            $('#buttonDiv').remove();
        }
        $('#filenames').after("<div id='buttonDiv' style='font-size: 13px; margin-top: 10px'></div>");
        $('#buttonDiv').append("<a id='uploadtrigger' title='上传' style='padding-top: 2.5px; padding-bottom: 2.5px; padding-right: 5px; padding-left: 5px; background-color: #c6f062; border: 1px solid; margin-left: 10px'>上传</a>");
        $('#uploadtrigger').click(function (){
            // 构造请求
            let oData = new FormData();
            for(let i=0;i<filelist.length;i++){
                let currentfile = filelist[i];
                uploadFile(currentfile).then(function(result){
                    oData.append('Filename',currentfile.name);
                    oData.append('Filedata',currentfile);
                    // 执行文件上传
                    let oReq = new XMLHttpRequest();
                    oReq.addEventListener("load", reqListener);
                    oReq.open("POST", "http://cc.bjtu.edu.cn:81/meol/servlet/SerUpload");
                    oReq.upload.onprogress = progressFunction;
                    oReq.send(oData);
                })
            }
            $('#buttonDiv').remove();
        })
    }

    function uploadFile(file) {
        return new Promise(function(resolve, reject) {
            let reader = new FileReader();
            reader.readAsArrayBuffer(file)
            reader.onload = function() {
                resolve(this.result)
            }
        })
    }

    function reqListener() {
        // 构建超链接 插入到编辑器
        let constructor = '<p><a data-cke-saved-href="/meol/'+this.responseText+'" href="/meol/'+this.responseText+'">[附件]</a></p>'
        // 遍历页面中iframe找到编辑器插入附件超链接
        // 学习笔记中iframe为双层iframe嵌套
        for(let i=0;i<document.getElementsByTagName("iframe").length;i++){
            let tmpiframe = document.getElementsByTagName("iframe")[i].contentWindow;
            let tmpDom = tmpiframe.document.getElementsByClassName('cke_show_borders');
            if(tmpDom.length&&($(tmpDom).attr('spellcheck')==false)){
                // 第一层iframe找到编辑器了
                // 用spellcheck="false"属性判断是否为编辑器所在iframe 避免错误插入
                let iframe = document.getElementsByTagName("iframe")[i].contentWindow;
                let textarea = iframe.document.getElementsByClassName('cke_show_borders');
                $(textarea).append(constructor);
            }
            else {
                // 第二层iframe中找编辑器
                for(let j=0;j<tmpiframe.document.getElementsByTagName("iframe").length;j++){
                    let smalliframe = tmpiframe.document.getElementsByTagName("iframe")[j].contentWindow;
                    let smallDom = smalliframe.document.getElementsByClassName('cke_show_borders');
                    if(smallDom.length&&($(tmpDom).attr('spellcheck')==false)){
                        // 第二层iframe找到编辑器了
                        let iframe = document.getElementsByTagName("iframe")[j].contentWindow;
                        let textarea = iframe.document.getElementsByClassName('cke_show_borders');
                        $(textarea).append(constructor);
                    }
                    else {console.log('摆烂了,不找了');}
                }
            }
        }

    }

    function progressFunction(event){
        let percentage;
        if(event.lengthComputable){
            percentage = event.loaded/event.total;
            console.log('Percentage: '+(percentage*100).toFixed(0)+'%');
            $('.processBar').html('上传进度:['+(percentage*100).toFixed(0)+'%]');
            if(event.loaded == event.total){
                alert("附件上传完成!");
                $('.fileindex').html('[√]');
            }
        }
    }
})();