Creating an iCal download link directive and need a little help passing/returning parameters


#1

I’m not overly familiar with directives (i suppose this could be used as a scope function within my controller), however my code is not yet complete as I don’t quite understand how to pass my date/times into the directive and have it return the ical element properly.

Issue 1) How do I create a link that hooks in and passes my data (event_title, start_date, start_time, end_date, end_time) into the directive from my view.

Issue 2) How do I return the value for download as an text/calendar header as noted by the last line which was stripped from my php code.

Test Data that needs to get in:

event_title = "My test event";
start_date = "2014-04-20";
start_time = "5:00 PM";
end_date = "2014-04-21";
end_time = "9:00 AM";

Current work in progress:

.directive('iCalgenerate', function() { 
    var start_date = moment(start_date, "YYYY-MM-DD").format("YYYYMMDD"); //Ymd 20141231
    var start_time; //His 235959
    var end_date = moment(end_date, "YYYY-MM-DD").format("YYYYMMDD"); //Ymd
    var end_time; //His

    if(start_time){
        start_time = moment(start_time, "h:mm A").format("HHmmss");
    }else{
        start_time = "120000";
    }
    if(end_time){
        end_time = moment(end_time, "h:mm A").format("HHmmss");
    }else{
        end_time = "120000";
    }

    //get and format the current time
    var curtime = moment();
    var gm_date = moment(curtime).format("YYYYMMDD");
    var gm_time = moment(curtime).format("HHmmss");

    var icalMSG = "BEGIN:VCALENDAR\r\n"+
    "VERSION:2.0\r\n"+
    "PRODID:-//My Place//NONSGML Events //EN\r\n"+
    "BEGIN:VEVENT\r\n"+
    "DTSTAMP:"+gm_date+'T'+gm_time+"Z\r\n"+
    "DTSTART:"+start_date+"T"+start_time+"Z\r\n"+
    "DTEND:"+end_date+"T"+end_time+"Z\r\n"+
    "SUMMARY:"+event_title+"\r\n"+
    "END:VEVENT\r\n"+
    "END:VCALENDAR";

    //TODO: Fixme to proper return
    //window.open( "data:text/calendar;charset=utf8," + escape(icalMSG));
})

#2

Directives are defined like this generally:

.directive('iCalGenerate', function() {

	return {

		restrict : 'A', 
		scope : {
			event : '='
		},

		template : '<div>Some stuff here</div>',

		link : function(scope, elem, attrs) {

		}

	};


});

The Egghead.io videos from 10 to 21 would explain this really well. https://egghead.io/lessons/angularjs-first-directive