Workshops page

inc/catc.php

@@ -33,8 +33,8 @@ class CATC extends Main
 			'tables' 			=>	array
 			(
 				Auth::USER_TABLE	=> array(Db::getText(Auth::USER_TABLE), 'nickname', 'pass', 'cookie'),
-				'workshops'			=> array('dates'),
+				Course::WS_TABLE	=> array('dates'),
-				'courses'			=> array(Db::getId('workshops'), 'description', 'timeslot', 'notes'),
+				Course::COURSE_TABLE=> array(Db::getId('workshops'), 'description', 'timeslot', 'notes'),
 				'docs'				=> array(Db::getId('courses'), 'type', 'path'),
 				'todos'				=> array(Db::getId('courses'), 'description')
 			),
@@ -136,7 +136,12 @@ class CATC extends Main
 		return $this->oAuth->checkApiKey($sApiKey);
 	}
 	
-	/* Managing projects */
+	/* Managing Courses */
+	
+	public function getWorkshops() {
+		return self::getJsonResult(true, '', (new Course($this->oDb))->getWorkshops());
+	}
+	
 	/*
 	public function upload()
 	{

inc/course.php

@@ -2,4 +2,34 @@
 
 class Course extends PhpObject {
 	
+	const WS_TABLE = 'workshops';
+	const COURSE_TABLE = 'courses';
+	
+	/**
+	 * DB
+	 * @var Db
+	 */
+	private $oDb;
+	
+	public function __construct(Db &$oDb)
+	{
+		parent::__construct(__CLASS__, Settings::DEBUG);
+		$this->oDb = &$oDb;
+	}
+	
+	public function getWorkshops() {
+		$asCourses = $this->oDb->selectRows(array(
+			'select'=> array(Db::getId(self::WS_TABLE), 'dates', Db::getId(self::COURSE_TABLE), 'description', 'timeslot'), 
+			'from'	=> self::COURSE_TABLE, 
+			'join'	=> array(self::WS_TABLE => Db::getId(self::WS_TABLE)))
+		);
+		
+		$asWorkshops = array();
+		foreach($asCourses as $asCourse) {
+			$asWorkshops[$asCourse[Db::getId(self::WS_TABLE)]]['dates'] = $asCourse['dates'];
+			$asWorkshops[$asCourse[Db::getId(self::WS_TABLE)]]['courses'][$asCourse[Db::getId(self::COURSE_TABLE)]] = array('description'=>$asCourse['description'], 'timeslot'=>$asCourse['timeslot']);
+		}
+		
+		return $asWorkshops;
+	}
 }

index.php

@@ -49,6 +49,9 @@ elseif($sAction!='' && $bLoggedIn)
 {
 	switch ($sAction)
 	{
+		case 'workshops':
+			$sResult = $oCATC->getWorkshops();
+			break;
 		default:
 			$sResult = CATC::getJsonResult(false, CATC::NOT_FOUND);
 	}
@@ -59,9 +62,6 @@ elseif($sAction!='' && !$bLoggedIn)
 	{
 		switch ($sAction)
 		{
-			case '':
-				//$sResult = $oCATC->apifunction();
-				break;
 			default:
 				$sResult = CATC::getJsonResult(false, CATC::NOT_FOUND);
 		}

masks/index.html

@@ -10,7 +10,7 @@
 	<script type="text/javascript" src="scripts/quill.min.js"></script>
 	<script type="text/javascript" src="scripts/common.js"></script>
 	<script type="text/javascript" src="scripts/catc.js"></script>
-	<link rel="shortcut icon" href="images/favicon2.ico" />
+	<link rel="icon" type="image/png" href="images/favicon.png">
 	<title>CATC Notes</title>
 	<script type="text/javascript">
 		var oCATC = new CATC(asGlobalVars); 

masks/logon.html

@@ -36,10 +36,14 @@
 <script type="text/javascript">
 oCATC.pageInit = function(asHash, bFirstPage)
 {
-	self.elem.$Main.addClass('no_frame');
 	$('[data-toggle="tooltip"]').tooltip();
 	
-	//$(window).keyup(function(e){if(e.which==13) logMeIn();});
+	$(window).keyup(function(e) {
+		if(e.which==13) {
+			if($('#signin').is(':visible')) $('#signin').click();
+			else $('#register').click();
+		}
+	});
 	$('#signin').click(logMeIn);
 	$('#register').on('click submit', function(event){
 		event.preventDefault();

masks/menu.html

@@ -1,3 +0,0 @@
-<a id="signout" href="?p=w" title="Exit" class="option">Write</a>&nbsp;.&nbsp;
-<a id="signout" href="?p=s" title="Exit" class="option">Settings</a>&nbsp;.&nbsp;
-<a id="signout" href="?p=q" title="Exit" class="option">Sign out</a>

masks/template.html

@@ -5,16 +5,15 @@
 </div>
 <div id="menu">
 	<ul>
-		<li><a href="#settings" class="button fal fa-settings"></a></li>
+		<li><a href="#" class="button fal fa-home"></a></li><li><a href="#logoff" class="button fal fa-logoff"></a></li>
-		<li><a href="#logoff" class="button fal fa-logoff"></a></li>
 	</ul>
 </div>
+<div id="main_title"><h1></h1></div>
 <div id="main"></div>
 <div id="side">
 	<div class="tag write"><a href="#write" class="fal fa-write"></a></div>
 </div>		
 <footer>
-	<span>Designed and powered by Franzz &amp; Clarita. </span>
+	<span>Designed and powered by Franzz &amp; Clarita - CATC Notes Project under <a href="http://www.gnu.org/licenses/gpl.html" target="_blank">GPLv3</a> License</span>
-	<span>My Thoughts Project under <a href="http://www.gnu.org/licenses/gpl.html" target="_blank">GPLv3</a> License.</span>
 </footer>
 #errors#

masks/workshops.html

@@ -1,7 +1,50 @@
-<h1>Workshops</h1>
+<div id="workshops">
+	<div class="ws_title"><h1>Workshops</h1></div>
+	<div id="ws_data"></div>
+</div>
 <script type="text/javascript">
 oCATC.pageInit = function(asHash, bFirstPage)
 {
-	console.log('workshops init');
+	self.setPageTitle('');
+	
+	//Workshops list
+	var $Workshops = $('<div>', {'class':'ws_list'});
+	Tools.ajax('workshops', function(asData){
+		$.each(asData, function(iWsId, asWorkshop){
+			var $Workshop = $('<div>', {'class':'ws_item clickable transition'})
+				.click(openCourses)
+				.append($('<span>', {'class':'title'}).text('WS '+iWsId))
+				.append($('<span>', {'class':'previous fa-fw clickable'})
+					.click(closeCourses)
+					.appendIcon('previous'))
+				.append($('<span>', {'class':'dates'}).text(asWorkshop.dates));
+			
+			var $Courses = $('<div>', {'class':'courses'}).appendTo($Workshop); 
+			$.each(asWorkshop.courses, function(iCourseId, asCourse){
+				var $Course = $('<div>', {'class':'course clickable transition'})
+					.click(function(){oCATC.setHash('course', iCourseId)})
+					.text(asCourse.description);
+				
+				$Courses.append($Course);
+			});
+			
+			$Workshops.append($Workshop);
+		});
+	});
+	$('#ws_data').append($Workshops);
+}
+
+function openCourses() {
+	var $This = $(this);
+	$('.ws_list').find('.ws_item').not($This).hide();
+	$This
+		.addClass('opened')
+		.removeClass('clickable');
+}
+
+function closeCourses(e) {
+	e.stopPropagation(); 
+	console.log('sdqsdf');
+	$('.ws_list').find('.ws_item').removeClass('opened').addClass('clickable').show();
 }
 </script>

scripts/catc.js

@@ -55,24 +55,8 @@ function CATC(asGlobals)
 	
 	this.initMenu = function()
 	{
+		self.elem.$Menu.find('.fa-home').attr('href', '#'+self.consts.default_page);
 		self.elem.$Menu.show('fast');
-		
-		//Thoughts on side menu
-		self.updateSideMenu();
-	};
-	
-	this.updateSideMenu = function() {
-		Tools.ajax(
-			'thoughts',
-			function(asData){
-				self.elem.$Side.find('.tag:not(.write)').remove();
-				$.each(asData, function(iKey, asThought) {
-					$Tile = $('<div>', {'class': 'tag'}).appendTo(self.elem.$Side);
-					var $Link = $('<a>', {'href': '#read-'+asThought.id_thought}).html(asThought.created_f.replace(' ', '<br />')).appendTo($Tile);
-				});
-				self.elem.$Side.slideDown('fast', self.setSideElemVisibility);
-			}
-		);
 	};
 	
 	this.setSideElemVisibility =  function() {
@@ -166,6 +150,8 @@ function CATC(asGlobals)
 		self.vars('log_in', asData.log_in);
 		self.vars('id', asData.id);
 		
+		$(window).off('keyup');
+		
 		if(self.vars('log_in')) {
 			//Setup menu
 			self.initMenu();
@@ -175,6 +161,10 @@ function CATC(asGlobals)
 		}
 	};
 	
+	this.setPageTitle = function(sTitle) {
+		$('#main_title').find('h1').text(sTitle);
+	};
+	
 	this.getActionLink = function(sAction, oVars)
 	{
 		if(!oVars) oVars = {};
@@ -247,9 +237,6 @@ function CATC(asGlobals)
 		$FadeInElem.empty();
 		$FadeInElem.html($Dom);
 
-		//Page Bootstrap
-		self.elem.$Main.removeClass('no_frame');
-		
 		//Show main
 		$FadeInElem.fadeTo('fast', 1, function(){self.pageInit(asHash, bFirstPage);});
 	};

scripts/common.js

@@ -31,7 +31,7 @@ var Tools = {
 		}
 		
 		asData['a'] = sAction;		
-		$.ajax({
+		return $.ajax({
 				url: oCATC.consts.context.process_page,
 				type: sType,
 				data: asData,
@@ -168,6 +168,10 @@ function copyArray(asArray)
 	return asArray.slice(0); //trick to copy array
 }
 
+$.prototype.appendIcon = function(sIcon, bFull) {
+	return $(this).append(Tools.getIcon(sIcon, bFull));
+};
+
 $.prototype.addButton = function(sType, sTitle, oClickLink, sId, sButtonClass)
 {
 	$This = $(this);

style/_font-awesome.scss

@@ -12,14 +12,18 @@ $fa-css-prefix: fa;
 @import 'fa/rotated-flipped';
 @import 'fa/stacked';
 
+//Logon
 .#{$fa-css-prefix}-user:before { content: fa-content($fa-var-user); }
 .#{$fa-css-prefix}-password:before { content: fa-content($fa-var-key); }
 
 //Menu
-.#{$fa-css-prefix}-write:before { content: fa-content($fa-var-pen); }
+.#{$fa-css-prefix}-home:before { content: fa-content($fa-var-home); }
 .#{$fa-css-prefix}-settings:before { content: fa-content($fa-var-cog); }
 .#{$fa-css-prefix}-logoff:before { content: fa-content($fa-var-sign-out); }
 
+//Workshops
+.#{$fa-css-prefix}-previous:before { content: fa-content($fa-var-chevron-left); }
+
 //Writer
 .#{$fa-css-prefix}-bold:before { content: fa-content($fa-var-bold); }
 .#{$fa-css-prefix}-underline:before { content: fa-content($fa-var-underline); }

style/_page_workshops.scss

@@ -0,0 +1,96 @@
+#workshops {
+	max-width: 800px;
+	margin: auto;
+	text-align: center;
+
+	.ws_title {
+		border-bottom: 2px solid $col_main_1;
+		margin-bottom: 1em;
+	}
+	
+	#ws_data .ws_list {
+		.ws_item {
+			color: $col_main_1;
+			background: $gray-400;
+			border-radius: 3px;
+			margin-bottom: 1em;
+			margin-right: 1em;
+			width: 100px;
+			height: 100px;
+			display: inline-block;
+			overflow: hidden;
+			position: relative;
+			
+			&:not(.opened):hover {
+				background: $col_main_2;
+				color: $gray-300;
+			}
+		
+			span {
+				display: inline-block;
+				text-align: center;
+				width: 100%;
+				
+				&.title {
+					border-bottom: 1px solid $gray-300;
+					font-weight: bold;
+				}
+			
+				&.previous {
+					display: none;
+				}
+			}
+		
+			.courses {
+				display: none;
+				width: 100%;
+				text-align: left;
+			}
+		
+			&.opened {
+				width: auto;
+				height: auto;
+				
+				span.title {
+					color: $gray-300;
+					background: $col_main_1;
+				}
+			
+				span.previous {
+					display: block;
+					position: absolute;
+					top: 0;
+					left: 5px;
+					width: auto;
+					color: $gray-300;
+					
+					&:hover {
+						color: $col_main_2;
+					}
+				}
+				
+				span.dates {
+					display: none;
+				}
+				
+				.courses {
+					display: inline-block;
+					
+					.course {
+						border-bottom: 1px solid $gray-300;
+						padding: 1em;
+
+						&:last-child {
+							border-bottom: none;
+						}
+					
+						&:hover {
+							background: $col_main_2;
+							color: $gray-300;
+						}
+					}
+				}
+			}
+		}
+	} 
+}

style/_template.scss

@@ -31,8 +31,8 @@ a:hover {
 	transition: all 0.3s ease 0s !important;
 }
 
-.bold {
+.clickable {
-	font-weight: bold;
+	cursor: pointer;
 }
 
 /* Common Classes - Containers */
@@ -48,22 +48,23 @@ a:hover {
 /* Common Classes - Inputs */
 
 a.button {
-	font-weight:normal;
+	font-weight: normal;
-	height:50px;
+	height: 40px;
-	width:50px;
+	width: 40px;
-	line-height:50px;
+	line-height: 40px;
 	font-size: 1.0em;
-	text-align:center;
+	text-align: center;
-	background:	url("../images/minicloud.png") 0 0 no-repeat;
 	color: $gray-600;
+	border-radius: 3px;
+	background-color: $gray-400;
 }
 a.button:hover {
-	color:white;
+	color: white;
-	background-position:0 -50px; 
+	background-color: $col_main_2;
 }
 a.button:active {
 	color:white;
-	background-position:0 -100px; 
+	background-color: $col_main_2;
 }
 
 .input-group-text i.fal {
@@ -87,10 +88,12 @@ a.button:active {
 
 #header {
 	position: relative;
+	height: 138px;
+	width: 50%;
 	
 	#logo_box {
-		height: 138px;
 		width: 100%;
+		height: 100%;
 		background: url('../images/logo.png') 0 0 no-repeat;
 	}
 
@@ -124,32 +127,40 @@ a.button:active {
 	display: none;
 	top: 0;
 	right: 0;
+	width: 50%;
+	height: 111px;
+	text-align: right;
+	
+	a.button {
+		margin-top: calc( ( 110px - 40px ) /2 );
+	}
 	
 	ul {
 		list-style: none;
 		
 		li {
 			display: inline;
+			margin-left: 1em;
 		}
 	}
 }
 
 /* Main */
 
+#main_title {
+	margin-top: 1em;
+}
+
 #main {
 	display: none;
-	margin-top: 1em;
 	position: absolute;
-	top:203px;
+	top: 138px;
 	bottom: 2rem;
 	right:0;
 	left:0;
 	border-radius: 0.5em;
 	padding: 1em;
-
+	overflow: auto;
-	&:not(.no_frame) {
-		@extend .shadow;
-	}
 }
 
 /* Side */

style/catc.scss

@@ -18,4 +18,5 @@
 
 /* Pages */
 
-@import 'logon';
+@import 'page_logon';
+@import 'page_workshops';