71 changed files with 26890 additions and 1 deletions
@ -0,0 +1,5 @@ |
|||||
|
node_modules |
||||
|
socket/node_modules |
||||
|
scss/.sass-cache |
||||
|
socket/public/node_modules |
||||
|
socket/public/scss/.sass-cache |
||||
@ -0,0 +1,10 @@ |
|||||
|
|
||||
|
RewriteEngine On |
||||
|
|
||||
|
Rewritebase / |
||||
|
|
||||
|
RewriteCond %{REQUEST_FILENAME} !-f |
||||
|
RewriteCond %{REQUEST_FILENAME} !-d |
||||
|
RewriteRule ^(.*)$ index.php?q=$1 [L,QSA] |
||||
|
|
||||
|
|
||||
@ -0,0 +1,67 @@ |
|||||
|
<?php |
||||
|
|
||||
|
@include '../cgi-bin/conn.conn'; |
||||
|
@include '../cgi-bin/functions.inc'; |
||||
|
@include '../cgi-bin/params.inc'; |
||||
|
|
||||
|
$GLOBALS['sid']=$_GET['sid']; |
||||
|
$GLOBALS['conn']; |
||||
|
|
||||
|
$conn=@mysqli_connect($DATAhst,$DATAusr,$DATApwd,$DATAdtb)or die("CONNECTION ERROR"); |
||||
|
mysqli_set_charset($conn, "utf8"); |
||||
|
|
||||
|
$qs=mysqli_query($conn, "SELECT * FROM `session` WHERE link='$sid'"); |
||||
|
$rs=mysqli_fetch_array($qs); |
||||
|
|
||||
|
$session->name = $rs['name']; |
||||
|
$session->start = $rs['start']; |
||||
|
$session->stop = $rs['stop']; |
||||
|
$session->enabled = $rs['enabled']; |
||||
|
|
||||
|
$messages = array(); |
||||
|
|
||||
|
$qmMaxProgress=mysqli_query($conn, "SELECT MAX(progress) FROM messages WHERE sid=".$rs['id']); |
||||
|
$rmMaxProgress=mysqli_fetch_array($qmMaxProgress); |
||||
|
$qmProgressN=mysqli_query($conn, "SELECT COUNT(progress) FROM messages WHERE progress!=0 AND sid=".$rs['id']); |
||||
|
$rmProgressN=mysqli_fetch_array($qmProgressN); |
||||
|
|
||||
|
$session->progress_n = $rmProgressN[0]; |
||||
|
$session->progress_max = $rmMaxProgress[0]; |
||||
|
$session->duration = strtotime($rs['stop']) - strtotime($rs['start']); |
||||
|
$progressCnt=0; |
||||
|
$stepDuration=$session->duration/($session->progress_n+1); |
||||
|
|
||||
|
$session->step_duration = $stepDuration; |
||||
|
|
||||
|
$qm=mysqli_query($conn, "SELECT * FROM messages WHERE sid=".$rs['id']." ORDER BY progress"); |
||||
|
while($rm=mysqli_fetch_array($qm)){ |
||||
|
if($rm['progress']){$progressCnt++;} |
||||
|
|
||||
|
$timer = ($rm['progress']!=0) ? |
||||
|
date("Y-m-d H:i:s",strtotime($session->start)+($progressCnt*$stepDuration)) : |
||||
|
date("Y-m-d H:i:s",strtotime($session->start)+timeSeconds($rm['timer'])); |
||||
|
|
||||
|
$singleMessage = array("id"=>$rm['id'], |
||||
|
"title"=>$rm['title'], |
||||
|
"short_text"=>$rm['short_text'], |
||||
|
"long_text"=>$rm['long_text'], |
||||
|
"image"=>$rm['image'], |
||||
|
"actions"=>$rm['actions'], |
||||
|
"timer"=>$timer |
||||
|
|
||||
|
); |
||||
|
array_push($messages, $singleMessage); |
||||
|
|
||||
|
} |
||||
|
|
||||
|
$session->messages = $messages; |
||||
|
|
||||
|
|
||||
|
header('Access-Control-Allow-Origin: *'); |
||||
|
header('Content-Type: application/json'); |
||||
|
|
||||
|
$json = json_encode($session); |
||||
|
echo $json; |
||||
|
|
||||
|
|
||||
|
?> |
||||
@ -0,0 +1,247 @@ |
|||||
|
<?php |
||||
|
|
||||
|
session_start(); |
||||
|
|
||||
|
@include 'cgi-bin/conn.conn'; |
||||
|
@include 'cgi-bin/functions.inc'; |
||||
|
@include 'cgi-bin/params.inc'; |
||||
|
|
||||
|
$conn=@mysqli_connect($DATAhst,$DATAusr,$DATApwd,$DATAdtb)or die("CONNECTION ERROR"); |
||||
|
mysqli_set_charset($conn, "utf8"); |
||||
|
|
||||
|
?> |
||||
|
|
||||
|
|
||||
|
<!DOCTYPE html> |
||||
|
<html> |
||||
|
<head> |
||||
|
|
||||
|
<title>COZe</title> |
||||
|
|
||||
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> |
||||
|
<meta name="description" content="COZe"> |
||||
|
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'> |
||||
|
|
||||
|
<base href="<?php echo $BASE_URL;?>/"> |
||||
|
<?php |
||||
|
@include 'cssvendors.php'; |
||||
|
?> |
||||
|
|
||||
|
</head> |
||||
|
<body> |
||||
|
|
||||
|
<div id="MainContent" class="container"> |
||||
|
<form method="post" enctype="multipart/form-data" class="add_message_form"> |
||||
|
|
||||
|
<?php |
||||
|
|
||||
|
if($_POST['title']) { |
||||
|
$image=0; |
||||
|
$imagePath=""; |
||||
|
$text = explode("%break%", $_POST['text']); |
||||
|
if(is_uploaded_file($_FILES['image']['tmp_name'])){ |
||||
|
$image = date("YmdHis"); |
||||
|
save_photo($_FILES['image']['tmp_name'],"images/upload/",$image); |
||||
|
$imagePath = "/images/upload/$image.jpg"; |
||||
|
} |
||||
|
|
||||
|
$actions = array(); |
||||
|
|
||||
|
if($_POST['action_title'][0] != ""){ |
||||
|
foreach ($_POST['action_title'] as $index => $message) { |
||||
|
$action_title = $_POST['action_title'][$index]; |
||||
|
$action_description = $_POST['action_description'][$index]; |
||||
|
$action_message = $_POST['action_message'][$index]; |
||||
|
mysqli_query($conn, "INSERT INTO actions VALUES(null, '".$action_title."', '".$action_description."',".$action_message.")"); |
||||
|
$actions[$index] = mysqli_insert_id($conn); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
$q = mysqli_query($conn, "INSERT INTO messages VALUES(null, '".$_POST['session']."', '".convert($_POST['title'])."', |
||||
|
'".convert_mce($text[0])."', '".convert_mce($text[1])."', '$imagePath', |
||||
|
'".implode(",", $actions)."', '".$_POST['hours'].":".$_POST['minutes'].":".$_POST['seconds']."', |
||||
|
".$_POST['progress'].")"); |
||||
|
|
||||
|
|
||||
|
echo "<script>parent.window.location=parent.window.location</script>"; |
||||
|
|
||||
|
} else { |
||||
|
?> |
||||
|
|
||||
|
<div class="row"> |
||||
|
<div class="col-12"> |
||||
|
<span class="font-12 text-grey">Session</span> |
||||
|
<div class="row"> |
||||
|
<div class="col"> |
||||
|
<select name="session"> |
||||
|
<?php |
||||
|
$qs = mysqli_query($conn, "SELECT * FROM `session` ORDER BY name"); |
||||
|
|
||||
|
while($rs = mysqli_fetch_array($qs)){ |
||||
|
echo "<option value=\"".$rs['id']."\">".$rs['name']."</option>\n"; |
||||
|
} |
||||
|
?> |
||||
|
</select> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="col-12"> |
||||
|
<span class="font-12 text-grey">Message title</span> |
||||
|
<input type="text" name="title"> |
||||
|
</div> |
||||
|
<div class="col-12"> |
||||
|
<span class="font-12 text-grey">Message text</span> |
||||
|
<textarea class="mce" name="text"></textarea> |
||||
|
</div> |
||||
|
<div class="col-12 mt-3"> |
||||
|
<span class="font-12 text-grey">Image<br></span> |
||||
|
<input type="file" name="image"> |
||||
|
</div> |
||||
|
|
||||
|
<div class="col-12"> |
||||
|
<span class="font-12 text-grey">Actions</span> |
||||
|
<div class="row item"> |
||||
|
<div class="col-3 font-10 text-grey"> |
||||
|
Label |
||||
|
</div> |
||||
|
<div class="col-4 font-10 text-grey"> |
||||
|
Description |
||||
|
</div> |
||||
|
<div class="col-4 font-10 text-grey"> |
||||
|
Link to |
||||
|
</div> |
||||
|
<div class="col-1"></div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="actions col-12"> |
||||
|
<div class="row item"> |
||||
|
<div class="col-3"> |
||||
|
<input type="text" name="action_title[]" placeholder="No action"> |
||||
|
</div> |
||||
|
<div class="col-4"> |
||||
|
<input type="text" name="action_description[]"> |
||||
|
</div> |
||||
|
<div class="col-4"> |
||||
|
<select name="action_message[]"> |
||||
|
<?php |
||||
|
$qm = mysqli_query($conn, "SELECT * FROM messages ORDER BY title"); |
||||
|
while($rm = mysqli_fetch_array($qm)){ |
||||
|
echo "<option value=\"".$rm['id']."\">".$rm['title']."</option>\n"; |
||||
|
} |
||||
|
?> |
||||
|
</select> |
||||
|
</div> |
||||
|
<div class="col-1"> |
||||
|
<button class="button grey del-row mx-0" disabled><i class="fa fa-minus"></i></button> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="col-12"> |
||||
|
<div class="row"> |
||||
|
<div class="col-12 text-left p-0"> |
||||
|
<button class="button grey add-row mx-0"><i class="fa fa-plus"></i></button> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
|
||||
|
|
||||
|
<div class="col-12 px-0"> |
||||
|
<hr> |
||||
|
<span class="font-12 text-grey">Schedule</span> |
||||
|
<div class="row"> |
||||
|
<div class="col"> |
||||
|
<button class="button discard big full mx-0" id="btn_none">Not scheduled</button> |
||||
|
</div> |
||||
|
<div class="col"> |
||||
|
<button class="button grey big full mx-0" id="btn_progress">Schedule</button> |
||||
|
</div> |
||||
|
<div class="col"> |
||||
|
<button class="button grey big full mx-0" id="btn_timer">Start after</button> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
|
||||
|
<div class="col-6 mx-auto my-5 d-none" id="div_timer"> |
||||
|
<span class="font-12 text-grey">Start after (HH:MM:SS)</span> |
||||
|
<div class="row"> |
||||
|
<div class="col"> |
||||
|
<select name="hours" class="text-center hours"> |
||||
|
<?php |
||||
|
for($i=0;$i<24;$i++){ |
||||
|
echo "<option value=\"".sprintf("%02d", $i)."\">".sprintf("%02d", $i)."</option>\n"; |
||||
|
} |
||||
|
?> |
||||
|
</select> |
||||
|
</div> |
||||
|
<div class="col hseparator"> |
||||
|
<select name="minutes" class="text-center minutes"> |
||||
|
<?php |
||||
|
for($i=0;$i<60;$i++){ |
||||
|
echo "<option value=\"".sprintf("%02d", $i)."\">".sprintf("%02d", $i)."</option>\n"; |
||||
|
} |
||||
|
?> |
||||
|
</select> |
||||
|
</div> |
||||
|
<div class="col hseparator"> |
||||
|
<select name="seconds" class="text-center seconds"> |
||||
|
<?php |
||||
|
for($i=0;$i<60;$i++){ |
||||
|
echo "<option value=\"".sprintf("%02d", $i)."\">".sprintf("%02d", $i)."</option>\n"; |
||||
|
} |
||||
|
?> |
||||
|
</select> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<div class="col-6 mx-auto my-5 d-none" id="div_progress"> |
||||
|
<span class="font-12 text-grey">Progress</span> |
||||
|
<div class="row"> |
||||
|
<div class="col"> |
||||
|
<select name="progress" class="text-center schedule"> |
||||
|
<option value="0" style="display: none; opacity:0">0</option> |
||||
|
<?php |
||||
|
for($i=1;$i<60;$i++){ |
||||
|
echo "<option value=\"$i\">$i</option>\n"; |
||||
|
} |
||||
|
?> |
||||
|
</select> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<div class="col-6 mx-auto my-5 text-center" id="div_none"> |
||||
|
<span class="font-12 text-grey">Not scheduled</span> |
||||
|
</div> |
||||
|
|
||||
|
|
||||
|
|
||||
|
<div class="col-12 text-center p4 px-0"> |
||||
|
<button type="submit" class="button big full confirm mx-0">Add message</button> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<?php |
||||
|
} |
||||
|
?> |
||||
|
|
||||
|
</form> |
||||
|
</div> |
||||
|
|
||||
|
<?php |
||||
|
@include 'jsvendors.php'; |
||||
|
@include 'scripts/'.$getQ[0].'.php'; |
||||
|
?> |
||||
|
|
||||
|
|
||||
|
</body> |
||||
|
</html> |
||||
|
|
||||
|
|
||||
|
|
||||
|
<?php |
||||
|
mysqli_close($conn); |
||||
|
?> |
||||
@ -0,0 +1,327 @@ |
|||||
|
<?php |
||||
|
|
||||
|
session_start(); |
||||
|
|
||||
|
@include 'cgi-bin/conn.conn'; |
||||
|
@include 'cgi-bin/functions.inc'; |
||||
|
@include 'cgi-bin/params.inc'; |
||||
|
|
||||
|
$conn=@mysqli_connect($DATAhst,$DATAusr,$DATApwd,$DATAdtb)or die("CONNECTION ERROR"); |
||||
|
mysqli_set_charset($conn, "utf8"); |
||||
|
|
||||
|
?> |
||||
|
|
||||
|
|
||||
|
<!DOCTYPE html> |
||||
|
<html> |
||||
|
<head> |
||||
|
|
||||
|
<title>COZe</title> |
||||
|
|
||||
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> |
||||
|
<meta name="description" content="COZe"> |
||||
|
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'> |
||||
|
|
||||
|
<base href="<?php echo $BASE_URL;?>/"> |
||||
|
<?php |
||||
|
@include 'cssvendors.php'; |
||||
|
?> |
||||
|
|
||||
|
</head> |
||||
|
<body> |
||||
|
|
||||
|
<div id="MainContent" class="container"> |
||||
|
<form method="post" enctype="multipart/form-data" class="add_message_form"> |
||||
|
|
||||
|
<?php |
||||
|
|
||||
|
if($_POST['title']) { |
||||
|
$image=0; |
||||
|
$text = explode("%break%", $_POST['text']); |
||||
|
if(is_uploaded_file($_FILES['image']['tmp_name'])){ |
||||
|
$image = date("YmdHis"); |
||||
|
$imagePath = "/images/upload/$image.jpg"; |
||||
|
save_photo($_FILES['image']['tmp_name'],"images/upload/",$image); |
||||
|
} |
||||
|
|
||||
|
if($_POST['del-img']){ |
||||
|
$imagePath=""; |
||||
|
} |
||||
|
|
||||
|
$actions = array(); |
||||
|
|
||||
|
if($_POST['action_title'][0] != ""){ |
||||
|
foreach ($_POST['action_title'] as $index => $message) { |
||||
|
$action_title = $_POST['action_title'][$index]; |
||||
|
$action_description = $_POST['action_description'][$index]; |
||||
|
$action_message = $_POST['action_message'][$index]; |
||||
|
$action_id = $_POST['action_id'][$index]; |
||||
|
if($action_id == 0){ |
||||
|
mysqli_query($conn, "INSERT INTO actions VALUES(null, '".$action_title."', '".$action_description."',".$action_message.")"); |
||||
|
$actions[$index] = mysqli_insert_id($conn); |
||||
|
}else{ |
||||
|
mysqli_query($conn, "UPDATE actions SET label='".$action_title."', description='".$action_description."', mid=".$action_message." WHERE id=$action_id"); |
||||
|
$actions[$index] = $action_id; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
$q = mysqli_query($conn, "UPDATE messages SET sid='".$_POST['session']."', title='".convert($_POST['title'])."', |
||||
|
short_text='".convert_mce($text[0])."', long_text='".convert_mce($text[1])."', |
||||
|
image='$imagePath', actions='".implode(",", $actions)."', |
||||
|
timer='".$_POST['hours'].":".$_POST['minutes'].":".$_POST['seconds']."', |
||||
|
progress=".$_POST['progress']." WHERE id=".$_POST['id']); |
||||
|
|
||||
|
|
||||
|
echo "<script>parent.window.location=parent.window.location</script>"; |
||||
|
|
||||
|
} else { |
||||
|
|
||||
|
$q = mysqli_query($conn, "SELECT * FROM messages WHERE id=".$_GET['id'].""); |
||||
|
$r = mysqli_fetch_array($q); |
||||
|
?> |
||||
|
|
||||
|
<div class="row"> |
||||
|
<div class="col-12"> |
||||
|
<span class="font-12 text-grey">Session</span> |
||||
|
<div class="row"> |
||||
|
<div class="col"> |
||||
|
<select name="session"> |
||||
|
<?php |
||||
|
$qs = mysqli_query($conn, "SELECT * FROM `session` ORDER BY name"); |
||||
|
|
||||
|
while($rs = mysqli_fetch_array($qs)){ |
||||
|
echo "<option value=\"".$rs['id']."\" "; |
||||
|
if($r['sid'] == $rs['id']){echo "selected";} |
||||
|
echo ">".$rs['name']."</option>\n"; |
||||
|
} |
||||
|
?> |
||||
|
</select> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="col-12"> |
||||
|
<span class="font-12 text-grey">Message title</span> |
||||
|
<input type="text" name="title" value="<?= $r['title'];?>"> |
||||
|
<input type="hidden" name="id" value="<?= $_GET['id'];?>"> |
||||
|
</div> |
||||
|
<div class="col-12"> |
||||
|
<span class="font-12 text-grey">Message text</span> |
||||
|
<textarea class="mce" name="text"><?= $r['short_text']."%break%".$r['long_text'];?></textarea> |
||||
|
</div> |
||||
|
<div class="col-10 mt-3"> |
||||
|
<span class="font-12 text-grey">Image<br></span> |
||||
|
<input type="file" name="image"> |
||||
|
</div> |
||||
|
<div class="col-1 mt-3"> |
||||
|
<?php |
||||
|
if($r['image']){ |
||||
|
echo "<img src=\"".$r['image']."\" width=\"100%\">"; |
||||
|
} |
||||
|
?> |
||||
|
</div> |
||||
|
<div class="col-1"> |
||||
|
<?php |
||||
|
if($r['image']){ |
||||
|
echo "<input type=\"checkbox\" name=\"del-img\" class=\"full-middle\" value=\"".$r['id']."\">"; |
||||
|
} |
||||
|
?> |
||||
|
</div> |
||||
|
|
||||
|
<div class="col-12"> |
||||
|
<span class="font-12 text-grey">Actions</span> |
||||
|
<div class="row item"> |
||||
|
<div class="col-3 font-10 text-grey"> |
||||
|
Label |
||||
|
</div> |
||||
|
<div class="col-4 font-10 text-grey"> |
||||
|
Description |
||||
|
</div> |
||||
|
<div class="col-4 font-10 text-grey"> |
||||
|
Link to |
||||
|
</div> |
||||
|
<div class="col-1"></div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="actions col-12"> |
||||
|
<?php |
||||
|
if($r['actions']){ |
||||
|
$cnt=0; |
||||
|
$qpa = mysqli_query($conn, "SELECT * FROM actions WHERE id IN(".$r['actions'].")"); |
||||
|
while($rpa = mysqli_fetch_array($qpa)){ |
||||
|
$cnt++; |
||||
|
?> |
||||
|
|
||||
|
<div class="row item"> |
||||
|
<div class="col-3"> |
||||
|
<input type="hidden" name="action_id[]" value="<?= $rpa['id'];?>"> |
||||
|
<input type="text" name="action_title[]" value="<?= $rpa['label'];?>"> |
||||
|
</div> |
||||
|
<div class="col-4"> |
||||
|
<input type="text" name="action_description[]" value="<?= $rpa['description'];?>"> |
||||
|
</div> |
||||
|
<div class="col-4"> |
||||
|
<select name="action_message[]"> |
||||
|
<?php |
||||
|
$qm = mysqli_query($conn, "SELECT * FROM messages ORDER BY title"); |
||||
|
while($rm = mysqli_fetch_array($qm)){ |
||||
|
echo "<option value=\"".$rm['id']."\" "; |
||||
|
if($rpa['mid'] == $rm['id']){echo "selected";} |
||||
|
echo ">".$rm['title']."</option>\n"; |
||||
|
} |
||||
|
?> |
||||
|
</select> |
||||
|
</div> |
||||
|
<div class="col-1"> |
||||
|
<button class="button grey del-row mx-0" <?php if($cnt==1){echo "disabled";}?>><i class="fa fa-minus"></i></button> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<?php |
||||
|
} |
||||
|
}else{ |
||||
|
?> |
||||
|
<div class="row item"> |
||||
|
<div class="col-3"> |
||||
|
<input type="hidden" name="action_id[]" value="0"> |
||||
|
<input type="text" name="action_title[]" placeholder="No action"> |
||||
|
</div> |
||||
|
<div class="col-4"> |
||||
|
<input type="text" name="action_description[]"> |
||||
|
</div> |
||||
|
<div class="col-4"> |
||||
|
<select name="action_message[]"> |
||||
|
<?php |
||||
|
$qm = mysqli_query($conn, "SELECT * FROM messages ORDER BY title"); |
||||
|
while($rm = mysqli_fetch_array($qm)){ |
||||
|
echo "<option value=\"".$rm['id']."\">".$rm['title']."</option>\n"; |
||||
|
} |
||||
|
?> |
||||
|
</select> |
||||
|
</div> |
||||
|
<div class="col-1"> |
||||
|
<button class="button grey del-row mx-0" disabled><i class="fa fa-minus"></i></button> |
||||
|
</div> |
||||
|
</div> |
||||
|
<?php |
||||
|
} |
||||
|
?> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="col-12"> |
||||
|
<div class="row"> |
||||
|
<div class="col-12 text-left p-0"> |
||||
|
<button class="button grey add-row mx-0"><i class="fa fa-plus"></i></button> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
|
||||
|
|
||||
|
<div class="col-12 px-0"> |
||||
|
<hr> |
||||
|
<span class="font-12 text-grey">Schedule</span> |
||||
|
<div class="row"> |
||||
|
<div class="col"> |
||||
|
<button class="button <?php if($r['timer']=='00:00:00' && $r['progress']==0){echo "discard";}else{echo "grey";}?> big full mx-0" id="btn_none">Not scheduled</button> |
||||
|
</div> |
||||
|
<div class="col"> |
||||
|
<button class="button <?php if($r['progress']!=0){echo "discard";}else{echo "grey";}?> big full mx-0" id="btn_progress">Schedule</button> |
||||
|
</div> |
||||
|
<div class="col"> |
||||
|
<button class="button <?php if($r['timer']!='00:00:00' && $r['progress']==0){echo "discard";}else{echo "grey";}?> big full mx-0" id="btn_timer">Start after</button> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
|
||||
|
<div class="col-6 mx-auto my-5 <?php if($r['timer']=='00:00:00'){echo "d-none";}?>" id="div_timer"> |
||||
|
<span class="font-12 text-grey">Start after (HH:MM:SS)</span> |
||||
|
<div class="row"> |
||||
|
<div class="col"> |
||||
|
<select name="hours" class="text-center hours"> |
||||
|
<?php |
||||
|
$timer = explode(':',$r['timer']); |
||||
|
for($i=0;$i<24;$i++){ |
||||
|
echo "<option value=\"".sprintf("%02d", $i)."\" "; |
||||
|
if($timer[0]==sprintf("%02d", $i)){echo "selected";} |
||||
|
echo ">".sprintf("%02d", $i)."</option>\n"; |
||||
|
} |
||||
|
?> |
||||
|
</select> |
||||
|
</div> |
||||
|
<div class="col hseparator"> |
||||
|
<select name="minutes" class="text-center minutes"> |
||||
|
<?php |
||||
|
for($i=0;$i<60;$i++){ |
||||
|
echo "<option value=\"".sprintf("%02d", $i)."\" "; |
||||
|
if($timer[1]==sprintf("%02d", $i)){echo "selected";} |
||||
|
echo ">".sprintf("%02d", $i)."</option>\n"; |
||||
|
} |
||||
|
?> |
||||
|
</select> |
||||
|
</div> |
||||
|
<div class="col hseparator"> |
||||
|
<select name="seconds" class="text-center seconds"> |
||||
|
<?php |
||||
|
for($i=0;$i<60;$i++){ |
||||
|
echo "<option value=\"".sprintf("%02d", $i)."\" "; |
||||
|
if($timer[2]==sprintf("%02d", $i)){echo "selected";} |
||||
|
echo ">".sprintf("%02d", $i)."</option>\n"; |
||||
|
} |
||||
|
?> |
||||
|
</select> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<div class="col-6 mx-auto my-5 <?php if($r['progress']==0){echo "d-none";}?>" id="div_progress"> |
||||
|
<span class="font-12 text-grey">Progress</span> |
||||
|
<div class="row"> |
||||
|
<div class="col"> |
||||
|
<select name="progress" class="text-center schedule"> |
||||
|
<option value="0" style="display: none; opacity:0">0</option> |
||||
|
<?php |
||||
|
for($i=1;$i<60;$i++){ |
||||
|
echo "<option value=\"$i\" "; |
||||
|
if($r['progress']!=0 && $r['progress']==$i){echo "selected";} |
||||
|
echo ">$i</option>\n"; |
||||
|
} |
||||
|
?> |
||||
|
</select> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<div class="col-6 mx-auto my-5 text-center <?php if($r['timer']!='00:00:00' || $r['progress']!=0){echo "d-none";}?>" id="div_none"> |
||||
|
<span class="font-12 text-grey">Not scheduled</span> |
||||
|
</div> |
||||
|
|
||||
|
|
||||
|
|
||||
|
<div class="col-12 text-center p4 px-0"> |
||||
|
<button type="submit" class="button big full confirm mx-0">Update message</button> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<?php |
||||
|
} |
||||
|
?> |
||||
|
|
||||
|
</form> |
||||
|
</div> |
||||
|
|
||||
|
<?php |
||||
|
@include 'jsvendors.php'; |
||||
|
@include 'scripts/'.$getQ[0].'.php'; |
||||
|
?> |
||||
|
|
||||
|
|
||||
|
</body> |
||||
|
</html> |
||||
|
|
||||
|
|
||||
|
|
||||
|
<?php |
||||
|
mysqli_close($conn); |
||||
|
?> |
||||
@ -0,0 +1,84 @@ |
|||||
|
<?php |
||||
|
|
||||
|
session_start(); |
||||
|
|
||||
|
@include 'cgi-bin/conn.conn'; |
||||
|
@include 'cgi-bin/functions.inc'; |
||||
|
@include 'cgi-bin/params.inc'; |
||||
|
|
||||
|
$conn=@mysqli_connect($DATAhst,$DATAusr,$DATApwd,$DATAdtb)or die("CONNECTION ERROR"); |
||||
|
mysqli_set_charset($conn, "utf8"); |
||||
|
|
||||
|
?> |
||||
|
|
||||
|
|
||||
|
<!DOCTYPE html> |
||||
|
<html> |
||||
|
<head> |
||||
|
|
||||
|
<title>COZe</title> |
||||
|
|
||||
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> |
||||
|
<meta name="description" content="COZe"> |
||||
|
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'> |
||||
|
|
||||
|
<base href="<?php echo $BASE_URL;?>/"> |
||||
|
<?php |
||||
|
@include 'cssvendors.php'; |
||||
|
?> |
||||
|
|
||||
|
</head> |
||||
|
<body> |
||||
|
|
||||
|
<div id="MainContent" class="container"> |
||||
|
<form method="post"> |
||||
|
|
||||
|
<?php |
||||
|
if($_POST['id']) { |
||||
|
|
||||
|
$q = mysqli_query($conn, "UPDATE `session` SET enabled=".intval($_POST['go'])." WHERE id=".$_POST['id'].""); |
||||
|
//echo "UPDATE `session` SET enabled=".intval($_POST['go'])." WHERE id=".$_POST['id'].""; |
||||
|
echo "<script>parent.window.location=parent.window.location</script>"; |
||||
|
|
||||
|
} else { |
||||
|
|
||||
|
if($_GET['status']){ |
||||
|
$action_text = "Disable session"; |
||||
|
}else{ |
||||
|
$action_text = "Enable session"; |
||||
|
} |
||||
|
?> |
||||
|
|
||||
|
<div class="row"> |
||||
|
<div class="col-12 text-center p-4"> |
||||
|
<span class="font-24"><?= $action_text;?></span> |
||||
|
<input type="hidden" name="id" value="<?= $_GET['id'];?>"> |
||||
|
<input type="hidden" name="go" value="<?= !intval($_GET['status']);?>"> |
||||
|
</div> |
||||
|
|
||||
|
<div class="col-12 text-center p4"> |
||||
|
<button type="submit" class="button big confirm mx-0">Go</button> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<?php |
||||
|
} |
||||
|
?> |
||||
|
|
||||
|
</form> |
||||
|
</div> |
||||
|
|
||||
|
<?php |
||||
|
@include 'jsvendors.php'; |
||||
|
@include 'scripts/'.$getQ[0].'.php'; |
||||
|
?> |
||||
|
|
||||
|
|
||||
|
</body> |
||||
|
</html> |
||||
|
|
||||
|
|
||||
|
|
||||
|
<?php |
||||
|
mysqli_close($conn); |
||||
|
?> |
||||
@ -0,0 +1,95 @@ |
|||||
|
<?php |
||||
|
|
||||
|
session_start(); |
||||
|
|
||||
|
@include 'cgi-bin/conn.conn'; |
||||
|
@include 'cgi-bin/functions.inc'; |
||||
|
@include 'cgi-bin/params.inc'; |
||||
|
|
||||
|
$conn=@mysqli_connect($DATAhst,$DATAusr,$DATApwd,$DATAdtb)or die("CONNECTION ERROR"); |
||||
|
mysqli_set_charset($conn, "utf8"); |
||||
|
|
||||
|
?> |
||||
|
|
||||
|
|
||||
|
<!DOCTYPE html> |
||||
|
<html> |
||||
|
<head> |
||||
|
|
||||
|
<title>COZe</title> |
||||
|
|
||||
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> |
||||
|
<meta name="description" content="COZe"> |
||||
|
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'> |
||||
|
|
||||
|
<base href="<?php echo $BASE_URL;?>/"> |
||||
|
<?php |
||||
|
@include 'cssvendors.php'; |
||||
|
?> |
||||
|
|
||||
|
</head> |
||||
|
<body> |
||||
|
|
||||
|
<div id="MainContent" class="container"> |
||||
|
<form method="post"> |
||||
|
|
||||
|
<?php |
||||
|
if($_POST['name']) { |
||||
|
|
||||
|
$q = mysqli_query($conn, "INSERT INTO session VALUES(null, '".convert($_POST['name'])."', '".convert_url($_POST['name'])."', '".$_POST['start']."', '".$_POST['stop']."', ".$_POST['enabled'].")"); |
||||
|
|
||||
|
echo "<script>parent.window.location=parent.window.location</script>"; |
||||
|
|
||||
|
} else { |
||||
|
?> |
||||
|
|
||||
|
<div class="row"> |
||||
|
<div class="col-12"> |
||||
|
<span class="font-12 text-grey">Session title</span> |
||||
|
<input type="text" name="name"> |
||||
|
</div> |
||||
|
<!-- <div class="col-12"> |
||||
|
<span class="font-12 text-grey">Session link</span> |
||||
|
<input type="text" id="link" name="link" value="<?= $BASE_URL;?>" readonly> |
||||
|
</div>--> |
||||
|
<div class="col-6"> |
||||
|
<span class="font-12 text-grey">Session start</span> |
||||
|
<input type="text" name="start" class="datepicker"> |
||||
|
</div> |
||||
|
<div class="col-6"> |
||||
|
<span class="font-12 text-grey">Session end</span> |
||||
|
<input type="text" name="stop" class="datepicker"> |
||||
|
</div> |
||||
|
<div class="col-6"> |
||||
|
<span class="font-12 text-grey">Status</span> |
||||
|
<select class="select" name="enabled"> |
||||
|
<option value="1">Enabled</option> |
||||
|
<option value="0">NOT enabled</option> |
||||
|
</select> |
||||
|
</div> |
||||
|
<div class="col-12"> |
||||
|
<button type="submit" class="button big full confirm mx-0">Add session</button> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<?php |
||||
|
} |
||||
|
?> |
||||
|
|
||||
|
</form> |
||||
|
</div> |
||||
|
|
||||
|
<?php |
||||
|
@include 'jsvendors.php'; |
||||
|
@include 'scripts/'.$getQ[0].'.php'; |
||||
|
?> |
||||
|
|
||||
|
|
||||
|
</body> |
||||
|
</html> |
||||
|
|
||||
|
|
||||
|
|
||||
|
<?php |
||||
|
mysqli_close($conn); |
||||
|
?> |
||||
@ -0,0 +1,97 @@ |
|||||
|
<?php |
||||
|
|
||||
|
session_start(); |
||||
|
|
||||
|
@include 'cgi-bin/conn.conn'; |
||||
|
@include 'cgi-bin/functions.inc'; |
||||
|
@include 'cgi-bin/params.inc'; |
||||
|
|
||||
|
$conn=@mysqli_connect($DATAhst,$DATAusr,$DATApwd,$DATAdtb)or die("CONNECTION ERROR"); |
||||
|
mysqli_set_charset($conn, "utf8"); |
||||
|
|
||||
|
?> |
||||
|
|
||||
|
|
||||
|
<!DOCTYPE html> |
||||
|
<html> |
||||
|
<head> |
||||
|
|
||||
|
<title>COZe</title> |
||||
|
|
||||
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> |
||||
|
<meta name="description" content="COZe"> |
||||
|
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'> |
||||
|
|
||||
|
<base href="<?php echo $BASE_URL;?>/"> |
||||
|
<?php |
||||
|
@include 'cssvendors.php'; |
||||
|
?> |
||||
|
|
||||
|
</head> |
||||
|
<body> |
||||
|
|
||||
|
<div id="MainContent" class="container"> |
||||
|
<form method="post"> |
||||
|
|
||||
|
<?php |
||||
|
if($_POST['name']) { |
||||
|
|
||||
|
$q = mysqli_query($conn, "UPDATE session SET name='".convert($_POST['name'])."', link='".convert_url($_POST['name'])."', |
||||
|
start='".$_POST['start']."', stop='".$_POST['stop']."', enabled=".$_POST['enabled']." |
||||
|
WHERE id=".$_POST['id'].""); |
||||
|
|
||||
|
echo "<script>parent.window.location=parent.window.location</script>"; |
||||
|
|
||||
|
} else { |
||||
|
|
||||
|
$q = mysqli_query($conn, "SELECT * FROM session WHERE id=".$_GET['id'].""); |
||||
|
$r = mysqli_fetch_array($q); |
||||
|
?> |
||||
|
|
||||
|
<div class="row"> |
||||
|
<div class="col-12"> |
||||
|
<span class="font-12 text-grey">Session title</span> |
||||
|
<input type="text" name="name" value="<?= $r['name'];?>"> |
||||
|
<input type="hidden" name="id" value="<?= $_GET['id'];?>"> |
||||
|
</div> |
||||
|
<div class="col-6"> |
||||
|
<span class="font-12 text-grey">Session start</span> |
||||
|
<input type="text" name="start" class="datepicker" value="<?= $r['start'];?>"> |
||||
|
</div> |
||||
|
<div class="col-6"> |
||||
|
<span class="font-12 text-grey">Session end</span> |
||||
|
<input type="text" name="stop" class="datepicker" value="<?= $r['stop'];?>"> |
||||
|
</div> |
||||
|
<div class="col-6"> |
||||
|
<span class="font-12 text-grey">Status</span> |
||||
|
<select class="select" name="enabled"> |
||||
|
<option value="1" <?php if($r['enabled'] == 1){echo "selected";}?>>Enabled</option> |
||||
|
<option value="0" <?php if($r['enabled'] == 0){echo "selected";}?>>NOT enabled</option> |
||||
|
</select> |
||||
|
</div> |
||||
|
<div class="col-12"> |
||||
|
<button type="submit" class="button big full confirm mx-0">Update session</button> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<?php |
||||
|
} |
||||
|
?> |
||||
|
|
||||
|
</form> |
||||
|
</div> |
||||
|
|
||||
|
<?php |
||||
|
@include 'jsvendors.php'; |
||||
|
@include 'scripts/'.$getQ[0].'.php'; |
||||
|
?> |
||||
|
|
||||
|
|
||||
|
</body> |
||||
|
</html> |
||||
|
|
||||
|
|
||||
|
|
||||
|
<?php |
||||
|
mysqli_close($conn); |
||||
|
?> |
||||
@ -0,0 +1,9 @@ |
|||||
|
<?php |
||||
|
|
||||
|
$DATAhst="localhost"; |
||||
|
$DATAusr="coze_training"; |
||||
|
$DATApwd="COZeMyPwd"; |
||||
|
$DATAdtb="coze_training"; |
||||
|
|
||||
|
|
||||
|
?> |
||||
@ -0,0 +1,75 @@ |
|||||
|
<?php |
||||
|
|
||||
|
function conv_date($od){ |
||||
|
$tmp=explode("-",substr($od,0,10)); |
||||
|
$stres = $tmp[2]."/".$tmp[1]."/".$tmp[0].""; |
||||
|
return $stres; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
function convert($stringa){ |
||||
|
$strres = $stringa; |
||||
|
$strres = str_replace("'","'",$strres); |
||||
|
return stripslashes(nl2br($strres)); |
||||
|
} |
||||
|
|
||||
|
|
||||
|
function convert_mce($stringa){ |
||||
|
$strres = $stringa; |
||||
|
$strres = str_replace("'","'",$strres); |
||||
|
return stripslashes($strres); |
||||
|
} |
||||
|
|
||||
|
function convert_url($text){ |
||||
|
$entities = array('+','%21', '%2A', '%27', '%28', '%29', '%3B', '%3A', '%40', '%26', '%3D', '%2B', '%24', '%2C', '%2F', '%3F', '%25', '%23', '%5B', '%5D'); |
||||
|
$replacements = array('-','_', '_', '_', '_', '_', '_', '_', '_', '_', '_', '_', '_', '_', '_', '_', '_', '_', '_', '_',); |
||||
|
return str_replace($entities, $replacements, urlencode($text)); |
||||
|
} |
||||
|
|
||||
|
function get_filesize($path){ |
||||
|
return filesize(realpath($_SERVER["DOCUMENT_ROOT"])."".$path); |
||||
|
} |
||||
|
|
||||
|
|
||||
|
function save_photo($foto,$basepath,$id){ |
||||
|
|
||||
|
$filename = $foto; |
||||
|
// Get new sizes |
||||
|
list($width, $height) = getimagesize($filename); |
||||
|
$percent=800/$width; |
||||
|
$newwidth = $width * $percent; |
||||
|
$newheight = $height * $percent; |
||||
|
|
||||
|
// Load |
||||
|
$thumb = imagecreatetruecolor($newwidth, $newheight); |
||||
|
|
||||
|
switch(exif_imagetype($filename)){ |
||||
|
case 1: |
||||
|
$source = imagecreatefromgif($filename); |
||||
|
break; |
||||
|
|
||||
|
case 2: |
||||
|
$source = imagecreatefromjpeg($filename); |
||||
|
break; |
||||
|
|
||||
|
case 3: |
||||
|
$source = imagecreatefrompng($filename); |
||||
|
break; |
||||
|
|
||||
|
} |
||||
|
// Resize |
||||
|
imagecopyresized($thumb, $source, 0, 0, 0, 0, $newwidth, $newheight, $width, $height); |
||||
|
|
||||
|
// Output |
||||
|
imagejpeg($thumb, $basepath."$id.jpg"); |
||||
|
|
||||
|
} |
||||
|
|
||||
|
function timeSeconds($time) { |
||||
|
list($h, $m, $s) = explode(':', $time); |
||||
|
return ($h * 3600) + ($m * 60) + $s; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
?> |
||||
@ -0,0 +1,6 @@ |
|||||
|
<?php |
||||
|
|
||||
|
$BASE_URL="http://".$_SERVER['HTTP_HOST'].""; |
||||
|
$ROOT = realpath($_SERVER["DOCUMENT_ROOT"]); |
||||
|
|
||||
|
?> |
||||
File diff suppressed because it is too large
@ -0,0 +1,3 @@ |
|||||
|
<link href="<?php echo $BASE_URL;?>/node_modules/flatpickr/dist/flatpickr.min.css" rel="stylesheet" type="text/css"/> |
||||
|
<link href="<?php echo $BASE_URL;?>/node_modules/flatpickr/dist/themes/material_red.css" rel="stylesheet" type="text/css"/> |
||||
|
<link href="<?php echo $BASE_URL;?>/css/styles.css" rel="stylesheet" type="text/css"/> |
||||
@ -0,0 +1,14 @@ |
|||||
|
|
||||
|
<header> |
||||
|
<div class="container"> |
||||
|
<div class="row"> |
||||
|
<div class="col-2"><img class="logo middle" src="<?= $BASE_URL;?>/images/logo.png"></div> |
||||
|
<div class="col-10 menu"> |
||||
|
<ul class="middle"> |
||||
|
<li class="<?php if($getQ[0]=="sessions"){echo "active";}?>"><a href="<?= $BASE_URL;?>/sessions">Sessioni</a></li> |
||||
|
<li class="<?php if($getQ[0]=="messages"){echo "active";}?>"><a href="<?= $BASE_URL;?>/messages">Messaggi</a></li> |
||||
|
</ul> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</header> |
||||
|
After Width: | Height: | Size: 6.2 KiB |
|
After Width: | Height: | Size: 225 B |
|
After Width: | Height: | Size: 3.7 KiB |
|
After Width: | Height: | Size: 25 KiB |
|
After Width: | Height: | Size: 29 KiB |
|
After Width: | Height: | Size: 28 KiB |
|
After Width: | Height: | Size: 28 KiB |
|
After Width: | Height: | Size: 34 KiB |
|
After Width: | Height: | Size: 32 KiB |
@ -1,4 +1,75 @@ |
|||||
<?php |
<?php |
||||
|
|
||||
echo "coze_training"; |
|
||||
|
session_start(); |
||||
|
|
||||
|
@include 'cgi-bin/conn.conn'; |
||||
|
@include 'cgi-bin/functions.inc'; |
||||
|
@include 'cgi-bin/params.inc'; |
||||
|
|
||||
|
$GLOBALS['getQ'][0]="home"; |
||||
|
$GLOBALS['conn']; |
||||
|
|
||||
|
$conn=@mysqli_connect($DATAhst,$DATAusr,$DATApwd,$DATAdtb)or die("CONNECTION ERROR"); |
||||
|
mysqli_set_charset($conn, "utf8"); |
||||
|
|
||||
|
if(@$_GET['q']){ |
||||
|
$GLOBALS['getQ']=explode("/",$_GET['q']); |
||||
|
} |
||||
|
|
||||
|
if($getQ[0]!="home"){ $isHome = false; } |
||||
|
|
||||
|
|
||||
|
if($getQ[0]=="logout"){ |
||||
|
unset($_SESSION['AUTH']); |
||||
|
session_destroy(); |
||||
|
header('Location: '.$BASE_URL); |
||||
|
} |
||||
|
|
||||
|
?> |
||||
|
|
||||
|
|
||||
|
<!DOCTYPE html> |
||||
|
<html> |
||||
|
<head> |
||||
|
|
||||
|
<title>COZe</title> |
||||
|
|
||||
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> |
||||
|
<meta name="description" content="COZe"> |
||||
|
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'> |
||||
|
|
||||
|
<base href="<?php echo $BASE_URL;?>/"> |
||||
|
<?php |
||||
|
@include 'cssvendors.php'; |
||||
|
?> |
||||
|
|
||||
|
</head> |
||||
|
<body> |
||||
|
|
||||
|
<?php |
||||
|
@include 'header.php'; |
||||
|
?> |
||||
|
<section class="pt-5"> |
||||
|
<div id="MainContent" class="container"> |
||||
|
<?php |
||||
|
@include $getQ[0].'.php'; |
||||
|
?> |
||||
|
</div> |
||||
|
</section> |
||||
|
|
||||
|
|
||||
|
|
||||
|
<?php |
||||
|
@include 'jsvendors.php'; |
||||
|
@include 'scripts/'.$getQ[0].'.php'; |
||||
|
?> |
||||
|
|
||||
|
|
||||
|
</body> |
||||
|
</html> |
||||
|
|
||||
|
|
||||
|
|
||||
|
<?php |
||||
|
mysqli_close($conn); |
||||
?> |
?> |
||||
|
|||||
@ -0,0 +1,107 @@ |
|||||
|
$(document).ready(function(){ |
||||
|
|
||||
|
const add_message_form = $('.add_message_form'); |
||||
|
const btn_progress = add_message_form.find('#btn_progress'); |
||||
|
const btn_timer = add_message_form.find('#btn_timer'); |
||||
|
const btn_none = add_message_form.find('#btn_none'); |
||||
|
const btn_add_row = add_message_form.find('.add-row'); |
||||
|
const btn_del_row = add_message_form.find('.del-row'); |
||||
|
|
||||
|
const div_progress = add_message_form.find('#div_progress'); |
||||
|
const div_timer = add_message_form.find('#div_timer'); |
||||
|
const div_none = add_message_form.find('#div_none'); |
||||
|
|
||||
|
const hh = add_message_form.find('.hours'); |
||||
|
const mm = add_message_form.find('.minutes'); |
||||
|
const ss = add_message_form.find('.seconds'); |
||||
|
const sk = add_message_form.find('.schedule'); |
||||
|
|
||||
|
btn_progress.on('click', (e)=> { |
||||
|
e.preventDefault(); |
||||
|
btn_progress.removeClass('grey').addClass('discard'); |
||||
|
btn_timer.removeClass('discard').addClass('grey'); |
||||
|
btn_none.removeClass('discard').addClass('grey'); |
||||
|
|
||||
|
hh.val('00'); |
||||
|
mm.val('00'); |
||||
|
ss.val('00'); |
||||
|
sk.val('0'); |
||||
|
|
||||
|
div_timer.addClass('d-none'); |
||||
|
div_none.addClass('d-none'); |
||||
|
div_progress.removeClass('d-none'); |
||||
|
|
||||
|
$('html, body').animate({scrollTop: $('body').height()}, 400); |
||||
|
}); |
||||
|
|
||||
|
btn_timer.on('click', (e)=> { |
||||
|
e.preventDefault(); |
||||
|
btn_timer.removeClass('grey').addClass('discard'); |
||||
|
btn_progress.removeClass('discard').addClass('grey'); |
||||
|
btn_none.removeClass('discard').addClass('grey'); |
||||
|
|
||||
|
hh.val('00'); |
||||
|
mm.val('00'); |
||||
|
ss.val('00'); |
||||
|
sk.val('0'); |
||||
|
|
||||
|
div_progress.addClass('d-none'); |
||||
|
div_none.addClass('d-none'); |
||||
|
div_timer.removeClass('d-none'); |
||||
|
|
||||
|
$('html, body').animate({scrollTop: $('body').height()}, 400); |
||||
|
}); |
||||
|
|
||||
|
btn_none.on('click', (e)=> { |
||||
|
e.preventDefault(); |
||||
|
btn_none.removeClass('grey').addClass('discard'); |
||||
|
btn_progress.removeClass('discard').addClass('grey'); |
||||
|
btn_timer.removeClass('discard').addClass('grey'); |
||||
|
|
||||
|
hh.val('00'); |
||||
|
mm.val('00'); |
||||
|
ss.val('00'); |
||||
|
sk.val('0'); |
||||
|
|
||||
|
div_progress.addClass('d-none'); |
||||
|
div_timer.addClass('d-none'); |
||||
|
div_none.removeClass('d-none'); |
||||
|
|
||||
|
$('html, body').animate({scrollTop: $('body').height()}, 400); |
||||
|
}); |
||||
|
|
||||
|
btn_add_row.on('click', (e)=> { |
||||
|
e.preventDefault(); |
||||
|
const self = $(e.currentTarget); |
||||
|
const add_message_form = $('.add_message_form'); |
||||
|
const actions = add_message_form.find('.actions'); |
||||
|
const item = actions.find('.item').first(); |
||||
|
const clone = item.clone(); |
||||
|
|
||||
|
$(clone).find('[name="action_id[]"]').val(0); |
||||
|
$(clone).find('[name="action_title[]"]').val(""); |
||||
|
$(clone).find('[name="action_description[]"]').val(""); |
||||
|
|
||||
|
actions.append(clone); |
||||
|
|
||||
|
|
||||
|
const btn_del_row = clone.find('.del-row'); |
||||
|
btn_del_row.removeAttr('disabled'); |
||||
|
btn_del_row.on('click', (e)=> { |
||||
|
e.preventDefault(); |
||||
|
const self = $(e.currentTarget); |
||||
|
const item = self.closest('.item'); |
||||
|
item.remove(); |
||||
|
}); |
||||
|
|
||||
|
}); |
||||
|
|
||||
|
|
||||
|
btn_del_row.on('click', (e)=> { |
||||
|
e.preventDefault(); |
||||
|
const self = $(e.currentTarget); |
||||
|
const item = self.closest('.item'); |
||||
|
item.remove(); |
||||
|
}); |
||||
|
|
||||
|
}); |
||||
@ -0,0 +1,32 @@ |
|||||
|
$(document).ready(function(){ |
||||
|
|
||||
|
$(".cbOpen").colorbox({iframe:true, width:"95%", height:"95%"}); |
||||
|
$(".cbOpenSmall").colorbox({iframe:true, width:"500px", height:"400px"}); |
||||
|
|
||||
|
tinymce.init({ |
||||
|
selector: '.mce', |
||||
|
height: 200, |
||||
|
theme: 'modern', |
||||
|
menubar: false, |
||||
|
// language: 'it',
|
||||
|
forced_root_block : '', |
||||
|
force_br_newlines : true, |
||||
|
pagebreak_separator: '%break%', |
||||
|
plugins: [ |
||||
|
'advlist autolink pagebreak lists paste' |
||||
|
], |
||||
|
toolbar: 'bold italic underline | bullist numlist pagebreak | removeformat', |
||||
|
image_advtab: false, |
||||
|
content_css: [ |
||||
|
'//fonts.googleapis.com/css?family=Montserrat:300,300i,400,400i', |
||||
|
] |
||||
|
}); |
||||
|
|
||||
|
$( ".datepicker" ).flatpickr({ |
||||
|
time_24hr: true, |
||||
|
enableTime: true, |
||||
|
dateFormat: "Y-m-d H:i:ss", |
||||
|
}); |
||||
|
|
||||
|
|
||||
|
}); |
||||
@ -0,0 +1,8 @@ |
|||||
|
|
||||
|
<script type="text/javascript" src="<?php echo $BASE_URL;?>/node_modules/jquery/dist/jquery.min.js"></script> |
||||
|
<script type="text/javascript" src="<?php echo $BASE_URL;?>/node_modules/tinymce/tinymce.min.js"></script> |
||||
|
<script type="text/javascript" src="<?php echo $BASE_URL;?>/node_modules/flatpickr/dist/flatpickr.min.js"></script> |
||||
|
<script type="text/javascript" src="<?php echo $BASE_URL;?>/node_modules/jquery-colorbox/jquery.colorbox-min.js"></script> |
||||
|
|
||||
|
<script type="text/javascript" src="<?php echo $BASE_URL;?>/js/scripts.js"></script> |
||||
|
<script type="text/javascript" src="<?php echo $BASE_URL;?>/js/messages.js"></script> |
||||
@ -0,0 +1,40 @@ |
|||||
|
|
||||
|
|
||||
|
<div class="messages"> |
||||
|
|
||||
|
<div class="row <?= $bgcolor;?> py-2 text-right"> |
||||
|
<div class="col-12"><a href="/cb_message_add.php" class="cbOpen button big confirm mx-0">Add new message</a></div> |
||||
|
</div> |
||||
|
|
||||
|
<div class="row <?= $bgcolor;?> p-2 text-upper text-grey"> |
||||
|
<div class="col-5 font-12">Message title</div> |
||||
|
<div class="col-4 font-12">Session</div> |
||||
|
<div class="col-1 font-12 text-center">Timer</div> |
||||
|
<div class="col-1 font-12 text-center">Prog.</div> |
||||
|
<div class="col-1 text-right"></div> |
||||
|
</div> |
||||
|
|
||||
|
<?php |
||||
|
$cnt=0; |
||||
|
$q=mysqli_query($conn, "SELECT messages.*, session.name AS session_name FROM `messages`, session WHERE messages.sid = session.id ORDER BY session_name,messages.title DESC"); |
||||
|
while($r=mysqli_fetch_array($q)){ |
||||
|
$cnt++; |
||||
|
$bgcolor = ($cnt%2) ? "bg-grey" : "bg-white"; |
||||
|
?> |
||||
|
|
||||
|
<div class="row items <?= $bgcolor;?> p-2"> |
||||
|
<div class="col-5 font-12"><?= $r['title'];?></div> |
||||
|
<div class="col-4 font-12"><?= $r['session_name'];?></div> |
||||
|
<div class="col-1 font-12 text-center"><?= $r['timer'];?></div> |
||||
|
<div class="col-1 font-12 text-center"><?= $r['progress'];?></div> |
||||
|
<div class="col-1 text-right"> |
||||
|
<a href="/cb_message_edit.php?id=<?= $r['id'];?>" class="cbOpen text-black"><i class="fa fa-pencil-square ml-2"></i></a> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<?php |
||||
|
} |
||||
|
?> |
||||
|
|
||||
|
|
||||
|
</div> |
||||
@ -0,0 +1,46 @@ |
|||||
|
{ |
||||
|
"name": "coze_training", |
||||
|
"version": "1.0.0", |
||||
|
"lockfileVersion": 1, |
||||
|
"requires": true, |
||||
|
"dependencies": { |
||||
|
"bootstrap": { |
||||
|
"version": "4.0.0", |
||||
|
"resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.0.0.tgz", |
||||
|
"integrity": "sha512-gulJE5dGFo6Q61V/whS6VM4WIyrlydXfCgkE+Gxe5hjrJ8rXLLZlALq7zq2RPhOc45PSwQpJkrTnc2KgD6cvmA==" |
||||
|
}, |
||||
|
"flatpickr": { |
||||
|
"version": "4.3.2", |
||||
|
"resolved": "https://registry.npmjs.org/flatpickr/-/flatpickr-4.3.2.tgz", |
||||
|
"integrity": "sha1-akdwQ8B17zbD/1T620m5NqZNY18=" |
||||
|
}, |
||||
|
"font-awesome": { |
||||
|
"version": "4.7.0", |
||||
|
"resolved": "https://registry.npmjs.org/font-awesome/-/font-awesome-4.7.0.tgz", |
||||
|
"integrity": "sha1-j6jPBBGhoxr9B7BtKQK7n8gVoTM=" |
||||
|
}, |
||||
|
"jquery": { |
||||
|
"version": "3.3.1", |
||||
|
"resolved": "https://registry.npmjs.org/jquery/-/jquery-3.3.1.tgz", |
||||
|
"integrity": "sha512-Ubldcmxp5np52/ENotGxlLe6aGMvmF4R8S6tZjsP6Knsaxd/xp3Zrh50cG93lR6nPXyUFwzN3ZSOQI0wRJNdGg==" |
||||
|
}, |
||||
|
"jquery-colorbox": { |
||||
|
"version": "1.6.4", |
||||
|
"resolved": "https://registry.npmjs.org/jquery-colorbox/-/jquery-colorbox-1.6.4.tgz", |
||||
|
"integrity": "sha1-eZRSUjpsSUg5Ik73AugH3rnAbMU=", |
||||
|
"requires": { |
||||
|
"jquery": "3.3.1" |
||||
|
} |
||||
|
}, |
||||
|
"popper.js": { |
||||
|
"version": "1.12.9", |
||||
|
"resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.12.9.tgz", |
||||
|
"integrity": "sha1-DfvC3/lsRRuzMu3Pz6r1ZtMx1bM=" |
||||
|
}, |
||||
|
"tinymce": { |
||||
|
"version": "4.7.9", |
||||
|
"resolved": "https://registry.npmjs.org/tinymce/-/tinymce-4.7.9.tgz", |
||||
|
"integrity": "sha512-JGN0Hn8cYINgyHTw6ztnO086hez4SIWbkny+3S5tesyvggNFg6He1GSIHPZgSB3+ydCqO8J6qhjGSIyi0LPwpQ==" |
||||
|
} |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,25 @@ |
|||||
|
{ |
||||
|
"name": "coze_training", |
||||
|
"version": "1.0.0", |
||||
|
"description": "COZe Training", |
||||
|
"main": "index.js", |
||||
|
"dependencies": { |
||||
|
"bootstrap": "^4.0.0", |
||||
|
"flatpickr": "^4.3.2", |
||||
|
"font-awesome": "^4.7.0", |
||||
|
"jquery": "^3.3.1", |
||||
|
"jquery-colorbox": "^1.6.4", |
||||
|
"popper.js": "^1.12.9", |
||||
|
"tinymce": "^4.7.9" |
||||
|
}, |
||||
|
"devDependencies": {}, |
||||
|
"scripts": { |
||||
|
"test": "echo \"Error: no test specified\" && exit 1" |
||||
|
}, |
||||
|
"repository": { |
||||
|
"type": "git", |
||||
|
"url": "git@185.104.124.137:/docs/git/coze_training.git" |
||||
|
}, |
||||
|
"author": "Dslak", |
||||
|
"license": "ISC" |
||||
|
} |
||||
@ -0,0 +1,151 @@ |
|||||
|
|
||||
|
#colorbox, |
||||
|
#cboxOverlay, |
||||
|
#cboxWrapper{ |
||||
|
position:fixed; |
||||
|
top:0; |
||||
|
left:0; |
||||
|
z-index:9999; |
||||
|
overflow:hidden; |
||||
|
-webkit-transform: translate3d(0,0,0); |
||||
|
} |
||||
|
|
||||
|
#cboxWrapper { |
||||
|
max-width:none; |
||||
|
} |
||||
|
|
||||
|
#cboxOverlay{ |
||||
|
position:fixed; |
||||
|
width:100%; |
||||
|
height:100%; |
||||
|
background: rgba(0,0,0,0.9); |
||||
|
} |
||||
|
|
||||
|
#cboxMiddleLeft, |
||||
|
#cboxBottomLeft{ |
||||
|
clear:left; |
||||
|
} |
||||
|
|
||||
|
#cboxContent{ |
||||
|
position:relative; |
||||
|
} |
||||
|
|
||||
|
#cboxLoadedContent{ |
||||
|
overflow:auto; |
||||
|
-webkit-overflow-scrolling: touch; |
||||
|
} |
||||
|
|
||||
|
#cboxTitle{ |
||||
|
margin:0; |
||||
|
} |
||||
|
|
||||
|
#cboxLoadingOverlay, |
||||
|
#cboxLoadingGraphic{ |
||||
|
position:absolute; |
||||
|
top:0; |
||||
|
left:0; |
||||
|
width:100%; |
||||
|
height:100%; |
||||
|
} |
||||
|
|
||||
|
#cboxPrevious, |
||||
|
#cboxNext, |
||||
|
#cboxClose, |
||||
|
#cboxSlideshow{ |
||||
|
cursor:pointer; |
||||
|
} |
||||
|
|
||||
|
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;border-radius: 5px;} |
||||
|
.cboxIframe{background:#fff; width:100%; height:100%; display:block; border:0; padding:0; margin:0;} |
||||
|
#colorbox, |
||||
|
#cboxContent, |
||||
|
#cboxLoadedContent{ |
||||
|
box-sizing:content-box; |
||||
|
-moz-box-sizing:content-box; |
||||
|
-webkit-box-sizing:content-box; |
||||
|
} |
||||
|
|
||||
|
#colorbox{ |
||||
|
outline:0; |
||||
|
} |
||||
|
|
||||
|
#cboxContent{ |
||||
|
background:#fff; |
||||
|
overflow:hidden; |
||||
|
border: 10px solid white; |
||||
|
border-radius: 5px; |
||||
|
} |
||||
|
|
||||
|
#cboxLoadedContent{ |
||||
|
margin-top: 30px; |
||||
|
} |
||||
|
|
||||
|
#cboxTitle{ |
||||
|
position:absolute; |
||||
|
top:4px; |
||||
|
left:0; |
||||
|
text-align:center; |
||||
|
width:100%; |
||||
|
color:#949494; |
||||
|
} |
||||
|
|
||||
|
#cboxCurrent{ |
||||
|
position:absolute; |
||||
|
top:4px; |
||||
|
left:58px; |
||||
|
color:#949494; |
||||
|
} |
||||
|
|
||||
|
#cboxLoadingOverlay{ |
||||
|
background:url(../images/colorbox/loading_background.png) no-repeat center center; |
||||
|
} |
||||
|
|
||||
|
#cboxLoadingGraphic{ |
||||
|
background:url(../images/colorbox/loading.gif) no-repeat center center; |
||||
|
} |
||||
|
|
||||
|
#cboxPrevious, |
||||
|
#cboxNext, |
||||
|
#cboxSlideshow, |
||||
|
#cboxClose { |
||||
|
border:0; |
||||
|
padding:0; |
||||
|
margin:0; |
||||
|
overflow:visible; |
||||
|
width:auto; |
||||
|
background:none; |
||||
|
&:active{ |
||||
|
outline:0; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
#cboxSlideshow{} |
||||
|
#cboxPrevious{} |
||||
|
#cboxNext{} |
||||
|
#cboxClose{ |
||||
|
position:absolute; |
||||
|
top: -5px; |
||||
|
right: -2px; |
||||
|
width: 20px; |
||||
|
|
||||
|
&:before{ |
||||
|
content: '\f057'; |
||||
|
font-family: 'FontAwesome'; |
||||
|
font-size: 20px; |
||||
|
color: black; |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
|
|
||||
|
.cboxIE #cboxTopLeft, |
||||
|
.cboxIE #cboxTopCenter, |
||||
|
.cboxIE #cboxTopRight, |
||||
|
.cboxIE #cboxBottomLeft, |
||||
|
.cboxIE #cboxBottomCenter, |
||||
|
.cboxIE #cboxBottomRight, |
||||
|
.cboxIE #cboxMiddleLeft, |
||||
|
.cboxIE #cboxMiddleRight { |
||||
|
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF); |
||||
|
} |
||||
@ -0,0 +1,690 @@ |
|||||
|
.flatpickr-calendar { |
||||
|
background: transparent; |
||||
|
overflow: hidden; |
||||
|
max-height: 0; |
||||
|
opacity: 0; |
||||
|
visibility: hidden; |
||||
|
text-align: center; |
||||
|
padding: 0; |
||||
|
-webkit-animation: none; |
||||
|
animation: none; |
||||
|
direction: ltr; |
||||
|
border: 0; |
||||
|
display: none; |
||||
|
font-size: $font-14; |
||||
|
border-radius: 5px; |
||||
|
position: absolute; |
||||
|
width: 280px; |
||||
|
-webkit-box-sizing: border-box; |
||||
|
box-sizing: border-box; |
||||
|
-ms-touch-action: manipulation; |
||||
|
touch-action: manipulation; |
||||
|
-webkit-box-shadow: 0 3px 13px rgba(0,0,0,0.08); |
||||
|
box-shadow: 0 3px 13px rgba(0,0,0,0.08); |
||||
|
} |
||||
|
.flatpickr-calendar.open, |
||||
|
.flatpickr-calendar.inline { |
||||
|
opacity: 1; |
||||
|
visibility: visible; |
||||
|
overflow: visible; |
||||
|
max-height: 640px; |
||||
|
} |
||||
|
.flatpickr-calendar.open { |
||||
|
display: inline-block; |
||||
|
z-index: 99999; |
||||
|
} |
||||
|
.flatpickr-calendar.animate.open { |
||||
|
-webkit-animation: fpFadeInDown 200ms cubic-bezier(0.23, 1, 0.32, 1); |
||||
|
animation: fpFadeInDown 200ms cubic-bezier(0.23, 1, 0.32, 1); |
||||
|
} |
||||
|
.flatpickr-calendar.inline { |
||||
|
display: block; |
||||
|
position: relative; |
||||
|
top: 2px; |
||||
|
} |
||||
|
.flatpickr-calendar.static { |
||||
|
position: absolute; |
||||
|
top: calc(100% + 2px); |
||||
|
} |
||||
|
.flatpickr-calendar.static.open { |
||||
|
z-index: 999; |
||||
|
display: block; |
||||
|
} |
||||
|
.flatpickr-calendar.hasWeeks { |
||||
|
width: auto; |
||||
|
} |
||||
|
.flatpickr-calendar .hasWeeks .dayContainer, |
||||
|
.flatpickr-calendar .hasTime .dayContainer { |
||||
|
border-bottom: 0; |
||||
|
border-bottom-right-radius: 0; |
||||
|
border-bottom-left-radius: 0; |
||||
|
} |
||||
|
.flatpickr-calendar .hasWeeks .dayContainer { |
||||
|
border-left: 0; |
||||
|
} |
||||
|
.flatpickr-calendar.showTimeInput.hasTime .flatpickr-time { |
||||
|
height: 40px; |
||||
|
border-top: 1px solid rgba(72,72,72,0.2); |
||||
|
} |
||||
|
.flatpickr-calendar.showTimeInput.hasTime .flatpickr-innerContainer { |
||||
|
border-bottom: 0; |
||||
|
} |
||||
|
.flatpickr-calendar.showTimeInput.hasTime .flatpickr-time { |
||||
|
border: 1px solid rgba(72,72,72,0.2); |
||||
|
} |
||||
|
.flatpickr-calendar.noCalendar.hasTime .flatpickr-time { |
||||
|
height: auto; |
||||
|
} |
||||
|
.flatpickr-calendar:before, |
||||
|
.flatpickr-calendar:after { |
||||
|
position: absolute; |
||||
|
display: block; |
||||
|
pointer-events: none; |
||||
|
border: solid transparent; |
||||
|
content: ''; |
||||
|
height: 0; |
||||
|
width: 0; |
||||
|
left: 22px; |
||||
|
} |
||||
|
.flatpickr-calendar.rightMost:before, |
||||
|
.flatpickr-calendar.rightMost:after { |
||||
|
left: auto; |
||||
|
right: 22px; |
||||
|
} |
||||
|
.flatpickr-calendar:before { |
||||
|
border-width: 5px; |
||||
|
margin: 0 -5px; |
||||
|
} |
||||
|
.flatpickr-calendar:after { |
||||
|
border-width: 4px; |
||||
|
margin: 0 -4px; |
||||
|
} |
||||
|
.flatpickr-calendar.arrowTop:before, |
||||
|
.flatpickr-calendar.arrowTop:after { |
||||
|
bottom: 100%; |
||||
|
} |
||||
|
.flatpickr-calendar.arrowTop:before { |
||||
|
border-bottom-color: rgba(72,72,72,0.2); |
||||
|
} |
||||
|
.flatpickr-calendar.arrowTop:after { |
||||
|
border-bottom-color: $red; |
||||
|
} |
||||
|
.flatpickr-calendar.arrowBottom:before, |
||||
|
.flatpickr-calendar.arrowBottom:after { |
||||
|
top: 100%; |
||||
|
} |
||||
|
.flatpickr-calendar.arrowBottom:before { |
||||
|
border-top-color: rgba(72,72,72,0.2); |
||||
|
} |
||||
|
.flatpickr-calendar.arrowBottom:after { |
||||
|
border-top-color: $red; |
||||
|
} |
||||
|
.flatpickr-calendar:focus { |
||||
|
outline: 0; |
||||
|
} |
||||
|
.flatpickr-wrapper { |
||||
|
position: relative; |
||||
|
display: inline-block; |
||||
|
} |
||||
|
.flatpickr-month { |
||||
|
border-radius: 5px 5px 0 0; |
||||
|
background: $red; |
||||
|
color: $white; |
||||
|
fill: $white; |
||||
|
height: 28px; |
||||
|
line-height: 1; |
||||
|
text-align: center; |
||||
|
position: relative; |
||||
|
-webkit-user-select: none; |
||||
|
-moz-user-select: none; |
||||
|
-ms-user-select: none; |
||||
|
user-select: none; |
||||
|
overflow: hidden; |
||||
|
} |
||||
|
.flatpickr-prev-month, |
||||
|
.flatpickr-next-month { |
||||
|
text-decoration: none; |
||||
|
cursor: pointer; |
||||
|
position: absolute; |
||||
|
top: 0px; |
||||
|
line-height: 16px; |
||||
|
height: 28px; |
||||
|
padding: 10px calc(3.57% - 1.5px); |
||||
|
z-index: 3; |
||||
|
} |
||||
|
.flatpickr-prev-month i, |
||||
|
.flatpickr-next-month i { |
||||
|
position: relative; |
||||
|
} |
||||
|
.flatpickr-prev-month.flatpickr-prev-month, |
||||
|
.flatpickr-next-month.flatpickr-prev-month { |
||||
|
left: 0; |
||||
|
} |
||||
|
|
||||
|
.flatpickr-prev-month.flatpickr-next-month, |
||||
|
.flatpickr-next-month.flatpickr-next-month { |
||||
|
right: 0; |
||||
|
} |
||||
|
|
||||
|
.flatpickr-prev-month:hover, |
||||
|
.flatpickr-next-month:hover { |
||||
|
color: #bbb; |
||||
|
} |
||||
|
.flatpickr-prev-month:hover svg, |
||||
|
.flatpickr-next-month:hover svg { |
||||
|
fill: $red; |
||||
|
} |
||||
|
.flatpickr-prev-month svg, |
||||
|
.flatpickr-next-month svg { |
||||
|
width: 14px; |
||||
|
height: 14px; |
||||
|
} |
||||
|
.flatpickr-prev-month svg path, |
||||
|
.flatpickr-next-month svg path { |
||||
|
-webkit-transition: fill 0.1s; |
||||
|
transition: fill 0.1s; |
||||
|
fill: inherit; |
||||
|
} |
||||
|
.numInputWrapper { |
||||
|
position: relative; |
||||
|
height: auto; |
||||
|
} |
||||
|
.numInputWrapper input, |
||||
|
.numInputWrapper span { |
||||
|
display: inline-block; |
||||
|
} |
||||
|
.numInputWrapper input { |
||||
|
width: 100%; |
||||
|
} |
||||
|
.numInputWrapper input::-ms-clear { |
||||
|
display: none; |
||||
|
} |
||||
|
.numInputWrapper span { |
||||
|
position: absolute; |
||||
|
right: 0; |
||||
|
width: 14px; |
||||
|
padding: 0 4px 0 2px; |
||||
|
height: 50%; |
||||
|
line-height: 50%; |
||||
|
opacity: 0; |
||||
|
cursor: pointer; |
||||
|
border: 1px solid rgba(72,72,72,0.15); |
||||
|
-webkit-box-sizing: border-box; |
||||
|
box-sizing: border-box; |
||||
|
} |
||||
|
.numInputWrapper span:hover { |
||||
|
background: rgba(0,0,0,0.1); |
||||
|
} |
||||
|
.numInputWrapper span:active { |
||||
|
background: rgba(0,0,0,0.2); |
||||
|
} |
||||
|
.numInputWrapper span:after { |
||||
|
display: block; |
||||
|
content: ""; |
||||
|
position: absolute; |
||||
|
} |
||||
|
.numInputWrapper span.arrowUp { |
||||
|
top: 0; |
||||
|
border-bottom: 0; |
||||
|
} |
||||
|
.numInputWrapper span.arrowUp:after { |
||||
|
border-left: 4px solid transparent; |
||||
|
border-right: 4px solid transparent; |
||||
|
border-bottom: 4px solid rgba(72,72,72,0.6); |
||||
|
top: 26%; |
||||
|
} |
||||
|
.numInputWrapper span.arrowDown { |
||||
|
top: 50%; |
||||
|
} |
||||
|
.numInputWrapper span.arrowDown:after { |
||||
|
border-left: 4px solid transparent; |
||||
|
border-right: 4px solid transparent; |
||||
|
border-top: 4px solid rgba(72,72,72,0.6); |
||||
|
top: 40%; |
||||
|
} |
||||
|
.numInputWrapper span svg { |
||||
|
width: inherit; |
||||
|
height: auto; |
||||
|
} |
||||
|
.numInputWrapper span svg path { |
||||
|
fill: rgba(255,255,255,0.5); |
||||
|
} |
||||
|
.numInputWrapper:hover { |
||||
|
background: rgba(0,0,0,0.05); |
||||
|
} |
||||
|
.numInputWrapper:hover span { |
||||
|
opacity: 1; |
||||
|
} |
||||
|
.flatpickr-current-month { |
||||
|
font-size: 135%; |
||||
|
line-height: inherit; |
||||
|
font-weight: 300; |
||||
|
color: inherit; |
||||
|
position: absolute; |
||||
|
width: 75%; |
||||
|
left: 12.5%; |
||||
|
padding: 6.16px 0 0 0; |
||||
|
line-height: 1; |
||||
|
height: 28px; |
||||
|
display: inline-block; |
||||
|
text-align: center; |
||||
|
-webkit-transform: translate3d(0px, 0px, 0px); |
||||
|
transform: translate3d(0px, 0px, 0px); |
||||
|
} |
||||
|
.flatpickr-current-month span.cur-month { |
||||
|
font-family: inherit; |
||||
|
font-weight: 700; |
||||
|
color: inherit; |
||||
|
display: inline-block; |
||||
|
margin-left: 0.5ch; |
||||
|
padding: 0; |
||||
|
} |
||||
|
.flatpickr-current-month span.cur-month:hover { |
||||
|
background: rgba(0,0,0,0.05); |
||||
|
} |
||||
|
.flatpickr-current-month .numInputWrapper { |
||||
|
width: 6ch; |
||||
|
width: 7ch\0; |
||||
|
display: inline-block; |
||||
|
} |
||||
|
.flatpickr-current-month .numInputWrapper span.arrowUp:after { |
||||
|
border-bottom-color: $white; |
||||
|
} |
||||
|
.flatpickr-current-month .numInputWrapper span.arrowDown:after { |
||||
|
border-top-color: $white; |
||||
|
} |
||||
|
.flatpickr-current-month input.cur-year { |
||||
|
background: transparent; |
||||
|
-webkit-box-sizing: border-box; |
||||
|
box-sizing: border-box; |
||||
|
color: inherit; |
||||
|
cursor: text; |
||||
|
padding: 0 0 0 0.5ch; |
||||
|
margin: 0; |
||||
|
display: inline-block; |
||||
|
font-size: inherit; |
||||
|
font-family: inherit; |
||||
|
font-weight: 300; |
||||
|
line-height: inherit; |
||||
|
height: auto; |
||||
|
border: 0; |
||||
|
border-radius: 0; |
||||
|
vertical-align: initial; |
||||
|
} |
||||
|
.flatpickr-current-month input.cur-year:focus { |
||||
|
outline: 0; |
||||
|
} |
||||
|
.flatpickr-current-month input.cur-year[disabled], |
||||
|
.flatpickr-current-month input.cur-year[disabled]:hover { |
||||
|
font-size: 100%; |
||||
|
color: rgba(255,255,255,0.5); |
||||
|
background: transparent; |
||||
|
pointer-events: none; |
||||
|
} |
||||
|
.flatpickr-weekdays { |
||||
|
background: $red; |
||||
|
text-align: center; |
||||
|
overflow: hidden; |
||||
|
width: 100%; |
||||
|
display: -webkit-box; |
||||
|
display: -webkit-flex; |
||||
|
display: -ms-flexbox; |
||||
|
display: flex; |
||||
|
-webkit-box-align: center; |
||||
|
-webkit-align-items: center; |
||||
|
-ms-flex-align: center; |
||||
|
align-items: center; |
||||
|
height: 28px; |
||||
|
} |
||||
|
span.flatpickr-weekday { |
||||
|
cursor: default; |
||||
|
font-size: 90%; |
||||
|
background: $red; |
||||
|
color: rgba(0,0,0,0.54); |
||||
|
line-height: 1; |
||||
|
margin: 0; |
||||
|
text-align: center; |
||||
|
display: block; |
||||
|
-webkit-box-flex: 1; |
||||
|
-webkit-flex: 1; |
||||
|
-ms-flex: 1; |
||||
|
flex: 1; |
||||
|
font-weight: bolder; |
||||
|
} |
||||
|
.dayContainer, |
||||
|
.flatpickr-weeks { |
||||
|
padding: 1px 0 0 0; |
||||
|
} |
||||
|
.flatpickr-days { |
||||
|
position: relative; |
||||
|
overflow: hidden; |
||||
|
display: -webkit-box; |
||||
|
display: -webkit-flex; |
||||
|
display: -ms-flexbox; |
||||
|
display: flex; |
||||
|
width: 100%; |
||||
|
border-left: 1px solid rgba(72,72,72,0.2); |
||||
|
border-right: 1px solid rgba(72,72,72,0.2); |
||||
|
padding: 4px 0; |
||||
|
} |
||||
|
.flatpickr-days:focus { |
||||
|
outline: 0; |
||||
|
} |
||||
|
.dayContainer { |
||||
|
padding: 0; |
||||
|
outline: 0; |
||||
|
text-align: left; |
||||
|
width: 100%; |
||||
|
min-width: 100%; |
||||
|
max-width: 100%; |
||||
|
-webkit-box-sizing: border-box; |
||||
|
box-sizing: border-box; |
||||
|
display: inline-block; |
||||
|
display: -ms-flexbox; |
||||
|
display: -webkit-box; |
||||
|
display: -webkit-flex; |
||||
|
display: flex; |
||||
|
-webkit-flex-wrap: wrap; |
||||
|
flex-wrap: wrap; |
||||
|
-ms-flex-wrap: wrap; |
||||
|
-ms-flex-pack: justify; |
||||
|
-webkit-justify-content: space-around; |
||||
|
justify-content: space-around; |
||||
|
-webkit-transform: translate3d(0px, 0px, 0px); |
||||
|
transform: translate3d(0px, 0px, 0px); |
||||
|
opacity: 1; |
||||
|
} |
||||
|
.flatpickr-day { |
||||
|
background: none; |
||||
|
border: 1px solid transparent; |
||||
|
border-radius: 150px; |
||||
|
-webkit-box-sizing: border-box; |
||||
|
box-sizing: border-box; |
||||
|
color: #484848; |
||||
|
cursor: pointer; |
||||
|
font-weight: 400; |
||||
|
width: 14.2857143%; |
||||
|
-webkit-flex-basis: 14.2857143%; |
||||
|
-ms-flex-preferred-size: 14.2857143%; |
||||
|
flex-basis: 14.2857143%; |
||||
|
max-width: 35px; |
||||
|
height: 35px; |
||||
|
line-height: 35px; |
||||
|
margin: 2px 0; |
||||
|
display: inline-block; |
||||
|
position: relative; |
||||
|
-webkit-box-pack: center; |
||||
|
-webkit-justify-content: center; |
||||
|
-ms-flex-pack: center; |
||||
|
justify-content: center; |
||||
|
text-align: center; |
||||
|
} |
||||
|
.flatpickr-day.inRange, |
||||
|
.flatpickr-day.prevMonthDay.inRange, |
||||
|
.flatpickr-day.nextMonthDay.inRange, |
||||
|
.flatpickr-day.today.inRange, |
||||
|
.flatpickr-day.prevMonthDay.today.inRange, |
||||
|
.flatpickr-day.nextMonthDay.today.inRange, |
||||
|
.flatpickr-day:hover, |
||||
|
.flatpickr-day.prevMonthDay:hover, |
||||
|
.flatpickr-day.nextMonthDay:hover, |
||||
|
.flatpickr-day:focus, |
||||
|
.flatpickr-day.prevMonthDay:focus, |
||||
|
.flatpickr-day.nextMonthDay:focus { |
||||
|
cursor: pointer; |
||||
|
outline: 0; |
||||
|
background: #e2e2e2; |
||||
|
border-color: #e2e2e2; |
||||
|
} |
||||
|
.flatpickr-day.today { |
||||
|
border-color: #bbb; |
||||
|
} |
||||
|
.flatpickr-day.today:hover, |
||||
|
.flatpickr-day.today:focus { |
||||
|
border-color: #bbb; |
||||
|
background: #bbb; |
||||
|
color: $white; |
||||
|
} |
||||
|
.flatpickr-day.selected, |
||||
|
.flatpickr-day.startRange, |
||||
|
.flatpickr-day.endRange, |
||||
|
.flatpickr-day.selected.inRange, |
||||
|
.flatpickr-day.startRange.inRange, |
||||
|
.flatpickr-day.endRange.inRange, |
||||
|
.flatpickr-day.selected:focus, |
||||
|
.flatpickr-day.startRange:focus, |
||||
|
.flatpickr-day.endRange:focus, |
||||
|
.flatpickr-day.selected:hover, |
||||
|
.flatpickr-day.startRange:hover, |
||||
|
.flatpickr-day.endRange:hover, |
||||
|
.flatpickr-day.selected.prevMonthDay, |
||||
|
.flatpickr-day.startRange.prevMonthDay, |
||||
|
.flatpickr-day.endRange.prevMonthDay, |
||||
|
.flatpickr-day.selected.nextMonthDay, |
||||
|
.flatpickr-day.startRange.nextMonthDay, |
||||
|
.flatpickr-day.endRange.nextMonthDay { |
||||
|
background: $red; |
||||
|
-webkit-box-shadow: none; |
||||
|
box-shadow: none; |
||||
|
color: $white; |
||||
|
border-color: $red; |
||||
|
} |
||||
|
.flatpickr-day.selected.startRange, |
||||
|
.flatpickr-day.startRange.startRange, |
||||
|
.flatpickr-day.endRange.startRange { |
||||
|
border-radius: 50px 0 0 50px; |
||||
|
} |
||||
|
.flatpickr-day.selected.endRange, |
||||
|
.flatpickr-day.startRange.endRange, |
||||
|
.flatpickr-day.endRange.endRange { |
||||
|
border-radius: 0 50px 50px 0; |
||||
|
} |
||||
|
.flatpickr-day.selected.startRange + .endRange, |
||||
|
.flatpickr-day.startRange.startRange + .endRange, |
||||
|
.flatpickr-day.endRange.startRange + .endRange { |
||||
|
-webkit-box-shadow: -10px 0 0 $red; |
||||
|
box-shadow: -10px 0 0 $red; |
||||
|
} |
||||
|
.flatpickr-day.selected.startRange.endRange, |
||||
|
.flatpickr-day.startRange.startRange.endRange, |
||||
|
.flatpickr-day.endRange.startRange.endRange { |
||||
|
border-radius: 50px; |
||||
|
} |
||||
|
.flatpickr-day.inRange { |
||||
|
border-radius: 0; |
||||
|
-webkit-box-shadow: -5px 0 0 #e2e2e2, 5px 0 0 #e2e2e2; |
||||
|
box-shadow: -5px 0 0 #e2e2e2, 5px 0 0 #e2e2e2; |
||||
|
} |
||||
|
.flatpickr-day.disabled, |
||||
|
.flatpickr-day.disabled:hover, |
||||
|
.flatpickr-day.prevMonthDay, |
||||
|
.flatpickr-day.nextMonthDay, |
||||
|
.flatpickr-day.notAllowed, |
||||
|
.flatpickr-day.notAllowed.prevMonthDay, |
||||
|
.flatpickr-day.notAllowed.nextMonthDay { |
||||
|
color: rgba(72,72,72,0.3); |
||||
|
background: transparent; |
||||
|
border-color: transparent; |
||||
|
cursor: default; |
||||
|
} |
||||
|
.flatpickr-day.disabled, |
||||
|
.flatpickr-day.disabled:hover { |
||||
|
cursor: not-allowed; |
||||
|
color: rgba(72,72,72,0.1); |
||||
|
} |
||||
|
.flatpickr-day.week.selected { |
||||
|
border-radius: 0; |
||||
|
-webkit-box-shadow: -5px 0 0 $red, 5px 0 0 $red; |
||||
|
box-shadow: -5px 0 0 $red, 5px 0 0 $red; |
||||
|
} |
||||
|
.rangeMode .flatpickr-day { |
||||
|
margin-top: 1px; |
||||
|
} |
||||
|
.flatpickr-weekwrapper { |
||||
|
display: inline-block; |
||||
|
float: left; |
||||
|
} |
||||
|
.flatpickr-weekwrapper .flatpickr-weeks { |
||||
|
padding: 0 12px; |
||||
|
border-left: 1px solid rgba(72,72,72,0.2); |
||||
|
} |
||||
|
.flatpickr-weekwrapper .flatpickr-weekday { |
||||
|
float: none; |
||||
|
width: 100%; |
||||
|
line-height: 28px; |
||||
|
} |
||||
|
.flatpickr-weekwrapper span.flatpickr-day, |
||||
|
.flatpickr-weekwrapper span.flatpickr-day:hover { |
||||
|
display: block; |
||||
|
width: 100%; |
||||
|
max-width: none; |
||||
|
color: rgba(72,72,72,0.3); |
||||
|
background: transparent; |
||||
|
cursor: default; |
||||
|
border: none; |
||||
|
} |
||||
|
.flatpickr-innerContainer { |
||||
|
display: block; |
||||
|
display: -webkit-box; |
||||
|
display: -webkit-flex; |
||||
|
display: -ms-flexbox; |
||||
|
display: flex; |
||||
|
-webkit-box-sizing: border-box; |
||||
|
box-sizing: border-box; |
||||
|
overflow: hidden; |
||||
|
background: $white; |
||||
|
border-bottom: 1px solid rgba(72,72,72,0.2); |
||||
|
} |
||||
|
.flatpickr-rContainer { |
||||
|
display: inline-block; |
||||
|
padding: 0; |
||||
|
-webkit-box-sizing: border-box; |
||||
|
box-sizing: border-box; |
||||
|
} |
||||
|
.flatpickr-time { |
||||
|
text-align: center; |
||||
|
outline: 0; |
||||
|
display: block; |
||||
|
height: 0; |
||||
|
line-height: 40px; |
||||
|
max-height: 40px; |
||||
|
-webkit-box-sizing: border-box; |
||||
|
box-sizing: border-box; |
||||
|
overflow: hidden; |
||||
|
display: -webkit-box; |
||||
|
display: -webkit-flex; |
||||
|
display: -ms-flexbox; |
||||
|
display: flex; |
||||
|
background: $white; |
||||
|
border-radius: 0 0 5px 5px; |
||||
|
} |
||||
|
.flatpickr-time:after { |
||||
|
content: ""; |
||||
|
display: table; |
||||
|
clear: both; |
||||
|
} |
||||
|
.flatpickr-time .numInputWrapper { |
||||
|
-webkit-box-flex: 1; |
||||
|
-webkit-flex: 1; |
||||
|
-ms-flex: 1; |
||||
|
flex: 1; |
||||
|
width: 40%; |
||||
|
height: 40px; |
||||
|
float: left; |
||||
|
} |
||||
|
.flatpickr-time .numInputWrapper span.arrowUp:after { |
||||
|
border-bottom-color: #484848; |
||||
|
} |
||||
|
.flatpickr-time .numInputWrapper span.arrowDown:after { |
||||
|
border-top-color: #484848; |
||||
|
} |
||||
|
.flatpickr-time.hasSeconds .numInputWrapper { |
||||
|
width: 26%; |
||||
|
} |
||||
|
.flatpickr-time.time24hr .numInputWrapper { |
||||
|
width: 49%; |
||||
|
} |
||||
|
.flatpickr-time input { |
||||
|
background: transparent; |
||||
|
-webkit-box-shadow: none; |
||||
|
box-shadow: none; |
||||
|
border: 0; |
||||
|
border-radius: 0; |
||||
|
text-align: center; |
||||
|
margin: 0; |
||||
|
padding: 0; |
||||
|
height: inherit; |
||||
|
line-height: inherit; |
||||
|
cursor: pointer; |
||||
|
color: #484848; |
||||
|
font-size: 14px; |
||||
|
position: relative; |
||||
|
-webkit-box-sizing: border-box; |
||||
|
box-sizing: border-box; |
||||
|
} |
||||
|
.flatpickr-time input.flatpickr-hour { |
||||
|
font-weight: bold; |
||||
|
} |
||||
|
.flatpickr-time input.flatpickr-minute, |
||||
|
.flatpickr-time input.flatpickr-second { |
||||
|
font-weight: 400; |
||||
|
} |
||||
|
.flatpickr-time input:focus { |
||||
|
outline: 0; |
||||
|
border: 0; |
||||
|
} |
||||
|
.flatpickr-time .flatpickr-time-separator, |
||||
|
.flatpickr-time .flatpickr-am-pm { |
||||
|
height: inherit; |
||||
|
display: inline-block; |
||||
|
float: left; |
||||
|
line-height: inherit; |
||||
|
color: #484848; |
||||
|
font-weight: bold; |
||||
|
width: 2%; |
||||
|
-webkit-user-select: none; |
||||
|
-moz-user-select: none; |
||||
|
-ms-user-select: none; |
||||
|
user-select: none; |
||||
|
-webkit-align-self: center; |
||||
|
-ms-flex-item-align: center; |
||||
|
align-self: center; |
||||
|
} |
||||
|
.flatpickr-time .flatpickr-am-pm { |
||||
|
outline: 0; |
||||
|
width: 18%; |
||||
|
cursor: pointer; |
||||
|
text-align: center; |
||||
|
font-weight: 400; |
||||
|
} |
||||
|
.flatpickr-time .flatpickr-am-pm:hover, |
||||
|
.flatpickr-time .flatpickr-am-pm:focus { |
||||
|
background: #ececec; |
||||
|
} |
||||
|
.flatpickr-input[readonly] { |
||||
|
cursor: pointer; |
||||
|
} |
||||
|
@-webkit-keyframes fpFadeInDown { |
||||
|
from { |
||||
|
opacity: 0; |
||||
|
-webkit-transform: translate3d(0, -20px, 0); |
||||
|
transform: translate3d(0, -20px, 0); |
||||
|
} |
||||
|
to { |
||||
|
opacity: 1; |
||||
|
-webkit-transform: translate3d(0, 0, 0); |
||||
|
transform: translate3d(0, 0, 0); |
||||
|
} |
||||
|
} |
||||
|
@keyframes fpFadeInDown { |
||||
|
from { |
||||
|
opacity: 0; |
||||
|
-webkit-transform: translate3d(0, -20px, 0); |
||||
|
transform: translate3d(0, -20px, 0); |
||||
|
} |
||||
|
to { |
||||
|
opacity: 1; |
||||
|
-webkit-transform: translate3d(0, 0, 0); |
||||
|
transform: translate3d(0, 0, 0); |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,61 @@ |
|||||
|
|
||||
|
|
||||
|
.font-light{ |
||||
|
font-weight: 300 !important; |
||||
|
} |
||||
|
.font-regular{ |
||||
|
font-weight: 400 !important; |
||||
|
} |
||||
|
.font-medium{ |
||||
|
font-weight: 500 !important; |
||||
|
} |
||||
|
.font-semibold{ |
||||
|
font-weight: 600 !important; |
||||
|
} |
||||
|
.font-bold{ |
||||
|
font-weight: 700 !important; |
||||
|
} |
||||
|
.font-extrabold{ |
||||
|
font-weight: 800 !important; |
||||
|
} |
||||
|
.font-normal { |
||||
|
font-style: normal !important; |
||||
|
} |
||||
|
.font-italic { |
||||
|
font-style: italic !important; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.text-right{ |
||||
|
text-align: right !important; |
||||
|
} |
||||
|
.text-center{ |
||||
|
text-align: center !important; |
||||
|
} |
||||
|
.text-left{ |
||||
|
text-align: left !important; |
||||
|
} |
||||
|
|
||||
|
.text-white{ |
||||
|
color: white !important; |
||||
|
} |
||||
|
.text-black{ |
||||
|
color: black !important; |
||||
|
} |
||||
|
.text-red{ |
||||
|
color: $red !important; |
||||
|
} |
||||
|
.text-green{ |
||||
|
color: $green !important; |
||||
|
} |
||||
|
.text-grey{ |
||||
|
color: $grey !important; |
||||
|
} |
||||
|
.text-light-grey{ |
||||
|
color: $light-grey !important; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.text-upper{ |
||||
|
text-transform: uppercase !important; |
||||
|
} |
||||
@ -0,0 +1,80 @@ |
|||||
|
|
||||
|
select, |
||||
|
input,button{ |
||||
|
border: none; |
||||
|
border-radius: 3px; |
||||
|
margin: 5px 0; |
||||
|
-webkit-appearance: none; |
||||
|
&::-ms-clear { |
||||
|
display: none; |
||||
|
} |
||||
|
&:focus {outline:none;} |
||||
|
&::-moz-focus-inner {border:0;} |
||||
|
color: black; |
||||
|
background: white; |
||||
|
} |
||||
|
|
||||
|
select, |
||||
|
input[type=text], |
||||
|
input[type=password]{ |
||||
|
border: 1px solid $grey; |
||||
|
padding: 5px 20px; |
||||
|
width: 100%; |
||||
|
text-align: left; |
||||
|
box-sizing: border-box; |
||||
|
|
||||
|
&.input-login{ |
||||
|
border: 1px solid $red; |
||||
|
border-radius: 5px; |
||||
|
color: black; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
input[type=button], |
||||
|
input[type=submit], |
||||
|
button, |
||||
|
.button{ |
||||
|
padding: 5px 20px; |
||||
|
margin: 10px; |
||||
|
border-radius: 4px; |
||||
|
cursor: pointer; |
||||
|
text-align: center; |
||||
|
font-size: $font-10; |
||||
|
text-transform: uppercase; |
||||
|
transition: .4s; |
||||
|
color: white; |
||||
|
|
||||
|
&:hover{ |
||||
|
opacity: .6; |
||||
|
} |
||||
|
|
||||
|
&:disabled{ |
||||
|
opacity: .4; |
||||
|
} |
||||
|
|
||||
|
&.full{ |
||||
|
width: 100%; |
||||
|
} |
||||
|
&.big{ |
||||
|
padding: 10px 25px; |
||||
|
} |
||||
|
|
||||
|
&.confirm{ |
||||
|
background: $red; |
||||
|
} |
||||
|
&.discard{ |
||||
|
background: black; |
||||
|
} |
||||
|
&.grey{ |
||||
|
background: $dark-grey; |
||||
|
} |
||||
|
&.dotted{ |
||||
|
background: white; |
||||
|
color: $dark-grey; |
||||
|
border: 2px dotted $dark-grey; |
||||
|
border-radius: 6px; |
||||
|
padding: 5px 15px; |
||||
|
margin: 5px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
@ -0,0 +1,101 @@ |
|||||
|
@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,500,600,700,800,900'); |
||||
|
|
||||
|
body{ |
||||
|
font-family: 'Montserrat'; |
||||
|
font-weight: 600; |
||||
|
} |
||||
|
|
||||
|
p, |
||||
|
label{ |
||||
|
margin: 0; |
||||
|
} |
||||
|
|
||||
|
a{ |
||||
|
color: white; |
||||
|
text-decoration: none; |
||||
|
transition: .4s; |
||||
|
outline: none; |
||||
|
&:active, |
||||
|
&:visited, |
||||
|
&:hover, |
||||
|
&:focus{ |
||||
|
outline: none; |
||||
|
color: white; |
||||
|
text-decoration: none; |
||||
|
} |
||||
|
&:hover{ |
||||
|
color: $grey; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.container{ |
||||
|
width: 100%; |
||||
|
padding: 0 20px; |
||||
|
} |
||||
|
|
||||
|
.border{ |
||||
|
border: 1px solid red; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.middle{ |
||||
|
position: absolute; |
||||
|
top: 50%; |
||||
|
transform: translateY(-50%); |
||||
|
} |
||||
|
|
||||
|
.middle-right{ |
||||
|
position: absolute; |
||||
|
right: 0; |
||||
|
top: 50%; |
||||
|
transform: translateY(-50%); |
||||
|
} |
||||
|
|
||||
|
.full-middle{ |
||||
|
position: absolute; |
||||
|
left: 50%; |
||||
|
top: 50%; |
||||
|
transform: translate(-50%, -50%); |
||||
|
} |
||||
|
|
||||
|
.pattern{ |
||||
|
background: white; |
||||
|
background-image: url(../images/pattern.jpg); |
||||
|
background-repeat: repeat-x; |
||||
|
background-position: center bottom; |
||||
|
} |
||||
|
|
||||
|
.radius{ |
||||
|
border-radius: 3px; |
||||
|
} |
||||
|
|
||||
|
.radius-bottom{ |
||||
|
border-radius: 0 0 3px 3px; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
#MainContent{ |
||||
|
padding-top: 30px; |
||||
|
z-index: 0; |
||||
|
overflow: hidden; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.hseparator{ |
||||
|
&:after{ |
||||
|
content: ':'; |
||||
|
position: absolute; |
||||
|
left: -2px; |
||||
|
top: 50%; |
||||
|
transform: translateY(-50%); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.bg-white{ |
||||
|
background: white; |
||||
|
} |
||||
|
|
||||
|
.bg-grey{ |
||||
|
background: $light-grey; |
||||
|
} |
||||
@ -0,0 +1,60 @@ |
|||||
|
|
||||
|
header{ |
||||
|
background: $dark-grey; |
||||
|
height: 50px; |
||||
|
width: 100%; |
||||
|
position: fixed; |
||||
|
z-index: 100; |
||||
|
|
||||
|
&.red{ |
||||
|
background: $red; |
||||
|
} |
||||
|
|
||||
|
.container{ |
||||
|
.row{ |
||||
|
height: 50px; |
||||
|
|
||||
|
.logo{ |
||||
|
height: 25px; |
||||
|
} |
||||
|
|
||||
|
.menu{ |
||||
|
text-align: right; |
||||
|
ul{ |
||||
|
list-style: none; |
||||
|
margin: 0; |
||||
|
right: 10px; |
||||
|
li{ |
||||
|
display: inline-block; |
||||
|
color: white; |
||||
|
margin: 10px; |
||||
|
padding: 7px 0 2px 0; |
||||
|
font-size: $font-12; |
||||
|
letter-spacing: 1px; |
||||
|
font-weight: bold; |
||||
|
text-transform: uppercase; |
||||
|
border-bottom: 4px solid $dark-grey; |
||||
|
cursor: pointer; |
||||
|
transition: .4s; |
||||
|
|
||||
|
a{ |
||||
|
.fa{ |
||||
|
font-size: $font-14; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
&.active, |
||||
|
&:hover{ |
||||
|
border-bottom: 4px solid $red; |
||||
|
a{ |
||||
|
&:hover{ |
||||
|
color: white; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,18 @@ |
|||||
|
@charset "UTF-8"; |
||||
|
|
||||
|
@import "variables"; |
||||
|
|
||||
|
@import "../node_modules/bootstrap/scss/bootstrap"; |
||||
|
@import "../node_modules/font-awesome/scss/font-awesome"; |
||||
|
|
||||
|
@import "colorbox"; |
||||
|
@import "fonts"; |
||||
|
@import "global"; |
||||
|
@import "forms"; |
||||
|
@import "header"; |
||||
|
@import "navigation"; |
||||
|
@import "flatpickr"; |
||||
|
|
||||
|
@import "sections/sections"; |
||||
|
|
||||
|
//@import "mediaqueries/mediaqueries"; |
||||
@ -0,0 +1,68 @@ |
|||||
|
#!/bin/bash |
||||
|
|
||||
|
# input folder |
||||
|
src="" |
||||
|
# input file |
||||
|
src+="main.scss" |
||||
|
|
||||
|
# output folders |
||||
|
dest="../css/" |
||||
|
# output filename |
||||
|
dev=$dest"styles.css" |
||||
|
prod=$dest"styles.min.css" |
||||
|
custom=$dest"styles.custom.css" |
||||
|
|
||||
|
#help message |
||||
|
usage=" |
||||
|
Usage:\n |
||||
|
sass.sh [environment|watch-mode] [watch-mode|other-switches]\n\n |
||||
|
Examples:\n |
||||
|
1) watch mode with develop environment presets\n |
||||
|
./sass.sh dev --watch\n |
||||
|
---\n |
||||
|
2) 1 time compiling for production\n |
||||
|
./sass.sh prod\n |
||||
|
---\n\n |
||||
|
to modify input/output paths edit sass.sh\n |
||||
|
" |
||||
|
|
||||
|
# check for output directories |
||||
|
if [[ ! -e $dest ]]; then |
||||
|
mkdir -p $dest |
||||
|
elif [[ ! -d $dest ]]; then |
||||
|
echo "$dest already exists but is not a directory." 1>&2 |
||||
|
fi |
||||
|
|
||||
|
# don't edit below this line |
||||
|
if (( $# == 0 )); then |
||||
|
echo -e $usage |
||||
|
exit |
||||
|
else |
||||
|
case $1 in |
||||
|
--h*|--\? ) |
||||
|
echo -e $usage |
||||
|
exit |
||||
|
;; |
||||
|
"dev" ) |
||||
|
echo "compiling for developement" |
||||
|
sass $2 $src:$dev --line-numbers --sourcemap=none --style expanded ${@:3} |
||||
|
exit |
||||
|
;; |
||||
|
"prod"|"min" ) |
||||
|
echo "compiling for production" |
||||
|
sass $2 $src:$prod --sourcemap=none --style compressed ${@:3} |
||||
|
exit |
||||
|
;; |
||||
|
--w* ) |
||||
|
echo "compiling with given switches in --watch mode" |
||||
|
sass $1 $src:$custom ${@:2} |
||||
|
exit |
||||
|
;; |
||||
|
* ) |
||||
|
echo "compiling with given switches" |
||||
|
sass $src:$custom ${@:1} |
||||
|
exit |
||||
|
;; |
||||
|
esac |
||||
|
echo -e $usage |
||||
|
fi |
||||
@ -0,0 +1,19 @@ |
|||||
|
|
||||
|
.messages{ |
||||
|
width: 100%; |
||||
|
|
||||
|
.items{ |
||||
|
transition: .4s; |
||||
|
&:hover{ |
||||
|
opacity: .6; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.add_message_form{ |
||||
|
|
||||
|
.actions{ |
||||
|
width: 100%; |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,4 @@ |
|||||
|
|
||||
|
@import "sessions"; |
||||
|
@import "messages"; |
||||
|
|
||||
@ -0,0 +1,11 @@ |
|||||
|
|
||||
|
.sessions{ |
||||
|
width: 100%; |
||||
|
|
||||
|
.items{ |
||||
|
transition: .4s; |
||||
|
&:hover{ |
||||
|
opacity: .6; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,62 @@ |
|||||
|
// Bootstrap Settings |
||||
|
$grid-columns: 12; |
||||
|
$grid-gutter-width: 20px; |
||||
|
|
||||
|
$grid-breakpoints: ( |
||||
|
xs: 0, // Mobile Portrait |
||||
|
sm: 768px, // Tablet Portrait |
||||
|
md: 1024px, // Tablet landscape/Small desktop |
||||
|
lg: 1280px, // Desktop |
||||
|
xl: 1600px, // Large desktop |
||||
|
); |
||||
|
|
||||
|
|
||||
|
$container-max-widths: ( |
||||
|
sm: 708px, |
||||
|
md: 984px, |
||||
|
lg: 1240px, |
||||
|
xl: 1560px |
||||
|
); |
||||
|
|
||||
|
$fa-font-path: '../node_modules/font-awesome/fonts/'; |
||||
|
|
||||
|
$font-8: 0.5rem; /* 8px */ |
||||
|
$font-10: 0.625rem; /* 10px */ |
||||
|
$font-12: 0.75rem; /* 12px */ |
||||
|
$font-13: 0.812rem; /* 13px */ |
||||
|
$font-14: 0.875rem; /* 14px */ |
||||
|
$font-15: 0.937rem; /* 15px */ |
||||
|
$font-16: 1rem; /* 16px */ |
||||
|
$font-18: 1.125rem; /* 18px */ |
||||
|
$font-20: 1.25rem; /* 20px */ |
||||
|
$font-22: 1.375rem; /* 22px */ |
||||
|
$font-24: 1.5rem; /* 24px */ |
||||
|
$font-26: 1.625rem; /* 26px */ |
||||
|
$font-28: 1.75rem; /* 28px */ |
||||
|
$font-30: 1.875rem; /* 30px */ |
||||
|
$font-34: 2.125rem; /* 34px */ |
||||
|
$font-40: 2.5rem; /* 40px */ |
||||
|
$font-45: 2.812rem; /* 45px */ |
||||
|
$font-48: 3rem; /* 48px */ |
||||
|
$font-53: 3.312rem; /* 53px */ |
||||
|
$font-alert: 8rem; /* ?px */ |
||||
|
|
||||
|
$icon: 'FontAwesome'; |
||||
|
|
||||
|
@each $size in 8, 10, 12, 13, 14, 15, 16, 18, 20, 22, 24, 26, 28, 30, 34, 40, 45, 48, 53 { |
||||
|
.font-#{$size} {font-size: #{$size/16}rem !important;} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
$alpha: rgba(255,255,255,0.6); |
||||
|
$green: #4e984a; |
||||
|
$light-green: #71986e; |
||||
|
$red: #bf0f3d; |
||||
|
$grey: #999; |
||||
|
$light-grey: #f2f2f2; |
||||
|
$dark-grey: #2f2f2f; |
||||
|
|
||||
|
$pink: #f6e7ea; |
||||
|
$dark-pink: #c8bcbe; |
||||
|
$azure: #d4eeed; |
||||
|
$dark-azure: #b0c8c6; |
||||
@ -0,0 +1,43 @@ |
|||||
|
|
||||
|
|
||||
|
<div class="sessions"> |
||||
|
|
||||
|
<div class="row <?= $bgcolor;?> py-2 text-right"> |
||||
|
<div class="col-12"><a href="/cb_session_add.php" class="cbOpen button big confirm mx-0">Add new session</a></div> |
||||
|
</div> |
||||
|
|
||||
|
<div class="row <?= $bgcolor;?> p-2 text-upper text-grey"> |
||||
|
<div class="col-3 font-12">Session name</div> |
||||
|
<div class="col-4 font-12">Session link</div> |
||||
|
<div class="col-2 font-12">Session start</div> |
||||
|
<div class="col-2 font-12">Session end</div> |
||||
|
<div class="col-1 text-right"></div> |
||||
|
</div> |
||||
|
|
||||
|
<?php |
||||
|
$cnt=0; |
||||
|
$q=mysqli_query($conn, "SELECT * FROM session ORDER BY enabled DESC, id DESC"); |
||||
|
while($r=mysqli_fetch_array($q)){ |
||||
|
$cnt++; |
||||
|
$bgcolor = ($cnt%2) ? "bg-grey" : "bg-white"; |
||||
|
?> |
||||
|
|
||||
|
<div class="row items <?= $bgcolor;?> p-2"> |
||||
|
<div class="col-3 font-12"><?= $r['name'];?></div> |
||||
|
<div class="col-4 font-12"><a href="<?= $BASE_URL.":3000/".$r['link'];?>" target="_blank" class="text-black"><?= $BASE_URL.":3000/".$r['link'];?></a></div> |
||||
|
<div class="col-2 font-12"><?= $r['start'];?></div> |
||||
|
<div class="col-2 font-12"><?= $r['stop'];?></div> |
||||
|
<div class="col-1 text-right"> |
||||
|
<a href="/cb_session_action.php?id=<?= $r['id'];?>&status=<?= $r['enabled'];?>" class="cbOpenSmall"> |
||||
|
<?= $r['enabled'] ? "<i class=\"fa fa-play text-green\"></i>" : "<i class=\"fa fa-pause text-grey\"></i>";?> |
||||
|
</a> |
||||
|
<a href="/cb_session_edit.php?id=<?= $r['id'];?>" class="cbOpen text-black"><i class="fa fa-pencil-square ml-2"></i></a> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<?php |
||||
|
} |
||||
|
?> |
||||
|
|
||||
|
|
||||
|
</div> |
||||
@ -0,0 +1 @@ |
|||||
|
node index.js |
||||
@ -0,0 +1,21 @@ |
|||||
|
|
||||
|
const express = require('express'); |
||||
|
const app = express(); |
||||
|
const http = require('http').Server(app); |
||||
|
const io = require('socket.io')(http); |
||||
|
const port = process.env.PORT || 3001; |
||||
|
|
||||
|
app.use(express.static(__dirname + '/public')); |
||||
|
|
||||
|
function onConnection(socket){ |
||||
|
socket.on('cloudIndex', (data) => socket.broadcast.emit('cloudIndex', data)); |
||||
|
socket.on('reset', (data) => socket.broadcast.emit('reset', data)); |
||||
|
socket.on('message', (data) => socket.broadcast.emit('message', data)); |
||||
|
socket.on('response', (data) => socket.broadcast.emit('response', data)); |
||||
|
socket.on('actions', (data) => socket.broadcast.emit('actions', data)); |
||||
|
socket.on('display', (data) => socket.broadcast.emit('display', data)); |
||||
|
} |
||||
|
|
||||
|
io.on('connection', onConnection); |
||||
|
|
||||
|
http.listen(port, () => console.log('listening on port ' + port)); |
||||
File diff suppressed because it is too large
@ -0,0 +1,23 @@ |
|||||
|
{ |
||||
|
"name": "coze_socket", |
||||
|
"version": "1.0.0", |
||||
|
"description": "COZe socket", |
||||
|
"main": "index.js", |
||||
|
"keywords": [ |
||||
|
"socket.io" |
||||
|
], |
||||
|
"dependencies": { |
||||
|
"express": "latest", |
||||
|
"font-awesome": "latest", |
||||
|
"ms": "github:zeit/ms", |
||||
|
"pillarjs": "latest", |
||||
|
"send": "github:pillarjs/send", |
||||
|
"socket.io": "latest", |
||||
|
"zeit": "latest" |
||||
|
}, |
||||
|
"scripts": { |
||||
|
"start": "node index" |
||||
|
}, |
||||
|
"author": "Dslak", |
||||
|
"license": "MIT" |
||||
|
} |
||||
@ -0,0 +1,29 @@ |
|||||
|
<!doctype html> |
||||
|
<html lang="en"> |
||||
|
<head> |
||||
|
<meta charset="UTF-8"> |
||||
|
<title>COZe</title> |
||||
|
<link rel="stylesheet" href="style.css"> |
||||
|
</head> |
||||
|
<body style="text-align: center"> |
||||
|
|
||||
|
<div id="controls"> |
||||
|
<select id="gotoCloud"> |
||||
|
<option value="0">0</option> |
||||
|
<option value="1">1</option> |
||||
|
<option value="2">2</option> |
||||
|
<option value="3">3</option> |
||||
|
<option value="4">4</option> |
||||
|
<option value="5">5</option> |
||||
|
</select> |
||||
|
|
||||
|
<button id="reset">Reset</button> |
||||
|
|
||||
|
<input id="message" type="text" > |
||||
|
</div> |
||||
|
|
||||
|
<script src="https://code.jquery.com/jquery-latest.min.js"></script> |
||||
|
<script src="/socket.io/socket.io.js"></script> |
||||
|
<script src="/control.js"></script> |
||||
|
</body> |
||||
|
</html> |
||||
@ -0,0 +1,63 @@ |
|||||
|
$(document).ready(()=>{ |
||||
|
|
||||
|
const socket = io(); |
||||
|
|
||||
|
|
||||
|
// socket.emit('cloudIndex', getURLParameter('cloud'));
|
||||
|
if(getURLParameter('cloud')){ |
||||
|
socket.emit('cloudIndex', getURLParameter('cloud')); |
||||
|
} |
||||
|
|
||||
|
if(getURLParameter('message')){ |
||||
|
socket.emit('message', getURLParameter('message')); |
||||
|
} |
||||
|
|
||||
|
if(getURLParameter('response')){ |
||||
|
socket.emit('response', getURLParameter('response')); |
||||
|
} |
||||
|
|
||||
|
if(getURLParameter('actions')){ |
||||
|
socket.emit('actions', getURLParameter('actions')); |
||||
|
} |
||||
|
|
||||
|
if(getURLParameter('display')){ |
||||
|
socket.emit('display', getURLParameter('display')); |
||||
|
} |
||||
|
|
||||
|
if(getURLParameter('reset')){ |
||||
|
socket.emit('reset', 1); |
||||
|
} |
||||
|
|
||||
|
$('#gotoCloud').on('change', function(){ |
||||
|
current = $(this).val(); |
||||
|
socket.emit('cloudIndex', current); |
||||
|
}); |
||||
|
|
||||
|
$('#reset').on('click', function(){ |
||||
|
socket.emit('reset', 1); |
||||
|
console.log('RESET'); |
||||
|
}); |
||||
|
|
||||
|
$('#message').on('keypress', function(event){ |
||||
|
if(event.which == 13){ |
||||
|
socket.emit('message', $(this).val()); |
||||
|
console.log('message', $(this).val()); |
||||
|
} |
||||
|
}); |
||||
|
|
||||
|
}); |
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
function getURLParameter(sParam){ |
||||
|
const sPageURL = window.location.search.substring(1); |
||||
|
const sURLVariables = sPageURL.split('&'); |
||||
|
|
||||
|
for (let i = 0; i < sURLVariables.length; i++){ |
||||
|
const sParameterName = sURLVariables[i].split('='); |
||||
|
if (sParameterName[0] == sParam){ |
||||
|
return sParameterName[1]; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
File diff suppressed because it is too large
Binary file not shown.
Binary file not shown.
|
After Width: | Height: | Size: 434 KiB |
Binary file not shown.
Binary file not shown.
Binary file not shown.
@ -0,0 +1,4 @@ |
|||||
|
[Dolphin] |
||||
|
PreviewsShown=true |
||||
|
Timestamp=2017,10,21,18,38,1 |
||||
|
Version=4 |
||||
|
After Width: | Height: | Size: 6.2 KiB |
|
After Width: | Height: | Size: 225 B |
|
After Width: | Height: | Size: 893 KiB |
|
After Width: | Height: | Size: 247 KiB |
@ -0,0 +1,58 @@ |
|||||
|
|
||||
|
|
||||
|
.font-light{ |
||||
|
font-weight: 300 !important; |
||||
|
} |
||||
|
.font-regular{ |
||||
|
font-weight: 400 !important; |
||||
|
} |
||||
|
.font-medium{ |
||||
|
font-weight: 500 !important; |
||||
|
} |
||||
|
.font-semibold{ |
||||
|
font-weight: 600 !important; |
||||
|
} |
||||
|
.font-bold{ |
||||
|
font-weight: 700 !important; |
||||
|
} |
||||
|
.font-extrabold{ |
||||
|
font-weight: 800 !important; |
||||
|
} |
||||
|
.font-normal { |
||||
|
font-style: normal !important; |
||||
|
} |
||||
|
.font-italic { |
||||
|
font-style: italic !important; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.text-right{ |
||||
|
text-align: right !important; |
||||
|
} |
||||
|
.text-center{ |
||||
|
text-align: center !important; |
||||
|
} |
||||
|
.text-left{ |
||||
|
text-align: left !important; |
||||
|
} |
||||
|
|
||||
|
.text-white{ |
||||
|
color: white !important; |
||||
|
} |
||||
|
.text-black{ |
||||
|
color: black !important; |
||||
|
} |
||||
|
.text-red{ |
||||
|
color: $red !important; |
||||
|
} |
||||
|
.text-grey{ |
||||
|
color: $grey !important; |
||||
|
} |
||||
|
.text-light-grey{ |
||||
|
color: $light-grey !important; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.text-upper{ |
||||
|
text-transform: uppercase !important; |
||||
|
} |
||||
@ -0,0 +1,66 @@ |
|||||
|
|
||||
|
|
||||
|
input,button{ |
||||
|
border: none; |
||||
|
border-radius: 3px; |
||||
|
margin: 5px 0; |
||||
|
-webkit-appearance: none; |
||||
|
&::-ms-clear { |
||||
|
display: none; |
||||
|
} |
||||
|
&:focus {outline:none;} |
||||
|
&::-moz-focus-inner {border:0;} |
||||
|
} |
||||
|
|
||||
|
input[type=text], |
||||
|
input[type=password]{ |
||||
|
border: 1px solid $grey; |
||||
|
color: $grey; |
||||
|
padding: 5px 20px; |
||||
|
width: 100%; |
||||
|
text-align: left; |
||||
|
box-sizing: border-box; |
||||
|
|
||||
|
&.input-login{ |
||||
|
border: 1px solid $red; |
||||
|
border-radius: 5px; |
||||
|
color: black; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
input[type=button], |
||||
|
input[type=submit], |
||||
|
button, |
||||
|
.button{ |
||||
|
padding: 5px 20px; |
||||
|
margin: 10px; |
||||
|
border-radius: 4px; |
||||
|
cursor: pointer; |
||||
|
text-align: center; |
||||
|
font-size: $font-10; |
||||
|
text-transform: uppercase; |
||||
|
color: white; |
||||
|
|
||||
|
&.big{ |
||||
|
padding: 10px 25px; |
||||
|
} |
||||
|
|
||||
|
&.confirm{ |
||||
|
background: $red; |
||||
|
} |
||||
|
&.discard{ |
||||
|
background: black; |
||||
|
} |
||||
|
&.grey{ |
||||
|
background: $dark-grey; |
||||
|
} |
||||
|
&.dotted{ |
||||
|
background: white; |
||||
|
color: $dark-grey; |
||||
|
border: 2px dotted $dark-grey; |
||||
|
border-radius: 6px; |
||||
|
padding: 5px 15px; |
||||
|
margin: 5px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
@ -0,0 +1,218 @@ |
|||||
|
@charset "UTF-8"; |
||||
|
@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,500,600,700,800,900'); |
||||
|
|
||||
|
@import "variables"; |
||||
|
|
||||
|
@import "../../node_modules/font-awesome/scss/font-awesome"; |
||||
|
|
||||
|
@import "fonts"; |
||||
|
@import "forms"; |
||||
|
|
||||
|
|
||||
|
body{ |
||||
|
font-family: 'Montserrat'; |
||||
|
font-weight: 600; |
||||
|
margin: 0; |
||||
|
padding: 0; |
||||
|
overflow: hidden; |
||||
|
} |
||||
|
|
||||
|
p, |
||||
|
label{ |
||||
|
margin: 0; |
||||
|
} |
||||
|
|
||||
|
a{ |
||||
|
color: white; |
||||
|
text-decoration: none; |
||||
|
transition: .4s; |
||||
|
outline: none; |
||||
|
&:active, |
||||
|
&:visited, |
||||
|
&:hover, |
||||
|
&:focus{ |
||||
|
outline: none; |
||||
|
color: white; |
||||
|
text-decoration: none; |
||||
|
} |
||||
|
&:hover{ |
||||
|
color: $grey; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.content{ |
||||
|
overflow: hidden; |
||||
|
position: fixed; |
||||
|
height: 100vh; |
||||
|
overflow-y: scroll; |
||||
|
width: calc(100vw + 17px); |
||||
|
|
||||
|
.cloud{ |
||||
|
display: none; |
||||
|
position: relative; |
||||
|
width: 70%; |
||||
|
font-size: $font-12; |
||||
|
font-weight: 500; |
||||
|
padding: 10px; |
||||
|
margin: 10px 0; |
||||
|
border-radius: 8px; |
||||
|
line-height: 18px; |
||||
|
color: $dark-grey; |
||||
|
|
||||
|
img{ |
||||
|
width: 100%; |
||||
|
padding: 5px; |
||||
|
cursor: pointer; |
||||
|
} |
||||
|
|
||||
|
&.left{ |
||||
|
left: 15px; |
||||
|
background: $pink; |
||||
|
border: 1px solid $dark-pink; |
||||
|
&:before{ |
||||
|
content: ''; |
||||
|
border: solid 8px transparent; |
||||
|
border-right-color: $dark-pink; |
||||
|
position: absolute; |
||||
|
left: 0; |
||||
|
top: 50%; |
||||
|
transform: translate(-100%, -50%); |
||||
|
} |
||||
|
&:after{ |
||||
|
content: ''; |
||||
|
border: solid 7px transparent; |
||||
|
border-right-color: $pink; |
||||
|
position: absolute; |
||||
|
left: 0; |
||||
|
top: 50%; |
||||
|
transform: translate(-100%, -50%); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
&.right{ |
||||
|
left: calc(30% - 38px); |
||||
|
background: $azure; |
||||
|
border: 1px solid $dark-azure; |
||||
|
&:before{ |
||||
|
content: ''; |
||||
|
border: solid 8px transparent; |
||||
|
border-left-color: $dark-azure; |
||||
|
position: absolute; |
||||
|
right: 0; |
||||
|
top: 50%; |
||||
|
transform: translate(100%, -50%); |
||||
|
} |
||||
|
&:after{ |
||||
|
content: ''; |
||||
|
border: solid 7px transparent; |
||||
|
border-left-color: $azure; |
||||
|
position: absolute; |
||||
|
right: 0; |
||||
|
top: 50%; |
||||
|
transform: translate(100%, -50%); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
&.empty{ |
||||
|
width: 100%; |
||||
|
text-align: center; |
||||
|
padding: 0; |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
|
|
||||
|
&.client{ |
||||
|
top: 50px; |
||||
|
height: calc(100vh - 100px); |
||||
|
.cloud{ |
||||
|
&.right{ |
||||
|
left: calc(30% - 58px); |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
|
|
||||
|
.video{ |
||||
|
display: none; |
||||
|
position: fixed; |
||||
|
top: 0; |
||||
|
left:0; |
||||
|
height: 100vh; |
||||
|
width: 100%; |
||||
|
background: black; |
||||
|
z-index: 10; |
||||
|
.video-close{ |
||||
|
position: absolute; |
||||
|
top: 0; |
||||
|
right: 3px; |
||||
|
height: 20px; |
||||
|
width: 20px; |
||||
|
cursor: pointer; |
||||
|
padding: 0; |
||||
|
z-index: 10; |
||||
|
|
||||
|
&:after{ |
||||
|
content: '\f00d'; |
||||
|
font-family: $icon; |
||||
|
font-size: $font-20; |
||||
|
color: white; |
||||
|
} |
||||
|
} |
||||
|
video{ |
||||
|
height: 100vh; |
||||
|
width: 100%; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.iframeGET{ |
||||
|
display: none; |
||||
|
} |
||||
|
|
||||
|
.header{ |
||||
|
position: fixed; |
||||
|
height: 50px; |
||||
|
width: 100%; |
||||
|
left: 0; |
||||
|
top: 0; |
||||
|
background: black; |
||||
|
|
||||
|
.logo{ |
||||
|
height: 25px; |
||||
|
position: absolute; |
||||
|
left: 50%; |
||||
|
top: 50%; |
||||
|
transform: translate(-50%, -50%); |
||||
|
} |
||||
|
|
||||
|
.menu{ |
||||
|
height: 20px; |
||||
|
position: absolute; |
||||
|
left: 20px; |
||||
|
top: 50%; |
||||
|
transform: translateY(-50%); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.footer{ |
||||
|
position: fixed; |
||||
|
height: 50px; |
||||
|
width: 100%; |
||||
|
left: 0; |
||||
|
bottom: 0; |
||||
|
background: black; |
||||
|
|
||||
|
input{ |
||||
|
width: 95%; |
||||
|
height: 35px; |
||||
|
border-radius: 4px; |
||||
|
border: none; |
||||
|
position: absolute; |
||||
|
left: 50%; |
||||
|
top: 50%; |
||||
|
margin: 0; |
||||
|
transform: translate(-50%, -50%); |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,68 @@ |
|||||
|
#!/bin/bash |
||||
|
|
||||
|
# input folder |
||||
|
src="" |
||||
|
# input file |
||||
|
src+="main.scss" |
||||
|
|
||||
|
# output folders |
||||
|
dest="../css/" |
||||
|
# output filename |
||||
|
dev=$dest"styles.css" |
||||
|
prod=$dest"styles.min.css" |
||||
|
custom=$dest"styles.custom.css" |
||||
|
|
||||
|
#help message |
||||
|
usage=" |
||||
|
Usage:\n |
||||
|
sass.sh [environment|watch-mode] [watch-mode|other-switches]\n\n |
||||
|
Examples:\n |
||||
|
1) watch mode with develop environment presets\n |
||||
|
./sass.sh dev --watch\n |
||||
|
---\n |
||||
|
2) 1 time compiling for production\n |
||||
|
./sass.sh prod\n |
||||
|
---\n\n |
||||
|
to modify input/output paths edit sass.sh\n |
||||
|
" |
||||
|
|
||||
|
# check for output directories |
||||
|
if [[ ! -e $dest ]]; then |
||||
|
mkdir -p $dest |
||||
|
elif [[ ! -d $dest ]]; then |
||||
|
echo "$dest already exists but is not a directory." 1>&2 |
||||
|
fi |
||||
|
|
||||
|
# don't edit below this line |
||||
|
if (( $# == 0 )); then |
||||
|
echo -e $usage |
||||
|
exit |
||||
|
else |
||||
|
case $1 in |
||||
|
--h*|--\? ) |
||||
|
echo -e $usage |
||||
|
exit |
||||
|
;; |
||||
|
"dev" ) |
||||
|
echo "compiling for developement" |
||||
|
sass $2 $src:$dev --line-numbers --sourcemap=none --style expanded ${@:3} |
||||
|
exit |
||||
|
;; |
||||
|
"prod"|"min" ) |
||||
|
echo "compiling for production" |
||||
|
sass $2 $src:$prod --sourcemap=none --style compressed ${@:3} |
||||
|
exit |
||||
|
;; |
||||
|
--w* ) |
||||
|
echo "compiling with given switches in --watch mode" |
||||
|
sass $1 $src:$custom ${@:2} |
||||
|
exit |
||||
|
;; |
||||
|
* ) |
||||
|
echo "compiling with given switches" |
||||
|
sass $src:$custom ${@:1} |
||||
|
exit |
||||
|
;; |
||||
|
esac |
||||
|
echo -e $usage |
||||
|
fi |
||||
@ -0,0 +1,62 @@ |
|||||
|
// Bootstrap Settings |
||||
|
$grid-columns: 12; |
||||
|
$grid-gutter-width: 20px; |
||||
|
|
||||
|
$grid-breakpoints: ( |
||||
|
xs: 0, // Mobile Portrait |
||||
|
sm: 768px, // Tablet Portrait |
||||
|
md: 1024px, // Tablet landscape/Small desktop |
||||
|
lg: 1280px, // Desktop |
||||
|
xl: 1600px, // Large desktop |
||||
|
); |
||||
|
|
||||
|
|
||||
|
$container-max-widths: ( |
||||
|
sm: 708px, |
||||
|
md: 984px, |
||||
|
lg: 1240px, |
||||
|
xl: 1560px |
||||
|
); |
||||
|
|
||||
|
$fa-font-path: '/fonts'; |
||||
|
|
||||
|
$font-8: 0.5rem; /* 8px */ |
||||
|
$font-10: 0.625rem; /* 10px */ |
||||
|
$font-12: 0.75rem; /* 12px */ |
||||
|
$font-13: 0.812rem; /* 13px */ |
||||
|
$font-14: 0.875rem; /* 14px */ |
||||
|
$font-15: 0.937rem; /* 15px */ |
||||
|
$font-16: 1rem; /* 16px */ |
||||
|
$font-18: 1.125rem; /* 18px */ |
||||
|
$font-20: 1.25rem; /* 20px */ |
||||
|
$font-22: 1.375rem; /* 22px */ |
||||
|
$font-24: 1.5rem; /* 24px */ |
||||
|
$font-26: 1.625rem; /* 26px */ |
||||
|
$font-28: 1.75rem; /* 28px */ |
||||
|
$font-30: 1.875rem; /* 30px */ |
||||
|
$font-34: 2.125rem; /* 34px */ |
||||
|
$font-40: 2.5rem; /* 40px */ |
||||
|
$font-45: 2.812rem; /* 45px */ |
||||
|
$font-48: 3rem; /* 48px */ |
||||
|
$font-53: 3.312rem; /* 53px */ |
||||
|
$font-alert: 8rem; /* ?px */ |
||||
|
|
||||
|
$icon: 'FontAwesome'; |
||||
|
|
||||
|
@each $size in 8, 10, 12, 13, 14, 15, 16, 18, 20, 22, 24, 26, 28, 30, 34, 40, 45, 48, 53 { |
||||
|
.font-#{$size} {font-size: #{$size/16}rem !important;} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
$alpha: rgba(255,255,255,0.6); |
||||
|
$green: #4e984a; |
||||
|
$light-green: #71986e; |
||||
|
$red: #bf0f3d; |
||||
|
$grey: #ccc; |
||||
|
$light-grey: #f2f2f2; |
||||
|
$dark-grey: #2f2f2f; |
||||
|
|
||||
|
$pink: #f6e7ea; |
||||
|
$dark-pink: #c8bcbe; |
||||
|
$azure: #d4eeed; |
||||
|
$dark-azure: #b0c8c6; |
||||
@ -0,0 +1,33 @@ |
|||||
|
<!doctype html> |
||||
|
<html lang="en"> |
||||
|
<head> |
||||
|
<title>COZe</title> |
||||
|
<meta charset="UTF-8"> |
||||
|
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'> |
||||
|
<link rel="stylesheet" href="/css/styles.css"> |
||||
|
</head> |
||||
|
<body> |
||||
|
<div class="header"> |
||||
|
<img class="menu" src="/images/menu.png"> |
||||
|
<img class="logo" src="/images/logo.png"> |
||||
|
</div> |
||||
|
|
||||
|
<div class="content client"> |
||||
|
</div> |
||||
|
|
||||
|
|
||||
|
<audio id="notify1"> |
||||
|
<source src="../sounds/message.ogg" type="audio/ogg"> |
||||
|
</audio> |
||||
|
|
||||
|
<script src="https://code.jquery.com/jquery-latest.min.js"></script> |
||||
|
<script src="/socket.io/socket.io.js"></script> |
||||
|
<script src="/smartphone.js"></script> |
||||
|
|
||||
|
<iframe class="iframeGET" src=""></iframe> |
||||
|
<!-- |
||||
|
<div class="footer"> |
||||
|
<input type="text"> |
||||
|
</div>--> |
||||
|
</body> |
||||
|
</html> |
||||
@ -0,0 +1,192 @@ |
|||||
|
$(document).ready(()=>{ |
||||
|
|
||||
|
const socket = io(); |
||||
|
const baseUrl = "http://coze-training.local"; |
||||
|
const serverPath = "http://" + window.location.hostname + ":" + window.location.port + "/";// "http://coze.dev:3000/";
|
||||
|
const canVibrate = "vibrate" in navigator || "mozVibrate" in navigator; |
||||
|
if (canVibrate && !("vibrate" in navigator)){navigator.vibrate = navigator.mozVibrate;} |
||||
|
|
||||
|
const content = $('.content') |
||||
|
|
||||
|
const urlString = window.location.href |
||||
|
const url = new URL(urlString); |
||||
|
const sid = url.searchParams.get("sid"); |
||||
|
|
||||
|
$.getJSON( baseUrl + "/apis/getMessages.php", { |
||||
|
sid: sid |
||||
|
}).done( (data)=> { |
||||
|
console.log(data); |
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
}); |
||||
|
|
||||
|
/* |
||||
|
|
||||
|
socket.on('cloudIndex', showCloud); |
||||
|
socket.on('reset', reset); |
||||
|
socket.on('message', showMessage); |
||||
|
socket.on('response', showResponse); |
||||
|
socket.on('actions', showActions); |
||||
|
socket.on('display', showHtml); |
||||
|
|
||||
|
|
||||
|
|
||||
|
function reset(index){ |
||||
|
cloudCount = 0 |
||||
|
console.log('RESET:', index) |
||||
|
content.empty() |
||||
|
parent.postMessage(cloudCount, "*") |
||||
|
} |
||||
|
|
||||
|
function showCloud(index){ |
||||
|
console.log('RECEIVE:', index); |
||||
|
|
||||
|
const thisCloud = $(clouds.get(index)); |
||||
|
let offset = 0; |
||||
|
|
||||
|
if(!thisCloud.hasClass('empty')){ |
||||
|
notify(true); |
||||
|
} |
||||
|
thisCloud.fadeIn(400,()=>{ |
||||
|
if(thisCloud.hasClass('scroll')){ |
||||
|
offset = thisCloud.offset().top |
||||
|
|
||||
|
content.animate({ |
||||
|
scrollTop: offset |
||||
|
}, 400); |
||||
|
} |
||||
|
}) |
||||
|
|
||||
|
} |
||||
|
|
||||
|
function showMessage(message){ |
||||
|
let newCloud = $('<div class="cloud right">' + decodeURIComponent(message) + '</div>'); |
||||
|
content.append(newCloud); |
||||
|
newCloud.fadeIn(); |
||||
|
content.animate({ |
||||
|
scrollTop: newCloud.offset().top |
||||
|
}, 400); |
||||
|
notify(false); |
||||
|
|
||||
|
cloudCount++ |
||||
|
parent.postMessage(cloudCount, "*") |
||||
|
} |
||||
|
|
||||
|
function showResponse(message){ |
||||
|
let newCloud = $('<div class="cloud left">' + decodeURIComponent(message) + '</div>'); |
||||
|
content.append(newCloud); |
||||
|
newCloud.fadeIn(); |
||||
|
content.animate({ |
||||
|
scrollTop: newCloud.offset().top |
||||
|
}, 400); |
||||
|
notify(true); |
||||
|
} |
||||
|
|
||||
|
function showActions(actions){ |
||||
|
|
||||
|
const actionsArray = decodeURIComponent(actions).split("|"); |
||||
|
let token = ""; |
||||
|
let buttons = ""; |
||||
|
let text = ""; |
||||
|
let side = ""; |
||||
|
|
||||
|
$.each(actionsArray, (index, val)=>{ |
||||
|
if(index==0){ |
||||
|
token = val; |
||||
|
}else{ |
||||
|
buttons += "<button class= \"button dotted\">"+val+"</button>"; |
||||
|
} |
||||
|
}); |
||||
|
|
||||
|
let newCloud = $('<div class="cloud empty">' + buttons + '</div>'); |
||||
|
content.append(newCloud); |
||||
|
newCloud.fadeIn(); |
||||
|
content.animate({ |
||||
|
scrollTop: newCloud.offset().top |
||||
|
}, 400); |
||||
|
|
||||
|
newCloud.find('button').on('click', ()=>{ |
||||
|
$('.iframeGET').attr('src', serverPath + 'control.html?display='+token); |
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
|
||||
|
function showHtml(token){ |
||||
|
|
||||
|
switch(token){ |
||||
|
case "plans_1": |
||||
|
side = "empty"; |
||||
|
text = "<img src=\""+serverPath.replace(":3000", "")+"images/video.png\" class=\"video-opener\">"; |
||||
|
break; |
||||
|
case "pull_1": |
||||
|
side = "left"; |
||||
|
text = "Ricordati di non avvicinarti eccessivamente."; |
||||
|
break; |
||||
|
case "monit_1": |
||||
|
side = "left"; |
||||
|
text = "<b>TEMA 3 COMPETENZE DI VENDITA - REGOLA#1<br><br>"+ |
||||
|
"Non rispondere a domande non fatte</b><br><br>"+ |
||||
|
"Il cliente chiede di un prodotto. È meglio limitarsi a domandare cosa il cliente voglia sapere del prodotto.<br>"+ |
||||
|
"<b>Ad esempio, colore, materiale, taglia.</b>"+ |
||||
|
"<img src=\""+serverPath.replace(":3000", "")+"images/photo-compare2.jpg\" width=\"100%\">"; |
||||
|
break; |
||||
|
} |
||||
|
|
||||
|
if(tokenOnce.indexOf(token) < 0){ |
||||
|
|
||||
|
let newCloud = $('<div class="cloud '+side+'">' + text + '</div>'); |
||||
|
setTimeout( ()=>{ |
||||
|
content.append(newCloud); |
||||
|
newCloud.fadeIn(); |
||||
|
content.animate({ |
||||
|
scrollTop: newCloud.offset().top |
||||
|
}, 400); |
||||
|
|
||||
|
content.find('.video-opener').on('click', (e)=>{ |
||||
|
|
||||
|
const show = $('#video') |
||||
|
const video = show.find('video') |
||||
|
const close = show.find('.video-close') |
||||
|
|
||||
|
show.fadeIn() |
||||
|
video.get(0).play() |
||||
|
|
||||
|
close.on('click', (e)=>{ |
||||
|
const elem = $(e.currentTarget) |
||||
|
const video = elem.siblings('video') |
||||
|
|
||||
|
video.get(0).pause() |
||||
|
elem.parent().fadeOut() |
||||
|
|
||||
|
}) |
||||
|
|
||||
|
}); |
||||
|
|
||||
|
notify(true);; |
||||
|
},1000); |
||||
|
|
||||
|
tokenOnce.push(token); |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
|
|
||||
|
function notify(vibrate){ |
||||
|
|
||||
|
if(vibrate){ |
||||
|
navigator.vibrate(500); |
||||
|
} |
||||
|
|
||||
|
$('#notify1')[0].play(); |
||||
|
} |
||||
|
*/ |
||||
|
|
||||
|
|
||||
|
}); |
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
Binary file not shown.
Binary file not shown.
Loading…
Reference in new issue