From some days I am working in html full calender, my default view is week view, I want to copy one week events into next week by click in html button. I got event array by below mention code but I am not getting, how should I copy this events into next week, I have googled but didn't get any thing regarding this. Please help to resolve this Thanks in advance.
$('#btn_copy_calendar_next_week').click(function () {
$('#calendar').fullCalendar('next');
events = $('#calendar').fullCalendar('clientEvents');
console.log(events);
});
I got solution of my own problem after very long time, it works for me I hope this will help other too, whoever need it.
$('#btn_copy_calendar_next_week').click(function () {
all_events = $('#calendar').fullCalendar('clientEvents');
var current_view = $('#calendar').fullCalendar('getView');
var start_date=current_view.start;
var end_date=current_view.end;
var event_obj = new Object();
var check_current_week_event=false;
all_events.forEach(function(evnt) {
if (evnt['start'].format() >= start_date.format() && evnt['end'].format() <= end_date.format()){
--l;
check_current_week_event=true;
D1=evnt['start']._d;
console.log(D1);
D2=evnt['end']._d;
var X1=D1.format("yyyy-mm-dd'T'HH:MM:ss'Z'");
var X2=D2.format("yyyy-mm-dd'T'HH:MM:ss'Z'");
var XD1=new Date(X1);
var XD2=new Date(X2);
XD1.setUTCDate(XD1.getUTCDate() + 7);
XD2.setUTCDate(XD2.getUTCDate() + 7);
var str_d1 = convertLocalDateToUTCDate(XD1,true);
var str_d2 =convertLocalDateToUTCDate(XD2,true);
var mb_test1 = convertLocalDateToUTCDate(str_d1,true);
var mb_test2 = convertLocalDateToUTCDate(str_d2,true);
event_obj.id='vkm_test'+l;
event_obj.title=evnt['title'];
event_obj.start= mb_test1.format("yyyy-mm-dd'T'HH:MM:ss'Z'");
event_obj.end= mb_test2.format("yyyy-mm-dd'T'HH:MM:ss'Z'");
event_obj.allDay = false;
event_obj.offer_id=evnt['offer_id'];
console.log('=========================');
customData = {
'event_id':"chunked-test"+l,
'offer_id':event_obj.offer_id,
'title': event_obj.title,
'start':event_obj.start,
'end':event_obj.end,
'rest_id':{{restaurant.restaurant_id}}
};
console.log(event_obj.start);
console.log(event_obj.end);
// $('#calendar').fullCalendar( 'renderEvent',event_obj);
$("#calendar").fullCalendar( "removeEvents", "chunked-helper");
$("#calendar").fullCalendar( "addEventSource",chunk_test(event_obj,'test'+l));
offers_list.push(customData);
}
});
if(check_current_week_event==true){
$('#calendar').fullCalendar('next');}
else{
$('#hd_id').text('DealMonk');
$('#txt_error_msg').text('There is Nothing to Copy in Next Week!');
$('#error_msg').modal('show');
}
});
Happy Coding..
Related
I use fullcalendar js jquery plugin which is a great plugin but I have a small question do you know how:
I have a list of events which always not overlap.
Then sometimes I need to resize an event to be 1 or 2 hours much longer. The real step is here I try to make the next event to be not overlap but to move according to the resized end event. I have tried with event overlap custom function but it doesn't really work. There is always a gap of minutes between the two events.
I will send you a fiddle tomorrow to show you where I am.
/EDIT/
Just Create this Codepen :
http://codepen.io/cchumi/pen/pEGLXd
Javascript example for overlap :
eventOverlap: function(stillEvent, movingEvent) {
//Update MovingEvent
$('#calendar').fullCalendar('updateEvent', movingEvent);
//swap stillEvent time with movingEvent
stillEvent.end = stillEvent.end;
stillEvent.start = movingEvent.end;
//Update stillEvent
$('#calendar').fullCalendar('updateEvent', stillEvent);
//return true to allow swap.
return true;
}
it's been a while since your post but I think that I got a solution for you, I was looking your code and understood that, at the moment that the events overlaps the eventoverlap function is triggered, so I just add an event listener .mouseup() before your code to stop the trigger of your code until you release the click of the mouse. Now it works perfectly.
Now your code has to look like this:
eventOverlap: function(stillEvent, movingEvent) {
$('#calendar').mouseup(function() {
var movingEventEnd = moment(movingEvent.end).utc().format();
//"YYYY-MM-DDTHH:mm:ss"
var StillStart = moment(stillEvent.start).utc().format();
var StillEnd = moment(stillEvent.end).utc().format();
var duration = moment.duration(moment(StillEnd).diff(moment(StillStart)));
var hoursbaseStillEvent = duration.asHours();
console.log("Still Hours Base " + hoursbaseStillEvent);
$('#calendar').fullCalendar('updateEvent', movingEvent);
var movingEventNewEnd = moment(movingEvent.end).utc().format();
var durationMovingEvent =
moment.duration(moment(movingEventNewEnd).diff(moment(movingEventEnd)));
var hoursMovingEvent = durationMovingEvent.asHours();
console.log("hourss " + hoursMovingEvent);
stillEvent.start = moment(movingEvent.end).utc().format();
var StillEventStart = moment(stillEvent.start).utc().format();
console.log("StillEventStart " + StillEventStart);
var StillEventEnd = moment(stillEvent.end).utc().format();
var Startdate = moment(StillEventStart).utc().format();
console.log("Startdate " + moment(Startdate).utc().format());
var Enddate = moment(StillEventEnd);
var StillEventEndNew = moment(Startdate).add(hoursbaseStillEvent, 'hours');
console.log("StillEventEndNew " + moment(StillEventEndNew).utc().format());
stillEvent.end = moment(StillEventEndNew).utc().format();
$('#calendar').fullCalendar('updateEvent', stillEvent);
});
return true;
//return stillEvent.allDay && movingEvent.allDay;
},
I enter to browser this link
https://google.com.vn;
Google redirect to https://www.google.com.vn;
I want alert full url redirect.
I used this code:
processNewURL: function(aURI) {
var tabIndex = gBrowser.tabContainer.selectedIndex;
var referredFromURI = gBrowser.tabContainer.childNodes[tabIndex].linkedBrowser.webNavigation.referringURI.spec;
alert(referredFromURI);
},
But it always alert https://www.google.com.vn,
and I tested with some short link example bit.ly/R9j52J . It isn't ok.
Please help me.
this works, i also show 2 methods to get to webNavigation. the second method is just longed winded way to teach other stuff, recommended way is method 1.
var processNewURL = function(e) {
console.log('e:', e);
var win = e.originalTarget.defaultView;
//start - method 1 to get to webNav:
var webNav = win.QueryInterface(Ci.nsIInterfaceRequestor)
.getInterface(Ci.nsIWebNavigation);
var referredFromURI = webNav.referringURI;
//end - method 1
//start - method 2 long winded way:
/*
var domWin = win.QueryInterface(Ci.nsIInterfaceRequestor)
.getInterface(Ci.nsIWebNavigation)
.QueryInterface(Ci.nsIDocShellTreeItem)
.rootTreeItem
.QueryInterface(Ci.nsIInterfaceRequestor)
.getInterface(Ci.nsIDOMWindow);
var tab = domWin.gBrowser._getTabForContentWindow(win);
//console.log('tab:', tab);
var referredFromURI = tab.linkedBrowser.webNavigation.referringURI;
*/
//end - method 2
if (referredFromURI != null) {
win.alert('referred from:' + referredFromURI.spec);
} else {
win.alert('not redirected');
}
}
gBrowser.addEventListener('DOMContentLoaded', processNewURL, false);
I have been using the Google API to get JSON data from my Blogger account and display and format blog posts on my own webiste.
It was working perfectly for weeks, and then suddenly, as of yesterday, the content stops displaying. The title, update (the date the post was updated), and the id, all come back just as they always have. Only the content stopped coming back.
I haven't changed the code in any way since first implementing it, and I looked for documentation to see if the API had changed, but didn't come across anything. So I am completely stumped as to why this one aspect of the code would suddenly stop working.
This is pretty much the entire Javascript that I use to get the JSON data. Is there something wroing with it?
function init() {
// Get your API key from http://code.google.com/apis/console
gapi.client.setApiKey('xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx');
// Load the Blogger JSON API
gapi.client.load('blogger', 'v3', function() {
// Load the list of posts for code.blogger.com
var request = gapi.client.blogger.posts.list({
'blogId': 'xxxxxxxxxxxxxxxxxxx',
'fields': 'items(content,title,updated,id)'
});
request.execute(function(response) {
var blogger = document.getElementById("blogger");
var anchor = 0;
for (var i = 0; i < response.items.length; i++)
{
var bloggerDiv = document.createElement("div");
bloggerDiv.id = "blogger-" + i;
bloggerDiv.className = "bloggerItem";
$(bloggerDiv).append("<h2>" + response.items[i].title + "</h2>");
var date = response.items[i].updated;
date = date.replace("T", " ");
date = date.replace("+09:00", "");
var printDate = new moment(date);
$(bloggerDiv).append("<p><span class='byline'>" + printDate.format('dddd, MMMM Do YYYY, h:mm:ss a') + "</span></p>");
$(bloggerDiv).append(response.items[i].content)
bloggerAnchor = document.createElement("a");
bloggerAnchor.name = "blogger-" + response.items[i].id;
blogger.appendChild(bloggerAnchor);
blogger.appendChild(bloggerDiv);
anchor = anchor + 1;
}
// find out which anchor the user wanted...
var hashVal = window.location.hash.substr(1);
// ... then jump to that position:
location.hash = "#" + hashVal;
});
});
}
Now fetchBodies defaults is false instead of true. For this reason you need to add param fetchBodies=true.
I downloaded: http://arshaw.com/fullcalendar/
Does somebody know how i can disable the prev button, so you can only see the current month and how i can limit the next button, so you can only see one next month?
I put this in the head:
$(document).ready(function() {
var date = new Date();
var d = date.setDate();
var m = date.setMonth();
var y = date.setFullYear();
$('#calendar').fullCalendar({
editable: true,
events: [
{
You can disable the prev/next button by just adding 'fc-state-disabled' class.
e.g.
//disballing prev button
$(".fc-button-prev").addClass('fc-state-disabled');
Also if you just want to allow to show only next month on clicking on next button then add following code.
function checkNext(e) {
if (isNextallowed == true) {
isNextallowed = false;
return true;
} else {
$(".fc-button-next").addClass('fc-state-disabled');
e.preventDefault();
return false;
}
}
$(".fc-button-next").on("click", checkNext);
$(".fc-button-next .fc-text-arrow").on("click", checkNext)
Checkout this Demo Fiddle
try -
$('#calendar').fullCalendar({
editable: true,
header : {
left : 'next today'
}
});
You can also refer to the documentation of the fullCalendar API to get more insight into how it works and other possible options. Refer - Full Calendar from Adam Arshaw
Here's my simple solution.
Place this code in the renderView function (around line 368 in version 1.5.4)) before ignoreWindowResize--; near the end of the function.
var lammCurrentDate = new Date();
var lammMinDate = new Date( lammCurrentDate.getFullYear(), lammCurrentDate.getMonth(), 1, 0, 0, 0, 0);
if (currentView.start <= lammMinDate){
header.disableButton('prev');
} else {
header.enableButton('prev');
}
I have been using this script ( http://www.dynamicdrive.com/dynamicindex6/dhtmlcount.htm ) for countdown to vacations. But this time i need to have 2 countdowns on ONE page. I tried having 2 different pages with one script in each and include them to the main page, but that did not work.
Anyone know how to edit it or have a script that works for this purpose? I tried editing some of the variables but I were unable to get it to work.
Thanks.
I have cooked up a simple countdown Constructor which may help you further.
function countDown(startTime, divid, the_event){
var tdiv = document.getElementById(divid)
,start = parseInt(startTime.getTime(),10)
,the_event = the_event || startTime.toLocaleString()
,to;
this.rewriteCounter = function(){
var now = new Date().getTime()
,diff = Math.round((start - now)/1000);
if (startTime > now)
{
tdiv.innerHTML = diff +' seconds untill ' + the_event;
}
else {clearInterval(to);}
};
this.rewriteCounter();
to = setInterval(this.rewriteCounter,1000);
}
//usage
var count1 = new countDown(new Date('2010/12/11 10:44:59')
,'counter1'
,'tomorrow 10:45');
var count2 = new countDown(new Date('2010/12/25')
,'counter2'
,'first christmas day');
Check it out #jsfiddle