Updated to nearly fully functional. Pre-release 1. Still needs some UI changes in the slideshow and admin pages (move the save button & fix the save detection for the internship list). Customer had one more page change request which I need to re-define and handle.
This commit is contained in:
Wynne Crisman
228
imports/ui/Admin/InternshipEditor.js
Normal file
228
imports/ui/Admin/InternshipEditor.js
Normal file
@@ -0,0 +1,228 @@
|
||||
|
||||
import './InternshipEditor.html';
|
||||
import '/imports/ui/dialogs/SelectImageDialog.js';
|
||||
import swal from "sweetalert2";
|
||||
|
||||
const PREFIX = "InternshipEditor_";
|
||||
|
||||
Tracker.autorun(function() {
|
||||
Meteor.subscribe("Internship");
|
||||
});
|
||||
|
||||
Template.InternshipEditor.onCreated(function() {
|
||||
this.internships = Meteor.collections.Internship.find({}, {sort: {name: 1}});
|
||||
Session.set(PREFIX + 'selectedInternship', null);
|
||||
});
|
||||
Template.InternshipEditor.helpers({
|
||||
internships: function() {
|
||||
return Template.instance().internships;
|
||||
},
|
||||
selectedInternship: function() {
|
||||
return Session.get(PREFIX + "selectedInternship");
|
||||
}
|
||||
});
|
||||
Template.InternshipEditor.events({
|
||||
'click .deleteInternship': function(event, template) {
|
||||
let $li = template.$(event.target).parent();
|
||||
|
||||
Meteor.call('removeInternship', $li.data('id'), function(error, id) {
|
||||
if(error) sAlert.error("Failed to create the internship!\n" + error);
|
||||
});
|
||||
},
|
||||
'click .internshipListItem': function(event, template) {
|
||||
let $li = template.$(event.currentTarget);
|
||||
|
||||
$li.addClass('selected');
|
||||
$li.siblings().removeClass('selected');
|
||||
Session.set(PREFIX + "selectedInternship", Meteor.collections.Internship.findOne($li.data('id')));
|
||||
},
|
||||
'click .editPageText': function(event,template) {
|
||||
|
||||
},
|
||||
"keyup input[name='newInternshipName']" : function(event, template) {
|
||||
if(event.keyCode === 13) {
|
||||
event.preventDefault();
|
||||
$('.createInternship').trigger('click');
|
||||
}
|
||||
},
|
||||
"click .createInternship": function(event, template) {
|
||||
let $input = template.$('input[name="newInternshipName"]');
|
||||
|
||||
if($input.hasClass('show')) {
|
||||
let name = $input.val();
|
||||
|
||||
name = name ? name.trim() : undefined;
|
||||
name = name && name.length > 0 ? name : undefined;
|
||||
|
||||
if(name) {
|
||||
let content = "<p><strong>Job Title: </strong></p>\n<p><strong>Supervisor / Sponsor: </strong></p>\n<p><strong>Location of Internship: </strong></p>\n<p><strong>Dates & hours: </strong></p>\n<p><strong>Duties & Activities: </strong></p>\n<p><strong>Desirable Qualities / Skills: </strong></p>";
|
||||
//Meteor.collections.Internship.insert({name, content});
|
||||
Meteor.call('addInternship', name, content, function(error, id) {
|
||||
if(error) sAlert.error("Failed to create the internship!\n" + error);
|
||||
else {
|
||||
//Clear the text editor.
|
||||
$input.val("");
|
||||
|
||||
//Quick hack to attempt to allow the internship we created to be added to the list before we try to select it and edit it.
|
||||
let count = 0;
|
||||
let interval = setInterval(function() {
|
||||
let selected = Meteor.collections.Internship.findOne(id);
|
||||
|
||||
if(selected) {
|
||||
//Select the sheet in the drop down.
|
||||
let $li = template.$('ul.internshipList li[data-id="' + id + '"]');
|
||||
|
||||
$li.addClass("selected");
|
||||
$li.siblings().removeClass("selected");
|
||||
Session.set(PREFIX + "selectedInternship", selected);
|
||||
clearInterval(interval);
|
||||
}
|
||||
else count++;
|
||||
|
||||
//Avoid infinite loop that should never happen.
|
||||
if(count > 100) clearInterval(interval);
|
||||
}, 100);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
$input.removeClass('show');
|
||||
$(event.target).toggleClass('move');
|
||||
}
|
||||
else {
|
||||
$input.addClass('show');
|
||||
$(event.target).toggleClass('move');
|
||||
$input.focus();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
Template.InternshipHtmlEditor.onCreated(function() {
|
||||
let template = this;
|
||||
|
||||
this.showSelectImageDialog = new ReactiveVar(false);
|
||||
|
||||
this.saveChanges = function(ask) {
|
||||
let data = this.$('.editor').val();
|
||||
let template = this;
|
||||
|
||||
//Only ask the user if they want to update their changes if they actually have changes that have not yet been saved.
|
||||
if(data !== template.currentHtml) {
|
||||
const changedData = data;
|
||||
|
||||
//Ensure this does not get run twice.
|
||||
template.currentHtml = changedData;
|
||||
|
||||
if(ask) {
|
||||
//Ask the user if they want to update the repository with their changes.
|
||||
swal({
|
||||
title: "Save Changes",
|
||||
text: "Would you like to save any changes you have made to this page?",
|
||||
type: "question",
|
||||
showCancelButton: true,
|
||||
confirmButtonColor: "#7cdd7f",
|
||||
confirmButtonText: "Yes",
|
||||
cancelButtonText: "No"
|
||||
}).then(
|
||||
function(isConfirm) {
|
||||
if(isConfirm) {
|
||||
Meteor.call('updateInternship', template.data.internship._id, changedData, function (error, result) {
|
||||
if (error) sAlert.error(error);
|
||||
else sAlert.success("Content Saved Successfully");
|
||||
});
|
||||
}
|
||||
},
|
||||
function(dismiss) {}
|
||||
);
|
||||
}
|
||||
else {
|
||||
Meteor.call('updateInternship', template.data.internship._id, changedData, function (error, result) {
|
||||
if (error) sAlert.error(error);
|
||||
else sAlert.success("Content Saved Successfully");
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
});
|
||||
Template.InternshipHtmlEditor.onRendered(function() {
|
||||
let template = this;
|
||||
|
||||
$('.editor').tinymce({
|
||||
inline: true,
|
||||
menubar: false,
|
||||
theme: 'inlite',
|
||||
plugins: [
|
||||
'autolink',
|
||||
'contextmenu',
|
||||
'link',
|
||||
'lists',
|
||||
'table',
|
||||
'textcolor'
|
||||
],
|
||||
toolbar: [
|
||||
'undo redo | bold italic underline | fontselect fontsizeselect',
|
||||
'forecolor backcolor | alignleft aligncenter alignright alignfull | link unlink | numlist bullist outdent indent'
|
||||
],
|
||||
table_default_attributes: {
|
||||
border: 0,
|
||||
cellpadding: 4
|
||||
},
|
||||
table_default_styles: {
|
||||
borderCollapse: "collapse"
|
||||
},
|
||||
insert_toolbar: 'quicktable', //image
|
||||
selection_toolbar: 'bold italic | h1 h2 h3 | bullist numlist outdent indent | blockquote quicklink',
|
||||
contextmenu: 'InsertImage | inserttable | cell row column deletetable', //image
|
||||
contextmenu_never_use_native: false,
|
||||
|
||||
|
||||
setup: function(editor) {
|
||||
editor.addMenuItem('InsertImage', {
|
||||
text: "Insert Image",
|
||||
context: 'tools',
|
||||
onclick: function() {
|
||||
template.showSelectImageDialog.set(true);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
Tracker.autorun(function() {
|
||||
//let data = Template.currentData().data; //Note: Calling Template.currentData() is a reactive way to get the template parameters.
|
||||
let data = Blaze.getData(template.view).internship;
|
||||
|
||||
if(data) {
|
||||
template.currentHtml = data.content;
|
||||
$('.editor').html(data.content && data.content.length > 0 ? data.content : "Change Me!");
|
||||
}
|
||||
});
|
||||
});
|
||||
Template.InternshipHtmlEditor.onDestroyed(function() {
|
||||
this.saveChanges(true);
|
||||
});
|
||||
Template.InternshipHtmlEditor.events({
|
||||
'click #save': function(event, template) {
|
||||
template.saveChanges(false);
|
||||
}
|
||||
});
|
||||
Template.InternshipHtmlEditor.helpers({
|
||||
showSelectImageDialog() {
|
||||
return Template.instance().showSelectImageDialog.get();
|
||||
},
|
||||
selectImageDialogArgs() {
|
||||
let template = Template.instance();
|
||||
return {
|
||||
onApply(value) {
|
||||
tinymce.activeEditor.insertContent('<img src="' + value + '"/>');
|
||||
template.showSelectImageDialog.set(false);
|
||||
},
|
||||
onClose() {
|
||||
template.showSelectImageDialog.set(false);
|
||||
}
|
||||
};
|
||||
},
|
||||
showInstructions() {
|
||||
return !Template.currentData().internship;
|
||||
}
|
||||
});
|
||||
Reference in New Issue
Block a user