121 lines
4.0 KiB
Plaintext
121 lines
4.0 KiB
Plaintext
include mixins
|
|
doctype html
|
|
html
|
|
include header
|
|
link(href="/stylesheets/bootstrap-datepicker.min.css", rel="stylesheet")
|
|
script(src='/javascripts/bootstrap-datepicker.min.js' )
|
|
script(src='/javascripts/bootstrap-datepicker.de.min.js' )
|
|
script(src='/javascripts/pfiswebsocket.js')
|
|
script(src='/templates/pentrymove_parishday.js')
|
|
script(src='/javascripts/runtime.js')
|
|
link(href="/stylesheets/style_week.css", rel="stylesheet")
|
|
style.
|
|
.cell_element { display: table-cell; }
|
|
.td_new_celebration { padding-top: 10px; }
|
|
.give_margin_left { padding-left: 10px; }
|
|
@media only screen and (max-width: 768px) {
|
|
.cell_element {
|
|
display: block;
|
|
margin-bottom: 15px;
|
|
}
|
|
.td_new_celebration { padding-top: 0px; }
|
|
.give_margin_left { padding-left: 0px; }
|
|
}
|
|
body
|
|
|
|
.root
|
|
|
|
.new_flex_zero
|
|
+nav("PfarrInfoSystem", "dropdown_menu")
|
|
|
|
.container-fluid
|
|
h1 #{pentrytype_pretty} #{clone_or_move_pretty_verb2}
|
|
.small »#{pentryname}«
|
|
.small(style="white-space: nowrap; font-size: 80%;") am #{date.weekday_short}, #{date.day}. #{date.month} #{date.year}</span>
|
|
|
|
.container-fluid
|
|
|
|
p Auf welches Datum soll #{clone_or_move_pretty_verb} werden?
|
|
|
|
form(method="POST", action="/pentry/#{date.date}/#{pentrytype}/#{uuid}/#{clone_or_move}", role="form", id="form-clonemove")
|
|
input(type="hidden", name="pcalview", value="#{pcalview}")
|
|
input(type="hidden", name="new_date", id="new_date", value="#{date.date}")
|
|
|
|
button(class="btn btn-success btn-sm", type="button", onclick="checked_submit()")
|
|
span(class="glyphicon glyphicon-ok", aria-hidden="true")
|
|
span
|
|
span #{clone_or_move_pretty_noun}
|
|
|
|
.alert.alert-danger(style="display: none")
|
|
a(class="close", data-hide="alert") ×
|
|
strong Fehler!
|
|
span
|
|
span Es kann nicht auf den ursprünglichen Tag #{clone_or_move_pretty_verb} werden!
|
|
|
|
//- http://eternicode.github.io/bootstrap-datepicker/
|
|
|
|
|
|
|
|
.new_flex_one(style="margin-top: 15px;", id="scroll_parent")
|
|
.container-fluid
|
|
#datepicker.cell_element(data-date="#{date.date}", style="vertical-align: top;")
|
|
.cell_element.give_margin_left(id="dayinfo", style="width: 100%;")
|
|
|
|
script.
|
|
|
|
// WebSocket setup
|
|
var ws = new PfISWebSocket("#{sessionuuid}");
|
|
ws.bind_standard_close_handler();
|
|
|
|
|
|
ws.bind('get_parishday_result',function(data){
|
|
console.log('got_parishday');
|
|
console.log(data);
|
|
var html = pentrymove_parishday_template({day: data.day } );
|
|
$("#dayinfo").html(html);
|
|
$("#scroll_parent").scrollTop(0);
|
|
});
|
|
|
|
$('#datepicker').datepicker({format: "yyyy-mm-dd", language: "de", calendarWeeks: true, todayHighlight: true});
|
|
$("#datepicker").on("changeDate", function(event) {
|
|
|
|
var d = $("#datepicker").datepicker('getFormattedDate');
|
|
console.log('date: ', d);
|
|
|
|
$("#new_date").val(d);
|
|
|
|
$(".alert").hide();
|
|
|
|
ws.send('get_parishday', { date: d });
|
|
});
|
|
|
|
checked_submit = function(e) {
|
|
var new_date = $("#new_date").val();
|
|
console.log(new_date);
|
|
|
|
if(new_date === "#{date.date}") {
|
|
$(".alert").show();
|
|
return;
|
|
}
|
|
|
|
$("#form-clonemove").submit();
|
|
}
|
|
$(function(){
|
|
ws.send('get_parishday', { date: "#{date.date}" });
|
|
|
|
$("[data-hide]").on("click", function(){
|
|
$("." + $(this).attr("data-hide")).hide();
|
|
/*
|
|
* The snippet above will hide all elements with the class specified in data-hide,
|
|
* i.e: data-hide="alert" will hide all elements with the alert property.
|
|
*
|
|
* Xeon06 provided an alternative solution:
|
|
* $(this).closest("." + $(this).attr("data-hide")).hide();
|
|
* Use this if are using multiple alerts with the same class since it will only find the closest element
|
|
*
|
|
* (From jquery doc: For each element in the set, get the first element that matches the selector by
|
|
* testing the element itself and traversing up through its ancestors in the DOM tree.)
|
|
*/
|
|
});
|
|
});
|