Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

979 syllabus upload button change #1005

Merged
merged 23 commits into from
Jul 20, 2023
Merged
Show file tree
Hide file tree
Changes from 7 commits
Commits
Show all changes
23 commits
Select commit Hold shift + click to select a range
8cf5519
Implementing the new function in base.js
ojmakinde Jul 12, 2023
925b224
implementing the function in base.js
ojmakinde Jul 12, 2023
a23223a
Function created. Currently finetuning the details.
ojmakinde Jul 13, 2023
62d7518
Function has been created. Refactoring required
ojmakinde Jul 13, 2023
7514515
Function has been sucessfully integrated into js and html files. Only…
ojmakinde Jul 14, 2023
835125d
Function has been incorporated successfully, and refactoring is compl…
ojmakinde Jul 14, 2023
701ed53
Merge remote-tracking branch 'origin' into 979-Syllabus-Upload-Button…
ojmakinde Jul 14, 2023
01f8b60
Progressed towards fixing error with saving files in course proposal
ojmakinde Jul 17, 2023
dcf435d
Changed the ajax submission that the saveContinue button was calling …
hoerstl Jul 17, 2023
177e080
Fixed a bug where the submit proposal button would readd the faculty,…
hoerstl Jul 17, 2023
80dff0d
Removed some table data that was unneccessary
hoerstl Jul 17, 2023
9167822
Debugging and optimizing functions
ojmakinde Jul 18, 2023
08827c0
Changed the button on the third tab that was masquerading as the save…
hoerstl Jul 18, 2023
fb4ee86
Moved the creation of the 'attachmentObjectContainer' inside of the '…
ojmakinde Jul 18, 2023
3af8b12
Changed the routes to use a more generic 'databaseId' key to read bot…
hoerstl Jul 18, 2023
f7c2a8b
Changed the createEvent page to use our displayAttachments macro.
hoerstl Jul 18, 2023
261ea83
Changed the course proposal page to use our displayFiles macro instea…
hoerstl Jul 18, 2023
58f33fc
Abstracted the display files functionality into a macro and js file w…
hoerstl Jul 18, 2023
b3341f4
Changed the indentation level of part of the handleFileSelection in t…
hoerstl Jul 18, 2023
00ce7aa
Fixed a bug where you couldn't delete course instructors with the rem…
hoerstl Jul 19, 2023
663477c
Removed some console logs
hoerstl Jul 19, 2023
a14c3ec
Changed the view Exit button to redirect to the correct page. The sam…
hoerstl Jul 20, 2023
e9048d9
Merge branch 'development' into 979-Syllabus-Upload-Button-Change
BrianRamsay Jul 20, 2023
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
71 changes: 71 additions & 0 deletions app/static/js/base.js
Original file line number Diff line number Diff line change
Expand Up @@ -124,3 +124,74 @@ function setCharacterLimit(textboxId, labelId){
$(labelId).text("Remaining Characters: " + 0);
}
}

function hasUniqueFileName(fileName){
return $(".fileName[data-filename='" + fileName + "']").length == 0;
}

function getSelectedFiles(){
let _fileHolder = new DataTransfer();
$(".fileHolder").each(function(){
_fileHolder.items.add($(this).data("file"));
});
return _fileHolder.files;
}

function handleFileSelection(fileInputId, attachedObjectContainerId){
var fileBoxId = "#" + fileInputId
var objectContainerId = "#" + attachedObjectContainerId
$(fileBoxId).on('change', function() {
const selectedFiles = $(fileBoxId).prop('files');
for (let i = 0; i < selectedFiles.length; i++){
const file = selectedFiles[i];
if (hasUniqueFileName(file.name)){
let fileName = (file.name.length > 25) ? file.name.slice(0,10) + '...' + file.name.slice(-10) : file.name;
let fileExtension = file.name.split(".").pop();
let iconClass = '';
switch(fileExtension) {
case 'jpg':
case 'png':
case 'jpeg':
iconClass = "bi-file-image";
break
case 'pdf':
iconClass = 'bi-filetype-pdf';
break
case 'docx':
iconClass = 'bi-filetype-docx';
break
case 'xlsx':
iconClass = 'bi-filetype-xlsx';
break
default:
iconClass = 'bi-file-earmark-arrow-up';
}
let trashNum = ($(objectContainerId+ " .row").length)
var fullTrashId = "#trash" + trashNum
$(objectContainerId).append("<div class='border row p-0 m-0' id='attachedFilesRow" +trashNum+"'> \
<i class='col-auto fs-3 px-3 bi " + iconClass + "'></i> \
<div id='attachedFile" + trashNum + "' data-filename='" + file.name + "' class='fileName col-auto pt-2'>" + fileName + "</div> \
<div class='col' style='text-align:right'> \
<div class='btn btn-danger fileHolder p-1 my-1 mx-1' id='trash" + trashNum + "' data-filenum='" + trashNum + "'>\
<span class='bi bi-trash fs-6'></span>\
</div>\
</div> \
</div>")
ojmakinde marked this conversation as resolved.
Show resolved Hide resolved
$(fullTrashId).data("file", file);
$(fullTrashId).data("file-container-id", attachedObjectContainerId);
$(fullTrashId).on("click", function() {
let elementFileNum = $(this).data('filenum');
let attachedObjectContainerId = $(this).data('file-container-id');
$("#"+ attachedObjectContainerId + " #attachedFilesRow" + elementFileNum).remove();
$(fileBoxId).prop('files', getSelectedFiles());
})
$(fileBoxId).data("file-num", $(fileBoxId).data("file-num") + 1)
}
else{
msgToast("File with filename '" + file.name + "' has already been added to this event")
}
}
$(fileBoxId).prop('files', getSelectedFiles());
});

}
69 changes: 1 addition & 68 deletions app/static/js/createEvents.js
Original file line number Diff line number Diff line change
Expand Up @@ -61,22 +61,6 @@ function format24to12HourTime(timeStr){

}


function getSelectedFiles(){
let _fileHolder = new DataTransfer();
$(".fileHolder").each(function(){
_fileHolder.items.add($(this).data("file"));
});
return _fileHolder.files;
}


function hasUniqueFileName(fileName){
return $(".fileName[data-filename='" + fileName + "']").length == 0;
}



/*
* Run when the webpage is ready for javascript
*/
Expand All @@ -85,58 +69,7 @@ $(document).ready(function() {
calculateRecurringEventFrequency();
}

var fileNum = 0;
$("#attachmentObject").on('change', function() {
const selectedFiles = $("#attachmentObject").prop('files');
for (let i = 0; i < selectedFiles.length; i++) {
const file = selectedFiles[i];
if (hasUniqueFileName(file.name)){
let fileName = (file.name.length > 25) ? file.name.slice(0,10) + '...' + file.name.slice(-10) : file.name;
let fileExtension = file.name.split(".").pop();
let iconClass = '';
switch(fileExtension) {
case 'jpg':
case 'png':
case 'jpeg':
iconClass = "bi-file-image";
break
case 'pdf':
iconClass = 'bi-filetype-pdf';
break
case 'docx':
iconClass = 'bi-filetype-docx';
break
case 'xlsx':
iconClass = 'bi-filetype-xlsx';
break
default:
iconClass = 'bi-file-earmark-arrow-up';
}
$("#attachedObjectContainer").append("<div class='border row p-0 m-0' id='attachedFilesRow" +fileNum+"'> \
<i class='col-auto fs-3 px-3 bi " + iconClass + "'></i> \
<div id='attachedFile" + fileNum + "' data-filename='" + file.name + "' class='fileName col-auto pt-2'>" + fileName + "</div> \
<div class='col' style='text-align:right'> \
<div class='btn btn-danger fileHolder p-1 my-1 mx-1' id='trash" + fileNum + "' data-filenum='" + fileNum + "'>\
<span class='bi bi-trash fs-6'></span>\
</div>\
</div> \
</div>")
$("#trash"+fileNum).data("file", file);
$("#trash"+fileNum).on("click", function() {
let elementFileNum = $(this).data('filenum');
$("#attachedFilesRow" + elementFileNum).remove();
$("#attachmentObject").prop('files', getSelectedFiles());
})
fileNum++;
}
else{
msgToast("File with filename '" + file.name + "' has already been added to this event")
}
}
$("#attachmentObject").prop('files', getSelectedFiles());
});


handleFileSelection("attachmentObject", "attachedObjectContainer")

$("#checkRSVP").on("click", function() {
if ($("#checkRSVP").is(":checked")) {
Expand Down
36 changes: 1 addition & 35 deletions app/static/js/slcNewProposal.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,41 +3,7 @@ import searchUser from './searchUser.js'
var currentTab = 0; // Current tab is set to be the first tab (0)

$(document).ready(function(e) {
disableSyllabusUploadFile()
$(".removeAttachment").on("click", function(){

let fileId= $(this).data("id")
let fileData = {fileId : fileId,
courseId:this.id}
$.ajax({
type:"POST",
url: "/deleteCourseFile",
data: fileData, //get the startDate, endDate and name as a dictionary
success: function(){
$("#modalAttachment_"+fileId).remove()
$("#pageAttachment_"+fileId).remove()
currentTab = 1;

},
error: function(error){
msgFlash(error)
}
});
});


$("#attachmentObject").on('fileloaded', function() {
enableSyllabusUploadFile()
})

$("#syllabusUploadButton").on("click", function() {
saveCourseData('/serviceLearning/saveProposal', function() {})
$("#syllabusUploadModal").modal("toggle")
})

$("#attachmentObject").fileinput({
allowedFileExtensions:["pdf","jpg","png","gif", "csv", "docx", "jpg", "jpeg", "jfif"]
})
handleFileSelection("attachmentObject", "attachedObjectContainer")

// set up the current tab and button state
if(window.location.href.includes("upload")) {
Expand Down
49 changes: 0 additions & 49 deletions app/templates/serviceLearning/slcNewProposal.html
Original file line number Diff line number Diff line change
Expand Up @@ -47,53 +47,4 @@
</div>
</form>

<!--modal-->
<div class="modal" id="syllabusUploadModal" tabindex="-1">
<form enctype="multipart/form-data" id="syllabusUploadForm" action="/uploadCourseFile" data-toggle="validator" role="form" method="POST">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Upload Syllabus</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group mb-5">
<input class="form-input" value={{course.id}} name="courseID" hidden/>
<div class="file-upload-wrapper">
<label class="form-label mb-2" for='attachmentObject'><strong>Add Files</strong></label>
<input type="file" id="attachmentObject" name="attachmentObject" multiple accept= ".png, .jpg, .pdf, .jpeg, .docx, .xlsx"/>
</div>
</div>
{% if filepaths %}
<div class="form-group mb-5">
<label class="mb-2 courseAttachments" for= "courseAttachments"><strong>Course Attachments</strong></label>
<table>
{% for key, value in filepaths.items() %}
<tr id="modalAttachment_{{value[1]}}" class="attachmentRow_{{key}}" data-id= "{{key}}">
<td class="pr-5">
<a class="mr-5" href="{{value[0]}}" target="_blank">{{key}}</a>
</td>
<td style="text-align:center">
<button
data-id="{{value[1]}}"
type="button"
class="removeAttachment btn btn-danger btn-sm"
id={{course.id}}>
<i class="bi bi-trash h5 align-middle"></i>
</button>
</td>
</tr>
{% endfor %}
</table>
</div>
{% endif %}
</div>
<div class="modal-footer justify-content-between">
<button type="button" class="btn btn-danger" data-bs-dismiss="modal">Dismiss</button>
<button type="submit" class="btn btn-primary" id="fileUpload">Upload File</button>
</div>
</div>
</div>
</form>
</div>
{% endblock %}
44 changes: 42 additions & 2 deletions app/templates/serviceLearning/slcProposal.html
Original file line number Diff line number Diff line change
Expand Up @@ -87,8 +87,43 @@ <h2 class="text-center pt-4 pb-2"> New Proposal For Service-Learning Course</h2>
<label class="form-check-label"> One-Time Special Topics/4-week course offering </label>
</div>
</div>
<label for="syllabus" class="pt-3 mb-2">Please upload a copy of the course syllabus:</label><br>
<button class="btn btn-primary mb-2" type="button"id="syllabusUploadButton">Upload</button>
<div class="form-group mb-5">
<label for="syllabus" class="pt-3 mb-2">Please upload a copy of the course syllabus:</label><br>
<input type="file" class="form-control" id="attachmentObject" name="attachmentObject" multiple accept= ".png, .jpg, .pdf, .jpeg, .docx, .xlsx"/>
<div id="attachedObjectContainer" class="py-0 px-0"></div>
ojmakinde marked this conversation as resolved.
Show resolved Hide resolved
</div>
{% if filepaths %}
<div class="form-group mb-5">
ojmakinde marked this conversation as resolved.
Show resolved Hide resolved
<label class="mb-2" for= "eventAttachments"><strong>Event Attachments</strong></label>
<table>
{% for key, value in filepaths.items() %}
<tr id="attachment_{{value[1]}}" class="attachmentRow_{{key}}" data-id= "{{key}}">
<td class="pr-5">
<a class="mr-5 fileName" data-filename='{{key}}' href="{{value[0]}}" target="_blank">{{key}}</a>
</td>
<td style="text-align:center">
<button
data-id="{{value[1]}}"
type="button"
class="removeAttachment btn btn-danger btn-sm"
id={{eventData.id}}>
ojmakinde marked this conversation as resolved.
Show resolved Hide resolved
<i class="bi bi-trash h5 align-middle"></i>
</button>
</td>
</tr>
{% endfor %}
</table>
</div>
{% endif %}



<!--We are going to replace the upload button with the new "choose file" input here, and add its functionality in the JavaScript-->
<!-- <button class="btn btn-primary mb-2" type="button"id="syllabusUploadButton">Upload</button> -->



<!--Additionally, we are going to get rid of (or modify) this filepaths condition here, as it is the old way of showing added attachments-->
ojmakinde marked this conversation as resolved.
Show resolved Hide resolved
{% if filepaths %}
<div class="form-group mb-5">
<label class="mb-2 courseAttachments" for= "courseAttachments"><strong>Course Attachments</strong></label>
Expand All @@ -112,6 +147,11 @@ <h2 class="text-center pt-4 pb-2"> New Proposal For Service-Learning Course</h2>
</table>
</div>
{% endif %}

<!--And finally, we are going to get rid of the modal in the other page-->
ojmakinde marked this conversation as resolved.
Show resolved Hide resolved



</div>
<div class="p-2 col-md-6">
<label for="inputCourseInstructor">When will this course be offered?</label>
Expand Down