免Flash文件上传

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

当前为 2021-09-07 提交的版本,查看 最新版本

您需要先安装一个扩展,例如 篡改猴Greasemonkey暴力猴,之后才能安装此脚本。

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

您需要先安装一个扩展,例如 篡改猴暴力猴,之后才能安装此脚本。

您需要先安装一个扩展,例如 篡改猴Userscripts ,之后才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 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('[√]');
            }
        }
    }
})();