fredag den 21. september 2012

jquery calendar appointment time picker


I was in need of a time picker with a corresponding duration-selector; and as I couldn't find anything which suited the requirements, I decided to make it myself. So here it is for you to grab if you like. This is what i looks like:



The requirement was to select a specific time on a time ruler, so I'm drawing a ruler on a html5 canvas element and, beneath it, a ruler to select the duration. With both rulers I overlay a 'ruler-marker' div, of course absolutely positioned, and those are decorated with the jquery UI 'draggable' attribute - limited in as much as you can only move the marker within the ruler. A 'onDrag'-handler makes sure the size of the ruler-marker of the time-ruler expands or contracts with the change in duration.

It's important to incorporate the touch-punch - http://touchpunch.furf.com/ - js support for the jquery ui, if you expect the draggable-functionality to work on IOS devices.

So that's a day's work for me, hopefully it'll save you one. Here's the source:

https://docs.google.com/open?id=0B8b-I3PiuN9lMlg2UnoxQnQ5MkU

Oh, there's a 'Helperfunctions.js' involved which I don't link to, but it incorporates a 'GetAbsolutePosition()'-function that I nicked from here: http://blogs.korzh.com/progtips/2008/05/28/absolute-coordinates-of-dom-element-within-document.html




onsdag den 19. september 2012

c# and Skype integration

UPDATE 7/9/13: I heard a rumor that Skype would no longer support the below method of integration. It's probably worth your while to check it out, and thus not waste your time if that's indeed the case.


I was asked to build a windows desktop application which offered video-assistances to students who visited with our physical helpdesk, only to find no-one there to help them - wherefore they could instead perform a video-call to the first available helpdesk-staffer.

My choice in building the application was to utilize the Skype API, in as much as the audio and video part is proven and reliable, and, well, there's no sense in re-inventing the wheel. They all use Skype to make intranet calls anyway, so they're used to it and very familiar with it. And so are the students, for that matter. So that's what I did and it worked out terrific. And here's how I did it:

1) You'll have to obtain a Skype licence. So go to http://developer.skype.com/ and join the developer program of your choice, either embedded or desktop. It's not a very costly program to join. This will get you your developer key. However, you'll download a *.pem-file, but in order to program against the Skype API on windows you'll need to convert this to a *.pfx file. No biggie: use this page - https://www.sslshopper.com/ssl-converter.html - to do an online conversion, which will result in a pfx-file you can import into your c# project, as did I. P.S.: the online conversion page will have you select both a 'Private Key File:' and a 'Certificate File to Convert:'. In both fields provide your downloaded *.pem file.

2) So you've got your *.pfx licence-file now, and the next thing you'll need is the SkypeKit_VS2010.dll so you can program against the API. Specifically you'll want to download the SkypeKit version 4.3.1 - here it is: http://developer.skype.com/skypekit/releases/skypekit-4-3-hf1/release_files/skypekit/downloads/101904 (desktop version). The gz-file you'll download via the above link contains a Visual Studio 2008 and 2010 project alike, and when you build that you get the dll as a result. Alternatively you can download my source code, the Visual Studio 2010 version of the dll is in there. I do recommend download the above kit, though, there's some great example code for your perusal.

2.5) Download the Skype runtime exe-file. The api-calls you make will be executed against this runtime exe-file. The exe is in the SkypeKit you downloaded - or you can browse the 'dll'-folder in my source code and the windows x86 exe is in there. 3) You've got your licence key and your dll. Reference the dll in your project and you'll be ready to program against the API. You'll do the following:

a) reference your licence key, like this: X509Certificate2 cert = new X509Certificate2(@"C:\userprofiles\mno\My Documents\Visual Studio 2010\Projects\SkypeTest\SkypeTest\SkypeStuff\Version.pfx", @"wallen11");

b) initiate a new Skype API connection: skype = new SktSkype(this, cert, true, false, 8963);

c) declare the 'onConnect' event handler associated with the skype API connection you've just initialized. This connect-handler will handle login via your account. skype.events.OnConnect += OnConnect;

d) Launch the Skype runtime. Again, this runtime receives the commands you send to the Skype API and executes them. skype.LaunchRuntime(@"C:\yourPathToTheExe\windows-x86-skypekit.exe", true);

e) ... And connect: skype.Connect();

f) The connect-command will trigger the onConnect-handler, which takes care of our logging into Skype:

public void OnConnect(object sender, SktEvents.OnConnectArgs e)
{
if (e.success)
{
account = skype.GetAccount();
account.LoginWithPassword(, false, false);
}
else
{
throw new Exception("IPC handshake failed with: " + e.handshakeResult + "\r\n");
}
}

4) Let's assume you've got connected to Skype, i.e. your desktop application is connected to the Skype network. Now it's a matter of making a call from the desktop application. This is where it gets a bit tricky. Your only - for now - option in calling other Skype contacts is to emulate a previous conversation you've had with them. You can do something akin 'SkypeCall call = new SkypeCall("SkypeAccountIWantToCall"); call.Ring();'.

What you must do is first get a list of your account's previous conversations:

conversationList = skype.GetConversationList(SktConversation.LIST_TYPE.ALL_CONVERSATIONS);

... and from one of those conversations you'll retrieve the list of participants:

SktParticipant.List parts = selectedConversation.GetParticipants(SktConversation.PARTICIPANTFILTER.OTHER_CONSUMERS);
List names = new List();
foreach (SktParticipant part in parts)
{
names.Add(part.P_IDENTITY);
}

// call the contact
conv.RingOthers(names, true, "");

There's a bit more to it than that - such as handling video, and checking for contact availability. I'll refer to my sample code. What I do is this, I get a list of the previous conversation and sort through these. I add the conversations by distinct users to an invisible listbox. A 'call' button traverses the conversations and checks availability of the participants; first available helpdesk employee gets the honors. That's perhaps not the most elegant fashion, the invisible listbox-thing, in my defence I was in a hurry and leaned heavily on the tutorial code provided by Skype.

As always here's a link to the source code of my effort:

https://docs.google.com/open?id=0B8b-I3PiuN9lMXNkTllyU1dGVms

Not documented terribly well, but, as always, get back to me if there's anything I can explain better, or if you need help in general.

Hope it helps! Best of luck in your coding efforts.