SharePoint Saturday DC: 12/05/09 Presented by: Will Lawrence and the jPoint Team jPoint: A jQuery Based Library for creating Web 2.0 Apps in SharePoint.
Post on 15-Jan-2016
219 Views
Preview:
Transcript
SharePoint Saturday DC: 12/05/09Presented by: Will Lawrence and the jPoint Team
jPoint:jPoint: A jQuery Based Library A jQuery Based Library for creating Web 2.0 Apps in SharePoint for creating Web 2.0 Apps in SharePoint
jPoint:jPoint: A jQuery Based Library A jQuery Based Library for creating Web 2.0 Apps in SharePoint for creating Web 2.0 Apps in SharePoint
Intro
AgendaAgenda
Old Aviation Event Reporting Process
1.Crash recorded by hand
2.Faxed to HQ in Washington and “processed”
3.Executives and special persons notified by voice
4.Event reports and verbal notifications recorded in spreadsheet and filed
Demo: Quick BackgroundDemo: Quick Background
Demo: Quick BackgroundDemo: Quick Background
Improved Event Reporting Process
1.Crash entered into SharePoint
2.Washington HQ “processes” event from Dashboard
3.Executives and special persons notified by voice
4.Verbal notifications recorded online in a SP list
What functionality is in the Dashboard in Step 2?
What happens in Step 4?
Answers: Watch the demo
Design DilemmaDesign Dilemma
• HQ client wants new event reporting process implemented quickly
• HQ client wants fancy features
• Design– A lot of details have been left out, but it
essentially comes down to one question SharePoint Designer or Visual Studio?
Visual Studio vs SharePoint Designer Tradeoffs
Visual Studio vs SharePoint Designer Tradeoffs
0
20
40
60
80
100
120
Time
% R
eq
uir
em
en
ts C
om
ple
te
Legend
SharePoint Designer
Visual Studio
jPoint Boost SP DevelopmentjPoint Boost SP Development
0
20
40
60
80
100
120
Time
% R
eq
uir
em
en
ts C
om
ple
te
Legend
jPoint
SharePoint Designer
Visual Studio
Activities that are difficult
…without jPoint
– Manipulate New/Disp/Edit form fields and their custom counterparts, dataViewWebParts
– Access SharePoint data from client side
– Build Web 2.0 and AJAX features quickly
Demo PreviewDemo PreviewFeatures
– Drag and Drop– Form field expandos– Date/Time/Timezone jQuery plugin in form– Auto save– Live lists as queues– Flexigrid jQuery plugin connected to SP data– Live collaboration
Video / Demo TimeVideo / Demo Time
Activities made difficult without jPoint
– Manipulate New/Disp/Edit form fields and their custom counterparts, dataViewWebParts
– Access SharePoint data on the client
– Build Web 2.0 and AJAX features quickly
Demo ReviewDemo ReviewFeatures
– Drag and Drop– Form field expandos– Date/Time/Timezone jQuery plugin in form– Auto save– Live lists as queues– Flexigrid jQuery plugin connected to SP data– Live collaboration
Client Side Script SolutionsClient Side Script Solutions
Why?
• To fill the value gap, increase ROI, and provide a visually stimulating, rich UX.
• Rapid prototyping and agile development lead to successful and sustainable solutions.
• Mashups and composite applications bring more value to the user.
What?• JavaScript
– jQuery– jQuery UI and plugins– jPoint
• API / SharePoint data layer• Web part deployment• jParts
– “jQuery plugins” for SP– User modifiable options
• Cloud Services– Charts (Google API)– Maps (Google, Bing)
• Content needs to be marked up early, easily, and often to prevent garbage and lackluster participation
• Business process integration into SharePoint needed to familiarize users with tools before successful business process improvement.
• Value gap should be filled for better ROI (it seems obvious, but is sometimes a hard fight)
• Need to show WIIFM (What’s In It For Me?) to gain user adoption
• UI Customizations and stimulating UX help to comfort and empower users
The value traditionallyseen from SharePoint
What is required by the business need
The value gap
Improve metadata inputIntegrate existing processes
Smart customization
Content ManagementCollaboration
Search
jPointjPoint
jQuery is Hot Topic for SharePointjQuery is Hot Topic for SharePoint
– I saw it being mentioned 3 times at this summer’s Regional SharePoint Conference.
– I saw it being mentioned 6 or more times and jQuery was used in live demos in at least 3 presentations at the SharePoint Conference 2009 in Vegas. Below are my live blog posts from the demos using jQuery.
• SharePoint Designer 2010 – Building Composite Apps: From SPC09 Las Vegas
• Enterprise Mashups with SharePoint Designer 2010, Bing map services, and Restful web services: From SPC09 Las Vegas
• Working with the new Client Object Model: From SPC09 Las Vegas
jPoint: UnleashedjPoint: Unleashed
Origins
6/13/08 4/3/09 8/22/09 8/28/09
Reasons and Motivation behind jPoint Project
Reasons and Motivation behind jPoint Project
• Client side code stored in content DB is easier to maintain than server side code for multiple front-end web servers in multiple server farms (due to austere regional replication)
• Need for cross-browser compatibility
• 3rd party paid web part solutions– Bundled packages too
expensive– Licensing headaches– I do not like being charged
for a web part that I can re-create in less than 45 minutes
• Need for comprehensive JavaScript library
Quick Mental ImageQuick Mental ImageMultiple server farm for regional replication
jPoint: UnleashedjPoint: Unleashed
Thanks!
Inspiration
Download from Download from
CodeplexCodeplex
The many great bloggers in the
community
Old and New ModelsOld and New Models
New! Model, developers:– Do not need to be SharePoint and
JavaScript Jedi Masters– Write re-usable code that is cross-browser
compatible– Rely on (or help) community to update
jPoint open source code– Use jPoint API that works with 2007 and
SharePoint 2010
Old Model, developers:
– Need to know underlying SharePoint details
– Hard code scripts that work for one page, one browser
– Use borrowed code from multiple sites that is hard to maintain
SharePoint
jPointjPointPlu
gin
sPlu
gin
sjPart SolutionjPart Solution
jQu
ery
jQu
ery
User OptionsUser Options
SharePoint
Borr
ow
ed
Scr
ipts
Borr
ow
ed
Scr
ipts
Form FieldsForm Fields Web ServicesWeb Services
Custom Script Solution
Custom Script Solution
jQu
ery
jQu
ery
jPoint: ComponentsjPoint: Components
• jPointLoader.js– Dynamically loads
jQuery and jPoint– Parameter passing to
override default paths
• Example:– <script
src=“jPointLoader.js?jQueryPath=/js/jQuery/”></script>
• jPoint.js– Contains main jPoint
class.– jP is to jPoint as $ is to
jQuery
jPointLoaderjPointLoader
jPartsjParts
jParts: Scripts as Web PartsjParts: Scripts as Web Parts
jPart TemplatejPart Template
Live Demo TimeLive Demo Time
A sliding scale of solution sophisticationDifferent tools for different roles
No-code solutions
Declarativesolutions, some code
Sophisticated enterprise applications
Visual Studio
SharePoint Designer
Office
Browser
Larger team developmentALM
Enterprise application integrationAcross the firewall integrationWeb services and components
Manageability
Declarative integration to external dataRelatively sophisticated workflows
Rich forms-based applicationsWeb design
Some VS-based (WF activities, web parts)
BU reporting, tracking Access DBs
User customized sitesAd-hoc solutions
Browser-based SharePoint data definition
Using galleries of web parts
Enable
Enable
Highest sophistication
Highest empowerment
Thank youThank you
• Remember to: – Share jPoint. It’s open source.
– Checkout http://jPoint.codeplex.com and supporting site http://sharejPoint.com.
• Contact me at :– will.lawrence@sharejPoint.com
– Twitter: @willhlaw
• Looking for:– Sponsors to support sharejPoint organization
– Developers to constantly improve the project
top related