Tuesday, December 10, 2013

Announcing the Location of the 2014 Midwest Lotus User Group Conference (MWLUG)

If you are not planning to go or not go to IBM Connect this year, there is going to be two great LUGs within the United States, one of which is MWLUG 2014.  As was announced at MWLUG 2013, the location for MWLUG 2014 is Grand Rapids, Michigan.  MWLUG 2014 will be the sixth conference that we have organized, thanks to an army of organizers, speakers, and volunteers from IBM Business Partners, IBM Customers, and IBM staff.

This is the third MWLUG that will be held is a grand historic and landmark hotel and close to the Amtrak station of that city. If you did not know, I am a big fan of rail travel.  In 2012 it was the historic William Penn Hotel.  In 2013 it was at the historic Crown Plaza Union Station Hotel.

After months of negotiations, I am please to announce that the site for the 2014 Midwest Lotus User Group Conference will be the Amway Grand Plaza on August 27-29, 2013. The Amway Grand Plaza was built in 1913 and in 1925 was rated as "One of the Ten Finest Hotels in America".

We are very excite to have MWLUG 2014 at the Amway Grand Plaza and with Grand Rapids being the Beer City USA you know what that means. Beer Beer.




Thursday, December 5, 2013

GRANITE - December 9, 2013 Meeting Agenda

The agenda for the GRANITE December 9 meeting is all set.  Special thanks to all the speakers for help us out at the last minute.  The meeting will be held at the IBM Center in Downtown Chicago.  See everyone on next Monday.


08:30 - 09:00 AM
Breakfast, refreshments, and networking.

09:00 AM - 09:15 AM
Presentation:  What's New with IBM?  Update
Presenter:  Luis Guirigay, IBM Collaboration Solutions

Luis will provide the audience an update in on the up and coming IBM/Lotus events and what is new from IBM/Lotus.

9:15 AM - 10:30 AM
Presentation: Social Selling in the Real World
Presenter: John Head — Director of Enterprise Collaboration, PSC Group, LLC

Social selling is the rage these days, but what does that really mean? This session is not about buzzwords or what’s new and cool, it’s about real-world practices of putting social selling to work. As a technology consultant who transitioned to sales 4 years ago, social selling tools and techniques made that change possible. Come see the ideas, techniques, and tools that helped John’s transition and enabled his success as a salesperson. You will walk away with a list of new tools to try in your own selling process.

10:30 AM - 10:45 AM
Break

10:45 AM - 12:00 PM
Presentation:   A Recipe for Java Beans
Presenter: Mike McGarel, Collaborative Solutions Developer, Czarnowski Display Services

Java beans are a great way to display and transfer data in XPages. They are fast, efficient and surprisingly easy to use. Mike McGarel from Czarnowski Display Services will show what ingredients are needed and demonstrate a few tasty samples that you can use in your own applications.

12:00 PM - 01:00 PM
Lunch - Provided by GRANITE

01:00 PM - 01:30 PM
Presentation:  MWLUG (Midwest Lotus User Group Conference) 2014 Planning Update
Presenter: Richard Moy, Phora Group

Richard will provide a summary of MWLUG 2013 and will update everyone on the status of MWLUG 2014 and all the new things that are happening this year in Grand Rapids.

01:30 PM -02:00 PM
Open discussion/Groups/Workshop/Networking
Focused, moderated discussion groups to address topics of major interest to attendees. So bring your problems, your laptops, your questions, and let's share some solutions. We can all learn something new at every meeting.



Wednesday, November 27, 2013

Reminder: Next GRANITE Meeting Monday, December 9, 2013

The next GRANITE Meeting will be on Monday, December 9, 2013.  It will be held at the IBM Center in Downtown Chicago.  We will be covering Mobile Security as one of the topics, a subject that is increasingly becoming an important topic to be aware of.

Friday, October 25, 2013

db.FTSearch != Ubuntu Server

We ran into a db.FTSearch problem with a customer a few years ago.  Full indexed search failed on PDF and DOCX file attachments. For other attachments it worked fine. We were using Ubuntu 10.4 LTS.  Searching through Notes.net we could only find a few references to db.FTsearch and Linux regarding these two file formats, but all the postings provided no resolution to the issue.  Fortunately, when we moved the database to production on a Windows server, the db.FTsearch for PDFs and DOCX files worked.  At that time, I thought it might have been our Linux server setup done incorrectly.

We recently had the same problem again using a different and newer installation of Ubuntu, 12.04 LTS server.  Further research and many attempts in changing configuration file did not help.  So we switch the server to CentOS as suggested by Bill Malchisky. Using the installation instructions and videos on Youtube from Devin Olsen, we installed CentOS 6.4 and now db.FTSearch works with PDFs and DOCX files. It seems that the FTsearch have issues with the Debian distribution of Linux.  Whether it is implementation of the KeyView filters not working or there is a bug I do not know.  This is beyond my Linux skills to track down.

Though I like Ubuntu alot, we will be switching all my servers to CentOS.  Lesson learned, if you need to perform db.FTSearch on databases that includes PDF or DOCX file attachments, do not use Ubuntu for the client or the server. 

Wednesday, August 28, 2013

MWLUG 2013 Wrap Up

MWLUG 2013 has come and gone. It was one of the best MWLUG conferences that we ever had. Josh Bleill and Scott Souder were great presenting at the OGS and if you missed Darren Duke's presentation, you missed one of the highlights of MWLUG 2013. The food was great and the Grand Hall where the OGS, exhibitor showcase, and food was served was unbelievable.







If you missed Catherine Emert's assorted cookies that she brought to MWLUG 2013 at the Prominic.NET booth, then you must wait another year to experience that.  Some one whom know who you are, beat me to the chocolate ones.





The Indy Speedway Museum and Tour was fun.  We had over two dozen participants .

Thank you to all the great speakers who donated their time and resources to speak at MWLUG 2013. It is you who make the MWLUG one of the best collaboration conference around. 


Thank you to all the incredible MWLUG 2013 Sponsors who make the entire conference possible. 




Special thanks to Ray Bylik for organizing the first annual MWLUG Brewfest Charity Competition on Wednesday. We raised over $500 for the Salvation Army Oklahoma Tornado Relief Fund.  This event was sponsored by CDW. Thanks to Rupert Clayton, Keith Brooks, and William Smith for judging this competition.  They definitely got their share of beer.





Everyone had a great time at the Rock Bottom Brewery and we all forgot to ask for a tour of the brewery.  On well. We had about 100 attendees show up for this event.






We also raised over $800 for The Gleaners Food Bank in Indianapolis. Also, Mike McGarel did an exceptional job on the web site while Sam Bridegroom was outstanding in helping us in getting Josh Bliell and organizing parts of the conference. The other volunteers made the entire process run smoothly. 

The Crowne Plaza Hotel - Union Station staff was great especially when things came up in the last minutes. Presentation slides and information will be posted soon.  All attendees will be get a link to available presentation slides and also to speaker evaluations.

MWLUG 2014 will be held in Grand Rapids, Michigan in August 2014. Actual dates will depend on hotel availability. More information coming.  So see everyone in Grand Rapids.

Richard

Tuesday, August 20, 2013

Next Stop: Indianapolis - MWLUG 2013

All packed for MWLUG.  Each year the planning for MWLUG gets more and more complex and stressful. But everything has come together.  For all who is attending, I guarantee you this will be three days of intense building of knowledge and relationships along with some fun activities.

LUGs like MWLUG, IamLUG, UKLUG, and BLUG really show what social collaboration is.  It is the coming together of customers, IBM Partners and IBMers for the goal of growing our community and building of knowledge in the way that you normally only see in a open source environment.

Beside having MWLUG in a different city each year which is a major challenge, we try to do something different from the previous years. Sometimes that work great like in MWLUG 2011's comedy club with the Fake "Ed Brill" and sometimes it becomes a total disaster like the "Engima Contest" from MWLUG 2012. Hopefully, this year we have another winner.

So I will be taking the Amtrak train from Chicago to Indianapolis along with a number of others and arrive 5 hours later at the doorsteps of the Crowne Plaza Hotel - Union Station. I can sleep on the train, but I will most likely be working on my Speed Sponsor presentation.

So see everyone soon at MWLUG 2013, have a great time, learn as much as you can, and have fun!




Monday, August 19, 2013

MWLUG 2013 Agenda App Now Available

It is two days before the start of the fifth Midwest Lotus User Group Conference.  The MWLUG 2013 Mobile Agenda App is now ready for download for iPhone and Android users. Special thanks to IBM Business Partner Salient Solutions for volunteering and developing the MWLUG 2013 Mobile Agenda App using their Mobilite solution. 

For iPhone users you can download it using itunes. 

https://itunes.apple.com/us/app/mobilite/id639148487?mt=8&uo=4

For Android users you can access the MWLUG Mobile App using Google Play Store.
https://play.google.com/store/apps/details?id=au.com.mobilite


The registration process is the same across all platforms, and is just a single step for anyone

Leave it on "Demo", and add your email address, tap "Register Account" and you're in.

You will see the MWLUG as an app next to our other demos systems.

Things you can do
  1. You can view the list of speakers and their bio's with picture (if provided).
  2. From the Speakers view, you can access an embedded view to see what sessions they're presenting.
  3. You can view sessions by day, track or speaker
  4. Each user can add a session to "My Sessions", your own personal list of sessions to attend, they will appear in chronological order. 
http://www.mobilite.com.au/

There is still time to register.  So go to:


MWLUG 2013 Registration

Thursday, August 15, 2013

MWLUG 2013 Update: Indianapolis Motor Speedway Hall of Fame Museum Tour - Wednesday August 21, 2013

Everything is finally set for the Indianapolis Motor Speedway Hall of Fame Museum and Track Bus Tour for MWLUG 2013 attendees. The cost for the event is $5 for the museum and $5 for the track tour.  However, since the Red Bull MotoGP is happening this weekend, we will need to wait until Tuesday, August 20, 2013 to determine if we will be able to get the track bus tour since they need to clean up everything.  We will be providing a bus from the hotel to the Indy Speedway Museum and back.  Depending on the number of attendees interested in attending this event, the bus may or may not need to make two trips.  The Indy Speedway is 5 miles away from the hotel.  The bus will be leaving the hotel at 10:00 AM and return back around 12:30 PM.  Please gather at the front lobby at 9:45 AM.

For more information about the Indianapolis Motor Speedway Hall of Fame Museum go to:
http://www.indianapolismotorspeedway.com/facility/35204-Museum/


Wednesday, August 14, 2013

Top Ten Reasons for Attending MWLUG 2013

MWLUG 2013 is almost upon us.  Starting next week close to 200 members of our IBM community will be descending the town of Indianapolis for knowledge, networking and beer.  Here is this year's Top 10 Reasons why you should join us.  There is still time to register for MWLUG 2013 and the hotel. 

Number 10

  • Find out how many gray hairs Richard got planning MWLUG 2013 this year 

Number 9

  • Find out how many kegs of beer MWLUG 2013 attendees can consume

Number 8

  • See if you can get a one of Catherine Emert (Prominic.NET) famous chocolate cookies

Number 7
  • Beer with friends 3 nights in a row!

Number 6
  • Meet 200 people with similar passion

Number 5
  • Learn how fast MWLUG 2013 Sponsors can speak at Speed Sponsoring

Number 4
  • Learn the true meaning of the word "Social"

Number 3
  • Meet the many IBM Champions and IBM Community contributors who have donated their time and resources to help educate our community. ( Make sure you buy them a beer.)
Number 2
  • Attend The World According to Gregg and Darren AKA "Gregg and Darren's Excellent Adventures" presentation

And the Number 1 Reason for Attending MWLUG 2013


  • Attend opening general session presentations with Josh Bleill and Scott Souder 


MWLUG 2013 Sessions

MWLUG 2013 Registration

Monday, August 12, 2013

MWLUG 2013 Charity Brewfest Competition Prize Is ...

Do you think you have created a great home brew or wine!!! Do you think your local micro-brewery beer is out of this world!!! Then bring them with you to MWLUG 2013 and lets find out.
We are happy to announce the MWLUG 2013 Charity Brewfest Competition. It will be held on Wednesday August 21, 2013 4:00 PM just before the MWLUG Wednesday Exhibitor Showcase Reception. This competition is open for all attendees. We would like to thank our sponsor CDW for making this event possible
.


The winning prize for the MWLUG 2013 Charity Brewfest Competition will be a $100 Gift Card from the Northern Brewer HomeBrew Supply courtesy of Gregg Eldred.

Ray Bylik and his panel of experienced judges will taste the different entries and select the winners of this competition. Gregg has selected some interesting prizes for this competition.
In order to participate in this competition, the submission fee is $10 with all proceeds benefiting the MWLUG Oklahoma Tornado Relief Fund. You can submit as many entries as you would like. For each entry, please bring at least two 12 ounce bottles. All competitors will need to sign a waiver. All nationally distributed micro-brewery beer do not qualify.
For every dollar that we raise in this event, our sponsor Phora Group will match a dollar. We are working with other sponsors for additional matching funds that will all benefit the Oklahoma residences that have been devastated by the recent horrific tornadoes.

Thursday, August 8, 2013

Highlights of MWLUG 2013 Starting in 2 weeks

We are two weeks away from the start of MWLUG 2013. Here is an opportunity to get up and close to current and potential IBM collaboration customers, partners, and IBMers. This event has been made possible by all the hard work of volunteers in the IBM Community that include IBM customers, IBM Business Partners, and IBM Staff.

All the speakers volunteer their time and resources to make this possible. The majority of the cost for MWLUG 2013 is made possible by the generous sponsors who not only provide money but also great technical expertise. Attendees to MWLUG 2013 receive a first-class conference for only an amazing $35 donation.




To register go to: http://mwlug.com/mwlug/mwlug2013.nsf/Register.xsp

We have added more rooms at the Crowne Plaza Hotel - Union Station, so you can still register for the hotel at the discounted rate.  However, you need to contact the hotel by telephone (317) 631-2221

Here are the highlights of MWLUG 2013.

Opening General Session Speakers

  • Josh Bleill from the Indianapolis Colts 
  • Scott Souder from IBM 


2 Workshops for Administrators and Developers: 

  • "Build a Bean" Workshop 
  • Building Your ICS Test Environment with Linux


37 Technical Sessions Covering Five Topics: 

  • Application Development
  • Best Practices and Customer Business Cases
  • Mobility and Web Security
  • Social Business
  • System Administration

Three Planned Events MWLUG 2013

  • Brewfest Competition
  • Wednesday Evening Showcase Reception
  • Thursday Evening Event at the Rock Bottom Brewery 


Free Breakfast, Lunch and Snack

  • Thursday
  • Friday

Tuesday, August 6, 2013

Announcing the MWLUG 2013 Thursday Evening Event

MWLUG 2013 Thursday Networking Event
We are please to announce the MWLUG 2013 Thursday networking event will be held at the Rock Bottom Brewery in Downtown Indianapolis. After an intense day of listening to sessions at MWLUG 2013, take the opportunity to relax and enjoy many of the great things that Indianapolis has to offer while networking with your fellow IBM collaboration professionals. We will be providing drinks and snacks. Afterwards, visit the night life of downtown Indianapolis. This event is sponsored in part by our event sponsor Mesa Technology.


We are 2 weeks away from the fifth Midwest Lotus User Group Conference. There is still time to register for this event. Discounted online hotel rooms are no longer available. However, you can still get the great discount by calling the hotel directly and using the discount code MWL (317) 631-2221.

MWLUG 2013 Workshops
The MWLUG 2013 workshops will start on Wednesday, August 21, 2013 in the afternoon. For administrators, there will be an intense 2.5 hr Linux Workshop "Building Your ICS Test Environment with Linux" hosted by our one and only William Malchisky. For developers interested in creating and mastering Managing Beans, Mike McGarel and Devin Olson will be hosting a 2 hour workshop "Build a Bean".

MWLUG 2013 Sessions
Starting on Thursday after the OGS, there will be two full days of technical and business sessions that include the following topics:
  • Application Development
  • Best Practices and Customer Business Cases
  • Mobility and Web Security
  • System Administration
  • Social Business
For a list of MWLUG 2013 sessions go to:http://www.mwlug.com/mwlug/mwlug2013.nsf/Sessions.xsp

MWLUG 2013 Brewfest Competition
Don't forget to bring your favorite home brew or microbrewery beer and compete in the "MWLUG 2013 Brewfest Competition" that will be held on Wednesday afternoon after the workshops. The donation entry fee is $10 which will be donated to the Salvation Army - Oklahoma Tornado Relief Fund. Our sponsor Phora Group will match dollar for dollar.

Registration
MWLUG 2013 is 3 full days with additional events and workshops on Wednesday along with two full days of sessions on Thursday and Friday. Thanks to all the MWLUG sponsors, this three full days of events, technical sessions, and workshops is provided to attendees at no cost with the exception of a $35.00 donation. The agenda for MWLUG 2013 is:
  • Tuesday - TLCC TackItOn
  • Wednesday - Special events, workshops, and Welcome Reception
  • Thursday - OGS, technical session and Thursday Evening Event
  • Friday - Full day of sessions and CGS

Thursday, August 1, 2013

MWLUG 2013 Hotel Discount Extended to August 5, 2013 and More Rooms Added

I am happy to say that we have extended the Crowne Plaza Hotel - Indianapolis discount for MWLUG 2013 until August 5, 2013.  In addition, we have added more rooms to our MWLUG room block since we have exceed our room allocation.   So make sure you register soon for MWLUG 2013 and make your reservations at the Crowne Plaza Hotel.

To registration for MWLUG 2013, go to http://www.mwlug.com/mwlug/mwlug2013.nsf/Register.xsp

To my your room reservation for MWLUG 2013 go to . http://www.mwlug.com/mwlug/mwlug2013.nsf/Hotel.xsp

Thursday, July 25, 2013

MWLUG 2013 - Crowne Plaza Hotel Online Hotel Discount Expires August 1, 2013

The MWLUG 2013 online guaranteed discount of $139 for a double at the Crowne Plaza Hotel - Downtown will expire on August 1, 2013.  Afterwards, you will have to call and see if there is available rooms.  So make sure you book your room before August 1, 2013.  We are four weeks away from the start of MWLUG 2013 so make sure you register as soon as your can.  We will be announcing the Thursday Evening Event next week.

To register for MWLUG 2013, please go to our web site: http://www.mwlug.com/mwlug/mwlug2013.nsf/Register.xsp

Tuesday, July 16, 2013

Announcing the MWLUG 2013 OGS Speaker, From the Indianapolis Colts ...

We are very please to announce the MWLUG 2013 Opening General Speaker will be former US Marine, Author, and Indianapolis Colts Community Spokeperson, Josh Bleill.   Josh the author of One Step at a Time: A Young Marine's Story of Courage, Hope, and a New Life in the NFL present about building a Community.

Along with Scott Souder our MWLUG 2013 IBM OGS speaker, Josh will deliver our Opening General Session. Special thanks to Sam Bridegroom one of our Indianapolis MWLUG team members for making this possible.


Josh Bleill, Indianapolis Colts Community Spokesperson 

Marine Corporal Josh Bleill [Bly-ul; rhymes with “Kyle” or “smile”] is a native of Greenfield, Indiana. After graduating high school, Josh attended Purdue University. Upon completion of his education, Josh decided to serve his country by joining the United States Marine Corps in 2004, and was activated for a tour of duty in Iraq in 2006.

While serving in Iraq, Corporal Bleill was severely injured, resulting in the loss of both of his legs.  After extensive rehabilitation, Bleill returned to Indiana in August of 2008, where he attacked his new life head-on.  This new life included employment as the Indianapolis Colts Community Spokesperson.


Indianapolis Colts Owner, Jim Irsay, has described Bleill as “very talented, bright-eyed, and skilled,” and Josh now travels the country to spread his message of hope, “one step at a time.”

Tuesday, July 9, 2013

Announcing the MWLUG 2013 Sessions

We are please to post the sessions for MWLUG 2013.  We will be adding a few more sessions to this list as we get everything together for this conference.  MWLUG 2013 will have over 40+ sessions and workshops with a $35.00 donation.  For a list of the current MWLUG 2013 sessions go to:

http://www.mwlug.com/mwlug/mwlug2013.nsf/Sessions.xsp

To register for MWLUG 2013 go to:

http://www.mwlug.com/mwlug/mwlug2013.nsf/Register.xsp

Monday, June 17, 2013

Thanks to All for their MWLUG 2013 Abstract Submissions

Thank you to all the potential speakers for submitting their abstract to MWLUG 2013.  We have close to 70 submissions this year.  The MWLUG 2013 speaker committee will be review all the submissions and will announce our list of MWLUG 2013 speakers in a couple of weeks.

Wednesday, June 12, 2013

MWLUG 2013 Abstract Submission Closing on Friday June 14, 2013, 6:00 PM CST

Reminder to everyone who is thinking about submitting an abstract to MWLUG 2013, abstract submission will be closing this Friday, June 14, 2013 at 6:00 PM CST.  If you are new to the speaking at a conference, remember that our goal each year is to have up to 25% of the sessions be presented by new speakers.  Don't be shy, show us what you know.  MWLUG is all about the exchange of knowledge.  A number of first time speakers at MWLUG have now spoken at Lotusphere sorry IBM Connect. So here is your opportunity to present in front of your IBM community colleagues.  So get your submissions in by the end of this week!!!

Tuesday, June 11, 2013

The Last of Its Kind, Extinction in the Making

A few years ago at Lotusphere, I picked up a number of Lotus Software hats.  Just like the Lotus brand which is fading away into the sunset, all my Lotus Software hats have been lost or have been damaged.  My favor was the Lotus Domino 8 cap which was lost on a trip a few years ago.  Now I am down to my final Lotus Software hat.  I have decided to not wear it since it is the last of its kind and I will preserve it for the archive.  But as the Lotus brand is now extincted, so will everything associated with it.  Maybe in 30 years, I can go to the Antiques Roadshow and ask how much it is worth.  Maybe I can then finally retire from the proceeds of the sale.



Monday, June 10, 2013

Announcing MWLUG 2013 Charity Brewfest Competition and Event

Do you think you have created a great home brew or wine!!! Do you think your local micro-brewery beer is out of this world!!! Then bring them with you to MWLUG 2013 and lets find out.

We are happy to announce the MWLUG 2013 Charity Brewfest Competition. It will be held on Wednesday August 21, 2013 before the MWLUG Wednesday Exhibitor Showcase Reception. This competition is open for all attendees. We would like to thank our sponsor CDW for making this event possible.




Gregg Eldred and his panel of experienced judges will taste the different entries and select the winners of this competition. Gregg has selected some interesting prizes for this competition.

In order to participate in this competition, the submission fee is $10 with all proceeds benefiting the MWLUG Oklahoma Tornado Relief Fund. You can submit as many entries as you would like.  For each entry, please bring at least two 12 ounce bottles.  All competitors will need to sign a waiver. All nationally distributed micro-brewery beer do not qualify.

For every dollar that we raise in this event, our sponsor Phora Group will match a dollar.  We are working with other sponsors for additional matching funds that will all benefit the Oklahoma residences that have been devastated by the recent horrific tornadoes.

For information go to:

http://www.mwlug.com/mwlug/mwlug2013.nsf/WednesdayAgenda.xsp

To register for MWLUG 2013 go to:

http://www.mwlug.com/mwlug/mwlug2013.nsf/Register.xsp

Friday, June 7, 2013

Creating Twitter Bootstrap Widgets - Part IIIA - Using Dojo To Bring It Together


Creating Twitter Bootstrap Widgets - Part I - Anatomy of a Widget
Creating Twitter Bootstrap Widgets - Part II - Let's Assemble
Creating Twitter Bootstrap Widgets - Part IIIA - Using Dojo To Bring It Together

Note:  With a customer deadline coming up and with all the work that MWLUG 2013 requires, I haven't had the time to devote to writing this series.  So I took most of today to complete this part. As I was writing this part of the series, I realized that I should talk about creating widgets using Dojo in general. So I split this part into part A and B because it was getting way too long.

Welcome to part three of my five part series "Creating Twitter Bootstrap Widgets". In the first two parts, we talked about how Bootstrap widgets can be assembled using a consistent framework of standard HTML elements with CSS3 styling.  In part three, we will connect together our combo box widget using Dojo and make it functional.  

As XPages developer you should be familiar with Dojo as the underlining Javascript library.  XPages widgets are mostly Dojo widgets, Dijits.  To create a dojo widget we should be familiar with dojo.declare and dijit._Widget ( dijit._widgetBase for 1.7 or higher).  If you are familiar with these two features of Dojo, then you should wait for Part IIIB which I will publish next week.  

dojo.declare
Since JavaScript does not support a Class system Dojo simulates an object oriented class structure using dojo.declare which we will use to create our Bootstrap combo box widget.  In my opinion, this is one major reason to use Dojo which goes beyond the standard JavaScript Prototype.  With dojo.declare you can creating superclasses that other classes can inherit and use. Remember that I mentioned that Bootstrap widgets are like the RISC of widgets. With dojo.declare you can look at a Bootstrap widget as a collection of simpler widgets each with it only superclass.  Therefore in reflecting with the RISC approach, we want to create a number of reusable core superclasses that we can use to create our combo box widget.  For more information about using dojo.declare go to: http://dojotoolkit.org/reference-guide/1.6/dojo/declare.html.


dijit._Widget
The other important class of Dojo that we need to understand in creating our Bootstrap widget is dijit._Widget.  It handles the widget lifecycle from creation, startup to destruction.  In addition, it handles the registration of the widget and make it available to be reference in our code.  So if our widget has the id  of "myWidget", we can reference it after it has been instantiated using dijit.byId('myWidget'). I attempted to create my own widget registration classes so that I would not need to include all the overhead of dijit._Widget, but that experiment turned into a complex mess and I went back to dijit._Widget.  Maybe in the future I will try again.  I just do not like loading extra stuff if I do not need it.  A widget lifecycle includes:

Creation and Start Up:
  • constructor()
  • postscript()
  • create()
  • postMixinProperties()
  • buildRendering()
  • postCreate()
  • startup()
Destruction:
  • destroy();
  • destroyDescendants();
  • destroyRecursive();
  • destroyRendering();
  • uninitialize();
When creating your own Bootstrap widgets, the most important dijit methods are constructor, postCreate and startup.  Majority of the time when I create my own widgets, I just use postCreate. 

The skeleton HTML of our combo box Bootstrap widget is:

<div class="input-append dropdown">
 <input type="text" class="input">
 <button class="btn" type="button">
  <span class="caret"></span>
 </button>
 <ul class="dropdown-menu">
 </ul>
</div>
Note: I changed the DOM node as described in part II.  I changed the class "span3" of the input to "input-medium' and remove the class "span3" from the ul tag which provide the same alignment with less code.  

One important part of the widget life cycle is to define the HTML DOM of the widget. This is done in the life cycle "buildRendering."  You can define our Bootstrap widget skeleton DOM HTML in the widget js file, in a HTML template, or directly as part of page HTML DOM.  

Dojo provides a helper class , dijit._Templated, that allows you to define a key variable "templateString" as the DOM representative of the widget.  You can defined it directly


templateString = '<div class="input-append dropdown"><input type="text" class="input-medium"><button class="btn" type="button"><span class="caret"></span></button><ul class="dropdown-menu"></ul></div>';
or from a template file that you have as part of your file structure.
templateString: dojo.cache("myNameSpace", "templates/combobox.html")

By using the dijit._Templated, dijit._Widget will automatically use the templateString in the buildRendering() cycle for the widget.

If you are using a HTML template to define the templateString, you will also need to use dojo.provide to tell Dojo where the HTML template and js file are located. In addition to using a templateString to define the structure of our widget you can also define the widget DOM directly in the buildRendering() method or just have the complete widget DOM reference in the HTML page itself and get a handle the widget DOM node.

Creating the Bootstrap Combo Box Widget Classes

That all said, I like having the complete widget DOM skeleton as part of the HTML DOM so when the page loads there is no additional overhead of loading the dijit._Templated superclass.  Our iPhora Application Designer engine automatically places the complete Bootstrap widget DOM skeleton into the HTML DOM of the page.   Also in our case, we do not declaratively create the widget, so there is no need to perform a buildRendering. 

Since we will be using dijit._Widget to build our widget, we need to use dojo.require('dijit._Widget') to load the superclass when we load the page.  

In creating our combo box, Dojo will need to:
  • Get a data source that will define the dropdown list
  • Build the list nodes inside our UL dropdown node from a data source
  • Connect the different sub nodes to different events that can happen
  • Define setters and getters to our widget so that we can interact with the widget

There are several events that we expect to happen in a combo box:
  • Click on dropdown button to open or close the dropdown menu
  • Click somewhere else in the body to close the dropdown menu when the dropdown menu is opened.
  • Click on the dropdown menu to select the value and close the dropdown menu
  • Click on the input field to open and close the dropdown menu.

In order to have the widget understand the different events, you will need to define in your widget skeleton  the events for different parts of widget DOM using dojoAttachEvent.  When you are creating your widget class using dojo.declare, you need to define each event handle as a private method, for example _onSelectDropDown within your widget class.

dojo.declare('myComboBox',[dijit._Widget,dijit._Templated],{
    .
    .
    .
    _onSelectDropDown:function(){
       .
       .
       .
    }
});



In our case it will be dojoAttachEvent="onClick:_onSelectDropDown".  So our widget HTML DOM skeleton will look like:

<div class="input-append dropdown">
<input type="text" class="input" dojoAttachEvent="onClick:_onToggleDropDown">
<button class="btn" type="button" dojoAttachEvent="onClick:_onToggleDropDown">
<span class="caret"></span>
</button>
<ul class="dropdown-menu" dojoAttachEvent="onClick:_onSelectDropDown">
</ul>


Adding dojoAttachEvent in the widget DOM for events is consider best practice, but Richard never follows what is considered the normal anyway.  I prefer to use dojo.connect or in the case of dojo.declare, this.connect.  Why, since we are programmatically creating the widgets (because it is slightly faster) rather than declaratively, we are not using dojo.parse .  For a good discussion about best practices in creating custom Dijits go to this series:

http://dojotipsntricks.com/2011/04/23/custom-dijit-best-practises-part-1/
http://dojotipsntricks.com/2011/04/23/custom-dijit-best-practises-part-2/


Our combo box widget can be split up into three core widgets that can be reused. Therefore, we will first create a three superclasses using dojo.declare that we can reuse with other widgets in the future along with our combo box widget class:
  • Input Class called 'demoInput'
  • List Class called 'demoList'
  • Dropdown Class called 'demoDropDown'

Next time, we will go through the creation of each the classes and add them as superclasses to our combo box class to complete our widget class and demo it using our newly created classes.

Monday, June 3, 2013

Announcing MWLUG 2013 OGS Speaker - Scott Souder









I am happy to announce that the MWLUG 2013 IBM OGS Speaker is Scott Souder, Program Director, Messaging and Collaboration Solutions, IBM.  It is great to have Scott speak at MWLUG 2013 given his busy schedule.  We look forward to hearing Scott speak on the future direction of IBM Messaging and Collaboration solutions.


Scott Souder is Program Director, Messaging and Collaboration Solutions, IBM.  Scott is responsible for the product and market strategy for IBM's messaging and collaboration products, including IBM Notes and Domino, iNotes and IBM Connections Mail.  Scott's focus is on extending and growing the success of these solutions through customer engagement, partner ecosystem development, and harnessing the breadth and depth of the IBM organization.  In his spare time, Scott enjoys being with family, flying airplanes, playing bluegrass music, and the amazing outdoors.

Monday, May 20, 2013

Registration for MWLUG 2013 is Now Opened.

Registration for MWLUG 2013 is now opened.  We have expanded MWLUG 2013 to almost three full days this year with events starting on Wednesday morning.  We will have three special events, two workshops plus the evening reception on Wednesday.  As usually, we will have two full days of sessions on Thursday and Friday along with other events.

In addition, on Tuesday just before MWLUG, TLCC will be offering a XPages TackItOn session for attendees that are interesting XPages training.

We have some unique and fun surprises installed this year.  I am always thinking of interesting events. So look forward to announcements coming in the next few weeks as we get closer to MWLUG 2013.

For more information go to http://www.mwlug.com.

MWLUG 2013 is make possible by the generous support of our great IBM Business Partner community.  Our current MWLUG 2013 sponsors are:

Corporate Sponsor

  • BCC


Gold Sponsor

  • CDW
  • Panagenda
  • PSC Group

Silver Sponsor
  • Instant Technologies
  • NotesCode
  • Phora Group
  • Prominic.NET
  • Teamstudio

Event Sponsor
  • TLCC

Tuesday, May 14, 2013

Creating Twitter Bootstrap Widgets - Part II - Let's Assemble


Creating Twitter Bootstrap Widgets - Part I - Anatomy of a Widget
Creating Twitter Bootstrap Widgets - Part II - Let's Assemble
Creating Twitter Bootstrap Widgets - Part IIIA - Using Dojo To Bring It Together

This is two part of my five part series "Creating Twitter Bootstrap Widgets".   As I mentioned in part one of this series, Twitter Bootstrap widgets are built from a collection standard HTML elements, styled, and programmed to function as a single unit. The goal of this series is to teach you how to create a Bootstrap widget that utilizes the Bootstrap CSS and Dojo. The use of Dojo with Bootstrap is very limited with the exception of Kevin Armstrong who did an incredible job with his Dojo Bootstrap, http://dojobootstrap.com.

Our example is a combo box that we are building to replace the standard Bootstrap combo box. In part one, we built a widget that looks like a combo box but did not have a drop down menu associated with it to allow the user to make a selection.





In part two, we will create the drop down list associated with the combo box using the Bootstrap list component which is actually a collection of many standard HTML elements. However, before you create the drop down for our combo box, let's take a look at Bootstrap list component.  Show below are five Bootstrap widgets that you as a developer should be familiar with: listbox, navigator, menu, tab, and pagination.


What does these five widgets have in common? They all are made of the same collection of HTML components. They are A tag wrapped within a LI tag inside a DIV UL tag combination.













Without the Bootstrap CSS, this HTML element collection will get you this:











Not very appealing.  And this is the power of Bootstrap.  By using a combination of standard Bootstrap CSS classes, you can make a HTML element combination to represent a tab, navigator, or menu.

For our dropdown list all we have to do is add the class "dropdown" to the DIV wrapper tag and "dropdown-menu" to the UL wrapper and you will get a drop down menu which we will use in our combo box.













One important thing is the class "active". The way that Bootstrap CSS is structured, this class can be used to define the selected tab, menu item or in the case of a navigator, a selected panel. You can continuously use the same structure to build widgets.  Later I will show you that this will greatly benefit us when we connect the widget together using Dojo.

As with the input field that we discussed previously, we can append icons before or after the text. For example, to add an icon to a menu item all you have to do place an I tag with an icon class before the text in the menu.  Here we have added the icon-wrench icon before the text "Settings".










Tip: To create a blank icon to align the text in the menu use the class "icon-".

Bootstrap CSS also automatically handles the reversal of the icon when your mouse highlights over the menu item.  No programming at all.


We now can add the our dropdown menu to our combo box shell and get the structure of our combo box.



















Couple of comments here. By having the "dropdown" class in the primary div wrapper, the dropdown menu will automatically align below the input field.  The "span3" class is applied to both the input and ul tag so that they will be the same width.  In addition, the "span3" class normally applies a margin-left of 30px so we need to add the margin-left:0px style inline to remove that for the ul element. To expand the dropdown list to also beneath the button we will need to use a bit of JavaScript or define another class of span3_30 that is 30 pixels longer than span3.  If this is a responsive fluid layout, you will need to resize it using JavaScript and in general that is what I do. Or you can leave it as is.

So far we have not done anything with JavaScript at all and only relied on the Bootstrap CSS to assemble our widget. Bootstrap is just so amazing. Next time in Part III, we will use Dojo and dojo.declare to program our widget and make it functional.  We will also discuss how the structure of Bootstrap components lends itself well to Dojo and object oriented classes.

Note: If you want to try this, make sure you add a .dropdown-menu { display:block;} into head/style tag to override the Bootstrap CSS so that you can see the dropdown menu. If not, it is always hidden.

Monday, May 13, 2013

MWLUG 2013 is Now Open for Abstract Submission

This year MWLUG celebrates it 5th anniversary in providing our IBM community a first-class conference to network and share our knowledge in collaboration technology. This year, MWLUG will be held in the heart of downtown Indianapolis, Indiana at the Crowne Plaza Hotel - Union Station.
We invite you to submit your MWLUG 2013 presentation abstract(s) for an opportunity to speak at MWLUG 2013. MWLUG 2013 provides you as a speaker a unique opportunity to share your knowledge of collaboration technology with our vase IBM community.
Each year, we combine outstanding technical sessions with fun activities and networking events to help grow our vibrant community. As always our sessions include not only IBM related topics, but sessions on topics that helps you grow as an IT professional.
MWLUG 2013 will include over 40 technical sessions, workshops, and events. Topics for MWUG 2013 include:
  • Administration
  • Application Development
  • Best Practices and Customer Business Cases
  • Mobility and Web Security
  • Social Business
As a MWLUG speaker you are entitled to all the benefits of an attendee plus free admission and more.
As always at MWLUG, reserve about 25% of all speaking slots for new speakers. So whether you are a veteran speaker of Lotusphere, MWLUG, or never have presented at a major conference, here is your chance to speak and present your knowledge to our great IBM community.

MWLUG 2013 abstract submission will close on June 14, 2013.

Friday, May 10, 2013

What I did for the Past 5 Months - Becareful When You Are Volunteered

Right after MWLUG 2012 last year, my son volunteered me to participate with him on his Science Olympiad quest.  I figure it would not take too much time.  As a kid, I was involved with Science Fair competition for many years.  However, it seems things have changed.  I discovered that I was volunteered for the Mission Possible competition.  I was a bit surprised on the tasks that were required.  So over the next five months I had to build a Rube Goldberg machine that had 10 to 13 tasks.  In order to complete this machine, I would have had a machine shop at home.  Everyone has a machine shop don't they.  With no machine shop, I had to improvise with what tools I had.  Many many nights were spent in 20 degrees or less weather milling, sanding, cutting, and grinding wood and metal to make this machine.  Did I mentioned, that I do not have a heated garage nor is it attached.

So after many competitions and modifications we were successful in winning Gold in the Regional Competition.  I am very proud that he won four Gold Medals in every competition he participated.  Since my son was not a varsity member, Regionals was the end of this years competition.  His school however is going to the Nationals.  Unlike, our competitors whom had up to three electric motors to drive their machine, our machine relied only on potential and kinetic energy created by gravity.



As of this weekend, the machine is no longer functional since I needed the ball bearing to fix my bike.

Here is a video of my five months of hard work.




And yes Gregg it was a Miller Genuine Draft Beer Can.

MWLUG 2013 Abstract Submission on Monday

For those who have been waiting, MWLUG 2013 Abstract Submission will start this coming Monday, May 13, 2013.  We expect a significant number of entries this year so make sure you submit your entry.

Wednesday, May 8, 2013

Creating Twitter Bootstrap Widgets - Part I - Anatomy of a Widget

Creating Twitter Bootstrap Widgets - Part I - Anatomy of a Widget
Creating Twitter Bootstrap Widgets - Part II - Let's Assemble
Creating Twitter Bootstrap Widgets - Part IIIA - Using Dojo To Bring It Together

Twitter Bootstrap currently is the most popular open source responsive CSS framework. If you are using Bootstrap strictly as a responsive framework, you are missing out.  It is also a great framework for creating UI widgets and UI components. Bootstrap normally comes with JQuery plug-ins widgets like buttons, inputs, and drop-down menus.  You can use these plugins as a basis in creating more complexity widgets.

In this five part series, I will walk you through the process of creating a Bootstrap widget by first understanding how Bootstrap widgets are structured, how to layout a widget, tie it together using Dojo, turn it into a responsive widget, and how to create it as a XPages custom control for you XPagers out there. There are three prerequisites to continue, you need to have a good understanding of CSS especially CSS3, you need to know Dojo, and have created Dojo classes using dojo.declare. We will be using Dojo 1.52 and if I have time Dojo 1.83 AMD.

Many developers like JQuery since it simple to understand and use. However for our complex projects, Dojo is a better option especially when most of our iPhora Framework currently uses Dojo 1.52. When I looked into creating Bootstrap widgets, my goal was to replace the Dojo Dijits will a simpler and lighter weight widget architecture. I had already created my own widget architecture but I was having issues in maintaining it. By using the Bootstrap CSS and widget architecture, I now not only have a simpler widget architecture, but I also can create widgets that are responsive to changing screen size.

Widgets with Bootstrap takes significant advantage of HTML 5 and CSS3 allowing you to use it both for the desktop and mobile environments. The key to creating Bootstrap widgets is having a good understanding of the core and responsive versions of the Bootstrap CSS, bootstrap.css and bootstrap-responsive.css. It is extremely powerful and gives you tremendous flexibility while minimizing the amount of JavaScript code that you need to make the widget function within your application.

With the aid of the core Bootstrap CSS, you can create countless types of widgets without too much coding.  The first step is to look at the structure of a Bootstrap widget. Bootstrap widgets can be divided into four core components just as any type of JavaScript widgets:

  • Input
  • Button
  • List
  • Display

These components are combinations of standard HTML elements or groups of standard HTML elements that is assembled together and styled as a component using the Bootstrap CSS.  Dojo Dijit also does this, but not to the extent as Bootstrap widgets. Dojo Dijit whom are used in XPages mostly restyles a standard HTML element using the Dijit themes. Bootstrap rely heavily on wrapper div and span elements to generate the visual layout of a widget. By combining these four types you can create any types of widgets ranging from listboxes, drop-down menu to complex visual grids. The goal of this tutorial is to walk you through the process of creating a Bootstrap combo box using bootstrap components and tie it all together using Dojo. In our tutorial, we will be creating a combo box. Bootstrap does come with a combo box, but in my opinion it is very ugly as shown in the image below.











So I decided to use basic bootstrap components to create a much more stylish combo box to my liking as shown.











So lets start.  A typical INPUT element looks like:






However, with a bit of style of CSS from Bootstrap, the INPUT element now looks much nicer.






When you place you focus into the input field, it will automatically highlight, all without any JavaScript code.






But with Bootstrap we can further enhance the INPUT tag by adding wrapper HTML elements to improve the visual aspect of the INPUT element or any type of standard HTML elements. For example:








You get:






By adding the span tag with the class "add-on" with "%", the user visually understands the type of information that is expected. There is no validation of information, but by adding the span tag after the input tag within a div tag wrapper, the user now understands that they are expected to input a number. The class "span2" defines the width of the INPUT element which we will address when we talk about responsive widgets.  Using JavaScript and Regexp we can create client validation.  The wrapper class of "input-append" tell the browser that you want to append the visual queue after the input tag.  You can add these visual queue in front or after the input.  They can be characters like % or $, icons, or even buttons, Now lets expand on this widget by adding an icon instead of character.  In this case, we want to let the user know that we are expecting them to input an email address.







You get:





Visually is better to append it to the front of the input tag for an email address input field.  We add an icon by adding an i tag with a class of "icon-envelope" instead of a character.  Bootstrap comes with a variety of icons through the Glyphicons that are included as part of the Bootstrap assets.  There is a number of other open source icons that are available including FontAwesome http://fortawesome.github.io/Font-Awesome/.

The class "input-prepend" tells the browser that the visual queue will be in front of the input tag. Beside characters and icons we can also include buttons that have characters or icons.  So lets append a button with caret to the input as it would be in a combo box.














By adding a span tag with the class "caret" we now have a drop-down caret in the button. We could have had added an icon using the i tag also. So now we have what looks like a combo box  However, we do not have a drop-down to make a selection. So we have to create the drop-down list. We could use standard select tag but that would not be consistent and it would not look very good.  We can create the drop-down by using the core Bootstrap list component that you can use to create listboxes, navigators, drop-down objects and etc.  So next time, we will talk about the anatomy of the basic bootstrap list component and add it to our combo box widget to create the drop-down portion of our combo box and follow up later with a bit of Dojo to create our widget.