Move this topic
I have a jQuery Mobile app I created that I added the ability to download an ics file to the users of the app.
Some in our sales force uses iPads/iPhones to access this application, so I have the following meta tag in my <head> to allow the application to be web-app capable.
<meta name="apple-mobile-web-app-capable" content="yes" />
I then created a bookmark to Home Screen of their devices.
The anchor tag that downloads the .ics file has the data-ajax="false" tag in it so that I can actually download the file to the device, and this works.
The problem is, once the apple users click this anchor, the Web App now ends and a Safari session starts. I lose the page I was on in the Web App, and the page that shows is whatever the user was last visiting within the safari browser.
I do have users that use android tablets/phones and all is well for them. The site works well in desktop browsers as well. It's just the apple iPad people that are getting this problem.
Thanks in advance.
Rob
1
Replies(15)
I came up with a work around for this delema for the iPad/iPhone users. I created an ajax call to send the ics file to the logged in users' email and not have the ics file directly sent to the device.
The calendars for my user's are synced between their mobile devices and their outlook calendar, so by me emailing the calendar item, they have the functionality that they require.
Leave a comment on Robert Binetti's reply
As you have noticed, Mobile Safari simply does not support importing .ics files to calendar. But it does support importing them via email.
It appears, though, there is a calinvite: custom URL scheme, but is poorly-documented. This might accomplish what you want.
Leave a comment on watusiware's reply
Maybe I'm misunderstanding this thread, but we have a JQuery Mobile app that allows .ics files to be downloaded with Mobile Safari on an iPhone into the iOS Calendar app:
Just tap on one of the calendar icons in the first horizontal slider.
It won't work with Chrome for iOS though. I also haven't tested it on an iPad yet.
Jim
Hi Jim,
I would love to know how your calendar feature was built. I'm working on a JQM web app that includes a calendar page that is fed from an existing desktop website with an events calendar. The desktop calendar has a "subscribe via ics" feature, but I haven't found a way to pull that ics file into my app and display the data. Any advice would be greatly appreciated (full disclosure - I'm not a programmer so there's a lot that I don't understand in this realm, but I am getting help with the programming stuff once a week from a teacher).
Thanks,
Jody
I would love to know how your calendar feature was built. I'm working on a JQM web app that includes a calendar page that is fed from an existing desktop website with an events calendar. The desktop calendar has a "subscribe via ics" feature, but I haven't found a way to pull that ics file into my app and display the data. Any advice would be greatly appreciated (full disclosure - I'm not a programmer so there's a lot that I don't understand in this realm, but I am getting help with the programming stuff once a week from a teacher).
Thanks,
Jody
Leave a comment on james.watkin's reply
Jody,
I’ll try to help, but I think what I’ve done might be different from what you’re trying to do. I'm dynamically creating an ics file and making it available for download. The consumption of my ics file is automatically handled by the Safari Mobile browser and the iOS Calendar app.
My development environment is:
To create the ics file, I use the following code (which is almost entirely copied from http://rbalajiprasad.blogspot.com/2012/11/mvc-c-create-ical-calendar-ics-feed.html):
On the server-side of your app, you might want to somehow consume the ics file and then display the data within your web client. I'm not sure how your "subscribe via ics" feature works.
I hope this helps.
Jim
I’ll try to help, but I think what I’ve done might be different from what you’re trying to do. I'm dynamically creating an ics file and making it available for download. The consumption of my ics file is automatically handled by the Safari Mobile browser and the iOS Calendar app.
My development environment is:
- ASP.NET MVC 4
- C#
- Visual Studio Ultimate (Academic Edition)
- Microsoft SQL Server
- Free DDay.iCal library for creating the ics file
- jQuery 1.9.1
- jQuery Mobile 1.3.2
To create the ics file, I use the following code (which is almost entirely copied from http://rbalajiprasad.blogspot.com/2012/11/mvc-c-create-ical-calendar-ics-feed.html):
- /// <summary>
/// This action method is almost entirely copied from this article: http://rbalajiprasad.blogspot.com/2012/11/mvc-c-create-ical-calendar-ics-feed.html
/// </summary>
/// <param name="bookId"></param>
/// <returns></returns>
public FileResult DownloadEventIcsFile(int bookId)
{
iCalendar iCalendar = new iCalendar();
Event iCalEvent = iCalendar.Create<Event>();
anderson_mobile_view emsEvent = EventSystemContextSingleton.Instance.SingleEvent(bookId);
iCalEvent.Start = new iCalDateTime(emsEvent.TimeEventStart);
iCalEvent.End = new iCalDateTime(emsEvent.TimeEventEnd);
iCalEvent.Summary = emsEvent.EventName;
iCalEvent.Location = emsEvent.RoomDesc;
List<string> contacts = new List<string>();
contacts.Add(emsEvent.Contact);
iCalEvent.Contacts = contacts;
iCalEvent.Description = emsEvent.GroupName + " " + emsEvent.EventTypeDesc;
ISerializationContext serializationContext = new SerializationContext();
ISerializerFactory serializerFactory = new DDay.iCal.Serialization.iCalendar.SerializerFactory();
IStringSerializer serializer = serializerFactory.Build(iCalendar.GetType(), serializationContext) as IStringSerializer;
string output = serializer.SerializeToString(iCalendar);
var contentType = "text/calendar";
var bytes = Encoding.UTF8.GetBytes(output);
return File(bytes, contentType, "ems-book-id-" + bookId + ".ics");
}
On the server-side of your app, you might want to somehow consume the ics file and then display the data within your web client. I'm not sure how your "subscribe via ics" feature works.
I hope this helps.
Jim
Leave a comment on james.watkin's reply
Hi Jim - you're right, I think what you're doing is different than what I'm trying to do. Rather than create an .ics file that can be downloaded, I'm trying to figure out a way to grab an existing .ics file from the web and display its data in my jQm web app. Thanks a lot for your thorough response, though. I appreciate you taking the time to explain it to me.
Jody
Leave a comment on jodycduncan's reply
Here you go... good luck! (It's a bit lengthy...)
http://www.ietf.org/rfc/rfc2445.txt
Use $.ajax to load the data into a string, and then parse away.
http://www.ietf.org/rfc/rfc2445.txt
Use $.ajax to load the data into a string, and then parse away.
Leave a comment on watusiware's reply
Thanks! That is a lot to digest, but I'll see what I can do.
Leave a comment on jodycduncan's reply
Depending on which programming language you're using, there are software libraries that will do the ics parsing for you. For C#, you might want to look at DDay.iCal http://www.ddaysoftware.com/Pages/Projects/DDay.iCal/Default.aspx
Other programming languages probably have similar libraries.
Jim
Leave a comment on james.watkin's reply
Thanks for the link to DDay.iCal. Unfortunately, I started this project in jQM, just using web-based languages (HTML, CSS, some Javascript and a tiny php snippet or two). I'm too far along now to start over, but I've been wishing lately that I had started off in X-Code or something.
Anyway, I tried looking a month or so ago for some sort of javascript/php-based solution and didn't find a whole lot, so I put it aside to focus on other problems. Now I'm back to the calendar problem...I'll look again tomorrow during class.
Leave a comment on jodycduncan's reply
Leave a comment on watusiware's reply
Thank you! This looks very useful. After much discussion today, I *think* I might try a different tack with my web app - pulling in a "News" RSS feed rather that trying to tackle the full calendar with an .ics file. The News component will encompass upcoming events and I've already got the code to pull in and finesse RSS feeds. I think I can add a "subscribe to the full calendar" link within my "News" section, and that will give the user an option to pull in the full calendar via their iPhone calendar or whatnot.
I will keep this ical.js handy if this new idea doesn't work out, though. Thanks for all the helpful responses everyone!
Leave a comment on jodycduncan's reply
Hello,
Very interesting thread. I have the exact same problem as the author of this post at the top, although in my case I really want to create a new event invite such as Mr Watkin does on his website.
The problem is that it does work very well in Mobile Safari but if you're in a web app (icon launched directly from the home screen) with <meta name="apple-mobile-web-app-capable" content="yes" /> then two possibilities :
1) if you put only a relative path to your .ics (generated server side) --> does not work, iOS says "cant be downloaded"
2) if you put an absolute path (with the http:// protocol) then it does exactly what the author of this post has written : --> it forces to close the session and open a new Mobile Safari tab then present the invite but when the user get out of the invite it goes back to the last Mobile Safari opened url and not the web app itself of course.
a) Has anyone found a workaround for that behaviour ?
b) Mr Watkin > Correct me if I'm wrong but your mobile website works in Mobile Safari but if the user is saving the icon on the desktop it's still open Safari and not the internal web app mechanism. So in your case you dont have the problem because AFAIK you always use a complete Mobile Safari session and not a "total" webapp. Or did you achieve the same result in a "total" web app ?
Thank you.
Guillaume
Very interesting thread. I have the exact same problem as the author of this post at the top, although in my case I really want to create a new event invite such as Mr Watkin does on his website.
The problem is that it does work very well in Mobile Safari but if you're in a web app (icon launched directly from the home screen) with <meta name="apple-mobile-web-app-capable" content="yes" /> then two possibilities :
1) if you put only a relative path to your .ics (generated server side) --> does not work, iOS says "cant be downloaded"
2) if you put an absolute path (with the http:// protocol) then it does exactly what the author of this post has written : --> it forces to close the session and open a new Mobile Safari tab then present the invite but when the user get out of the invite it goes back to the last Mobile Safari opened url and not the web app itself of course.
a) Has anyone found a workaround for that behaviour ?
b) Mr Watkin > Correct me if I'm wrong but your mobile website works in Mobile Safari but if the user is saving the icon on the desktop it's still open Safari and not the internal web app mechanism. So in your case you dont have the problem because AFAIK you always use a complete Mobile Safari session and not a "total" webapp. Or did you achieve the same result in a "total" web app ?
Thank you.
Guillaume
Leave a comment on halfarchange's reply
As an experiment, I just now tried it as an iOS "webapp" by using <meta name="apple-mobile-web-app-capable" content="yes"> and launching the app from a homepage icon.
My .ics file is specified with a relative path. It always was.
After launching from a home screen icon, the app is full screen. When tapping on the .ics <a> link, another Safari browser window opens but with the standard header URL field and footer controls both overlaying my page (showing a "2" in the far right window-count icon in the footer overlay), then an iOS Calendar dialog immediately covers that and lets me save the event as usual. After tapping "Done", I'm taken back to the Safari window but the "2" in the far right icon in the footer overlay is gone. If I slightly adjust the vertical scrolling, then the URL text field disappears but the footer overlay remains.
At this point, if I try to save another .ics event, a second Safari window doesn't open, it just works as expected. The second window only opens the first time I try to save the .ics file following the launch from a home screen icon.
To summarize, when in full screen web app mode, the calendar saving operation still works for me, but it pops me out of the full screen mode.
I'm not planning to use the full screen mode at this time.
I used iOS 6 on an iPhone 3GS for this testing.
Jim
Leave a comment on james.watkin's reply
Thank you very much for your test.
I'm confused about the relative path for the .ics, all my tests did not work with a relative path in a webapp (under iOS6 / iphone 4) but they did work in Safari I think. I'll redo some tests if you say it worked relatively under a webapp.
From your explanation I think you then have the same kind of problem than me, although I'm not sure I understood well what happened : once one exit the full screen mode and "accepted" the invitation, in my case it goes back to any old safari window still opened (that can be any site in the world) so that's for me worse than just exit of the full screen mode --> it completely breaks the user experience because it does not go back to the application at all, you have to manually Go back to the home screen, look again for your icon and re-launch it.
I'm wondering if the relative path made you somehow have your application opened again in the Safari standard window.
I'll make some more tests but I doubt there's a workaround to this behaviour sadly.
Many thanks.
I'm confused about the relative path for the .ics, all my tests did not work with a relative path in a webapp (under iOS6 / iphone 4) but they did work in Safari I think. I'll redo some tests if you say it worked relatively under a webapp.
From your explanation I think you then have the same kind of problem than me, although I'm not sure I understood well what happened : once one exit the full screen mode and "accepted" the invitation, in my case it goes back to any old safari window still opened (that can be any site in the world) so that's for me worse than just exit of the full screen mode --> it completely breaks the user experience because it does not go back to the application at all, you have to manually Go back to the home screen, look again for your icon and re-launch it.
I'm wondering if the relative path made you somehow have your application opened again in the Safari standard window.
I'll make some more tests but I doubt there's a workaround to this behaviour sadly.
Many thanks.
Leave a comment on halfarchange's reply
Change topic type
Link this topic
Provide the permalink of a topic that is related to this topic
Reply to Robert Binetti's question
{"z24598033":[14737000004712577,14737000004787589,14737000004797255,14737000004878113],"z27637159":[14737000004857353,14737000004894433],"z7664639":[14737000004697647,14737000004795115,14737000004803035],"z29885764":[14737000004700464,14737000004696605],"z30550523":[14737000004786803,14737000004796087,14737000004796351,14737000004801021,14737000004807219]}
Statistics
- 15 Replies
- 11096 Views
- 4 Followers