Appreciation Editor Complete / All Others Incomplete

The text editor for the appreciation page is complete, but all other files are empty, besides User Manager.
This commit is contained in:
2018-08-17 11:24:00 -07:00
parent 26728082dc
commit 2593d0f977
24 changed files with 502 additions and 388 deletions

48
imports/api/Page.js Normal file
View File

@@ -0,0 +1,48 @@
import { Meteor } from 'meteor/meteor';
import { Mongo } from 'meteor/mongo';
import { check } from 'meteor/check';
import SimpleSchema from 'simpl-schema';
let Pages = new Mongo.Collection('Pages');
Pages.attachSchema(new SimpleSchema({
name: {
type: String,
label: "Name",
optional: false,
trim: true,
index: 1,
unique: true
},
html: {
type: String,
label: "HTML",
optional: false,
trim: false
},
updatedAt: {
type: Date,
label: "Updated On",
optional: true
}
}));
if(Meteor.isServer) Meteor.publish('pages', function() {
return Pages.find({});
});
if(Meteor.isServer) {
Meteor.methods({
updatePage: function(name, html) {
check(name, String);
check(html, String);
if(Roles.userIsInRole(this.userId, [Meteor.UserRoles.ROLE_UPDATE])) {
Pages.upsert({name}, {$set: {name, html, updatedAt: new Date()}});
}
else throw new Meteor.Error(403, "Not authorized.");
}
});
}
export default Pages;

View File

@@ -1,9 +1,10 @@
import Users from "./User.js";
import UserRoles from "./Roles.js";
import Pages from "./Page.js";
//Save the collections in the Meteor.collections property for easy access without name conflicts.
Meteor.collections = {Users, UserRoles};
Meteor.collections = {Users, UserRoles, Pages};
//If this is the server then setup the default admin user if none exist.
if(Meteor.isServer) {

View File

@@ -63,6 +63,13 @@ pri.route("/Admin/Appreciation", {
BlazeLayout.render("Admin", {content: "AppreciationEditor"})
}
});
pri.route("/Admin/NewsEditor", {
name: "NewsEditor",
action: function(params, queryParams) {
require("/imports/ui/Admin/NewsEditor.js");
BlazeLayout.render("Admin", {content: "NewsEditor"})
}
});
//*** PUBLIC
pub.route('/', {

View File

@@ -1,3 +1,5 @@
import SimpleSchema from 'simpl-schema';
let AppVersion = new Mongo.Collection('AppVersion');
let AppVersionSchema = new SimpleSchema({
version: {

View File

@@ -1,4 +1,7 @@
<template name="AppreciationEditor">
<div id="appreciationEditor">
<h1>Appreciation Editor</h1>
<div id="editor"></div>
<button id="save">Save</button>
</div>
</template>

View File

@@ -0,0 +1,6 @@
#appreciationEditor
display: block
.ck.ck-editor__editable_inline
border-color: rgba(0,0,0,.2)
.ck.ck-editor__editable_inline.ck-focused
border-color: rgba(0,0,0,1)

View File

@@ -1,2 +1,77 @@
import CKEditor from '@ckeditor/ckeditor5-build-balloon';
import './AppreciationEditor.html';
import swal from "sweetalert2";
import './AppreciationEditor.html';
let originalData = "";
Tracker.autorun(function() {
Meteor.subscribe("pages");
});
Template.AppreciationEditor.onRendered(function() {
let _this = this;
//#appreciationEditor'
CKEditor.create(document.querySelector('#editor'), {}).then(editor => {
_this.ckEditor = editor;
Tracker.autorun(function() {
let doc = Meteor.collections.Pages.findOne({name: 'Appreciation'});
originalData = (doc === undefined ? "" : doc.html);
editor.setData(originalData);
});
}).catch(err => {
console.error(err);
});
});
Template.AppreciationEditor.onDestroyed(function() {
let data = this.ckEditor.getData();
if(data != originalData) {
swal({
title: "Save Changes",
text: "Would you like to save any changes you have made to this sheet?",
type: "question",
showCancelButton: true,
confirmButtonColor: "#7cdd7f",
confirmButtonText: "Yes",
cancelButtonText: "No"
}).then(
function(isConfirm) {
if(isConfirm) {
Meteor.call('updatePage', 'Appreciation', data, function (error, result) {
if (error) sAlert.error(error);
else sAlert.success("Content Saved Successfully");
});
}
},
function(dismiss) {}
);
}
});
Template.AppreciationEditor.helpers({
// html: function() {
// let doc = Meteor.collections.Pages.findOne({name: 'Appreciation'});
//
// return doc == undefined ? "" : doc.html;
// }
});
Template.AppreciationEditor.events({
'click #save': function(event, template) {
let data = template.ckEditor.getData();
if(data != originalData) {
Meteor.call('updatePage', 'Appreciation', data, function (error, result) {
if (error) sAlert.error(error);
else sAlert.success("Content Saved Successfully");
});
}
else {
sAlert.success("Data has not changed!");
}
}
});

View File

@@ -1,2 +0,0 @@
#appreciationEditor
display: block

View File

@@ -18,19 +18,21 @@
</thead>
</table>
</div>
<div class="listRow">
<div class="listCell">
<div class="tableContainer mCustomScrollbar" data-mcs-theme="dark">
<table class="dataTable table table-striped table-hover">
<tbody>
{{#if displayNewUser}}
<tr>{{> UserEditor isNew=true}}</tr>
{{/if}}
{{#each users}}
{{> User}}
{{/each}}
</tbody>
</table>
<div class="listContianer">
<div class="listRow">
<div class="listCell">
<div class="tableContainer mCustomScrollbar" data-mcs-theme="dark">
<table class="dataTable table table-striped table-hover">
<tbody>
{{#if displayNewUser}}
<tr>{{> UserEditor isNew=true}}</tr>
{{/if}}
{{#each users}}
{{> User}}
{{/each}}
</tbody>
</table>
</div>
</div>
</div>
</div>

View File

@@ -5,6 +5,7 @@
height: 100%
width: 100%
text-align: left
position: relative
.tableControls
display: table
@@ -79,46 +80,52 @@
display: inline-block
.fa-plus-circle
display: none
.listRow
display: table-row
.listCell
display: table-cell
position: relative
height: 100%
width: 100%
.tableContainer
position: absolute
top: 0
bottom: 0
left: 0
right: 0
width: auto
height: auto
border: 0
font-size: 12.5px
overflow-y: auto
table
table-layout: fixed
width: 100%
thead
display: none
visibility: hidden
.userRemove
color: red
.userEdit
color: darkblue
.editorApply
color: green
.editorCancel
color: red
.userEditor > div
display: table
> div
display: table-cell
padding: 10px
.roles
.role
vertical-align: middle
.listContainer
position: absolute
top: 100px
left: 0
right: 0
bottom: 0
.listRow
display: table-row
.listCell
display: table-cell
position: relative
height: 100%
width: 100%
.tableContainer
position: absolute
top: 0
bottom: 0
left: 0
right: 0
width: auto
height: auto
border: 0
font-size: 12.5px
overflow-y: auto
table
table-layout: fixed
width: 100%
thead
display: none
visibility: hidden
.userRemove
color: red
.userEdit
color: darkblue
.editorApply
color: green
.editorCancel
color: red
.userEditor > div
display: table
> div
display: table-cell
padding: 10px
.roles
.role
vertical-align: middle
td.roles
.role
padding: 4px 4px

View File

@@ -1,2 +1,2 @@
import './Appreciations.html';
import './Appreciation.html';

View File

@@ -10,47 +10,41 @@
</div>
<div class="menuArea generalMenu">
<ul>
<li class="{{isActiveRoute 'InternshipJobs'}}">
<a href="{{pathFor 'InternshipJobs'}}">
<li class="{{isActiveRoute 'InternshipsEditor'}}">
<a href="{{pathFor 'InternshipsEditor'}}">
Internship Job List
</a>
</li>
<li class="{{isActiveRoute 'DatesEditor'}}">
<a href="{{pathFor 'DatesEditor'}}">
Important Dates
</a>
</li>
<li class="{{isActiveRoute 'AppreciationEditor'}}">
<a href="{{pathFor 'AppreciationEditor'}}">
Appreciation
</a>
</li>
<li class="{{isActiveRoute 'BoardEditor'}}">
<a href="{{pathFor 'BoardEditor'}}">
Current Board
</a>
</li>
<li class="{{isActiveRoute 'NewsEditor'}}">
<a href="{{pathFor 'NewsEditor'}}">
News & Notices
</a>
</li>
<li class="{{isActiveRoute 'UserManagement'}}">
<a href="{{pathFor 'UserManagement'}}">
Users
</a>
</li>
<li class="{{isActiveRoute 'ImportantDates'}}">
<a href="{{pathFor 'ImportantDates'}}">
Important Dates
</a>
</li>
<li class="{{isActiveRoute 'Appreciation'}}">
<a href="{{pathFor 'Appreciation'}}">
Appreciation
</a>
</li>
<li class="{{isActiveRoute 'CurrentBoard'}}">
<a href="{{pathFor 'CurrentBoard'}}">
Current Board
</a>
</li>
<li class="{{isActiveRoute 'News&Notices'}}">
<a href="{{pathFor 'News&Notices'}}">
News & Notices
</a>
</li>
<!-- Below is a second menu with a tag attached. -->
<!--<li class="{{isActiveRoute 'Misc'}}">-->
<!--<a href="{{pathFor 'Misc'}}">-->
<!--Misc &lt;!&ndash; <span class="tag">sample tag</span>&ndash;&gt;-->
<!--</a>-->
<!--</li>-->
</ul>
</div>
</div>
</nav>
<div class="contentBody verticalStack">
<div class="contentBody">
{{> Template.dynamic template=content}}
</div>
</div>

View File

@@ -181,9 +181,5 @@
color: white
.contentBody
flex: 1 1 1px
padding: 10px 20px
-webkit-box-shadow: inset 4px 2px 10px -3px rgba(168,165,168,1)
-moz-box-shadow: inset 4px 2px 10px -3px rgba(168,165,168,1)
box-shadow: inset 8px 0px 10px -3px rgba(168,165,168,1)
overflow: hidden
height:100%
padding: 10px 40px 10px 40px