Just a quick "Thank You!" to all the friends, colleagues and strangers who donated to the First Domino Dander for Dosh charity walk. Eileen Fitzgeral, Andy Clark (a colleague from AVX where I work) and I completed the 26.22 miles of the Moyle Way yesterday in 10hrs and 6 minutes and thanks to the generosity of you lot we raised £1,375.00 for the Disaster Emmergency Committee appeal for the drought and famine in East Africa.
It is humbling to think that we 3 can raise some cash and make a difference to lives so far away. £0.25 will bring a child back from the brink of death, and £1375.00 will make a real difference to lots of people. We did the walk because we enjoy walking and hoped to make a bit of a difference to some other people ... you helped us to do that and we are very very very grateful to you all..
Thank you thank you thank you!
A full post on the goings-on with picture can be found here on the family blog
And once again THANK YOU!!! You guys ROCK!
Sunday 21 August 2011
Tuesday 16 August 2011
SInging jQuery's praises in a Domino Environment
Riding as I do just behind the xPage wave, I still spend most of my time using the older web tech on the domino server to web enable my apps, some apps are just to big and too difficult to make all xPagey and lovely quickly, so we take a gradual approach to migration.
This does not mean however that the poor users have to put up with old fashioned make do an mend. We have been using a lot of jQuery of late to leverage some bells and whistles and whilst not the pre supplied Dojo that lives on the server which gets used a bit, For the shiney front end stuff we do use jQuery because it is so easy to code in.
You can get every thing you need from the UI page here. jQuery comes in two parts, the core product and the UI and there are pages to download both, However when you download the UI you will get the current stable jQuery core that matches the UI code, so I generally go down this route when acquiring the required bits and bobs.
When dealing with the UI components do have a look at the themes avaiable and choose the one that best suits you before you download. There is a "Theme Roller" app that allows you to tweak just about everything before you download and this is very useful when trying to get something that is "corporate identity friendly".
When you download the core and ui elements you get a zip file with everything you need including samples.Which can be a bit daunting. However the files you need are in two places all the Javascript is found in a directory called JS .. the files are currently
jQuery-1.5.1.min.js - 84kb which contains the jQuery core code
and
jQuery-ui-1.8.15.custom.min.js - 206kb which contains the jQuery widget code.
You also need to resuce the CSS file and the associated graphics files which are in the CSS directory
when you tweaked the theme or selected one of the themes from the gallery of predfined ones you will have a subdirectory called the name of the theme. For example if you select "smoothness" there will be a dir called smoothness in which you will find
jQuery-ui-1.8.15.custom.css - 33kb
and a sub directory called images which has all the image files you need for the widgets
You have a couple of options here,you can totally ignore the download and use the CDN hosted files or you can just copy the JS and CSS to the Domino\Data\Domino\html directory on your server,or you can embedd the requred files in your domino application. The choice is up to you. From a personal point of view I am inclined to embed the files in my apps as I live in a very disparate server environment where I cannot guarantee that every user will have access to the internet for the CDN files , or guarantee that every server in the domain has the correct JS in the correct place at the same time.
Housing the jQuery in an NSF is not that difficult but it does need a wee bit of tweaking.
The JS files are minified and as such cannot just be cut and pasted into a JS library, so I just import them into the RESOURCCES / FILES section.
The CSS I import directly into a RESOURCES Style sheet, edit and run a Replace All on URL(images/ replacing it with plain URL(
The Images are all PNG so will not import into the images section of the nsf so I load them into the RESOURCES / FILES section as well.
... and that is it. you are ready to roll.
As an example of how easy it is to provide a jQueried widget I wil use the old favoutie a name finder field
For this you will need access to the jQuery code defined above by one of the methods
Create your form
Add links to the JS files and CSS files in the HTML HEAD Section
(i have renamed the files for ease of typing)
Add the field you want to have an autocomplete onto the form
Give it an HTML ID property of say "myname"
Create some HTML in the JS Header section like this
jQuery has a special function $(document).ready() which fires when the document is completely ready and all JS, images etc has been downloaded, and is ready for use. This is what is happening in (A) above which says when the document is ready run the function fInitApp()
fInitApp() is defined below and the jQuery selector $('#myname') tells jquery to search the document and locate the HTML element with the ID of myname [jQuery uses the same short hand as CSS in that a . defines a css classname and # defines an ID name.
Having found the element with an ID of myname, in this case a Text or Name field on the form jQuery then uses the autocomplete widget instansiator. Autocomplete is defined in the UI JS file and all that is required is that you set it up once when the document is loaded.
The Autocomplete function is supplied with an array of options surrounded in curly brackets.In the example above what I am saying is .. trigger the autocomplete when I have type 3 characters, get the data from a notes agent called getnames and the return data will be in json format.
jQuery passes what you type back to the agent url as a field called TERM in the CGI field called Query_String
So you write an agent with the same name as the Source: definition that takes this CGI field and queries the ($users) views in your names.nsf and returns a JSON String something like this ( I am limiting the return to 10 names you can set this as you see fit)
And that is all there is to it...
I have popped the above code into an NSF and you can have a look at by downloading it from here
and if you havent looked a jQuery yet, i advise you to have a look see. There is a wee learning curve but once you have the basics you can get remarkable effects very quickly and you do not need xPages to do it, so if you are stuck back on early V8 or V7 then you can still serve your users something pretty good very quickly.
This does not mean however that the poor users have to put up with old fashioned make do an mend. We have been using a lot of jQuery of late to leverage some bells and whistles and whilst not the pre supplied Dojo that lives on the server which gets used a bit, For the shiney front end stuff we do use jQuery because it is so easy to code in.
You can get every thing you need from the UI page here. jQuery comes in two parts, the core product and the UI and there are pages to download both, However when you download the UI you will get the current stable jQuery core that matches the UI code, so I generally go down this route when acquiring the required bits and bobs.
When dealing with the UI components do have a look at the themes avaiable and choose the one that best suits you before you download. There is a "Theme Roller" app that allows you to tweak just about everything before you download and this is very useful when trying to get something that is "corporate identity friendly".
When you download the core and ui elements you get a zip file with everything you need including samples.Which can be a bit daunting. However the files you need are in two places all the Javascript is found in a directory called JS .. the files are currently
jQuery-1.5.1.min.js - 84kb which contains the jQuery core code
and
jQuery-ui-1.8.15.custom.min.js - 206kb which contains the jQuery widget code.
You also need to resuce the CSS file and the associated graphics files which are in the CSS directory
when you tweaked the theme or selected one of the themes from the gallery of predfined ones you will have a subdirectory called the name of the theme. For example if you select "smoothness" there will be a dir called smoothness in which you will find
jQuery-ui-1.8.15.custom.css - 33kb
and a sub directory called images which has all the image files you need for the widgets
You have a couple of options here,you can totally ignore the download and use the CDN hosted files or you can just copy the JS and CSS to the Domino\Data\Domino\html directory on your server,or you can embedd the requred files in your domino application. The choice is up to you. From a personal point of view I am inclined to embed the files in my apps as I live in a very disparate server environment where I cannot guarantee that every user will have access to the internet for the CDN files , or guarantee that every server in the domain has the correct JS in the correct place at the same time.
Housing the jQuery in an NSF is not that difficult but it does need a wee bit of tweaking.
The JS files are minified and as such cannot just be cut and pasted into a JS library, so I just import them into the RESOURCCES / FILES section.
The CSS I import directly into a RESOURCES Style sheet, edit and run a Replace All on URL(images/ replacing it with plain URL(
The Images are all PNG so will not import into the images section of the nsf so I load them into the RESOURCES / FILES section as well.
... and that is it. you are ready to roll.
As an example of how easy it is to provide a jQueried widget I wil use the old favoutie a name finder field
For this you will need access to the jQuery code defined above by one of the methods
Create your form
Add links to the JS files and CSS files in the HTML HEAD Section
Add the field you want to have an autocomplete onto the form
Give it an HTML ID property of say "myname"
Create some HTML in the JS Header section like this
fInitApp() is defined below and the jQuery selector $('#myname') tells jquery to search the document and locate the HTML element with the ID of myname [jQuery uses the same short hand as CSS in that a . defines a css classname and # defines an ID name.
Having found the element with an ID of myname, in this case a Text or Name field on the form jQuery then uses the autocomplete widget instansiator. Autocomplete is defined in the UI JS file and all that is required is that you set it up once when the document is loaded.
The Autocomplete function is supplied with an array of options surrounded in curly brackets.In the example above what I am saying is .. trigger the autocomplete when I have type 3 characters, get the data from a notes agent called getnames and the return data will be in json format.
jQuery passes what you type back to the agent url as a field called TERM in the CGI field called Query_String
So you write an agent with the same name as the Source: definition that takes this CGI field and queries the ($users) views in your names.nsf and returns a JSON String something like this ( I am limiting the return to 10 names you can set this as you see fit)
And that is all there is to it...
I have popped the above code into an NSF and you can have a look at by downloading it from here
and if you havent looked a jQuery yet, i advise you to have a look see. There is a wee learning curve but once you have the basics you can get remarkable effects very quickly and you do not need xPages to do it, so if you are stuck back on early V8 or V7 then you can still serve your users something pretty good very quickly.
Subscribe to:
Posts (Atom)