franzz/catc
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Notes

Browse Source
This commit is contained in:
Franzz
2019-09-05 22:55:40 +02:00
parent d8ac086b17
commit 1407e9b77a
12 changed files with 210 additions and 263 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
inc/catc.php
View File

@@ -12,7 +12,8 @@ class CATC extends Main
{
$asClasses = array(
array('name'=>'auth', 'project'=>true),
array('name'=>'course', 'project'=>true)
array('name'=>'course', 'project'=>true),
array('name'=>'note', 'project'=>true)
);
parent::__construct($oClassManagement, $sProcessPage, $asClasses);
@@ -73,7 +74,7 @@ class CATC extends Main
);
//Pages
$asPages = array('logon', 'logoff', 'template', 'workshops');
$asPages = array('logon', 'logoff', 'template', 'workshops', 'course');
foreach($asPages as $sPage) $asGlobalVars['consts']['pages'][$sPage] = $this->getPageContent($sPage);
//Main Page
@@ -136,12 +137,30 @@ class CATC extends Main
return $this->oAuth->checkApiKey($sApiKey);
}
/* Managing Courses */
/* Workshops / Courses */
public function getWorkshops() {
return self::getJsonResult(true, '', (new Course($this->oDb))->getWorkshops());
}
/* Notes*/
public function getNote($iCourseId) {
$oCourse = new Course($this->oDb, $iCourseId);
$asNote = $oCourse->getNote();
$iCourseId = $asNote[Db::getId(Course::COURSE_TABLE)];
return self::getJsonResult(($iCourseId > 0), '', array('id'=>$iCourseId, 'ops'=>$asNote['notes'], 'led'=>$asNote['led']));
}
public function setNote($iCourseId, $asOps) {
$oCourse = new Course($this->oDb, $iCourseId);
$sError = $oCourse->setNote($asOps);
$bSuccess = ($sError=='');
return self::getJsonResult(($sError==''), $sError, array('led' => $oCourse->getNote()['led']));
}
/*
public function upload()
{

33
inc/course.php
View File

@@ -11,10 +11,41 @@ class Course extends PhpObject {
*/
private $oDb;
public function __construct(Db &$oDb)
private $iCourseId;
public function __construct(Db &$oDb, $iCourseId=0)
{
parent::__construct(__CLASS__, Settings::DEBUG);
$this->oDb = &$oDb;
$this->setCourseId($iCourseId);
}
public function getCourseId() {
return $this->iCourseId;
}
public function setCourseId($iCourseId) {
$this->iCourseId = $iCourseId;
}
public function getNote() {
$asCourse = $this->oDb->selectRow(self::COURSE_TABLE, $this->getCourseId(), array(Db::getId(self::COURSE_TABLE), 'notes', 'led'));
$asCourse['notes'] = json_decode($asCourse['notes'], true);
return $asCourse;
}
public function setNote($asOps) {
$sError = '';
$sIdCol = Db::getId(self::COURSE_TABLE);
if($this->getCourseId() > 0) {
$iCourseId = $this->oDb->insertUpdateRow(self::COURSE_TABLE, array($sIdCol=>$this->getCourseId(), 'notes'=>json_encode($asOps)), array($sIdCol));
if(!$iCourseId) $sError = $this->oDb->getLastError();
}
else $sError = 'Course ID not set';
return $sError;
}
public function getWorkshops() {

9
index.php
View File

@@ -28,12 +28,11 @@ $oClassManagement = new ClassManagement('catc');
ToolBox::cleanPost($_POST);
ToolBox::cleanPost($_GET);
ToolBox::cleanPost($_REQUEST);
ToolBox::fixGlobalVars(isset($argv)?$argv:array());
//ToolBox::fixGlobalVars(isset($argv)?$argv:array());
//Available variables
$sToken = isset($_REQUEST['token'])?$_REQUEST['token']:'';
$sAction = isset($_REQUEST['a'])?$_REQUEST['a']:'';
$sPage = isset($_GET['p'])?$_GET['p']:'index';
$sNickName = isset($_REQUEST['nickname'])?$_REQUEST['nickname']:'';
$iApiKey = isset($_GET['api'])?$_GET['api']:'';
$sContent = isset($_POST['content'])?$_POST['content']:'';
@@ -52,6 +51,12 @@ elseif($sAction!='' && $bLoggedIn)
case 'workshops':
$sResult = $oCATC->getWorkshops();
break;
case 'get_note':
$sResult = $oCATC->getNote($iId);
break;
case 'set_note':
$sResult = $oCATC->setNote($iId, $sContent);
break;
default:
$sResult = CATC::getJsonResult(false, CATC::NOT_FOUND);
}

83
masks/course.html Normal file
View File

@@ -0,0 +1,83 @@
<div id="course">
<div id="docs"></div>
<div id="notes_box">
<div id="notes_feedback"></div>
<div id="notes"></div>
</div>
</div>
<script type="text/javascript">
oCATC.pageInit = function(asHash, bFirstPage) {
self.setPageTitle('Course');
self.tmp('id_course', asHash.items[0]);
oEditor = new Editor('#notes');
oEditor.onKeyStroke = (e) => {
if(e.which == 83 && e.ctrlKey) {
e.preventDefault();
save(true);
}
else save();
}
oEditor.open(self.tmp('id_course'));
//oQuill.keyboard.addBinding({key: 'S', ctrlKey: true}, function(){saveNotes(true);});
};
oCATC.onQuitPage = function() {
return save(true);
};
oCATC.onFeedback = function(sType, sMsg)
{
var $Feedback = $('#notes_feedback').stop();
if(sMsg != $Feedback.find('span').text()) {
$Feedback.fadeOut($Feedback.is(':empty')?0:'fast', function(){
$(this)
.empty()
.append($('<span>', {'class':sType}).text(sMsg))
.fadeIn('fast');
});
}
};
function save(bForce)
{
if(typeof oSaveTimer != 'undefined') clearTimeout(oSaveTimer);
var bSave = (oEditor.keystrokes % 20 == 0 || bForce);
if(bSave) {
if(self.tmp('saving')) {
oSaveTimer = setTimeout(function(){save(true);}, 500);
}
else {
var sContent = oEditor.getContent();
if(oEditor.id != 0) {
self.tmp('saving', true);
oCATC.onFeedback('info', 'Saving...');
getInfo(
'set_note',
function(sDesc, asData) {
oCATC.feedback('notice', 'Note saved ('+asData.led.substr(11, 5)+')');
self.tmp('saving', false);
},
{
id: oEditor.id,
content: sContent
},
function(sError) {
oCATC.feedback('error', 'Not saved! An error occured: '+sError);
self.tmp('saving', false);
oSaveTimer = setTimeout(save, 1000);
},
'POST'
);
}
else oCATC.feedback('error', 'No Course ID');
}
}
else {
oSaveTimer = setTimeout(function(){save(true);}, 1000*10);
}
return true;
}
</script>

2
masks/template.html
View File

@@ -5,7 +5,7 @@
</div>
<div id="menu">
<ul>
<li><a href="#" class="button fal fa-home"></a></li><li><a href="#logoff" class="button fal fa-logoff"></a></li>
<li><a href="#workshops" class="button fal fa-home"></a></li><li><a href="#logoff" class="button fal fa-logoff"></a></li>
</ul>
</div>
<div id="main_title"><h1></h1></div>

191
scripts/catc.js
View File

@@ -277,46 +277,28 @@ function CATC(asGlobals)
};
}
//Date format
const Inline = Quill.import('blots/inline');
class ThoughtDate extends Inline {
static create(value) {
let node = super.create();
node.setAttribute('class', 'edi_header');
return node;
}
}
ThoughtDate.blotName = 'thought_date';
ThoughtDate.tagName = 'div';
Quill.register(ThoughtDate);
class Editor {
constructor(sContainerId, bReadOnly) {
constructor(sEditorId, bReadOnly) {
this.id = 0;
this.page = 0;
this.keystrokes = 0;
this.line = false;
this.readOnly = bReadOnly || false;
this.sCursorPos = '';
//DOM Elements
var sEditorId = 'edi'+Math.floor(Math.random() * 1000);
this.$Container = $(sContainerId).addClass('editor').append(self.consts.pages['editor']);
this.$Header = this.$Container.find('.edi_header');
this.$EditorBox = this.$Container.find('.edi_container');
this.$Editor = this.$Container.find('.edi_table').attr('id', sEditorId);
this.$PrevBtn = $('.prev');
this.$NextBtn = $('.next');
this.$Editor = $(sEditorId);
this.onKeyStroke = function(e){};
this.oQuill = new Quill('#'+sEditorId, {
theme: 'bubble',
placeholder: 'What\'s on your mind?',
readOnly: bReadOnly,
this.oQuill = new Quill(sEditorId, {
theme: 'snow',
placeholder: 'Notes',
readOnly: bReadOnly/*,
modules: {
toolbar: [['bold', 'italic', 'underline'], [{ 'list': 'ordered'}, { 'list': 'bullet' }], ['clean']]
}
}*/
});
this._initEvents();
@@ -326,174 +308,29 @@ class Editor {
_initEvents() {
//Key strokes
this.$Editor.keydown((e) => {
if($.inArray(e.which, [13, 37, 38, 39, 40]) != -1) this._onChange('', '', 'user', e);
else if(e.which==33) this.$PrevBtn.click();
else if(e.which==34) this.$NextBtn.click();
else this.onKeyStroke(e);
if($.inArray(e.which, [13, 37, 38, 39, 40]) == -1) this.onKeyStroke(e);
});
//On text modification
this.oQuill.on('text-change', (delta, oldDelta, sSource) => {this._onChange(delta, oldDelta, sSource);});
//Mouse wheel events
$(window).mousewheel((turn, iDelta) => {
var iNewPage = this.page + ((iDelta > 0)?-1:1);
this.moveToPage(iNewPage);
return false;
});
//Page buttons
this.$PrevBtn.click(() => {this.moveToPage(this.page - 1);});
this.$NextBtn.click(() => {this.moveToPage(this.page + 1);});
this.oQuill.on('text-change', (delta, oldDelta, sSource) => {this._incKeyStrokes();});
}
_postInit(iPage) {
iPage = iPage || 0;
this._setPageHeight();
this.moveToPage(iPage);
if(!this.readOnly) this.oQuill.focus();
}
setHeader(sHeader) {
this.$Editor.find('.edi_header').remove();
if(this.readOnly) {
this.oQuill.insertText(0, sHeader+"\n");
this.oQuill.formatText(0, sHeader.length, 'thought_date', true);
}
}
open(iThoughtId) {
open(iCourseId) {
Tools.ajax(
'load',
'get_note',
(asData) => {
this.id = asData.id;
this.oQuill.setContents(asData.ops);
this.setHeader('Thoughts on '+asData.created_f);
this._postInit();
},
{id: iThoughtId}
{id: iCourseId}
);
}
_setPageHeight() {
var iHeight = this.$EditorBox.height();
var iLineHeight = parseInt(this.$Editor.find('p').css('line-height'));
var iMaxHeight = Math.floor(iHeight / iLineHeight) * iLineHeight;
this.$EditorBox.height(iMaxHeight+'px');
this.lineHeight = iLineHeight;
this.pageHeight = iMaxHeight;
}
_onChange(delta, oldDelta, sSource, e) {
if(sSource == 'user')
{
var range = this.oQuill.getSelection();
if(range)
{
var bSelection = (typeof e != 'undefined')?e.shiftKey:false;
var oSelBound = this.oQuill.getBounds(range.index, range.length);
var oEditorCurBound = { top: this.pageHeight * this.page,
bottom: this.pageHeight * (this.page + 1)};
//console.log('oEditorCurBound: top='+oEditorCurBound.top+' bottom='+oEditorCurBound.bottom);
//console.log('---------------------');
//console.log('range.length = '+range.length);
//console.log('oSelBound: top='+oSelBound.top+' bottom='+oSelBound.bottom);
//Detecting new selection & saving original line
if(!this.line && bSelection) this.line = $.extend({}, oSelBound);
else if(!bSelection) this.line = false;
//Detecting navigating back to original line
var bReset = (this.line && this.line.top == oSelBound.top && this.line.bottom == oSelBound.bottom);
//Anticipating arrows (downside of using keydown event)
if(e)
{
switch(e.which)
{
case 13: //Enter
case 40: //Down
if(bSelection) {
if(bReset) this.sCursorPos = 'last';
if(this.sCursorPos == 'last') { //Downwards selection, expanding
oSelBound.bottom += this.lineHeight;
}
else { //Upwards selection, reducing
oSelBound.top += this.lineHeight;
}
}
else oSelBound.bottom += this.lineHeight;
break;
case 38: //Up
if(bSelection) {
if(bReset) this.sCursorPos = 'first';
if(this.sCursorPos == 'last') { //Downwards selection, reducing
oSelBound.bottom -= this.lineHeight;
}
else { //Upwards selection, expanding
oSelBound.top -= this.lineHeight;
}
}
else oSelBound.top = Math.max(0, oSelBound.top - this.lineHeight);
break;
case 37: //Left
if(bReset && bSelection) this.sCursorPos = 'first';
oSelBound = this.oQuill.getBounds(Math.max(0, range.index - 1), range.length);
break;
case 39: //Right
if(bReset && bSelection) this.sCursorPos = 'last';
oSelBound = this.oQuill.getBounds(range.index + 1, range.length);
break;
}
}
else this._incKeyStrokes();
//console.log('oSelBound: top='+oSelBound.top+' bottom='+oSelBound.bottom);
var sNewPage = this.page;
if( oSelBound.top < oEditorCurBound.top && (!bSelection || this.sCursorPos == 'first') ||
oSelBound.bottom < oEditorCurBound.top && (!bSelection || this.sCursorPos == 'last')) {
sNewPage--;
}
else if(oSelBound.bottom > oEditorCurBound.bottom && (!bSelection || this.sCursorPos == 'last') ||
oSelBound.top > oEditorCurBound.bottom && (!bSelection || this.sCursorPos == 'first')) {
sNewPage++;
}
this.moveToPage(sNewPage);
}
}
}
moveToPage(iNewPage) {
var iContentHeight = this.$Editor.height();
var iLastPage = Math.floor(iContentHeight / this.pageHeight);
if(iNewPage == 'last') iNewPage = iLastPage;
if(iNewPage >= 0 && iNewPage <= iLastPage)
{
if(iNewPage != this.page)
{
var iOldPage = this.page;
this.page = iNewPage;
//Page Position
var iOffset = this.page * this.pageHeight * -1;
this.$Editor.css('top', iOffset);
}
//Page Number
//$('.curr').text(self.vars('quill_page') + 1);
//Detect First/Last Page
this.$PrevBtn.toggleClass('visible', this.page != 0);
this.$NextBtn.toggleClass('visible', this.page != iLastPage);
}
}
_incKeyStrokes() {
this.keystrokes += 1;
}

35
style/_page_course.scss Normal file
View File

@@ -0,0 +1,35 @@
#course {
#notes_box {
position: absolute;
width: 70%;
top: 0;
right: 0;
height: 100%;
#notes_feedback {
position: absolute;
top: 0;
right: 0;
height: 41.35px;
width: 50%;
text-align: right;
span {
position: absolute;
width: 100%;
display: inline-block;
top: 50%;
transform: translateY(-50%);
right: 0;
}
}
#notes {
width: 100%;
height: calc(100% - 43.35px);
background: $gray-400;
border-radius: 0.5em;
}
}
}

86
style/_quill.scss
View File

@@ -1,80 +1,16 @@
@import 'quill/quill.bubble';
@import 'quill/quill.snow';
.ql-toolbar.ql-snow {
border: none;
}
.ql-snow.ql-toolbar button:hover, .ql-snow .ql-toolbar button:hover, .ql-snow.ql-toolbar button:focus, .ql-snow .ql-toolbar button:focus, .ql-snow.ql-toolbar button.ql-active, .ql-snow .ql-toolbar button.ql-active, .ql-snow.ql-toolbar .ql-picker-label:hover, .ql-snow .ql-toolbar .ql-picker-label:hover, .ql-snow.ql-toolbar .ql-picker-label.ql-active, .ql-snow .ql-toolbar .ql-picker-label.ql-active, .ql-snow.ql-toolbar .ql-picker-item:hover, .ql-snow .ql-toolbar .ql-picker-item:hover, .ql-snow.ql-toolbar .ql-picker-item.ql-selected, .ql-snow .ql-toolbar .ql-picker-item.ql-selected {
color: $col_main_2;
}
.ql-snow.ql-toolbar button:hover .ql-stroke, .ql-snow .ql-toolbar button:hover .ql-stroke, .ql-snow.ql-toolbar button:focus .ql-stroke, .ql-snow .ql-toolbar button:focus .ql-stroke, .ql-snow.ql-toolbar button.ql-active .ql-stroke, .ql-snow .ql-toolbar button.ql-active .ql-stroke, .ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke, .ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke, .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke, .ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke, .ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke, .ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke, .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke, .ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke, .ql-snow.ql-toolbar button:hover .ql-stroke-miter, .ql-snow .ql-toolbar button:hover .ql-stroke-miter, .ql-snow.ql-toolbar button:focus .ql-stroke-miter, .ql-snow .ql-toolbar button:focus .ql-stroke-miter, .ql-snow.ql-toolbar button.ql-active .ql-stroke-miter, .ql-snow .ql-toolbar button.ql-active .ql-stroke-miter, .ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke-miter, .ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke-miter, .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter, .ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter, .ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke-miter, .ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke-miter, .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter, .ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter {
stroke: $col_main_2;
}
.ql-editor.ql-blank::before {
left: 1.5em;
color: $gray-400;
}
.editor {
position: relative;
height:100%;
.edi_container {
height: calc(100% - 2em); /* 2 * 2em*/
overflow: hidden;
position: relative;
.edi_content {
height:auto;
position: relative;
.ql-container {
padding: 0;
}
.ql-editor {
padding: 0;
font-family: $font_para;
font-size: 14px;
div {
margin: 0;
&.edi_header {
color: $gray-500;
font-style: italic;
line-height: 3em;
}
}
p {
text-indent: 1.5em;
margin: 0;
padding: 0;
text-align: justify;
line-height: 1.5em;
}
}
}
}
/* Write - Navbar */
.edi_nav {
position: absolute;
bottom: 0;
right: 0;
left: 0;
.nav-elem {
color: $gray-500;
display: inline-block;
cursor: pointer;
width: 1.25em;
font-size: 1.25em;
&:hover {
color: $gray-700;
}
&.prev, &.curr, &.next {
visibility: hidden;
}
&.next {
float: right;
}
}
}
}

2
style/_template.scss
View File

@@ -154,7 +154,7 @@ a.button:active {
#main {
display: none;
position: absolute;
top: 138px;
top: calc(138px + 4em);
bottom: 2rem;
right:0;
left:0;

2
style/catc.css
View File

File diff suppressed because one or more lines are too long

4
style/catc.css.map
View File

File diff suppressed because one or more lines are too long

1
style/catc.scss
View File

@@ -20,3 +20,4 @@
@import 'page_logon';
@import 'page_workshops';
@import 'page_course';