Go to main content

Textpattern CMS support forum

You are not logged in. Register | Login | Help

#853 2014-12-16 11:19:08

Bloke
Developer
From: Leeds, UK
Registered: 2006-01-29
Posts: 11,250
Website GitHub

Re: smd_calendar: complete schedule / event / calendar / diary

Gallex wrote #286614:

can anybody provide me this little jquery code?

Certainly. Code is below. Assumptions are:

  • You have a recent jQuery loaded on the page.
  • You have a div surrounding your calendar called myCalendar.
  • You haven’t changed any of the calendar attributes which manage the navigation aspects (e.g. class names, etc).

Put the following code anywhere on your page after jQuery has loaded, except inside your calendar div:

<script>
$(function() {
   $('#myCalendar').on('click', '.smd_cal_navnext, .smd_cal_navprev', function(ev) {
      ev.preventDefault();
      $('#myCalendar').load($(this).attr('href') + ' #myCalendar table');
   });
});
</script>

That will simply:

  • Intercept any clicks to the calendar’s nav elements.
  • Prevent the default click action from firing.
  • Call jQuery’s .load() method using the URL of the nav element (the current page + calendar params), passing it the div from which you want to load the content. When fetched, the content is scanned for the calendar block myCalendar, the HTML is extracted and injected into the div on the page that houses the calendar. In this case they’re both the same div, hence the duplication of #myCalendar in the call to .load().

Note it won’t intercept any month/year <select> tags if you have those in your calendar. That’s a fair bit more involved.

Hope that helps.

EDIT: better filter. See here.

Last edited by Bloke (2014-12-16 13:28:35)


The smd plugin menagerie — for when you need one more gribble of power from Textpattern. Bleeding-edge code available on GitHub.

Txp Builders – finely-crafted code, design and Txp

Offline

#854 2014-12-16 12:47:56

Gallex
Member
Registered: 2006-10-08
Posts: 1,289

Re: smd_calendar: complete schedule / event / calendar / diary

absolutly brilliant, bloke!! thank you!
you can see it in the action here

Last edited by Gallex (2014-12-16 12:48:45)

Offline

#855 2014-12-16 13:27:20

Bloke
Developer
From: Leeds, UK
Registered: 2006-01-29
Posts: 11,250
Website GitHub

Re: smd_calendar: complete schedule / event / calendar / diary

Gallex wrote #286630:

absolutly brilliant, bloke!! thank you!

No problem. Glad it worked. One thing I just spotted is that jQuery is pulling the full content including the div and injecting it inside the div on the page. That means after the first nav click you get two div containers with the same ID on the page. To combat this, you should alter the .load() call like this:

$('#myCalendar').load($(this).attr('href') + ' #myCalendar table');

By asking it to go and fetch the myCalendar id and then find the table inside, you only get the table returned to you, which is then injected inside the myCalendar div on the page.

Sorry about the mix-up. I’ll amend the post above.


The smd plugin menagerie — for when you need one more gribble of power from Textpattern. Bleeding-edge code available on GitHub.

Txp Builders – finely-crafted code, design and Txp

Offline

#856 2014-12-16 14:08:32

Gallex
Member
Registered: 2006-10-08
Posts: 1,289

Re: smd_calendar: complete schedule / event / calendar / diary

yeah, i noticed that too, but now – no more duplicated div’s.

ps. maybe you should put this (my issue) into the plugin? ;) possible?

Offline

#857 2014-12-16 14:37:12

Bloke
Developer
From: Leeds, UK
Registered: 2006-01-29
Posts: 11,250
Website GitHub

Re: smd_calendar: complete schedule / event / calendar / diary

Gallex wrote #286634:

maybe you should put this (my issue) into the plugin? ;) possible?

The main reason I’ve not done it, is because there are a zillion attributes already which weigh the plugin down. So adding more attributes to try and second-guess how people will use the plugin makes it quite tricky to build a universal AJAX system. For example:

  • What container name / id is in use. This is easy if the wraptag / html_id attributes are used, but if you do it outside the calendar plugin, it’s more difficult.
  • Whether you’re going to put more than one calendar per page.
  • Whether you’re going to use select lists for month/year.
  • Whether you’ve reconfigured the classes or manually built header content.
  • Whether you want article content in date cells to also popup without page refresh.

You can see the predicament. That’s why, for the sake of a few lines of jQuery, it’s currently up to site admins to implement any extras like this.

I would like to be able to make it easier for building this kind of thing with the plugin, but I don’t know how it can be done flexibly enough to cover most likely scenarios.


The smd plugin menagerie — for when you need one more gribble of power from Textpattern. Bleeding-edge code available on GitHub.

Txp Builders – finely-crafted code, design and Txp

Offline

#858 2015-02-28 21:54:40

MattD
Plugin Author
From: Monterey, California
Registered: 2008-03-21
Posts: 1,254
Website

Re: smd_calendar: complete schedule / event / calendar / diary

It seems when I click a date the url doesn’t include the m and y attributes, making the calendar go back to the current date, even if I add m and y to the maintain value. Is there another way to make the calendar stay where it was when clicked?


My Plugins

Piwik Dashboard, Google Analytics Dashboard, Minibar, Article Image Colorpicker, Admin Datepicker, Admin Google Map, Admin Colorpicker

Offline

#859 2015-03-01 08:55:27

Bloke
Developer
From: Leeds, UK
Registered: 2006-01-29
Posts: 11,250
Website GitHub

Re: smd_calendar: complete schedule / event / calendar / diary

MattD wrote #288661:

Is there another way to make the calendar stay where it was when clicked?

Yes. The maintain attribute is only for when navigating the calendar using the next/prev month links. To add date portions to your URL you need to alter your event anchor to include them, a bit like this:

<txp:smd_calendar section="events">
   <a href="?y=<txp:smd_cal_info type="year" />&m=<txp:smd_cal_info type="month" />"><txp:title /></a>
</txp:smd_calendar>

The smd plugin menagerie — for when you need one more gribble of power from Textpattern. Bleeding-edge code available on GitHub.

Txp Builders – finely-crafted code, design and Txp

Offline

#860 2015-03-01 18:06:33

MattD
Plugin Author
From: Monterey, California
Registered: 2008-03-21
Posts: 1,254
Website

Re: smd_calendar: complete schedule / event / calendar / diary

Bloke wrote #288664:

Yes. The maintain attribute is only for when navigating the calendar using the next/prev month links. To add date portions to your URL you need to alter your event anchor to include them, a bit like this:

<txp:smd_calendar section="events">...

My issue is with the small calendar.

<txp:smd_calendar size="small" section="events" emptyclass="cal-emtpy" maintain="section,date,m,y"/>

My Plugins

Piwik Dashboard, Google Analytics Dashboard, Minibar, Article Image Colorpicker, Admin Datepicker, Admin Google Map, Admin Colorpicker

Offline

#861 2015-03-01 21:06:47

Bloke
Developer
From: Leeds, UK
Registered: 2006-01-29
Posts: 11,250
Website GitHub

Re: smd_calendar: complete schedule / event / calendar / diary

MattD wrote #288673:

My issue is with the small calendar.

Then you’ll need to emulate/fake the behaviour of the small calendar using the full-size one. The minical is quite limited in what it can do — it’s just a throwback to this plugin’s roots in mdp_calendar.

There are a few examples dotted around the forum of making a faux minical (that’s one such example, though it’s not complete).


The smd plugin menagerie — for when you need one more gribble of power from Textpattern. Bleeding-edge code available on GitHub.

Txp Builders – finely-crafted code, design and Txp

Offline

#862 2015-03-04 19:06:46

MattD
Plugin Author
From: Monterey, California
Registered: 2008-03-21
Posts: 1,254
Website

Re: smd_calendar: complete schedule / event / calendar / diary

Sorry to bother but I’m banging my head. How do I get <txp:smd_article_event /> to display a list of events for a specific day, including recurring events?


My Plugins

Piwik Dashboard, Google Analytics Dashboard, Minibar, Article Image Colorpicker, Admin Datepicker, Admin Google Map, Admin Colorpicker

Offline

#863 2015-03-05 23:43:21

Bloke
Developer
From: Leeds, UK
Registered: 2006-01-29
Posts: 11,250
Website GitHub

Re: smd_calendar: complete schedule / event / calendar / diary

MattD wrote #288753:

How do I get <txp:smd_article_event /> to display a list of events for a specific day, including recurring events?

In theory, for today:

<txp:smd_article_event stepfield="custom_N" time="today">
   <txp:permlink><txp:title /></txp:permlink>
</txp:smd_article_event>

Where N is the custom field number that contains your recurring event definitions.

For specific days, you swap out time="today" for:

from='<txp:smd_cal_now now="yyyy-mm-dd 00:00:00" />'
to='<txp:smd_cal_now now="yyyy-mm-dd 23:59:59"

Of course, the dates themselves can be injected from anywhere: a txp:variable, from the URL via adi_gps, etc…

If that doesn’t work, what have you tried so far?

Last edited by Bloke (2015-03-05 23:47:23)


The smd plugin menagerie — for when you need one more gribble of power from Textpattern. Bleeding-edge code available on GitHub.

Txp Builders – finely-crafted code, design and Txp

Offline

#864 2015-03-06 01:27:38

MattD
Plugin Author
From: Monterey, California
Registered: 2008-03-21
Posts: 1,254
Website

Re: smd_calendar: complete schedule / event / calendar / diary

Bloke wrote #288784:

If that doesn’t work, what have you tried so far?

Finally got it working with your tip. Ended up using this

<txp:smd_article_event 
	stepfield="custom_3" 
	section="events" 
	from='<txp:variable name="article-date"/> 00:00:00'
	to='<txp:variable name="article-date"/> 23:59:59' 
	form="event-article"/>

where article-date is a variable with the format yyyy-mm-dd.

Thanks for your help and the great plugin.

Last edited by MattD (2015-03-10 13:16:34)


My Plugins

Piwik Dashboard, Google Analytics Dashboard, Minibar, Article Image Colorpicker, Admin Datepicker, Admin Google Map, Admin Colorpicker

Offline

Board footer

Powered by FluxBB