Skip to content

Instantly share code, notes, and snippets.

@vsdsantos

vsdsantos/agendamento.html

Last active August 29, 2015 14:27
Show Gist options
  • Save vsdsantos/23c04cb60aa7666d30e9 to your computer and use it in GitHub Desktop.
Save vsdsantos/23c04cb60aa7666d30e9 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
agendamento.html
<!DOCTYPE html>
<html>
<head>
<title>Thelgrains</title>
<meta name="csrf-param" content="authenticity_token" />
<meta name="csrf-token" content="kv4n+ruYwiO3X17NJhA1iScg0vQ8Tn0LXlK77y4Hp3Bn7K3T4SuYybiJv6JEzE9sIstBtunuyjXc/Na+ca6lWg==" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Carregar possíveis fontes -->
<!-- "Como é que baixa CSS?" É assim ó ... -->
<link rel="stylesheet" type="text/css" href="/css/bootstrap.css" />
<link rel="stylesheet" type="text/css" href="/css/bootstrap-responsive.css" />
<link rel="stylesheet" type="text/css" href="/css/style.css" />
<link rel="stylesheet" type="text/css" href="/css/mainzao.css" />
<link rel="stylesheet" type="text/css" href="/css/jquery.cslider.css" />
<link rel="stylesheet" type="text/css" href="/css/jquery.bxslider.css" />
<link rel="stylesheet" type="text/css" href="/css/animate.css" />
<link rel="stylesheet" type="text/css" href="/css/demo.css" />
<!-- Ícones da página -->
<link rel="eva-icone-precomposed" sizes="144x144" href="/images/ico/eva-icone-144.png">
<link rel="eva-icone-precomposed" sizes="114x114" href="/images/ico/eva-icone-114.png">
<link rel="eva-icone-precomposed" sizes="72x72" href="/images/eva-icone-72.png">
<link rel="eva-icone-precomposed" href="/images/ico/eva-icone-57.png">
<link rel="shortcut icon" href="/images/ico/favicon.ico">
<!-- "Import nos JS ... -->
<script src="/assets/jquery.self-d03a5518f45df77341bdbe6201ba3bfa547ebba8ed64f0ea56bfa5f96ea7c074.js?body=1"></script>
<script src="/assets/moment.self-7c169710367e715cec0e7768bb92b9339f5a767a109041e9e9861a0abc0afa44.js?body=1"></script>
<script src="/assets/fullcalendar.self-8668c2e6be32331fb05b9c8cb047adeb64ae3d0575ba9d2f029b9a4cb37ec3f5.js?body=1"></script>
<script src="/assets/application.self-90aa46197f4490e7c2461c366562e042e156bf50bfcf6852e4941ee28609c220.js?body=1"></script>
<script type="text/javascript" src="/js/cpfvall.js"></script>
<!-- <script type="text/javascript" src="/js/jquery-1.10.2.min.js"></script> -->
<script src="/js/script.js"></script>
<link rel="stylesheet" media="screen" href="/assets/web/agendamentos/fullcalendar.print.self-874a0f3f2b6e5ae06473c8d43104076dde0aca8a85f40f3919956ac7d9cb85bb.css?body=1" />
<link rel="stylesheet" media="screen" href="/assets/web/agendamentos/stylecalendar.self-858844b125b2a2dca11980150a9a839b5b349fb7dbdcf347d1d5d6908fcc38e8.css?body=1" />
<script src="/assets/web/agendamentos/controladorCalendar.self-330b2a04d8b6e1ad5fd7e3bde3c57a028b13940c89691f45e38ae63b07546a15.js?body=1"></script>
<script src="/assets/web/agendamentos/pt.self-2476da2a8c9d34c025d5da511802703e9de3f8622bf57be2e3fd2d73e3c31813.js?body=1"></script>
<div class="navbar">
<div class="navbar-inner">
<div class="container">
<a href="/" class="brand">
<img src="images/logo.png" width="140" height="60" alt="Logo" /> <center>ÁREA DE SERVIÇO</center>
<!-- Logo EVA HAIR FASHION -->
</a>
<!-- Barra de navegação -->
<button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<i class="icon-menu"></i>
</button>
<!-- Menu principal -->
<div class="nav-collapse collapse pull-right">
<ul class="nav" id="top-navigation">
<li class="active"><a href="/home">Home</a></li>
<li class=""><a href="/caixa">Caixa</a></li>
<li class=""><a href="/agendamentos">Agendamentos</a></li>
<li class=""><a href="/atendimentos">Atendimentos</a></li>
<li><a href="/admin/login">Administração</a></li>
<li><a href="/logout">Logout</a></li>
</ul>
</div>
<!-- Fim do Menu principal -->
</div>
</div>
</div>
</head>
<body id="backss">
<img src="/images/RoxoBack.png" class="bg">
<div id="container">
<div id='wrap'>
<div id='external-events'>
<h4>Arraste para agendar</h4>
<div class='fc-event'>Serviço</div>
</div>
<br><br><br><br><br>
<div id='calendar'></div>
<div style='clear:both'></div>
</div>
</div>
<!-- INÍCIO DO FOOTER -->
<div class="footer2">
<p>&copy; 2015 Thelgrains Project</p>
</div>
<!-- FIM DO FOOTER -->
</body>
</html>
Raw
controladorCalendar.js
$(document).ready(function() {
var zone = "03:30";
var currentMousePos = {
x: -1,
y: -1
};
jQuery(document).on("mousemove", function (event) {
currentMousePos.x = event.pageX;
currentMousePos.y = event.pageY;
});
$('#external-events .fc-event').each(function() {
// store data so the calendar knows to render an event upon drop
$(this).data('event', {
title: $.trim($(this).text()), // use the element's text as the event title
stick: true // maintain when user navigates (see docs on the renderEvent method)
});
// make the event draggable using jQuery UI
$(this).draggable({
zIndex: 999,
revert: true, // will cause the event to go back to its
revertDuration: 0 // original position after the drag
});
});
$('#calendar').fullCalendar({
events: '/feed.json',
utc: true,
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
editable: true,
droppable: true,
eventLimit: true,
//selectable: true,
//selectHelper: true,
slotDuration: '00:15:00',
eventReceive: function(event){
var title2 = event.title;
var start2 = event.start.format("YYYY-MM-DD[T]HH:MM:SS");
var startzone = start2;
var enviar = "{"+'"'+"event"+'"'+":"+JSON.stringify({title:""+title2,start_time:""+startzone,end_time:""+startzone,all_day:"false",user_id:'1'})+"}";
console.log(enviar);
$.ajax({
url: '/feed.json',
data: enviar,
type: 'POST',
contentType: 'application/json;',
dataType: 'json',
success: function(response){
event.id = response.eventid;
$('#calendar').fullCalendar('updateEvent',event);
},
error: function(xhr, textStatus, error){
console.log(xhr.statusText);
console.log(textStatus);
console.log(error);
}
});
$('#calendar').fullCalendar('updateEvent',event);
console.log(event);
},
eventClick: function(event, jsEvent, view) {
console.log(event.id);
var title2 = prompt('Nome do agendamento:', event.title, { buttons: { Ok: true, Cancel: false} });
var enviar = "{"+'"'+"event"+'"'+":"+JSON.stringify({title:""+title2})+"}";
if (title2){
event.title = title2;
$.ajax({
url: '/feed/'+event.id+'.json',
data: enviar,
type: 'PUT',
contentType: 'application/json;',
dataType: 'json',
success: function(response){
$('#calendar').fullCalendar('updateEvent',event);
},
error: function(xhr, textStatus, error){
console.log(xhr.statusText);
console.log(textStatus);
console.log(error);
}
});
}
},
eventResize: function(event, delta, revertFunc) {
var title2 = event.title;
var start2 = event.start.format();
var end2 = (event.end == null) ? start : event.end.format();
var startzone = start2+zone;
var endzone = end2+zone;
var enviar = "{"+'"'+"event"+'"'+":"+JSON.stringify({start_time:""+startzone,end_time:""+endzone,all_day:"false"})+"}";
$.ajax({
url: '/feed/'+event.id+'.json',
data: enviar,
type: 'PUT',
contentType: 'application/json;',
dataType: 'json',
success: function(response){
$('#calendar').fullCalendar('updateEvent',event);
},
error: function(xhr, textStatus, error){
console.log(xhr.statusText);
console.log(textStatus);
console.log(error);
}
});
},
eventDragStop: function (event, jsEvent, ui, view) {
if (isElemOverDiv()) {
$.ajax({
url: '/feed/'+event.id+'.json',
type: 'DELETE',
contentType: 'application/json;',
dataType: 'json',
success: function(response){
console.log(response);
$('#calendar').fullCalendar('removeEvents');
getFreshEvents();
},
error: function(xhr, textStatus, error){
console.log(xhr.statusText);
console.log(textStatus);
console.log(error);
}
});
}
}
});
function getFreshEvents(){
$('#calendar').fullCalendar('addEventSource','/feed.json');
}
function isElemOverDiv() {
var trashEl = jQuery('#calendar');
var ofs = trashEl.offset();
var x1 = ofs.left;
var x2 = ofs.left + trashEl.outerWidth(true);
var y1 = ofs.top;
var y2 = ofs.top + trashEl.outerHeight(true);
if (currentMousePos.x <= x1 || currentMousePos.x >= x2 &&
currentMousePos.y <= y1 || currentMousePos.y >= y2) {
return true;
}
return false;
}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment