Ok, this might be tricky to explain without looking like insane person.
I was successful implementing jQuery Datepicker with wordpress so Event_post_types were picked up and the proper days were highlighted on the datepicker widget. And also each date corresponding to an event on the datepicker was a link which was going to that even't page.
But then project got more complicated and I had to move all my custom posts to Event Espresso plugin. So far I was able to recreate everything except the linking with event page part which gives me more and more headache. Any suggestions about improvement will be appreciated - especially that I know that my solution might be really ugly and not very good.
So i've got my variables
var disabledDays = new Array();
var tips = new Array();
var hrefs = new Array();
Then loop through all my events and placement of dates, links and some title on hover
<?php global $post, $wp_query;
// define some arguments for our Event Espresso query
$args = array(
'post_type' => 'espresso_event',
'meta_key' => 'event_start_date',
'meta_query' => array(
array(
'key' => 'event_start_date',
'value' => date('Y-m-d'),
'compare' => '>=', // compares the event_start_date against today's date so we only display events that haven't happened yet
'type' => 'DATE'
)
),
orderby' => 'meta_value',
'order' => 'ASC' // change this to ASC if you want newer events on top
);
// this saves the query to a temporary location so we can go back to it later after we run our query
$temp = $wp_query;
$wp_query = null;
$wp_query = new WP_Query($args);
// now run the loop
while ( $wp_query->have_posts() ) : $wp_query->the_post(); ?>
<?php
$event_id = get_post_meta($post->ID, 'event_id', true);
$event_date = do_shortcode('[EVENT_TIME event_id="'.$event_id.'" type="start_date" format="Y-n-j"]');
$permalink = get_permalink();
?>
<script>
disabledDays.push('<?php echo $event_date; ?>');
tips.push('<?php echo get_the_title(); ?>');
hrefs.push('<?php echo get_the_permalink(); ?>');
</script>
<?php
endwhile;
$wp_query = null;
$wp_query = $temp; // put the old query back where we left it
?>
And finally the datepicker code in the footer
jQuery("#dates").datepicker({
showButtonPanel: false,
firstDay: 1,
dateFormat: 'yy-mm-dd',
beforeShowDay: function (date) {
var m = date.getMonth(),
d = date.getDate(),
y = date.getFullYear();
for (var i = 0; i < disabledDays.length; i++) {
if (jQuery.inArray(y + '-' + (m + 1) + '-' + d, disabledDays) != -1) {
return [true, 'highlight', tips[disabledDays.indexOf(y + '-' + (m + 1) + '-' + d)]];
}
}
return [true];
},
onSelect: function(dateText, inst) {
var date = new Date(dateText.slice(4)),
m = date.getMonth(),
d = date.getDate(),
y = date.getFullYear();
if ($.inArray(y + '-' + (m + 1) + '-' + d, disabledDays) != -1) {
window.location = hrefs[disabledDays.indexOf((y + '-' + (m + 1) + '-' + d))];
}
}
});
Sooo, everything still works great, dates are getting highlighted on the datepicker, titles are displaying on hover, just this links are not working at all...
Any suggestions?
Thanks