forked from saurabh/orbit4-5
calendar widget and frontend fix
This commit is contained in:
parent
5977370c98
commit
2508d70883
|
@ -23,6 +23,13 @@
|
|||
text-align: center;
|
||||
font-size: 0.8125rem;
|
||||
}
|
||||
.loading {
|
||||
&:after {
|
||||
content: '\f1ce';
|
||||
font-family: FontAwesome;
|
||||
animation: 2s linear 0s normal none infinite running fa-spin;
|
||||
}
|
||||
}
|
||||
}
|
||||
.w-calendar-table {
|
||||
margin-bottom: 0;
|
||||
|
@ -34,6 +41,7 @@
|
|||
background: $theme-color-third;
|
||||
color: $theme-white;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.w-calendar-nav {
|
||||
|
@ -47,4 +55,12 @@
|
|||
left: auto;
|
||||
right: 10px;
|
||||
}
|
||||
}
|
||||
@keyframes fa-spin {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
|
@ -1,6 +1,9 @@
|
|||
<div class="w-calendar widget-calendar-1">
|
||||
<div class="w-calendar widget-calendar-1" data-module="calendar">
|
||||
<div class='month_template'>
|
||||
<h4 class="widget-title"></h4>
|
||||
<h4 class="widget-title ">
|
||||
<span class="text"></span>
|
||||
<i class="fa fa-circle-o-notch fa-spin fa-fw loading hide"></i>
|
||||
</h4>
|
||||
<div class="w-calendar-nav">
|
||||
<a href="#" class="w-calendar-nav-prev">
|
||||
<i class="fa fa-chevron-left"></i>
|
||||
|
@ -29,102 +32,27 @@
|
|||
</div>
|
||||
|
||||
<script>
|
||||
if(typeof CalendarModuleMonth == "undefined"){
|
||||
var CalendarModuleMonth = function(month,year,month_template){
|
||||
_this = this;
|
||||
this.monthDom = $("<div data-year='"+year+"' data-month='"+month+"'></div>");
|
||||
var template = month_template,
|
||||
monthNames = ['January','February','March','April','May','June','July','August','September','October','November','December'],
|
||||
firstDay = new Date(year,month,1),
|
||||
lastDay = new Date(year,month+1,0),
|
||||
last_inserted_date = 1;
|
||||
|
||||
var renderMonth = function(){
|
||||
var num_of_rows = getNumberOfRows(year,month)
|
||||
for(var i = 0; i < num_of_rows; i++){
|
||||
var tr = null;
|
||||
if(i == 0){
|
||||
tr = makeRow("first");
|
||||
}else if(i == (num_of_rows - 1)){
|
||||
tr = makeRow("last");
|
||||
}else{
|
||||
tr = makeRow("middle");
|
||||
if(document.getElementById("calendar-widget_module") == null){
|
||||
var tag = document.createElement('script');
|
||||
tag.setAttribute("id", "calendar-widget_module");
|
||||
tag.src = "/assets/calendar_widget.js";
|
||||
tag.onload = function(){
|
||||
$("div[data-module=calendar]").each(function(index){
|
||||
var calendar = $(this),
|
||||
cmi = new CalendarModuleMonth(new Date(), calendar,calendar.data("subpart-id"));
|
||||
cmi.currentMonth();
|
||||
calendar.find("div.w-calendar-nav a").on("click",function(){
|
||||
var el = $(this);
|
||||
if(el.hasClass("w-calendar-nav-prev")){
|
||||
cmi.prevMonth();
|
||||
}else if(el.hasClass("w-calendar-nav-next")){
|
||||
cmi.nextMonth();
|
||||
}
|
||||
if(tr == null){
|
||||
break;
|
||||
}
|
||||
template.find("table.table tbody").append(tr);
|
||||
template.find("h4").text(monthNames[firstDay.getMonth()] + " " + firstDay.getFullYear());
|
||||
}
|
||||
_this.monthDom.append(template);
|
||||
return _this.monthDom;
|
||||
}
|
||||
|
||||
function getNumberOfRows(year, month) {
|
||||
var day = 1,
|
||||
sat_counter = 0,
|
||||
sunday_counter = 0,
|
||||
date = new Date(year, month, day);
|
||||
|
||||
while(date.getMonth() === month) {
|
||||
if(date.getDay() === 0) {
|
||||
sunday_counter++;
|
||||
}else if(date.getDay() === 6) {
|
||||
sat_counter++;
|
||||
}
|
||||
day++;
|
||||
date = new Date(year, month, day);
|
||||
}
|
||||
return (sunday_counter == 5 && sat_counter == 5 ? 6 : 5);
|
||||
}
|
||||
|
||||
var makeRow = function(position){
|
||||
if(last_inserted_date <= lastDay.getDate()){
|
||||
var row = $("<tr></tr>");
|
||||
switch (position){
|
||||
case "first":
|
||||
for(var i = 0;i < 7;i++){
|
||||
var td = $("<td></td>");
|
||||
if(i >= firstDay.getDay()){
|
||||
td.text(last_inserted_date);
|
||||
td.attr("data-date-node",last_inserted_date+"-"+firstDay.getMonth()+"-"+firstDay.getFullYear());
|
||||
last_inserted_date++;
|
||||
}
|
||||
row.append(td);
|
||||
}
|
||||
break;
|
||||
case "middle":
|
||||
for(var i = 0;i < 7;i++){
|
||||
var td = $("<td></td>");
|
||||
td.text(last_inserted_date);
|
||||
td.attr("data-date-node",last_inserted_date+"-"+firstDay.getMonth()+"-"+firstDay.getFullYear());
|
||||
last_inserted_date++;
|
||||
row.append(td);
|
||||
}
|
||||
break;
|
||||
case "last":
|
||||
for(var i = 0;i < 7;i++){
|
||||
var td = $("<td></td>");
|
||||
if(i <= lastDay.getDay()){
|
||||
td.text(last_inserted_date);
|
||||
td.attr("data-date-node",last_inserted_date+"-"+firstDay.getMonth()+"-"+firstDay.getFullYear());
|
||||
last_inserted_date++;
|
||||
}
|
||||
row.append(td);
|
||||
}
|
||||
break;
|
||||
}
|
||||
}else{
|
||||
var row = null;
|
||||
}
|
||||
return row;
|
||||
}
|
||||
return renderMonth();
|
||||
return false;
|
||||
})
|
||||
})
|
||||
}
|
||||
var head = document.getElementsByTagName("head");
|
||||
head[0].appendChild(tag);
|
||||
}
|
||||
|
||||
var date = new Date();
|
||||
|
||||
$(".w-calendar[data-subpart-id={{subpart-id}}]").html(new CalendarModuleMonth(date.getMonth(),date.getFullYear(),$(".w-calendar[data-subpart-id={{subpart-id}}] .month_template")));
|
||||
|
||||
</script>
|
Binary file not shown.
After Width: | Height: | Size: 4.0 KiB |
|
@ -65,10 +65,10 @@
|
|||
<div class="control-group">
|
||||
<label class="control-label muted"><%= @widget_settings['override_category_with'].classify %> List :</label>
|
||||
<div class="controls">
|
||||
<% @custom.each do |c| %>
|
||||
<% @custom.each do |cust| %>
|
||||
<label class="checkbox">
|
||||
<input type="checkbox" <%= @subpart.custom_array_field.include?(c.id.to_s) ? "checked='checked'" : "" rescue nil %> value="<%= c.id.to_s %>" name="page_part[sub_parts_attributes][<%= @select_number %>][custom_array_field][]">
|
||||
<%= c["#{@display_field}"] %>
|
||||
<input type="checkbox" <%= @subpart.custom_array_field.include?(cust.id.to_s) ? "checked='checked'" : "" rescue nil %> value="<%= cust.id.to_s %>" name="page_part[sub_parts_attributes][<%= @select_number %>][custom_array_field][]">
|
||||
<%= cust.send(@display_field) rescue "" %>
|
||||
</label>
|
||||
<% end %>
|
||||
</div>
|
||||
|
|
Loading…
Reference in New Issue