Enviar pesquisa
Carregar
Presentation BP205 "Custom Controls: Powerful, But Not Rocket Science!" Connect 2013
•
Transferir como ODP, PDF
•
0 gostou
•
370 visualizações
Martin Meijer
Seguir
My presentation on Connect 2013 "Custom Controls: Powerful, But Not Rocket Science!"
Leia menos
Leia mais
Tecnologia
Denunciar
Compartilhar
Denunciar
Compartilhar
1 de 78
Baixar agora
Recomendados
QuickLook Guide
QuickLook Guide
GARNETT2183
Sclerodermia e ipertensione polmonare
Sclerodermia e ipertensione polmonare
ilpolmone
News connect2
News connect2
Mats Jansson
Social Connections VI -- Customizing Connections Profiles to Provide a Compan...
Social Connections VI -- Customizing Connections Profiles to Provide a Compan...
Martin Leyrer
IBM Social Business Toolkit SDK - Playground and Scenarios
IBM Social Business Toolkit SDK - Playground and Scenarios
Niklas Heidloff
What's new in designer
What's new in designer
Raj J (Rajendran)
IBM Lotusphere 2013 AD109: Using the IBM® Sametime® Proxy SDK: WebSphere Port...
IBM Lotusphere 2013 AD109: Using the IBM® Sametime® Proxy SDK: WebSphere Port...
William Holmes
JavaOne 2013: Garbage Collection Unleashed - Demystifying the Wizardry
JavaOne 2013: Garbage Collection Unleashed - Demystifying the Wizardry
Ryan Sciampacone
Recomendados
QuickLook Guide
QuickLook Guide
GARNETT2183
Sclerodermia e ipertensione polmonare
Sclerodermia e ipertensione polmonare
ilpolmone
News connect2
News connect2
Mats Jansson
Social Connections VI -- Customizing Connections Profiles to Provide a Compan...
Social Connections VI -- Customizing Connections Profiles to Provide a Compan...
Martin Leyrer
IBM Social Business Toolkit SDK - Playground and Scenarios
IBM Social Business Toolkit SDK - Playground and Scenarios
Niklas Heidloff
What's new in designer
What's new in designer
Raj J (Rajendran)
IBM Lotusphere 2013 AD109: Using the IBM® Sametime® Proxy SDK: WebSphere Port...
IBM Lotusphere 2013 AD109: Using the IBM® Sametime® Proxy SDK: WebSphere Port...
William Holmes
JavaOne 2013: Garbage Collection Unleashed - Demystifying the Wizardry
JavaOne 2013: Garbage Collection Unleashed - Demystifying the Wizardry
Ryan Sciampacone
How to enhance Email with Embedded Experiences
How to enhance Email with Embedded Experiences
IBM Connections Developers
We4IT LCTY 2013 - captain mobility - whats new ibm notes traveler and mobile ...
We4IT LCTY 2013 - captain mobility - whats new ibm notes traveler and mobile ...
We4IT Group
Become an IBM Cloud Architect in 40 Minutes
Become an IBM Cloud Architect in 40 Minutes
Andrew Ferrier
BP102 Build Your Free Admin Toolkit
BP102 Build Your Free Admin Toolkit
Chris Miller
JMP102 Extending Your App Arsenal With OpenSocial
JMP102 Extending Your App Arsenal With OpenSocial
Ryan Baxter
IBM Connect AD206 IBM Domino XPages – Embrace, Extend, Integrate
IBM Connect AD206 IBM Domino XPages – Embrace, Extend, Integrate
Niklas Heidloff
Where Does IBM Web Experience Factory Fit in your Architecture? TECH-D22 from...
Where Does IBM Web Experience Factory Fit in your Architecture? TECH-D22 from...
Davalen LLC
Introducing Bluemix
Introducing Bluemix
Raul Chong
z/OS Small Enhancements - Episode 2015B
z/OS Small Enhancements - Episode 2015B
Marna Walle
Spark working with a Cloud IDE: Notebook/Shiny Apps
Spark working with a Cloud IDE: Notebook/Shiny Apps
Data Con LA
How to use the Social Business Development Environments
How to use the Social Business Development Environments
IBM Connections Developers
Introduction to IBM Cloud Private - April 2018
Introduction to IBM Cloud Private - April 2018
Michael Elder
Codemotion Rome 2015 Bluemix Lab Tutorial
Codemotion Rome 2015 Bluemix Lab Tutorial
gjuljo
Social Conndections VI -- Debugging IBM Connections During Install And Operation
Social Conndections VI -- Debugging IBM Connections During Install And Operation
Martin Leyrer
CampDevOps keynote - DevOps: Using 'Lean' to eliminate Bottlenecks
CampDevOps keynote - DevOps: Using 'Lean' to eliminate Bottlenecks
Sanjeev Sharma
Java and the GPU - Everything You Need To Know
Java and the GPU - Everything You Need To Know
Adam Roberts
IBM Bluemix Demos: Driving Smartphone and Personality Ball
IBM Bluemix Demos: Driving Smartphone and Personality Ball
Niklas Heidloff
z/OS Small Enhancements - Episode 2015A
z/OS Small Enhancements - Episode 2015A
Marna Walle
Radically Simple Management & Assembly of API-based Applications
Radically Simple Management & Assembly of API-based Applications
vinodmut
Ibm worklight - going from xpages mobile to native mobile applications
Ibm worklight - going from xpages mobile to native mobile applications
Mark Roden
AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of Terraform
Andrey Devyatkin
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...
apidays
Mais conteúdo relacionado
Semelhante a Presentation BP205 "Custom Controls: Powerful, But Not Rocket Science!" Connect 2013
How to enhance Email with Embedded Experiences
How to enhance Email with Embedded Experiences
IBM Connections Developers
We4IT LCTY 2013 - captain mobility - whats new ibm notes traveler and mobile ...
We4IT LCTY 2013 - captain mobility - whats new ibm notes traveler and mobile ...
We4IT Group
Become an IBM Cloud Architect in 40 Minutes
Become an IBM Cloud Architect in 40 Minutes
Andrew Ferrier
BP102 Build Your Free Admin Toolkit
BP102 Build Your Free Admin Toolkit
Chris Miller
JMP102 Extending Your App Arsenal With OpenSocial
JMP102 Extending Your App Arsenal With OpenSocial
Ryan Baxter
IBM Connect AD206 IBM Domino XPages – Embrace, Extend, Integrate
IBM Connect AD206 IBM Domino XPages – Embrace, Extend, Integrate
Niklas Heidloff
Where Does IBM Web Experience Factory Fit in your Architecture? TECH-D22 from...
Where Does IBM Web Experience Factory Fit in your Architecture? TECH-D22 from...
Davalen LLC
Introducing Bluemix
Introducing Bluemix
Raul Chong
z/OS Small Enhancements - Episode 2015B
z/OS Small Enhancements - Episode 2015B
Marna Walle
Spark working with a Cloud IDE: Notebook/Shiny Apps
Spark working with a Cloud IDE: Notebook/Shiny Apps
Data Con LA
How to use the Social Business Development Environments
How to use the Social Business Development Environments
IBM Connections Developers
Introduction to IBM Cloud Private - April 2018
Introduction to IBM Cloud Private - April 2018
Michael Elder
Codemotion Rome 2015 Bluemix Lab Tutorial
Codemotion Rome 2015 Bluemix Lab Tutorial
gjuljo
Social Conndections VI -- Debugging IBM Connections During Install And Operation
Social Conndections VI -- Debugging IBM Connections During Install And Operation
Martin Leyrer
CampDevOps keynote - DevOps: Using 'Lean' to eliminate Bottlenecks
CampDevOps keynote - DevOps: Using 'Lean' to eliminate Bottlenecks
Sanjeev Sharma
Java and the GPU - Everything You Need To Know
Java and the GPU - Everything You Need To Know
Adam Roberts
IBM Bluemix Demos: Driving Smartphone and Personality Ball
IBM Bluemix Demos: Driving Smartphone and Personality Ball
Niklas Heidloff
z/OS Small Enhancements - Episode 2015A
z/OS Small Enhancements - Episode 2015A
Marna Walle
Radically Simple Management & Assembly of API-based Applications
Radically Simple Management & Assembly of API-based Applications
vinodmut
Ibm worklight - going from xpages mobile to native mobile applications
Ibm worklight - going from xpages mobile to native mobile applications
Mark Roden
Semelhante a Presentation BP205 "Custom Controls: Powerful, But Not Rocket Science!" Connect 2013
(20)
How to enhance Email with Embedded Experiences
How to enhance Email with Embedded Experiences
We4IT LCTY 2013 - captain mobility - whats new ibm notes traveler and mobile ...
We4IT LCTY 2013 - captain mobility - whats new ibm notes traveler and mobile ...
Become an IBM Cloud Architect in 40 Minutes
Become an IBM Cloud Architect in 40 Minutes
BP102 Build Your Free Admin Toolkit
BP102 Build Your Free Admin Toolkit
JMP102 Extending Your App Arsenal With OpenSocial
JMP102 Extending Your App Arsenal With OpenSocial
IBM Connect AD206 IBM Domino XPages – Embrace, Extend, Integrate
IBM Connect AD206 IBM Domino XPages – Embrace, Extend, Integrate
Where Does IBM Web Experience Factory Fit in your Architecture? TECH-D22 from...
Where Does IBM Web Experience Factory Fit in your Architecture? TECH-D22 from...
Introducing Bluemix
Introducing Bluemix
z/OS Small Enhancements - Episode 2015B
z/OS Small Enhancements - Episode 2015B
Spark working with a Cloud IDE: Notebook/Shiny Apps
Spark working with a Cloud IDE: Notebook/Shiny Apps
How to use the Social Business Development Environments
How to use the Social Business Development Environments
Introduction to IBM Cloud Private - April 2018
Introduction to IBM Cloud Private - April 2018
Codemotion Rome 2015 Bluemix Lab Tutorial
Codemotion Rome 2015 Bluemix Lab Tutorial
Social Conndections VI -- Debugging IBM Connections During Install And Operation
Social Conndections VI -- Debugging IBM Connections During Install And Operation
CampDevOps keynote - DevOps: Using 'Lean' to eliminate Bottlenecks
CampDevOps keynote - DevOps: Using 'Lean' to eliminate Bottlenecks
Java and the GPU - Everything You Need To Know
Java and the GPU - Everything You Need To Know
IBM Bluemix Demos: Driving Smartphone and Personality Ball
IBM Bluemix Demos: Driving Smartphone and Personality Ball
z/OS Small Enhancements - Episode 2015A
z/OS Small Enhancements - Episode 2015A
Radically Simple Management & Assembly of API-based Applications
Radically Simple Management & Assembly of API-based Applications
Ibm worklight - going from xpages mobile to native mobile applications
Ibm worklight - going from xpages mobile to native mobile applications
Último
AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of Terraform
Andrey Devyatkin
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...
apidays
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
Orbitshub
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Safe Software
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Victor Rentea
Artificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : Uncertainty
Khushali Kathiriya
Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
panagenda
Polkadot JAM Slides - Token2049 - By Dr. Gavin Wood
Polkadot JAM Slides - Token2049 - By Dr. Gavin Wood
Juan lago vázquez
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
Angeliki Cooney
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
sammart93
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
apidays
Mcleodganj Call Girls 🥰 8617370543 Service Offer VIP Hot Model
Mcleodganj Call Girls 🥰 8617370543 Service Offer VIP Hot Model
Deepika Singh
Exploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with Milvus
Zilliz
Platformless Horizons for Digital Adaptability
Platformless Horizons for Digital Adaptability
WSO2
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
?#DUbAI#??##{{(☎️+971_581248768%)**%*]'#abortion pills for sale in dubai@
CNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In Pakistan
danishmna97
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
apidays
Corporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptx
Rustici Software
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
apidays
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024
MIND CTI
Último
(20)
AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of Terraform
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Artificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : Uncertainty
Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
Polkadot JAM Slides - Token2049 - By Dr. Gavin Wood
Polkadot JAM Slides - Token2049 - By Dr. Gavin Wood
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Mcleodganj Call Girls 🥰 8617370543 Service Offer VIP Hot Model
Mcleodganj Call Girls 🥰 8617370543 Service Offer VIP Hot Model
Exploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with Milvus
Platformless Horizons for Digital Adaptability
Platformless Horizons for Digital Adaptability
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
CNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In Pakistan
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Corporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptx
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024
Presentation BP205 "Custom Controls: Powerful, But Not Rocket Science!" Connect 2013
1.
BP205 Custom Controls:
Powerful, But Not Rocket Science Martin Meijer | Developer © 2013 IBM Corporation
2.
Legal disclaimer
© IBM Corporation 2013. All Rights Reserved. The information contained in this publication is provided for informational purposes only. While efforts were made to verify the completeness and accuracy of the information contained in this publication, it is provided AS IS without warranty of any kind, express or implied. In addition, this information is based on IBM’s current product plans and strategy, which are subject to change by IBM without notice. IBM shall not be responsible for any damages arising out of the use of, or otherwise related to, this publication or any other materials. Nothing contained in this publication is intended to, nor shall have the effect of, creating any warranties or representations from IBM or its suppliers or licensors, or altering the terms and conditions of the applicable license agreement governing the use of IBM software. References in this presentation to IBM products, programs, or services do not imply that they will be available in all countries in which IBM operates. Product release dates and/or capabilities referenced in this presentation may change at any time at IBM’s sole discretion based on market opportunities or other factors, and are not intended to be a commitment to future product or feature availability in any way. Nothing contained in these materials is intended to, nor shall have the effect of, stating or implying that any activities undertaken by you will result in any specific sales, revenue growth or other results. Performance is based on measurements and projections using standard IBM benchmarks in a controlled environment. The actual throughput or performance that any user will experience will vary depending upon many factors, including considerations such as the amount of multiprogramming in the user's job stream, the I/O configuration, the storage configuration, and the workload processed. Therefore, no assurance can be given that an individual user will achieve results similar to those stated here. All customer examples described are presented as illustrations of how those customers have used IBM products and the results they may have achieved. Actual environmental costs and performance characteristics may vary by customer. Adobe, the Adobe logo, PostScript, and the PostScript logo are either registered trademarks or trademarks of Adobe Systems Incorporated in the United States, and/or other countries. Java and all Java-based trademarks are trademarks of Sun Microsystems, Inc. in the United States, other countries, or both. Microsoft and Windows are trademarks of Microsoft Corporation in the United States, other countries, or both. Intel, Intel Centrino, Celeron, Intel Xeon, Intel SpeedStep, Itanium, and Pentium are trademarks or registered trademarks of Intel Corporation or its subsidiaries in the United States and other countries. UNIX is a registered trademark of The Open Group in the United States and other countries. Linux is a registered trademark of Linus Torvalds in the United States, other countries, or both. Other company, product, or service names may be trademarks or service marks of others. All references to [insert fictitious company name] refer to a fictitious company and are used for illustration purposes only. 2 © 2013 IBM Corporation
3.
About me
Martin Meijer Developer for Saxion (University in the Netherlands) Developer for Yellow 2010 Speaker (NLLUG, DNUG, Lotusphere Idol 2010) Big Fan of XPages Big Fan of OpenNTF 3 © 2013 IBM Corporation
4.
Agenda
XPages and Custom Controls Example 1: YouTube Example 2: Google Maps Example 3: Bootstrap OpenNTF Q&A ─ 4 © 2013 IBM Corporation
5.
What are Custom
Controls? Reusable piece of functionality Like a subform in Classic Domino, but better! Can contain the same elements as an XPage Powerful because of the custom properties ─ 5 © 2013 IBM Corporation
6.
Design Patterns
Use an XPage as a Container for your custom Controls Use a Custom Control as a container for a piece of functionality (Tagcloud, Search Control etc. etc) Use a Custom Control for your GUI (think of a Layout Custom Control with Editable Area's for nesting Custom Controls) ─ 6 © 2013 IBM Corporation
7.
Custom Properties 7
© 2013 IBM Corporation
8.
Custom Properties 8
© 2013 IBM Corporation
9.
Custom Properties 9
© 2013 IBM Corporation
10.
Custom Properties 10
© 2013 IBM Corporation
11.
Custom Properties 11
© 2013 IBM Corporation
12.
Custom Properties 12
© 2013 IBM Corporation
13.
Custom Properties 13
© 2013 IBM Corporation
14.
Custom Properties 14
© 2013 IBM Corporation
15.
Custom Properties 15
© 2013 IBM Corporation
16.
Custom Properties 16
© 2013 IBM Corporation
17.
Custom Properties 17
© 2013 IBM Corporation
18.
Custom Properties 18
© 2013 IBM Corporation
19.
Example 2: Google
Maps 19 © 2013 IBM Corporation
20.
Example 2: Google
Maps Start with the documentation! Copy & Past example, make it work. Look for elements you can make variable, they will become custom properties. ─ 20 © 2013 IBM Corporation
21.
https://developers.google.com/maps/documentation/javascript/tutorial#HelloWorld 21
© 2013 IBM Corporation
22.
Step 1: We
declare the application as HTML5 using the <!DOCTYPE html> declaration 22 © 2013 IBM Corporation
23.
Example 2: Google
Maps Step 1: We declare the application as HTML5 using the <!DOCTYPE html> declaration 23 © 2013 IBM Corporation
24.
Step 2: We
include the Maps API JavaScript using a script tag. 24 © 2013 IBM Corporation
25.
Step 2: We
include the Maps API JavaScript using a script tag. <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&sensor=SET_TO_TRUE_OR_FALSE"> </script> key=YOUR_API_KEY sensor=SET_TOTRUE_OR_FALSE Parameters: What is this? Remember .... Read the documentation! 25 © 2013 IBM Corporation
26.
Step 2: We
include the Maps API JavaScript using a script tag. key=YOUR_API_KEY Conclusion: for this simple example we don't need this 26 © 2013 IBM Corporation
27.
Step 2: We
include the Maps API JavaScript using a script tag. sensor=SET_TOTRUE_OR_FALSE Conclusion: It is used to determine the user's location/ It is a required value, in this example we will use sensor=false 27 © 2013 IBM Corporation
28.
Step 2: We
include the Maps API JavaScript using a script tag. 28 © 2013 IBM Corporation
29.
Step 2: We
include the Maps API JavaScript using a script tag. 29 © 2013 IBM Corporation
30.
Step 2: We
include the Maps API JavaScript using a script tag. 30 © 2013 IBM Corporation
31.
Step 3: We
create a div element named "map_canvas" to hold the Map. 31 © 2013 IBM Corporation
32.
Step 3: We
create a div element named "map_canvas" to hold the Map. 32 © 2013 IBM Corporation
33.
Step 3: We
create a div element named "map_canvas" to hold the Map. 33 © 2013 IBM Corporation
34.
Step 4: We
create a JavaScript object literal to hold a number of map properties. Step 5: We write a JavaScript function to create a "map" object. 34 © 2013 IBM Corporation
35.
Step 4: We
create a JavaScript object literal to hold a number of map properties. Step 5: We write a JavaScript function to create a "map" object. Step 6: We initialize the map object from the body tag's onload event. 35 © 2013 IBM Corporation
36.
So far ... 36
© 2013 IBM Corporation
37.
So far ... 37
© 2013 IBM Corporation
38.
What not to
forget Style: See Hello World example ... 38 © 2013 IBM Corporation
39.
What not to
forget Style: See Hello World example ... 39 © 2013 IBM Corporation
40.
What not to
forget Meta tag: See Hello World example ... 40 © 2013 IBM Corporation
41.
What not to
forget Style: See Hello World example ... Conclusion: In this example we don't use it 41 © 2013 IBM Corporation
42.
We are ready,
let's try! 42 © 2013 IBM Corporation
43.
Now we can
make use of Custom Properties to make things Configurable! 43 © 2013 IBM Corporation
44.
Now we can
make use of Custom Properties to make things Configurable! var mapOptions = { center: new google.maps.LatLng(-34.397, 150.644), zoom: 8, mapTypeId: google.maps.MapTypeId.ROADMAP }; center: new google.maps.LatLng(-34.397, 150.644), zoom: 8, mapTypeId: google.maps.MapTypeId.ROADMAP 44 © 2013 IBM Corporation
45.
Now we can
make use of Custom Properties to make things Configurable! 45 © 2013 IBM Corporation
46.
Now we can
make use of Custom Properties to make things Configurable! 46 © 2013 IBM Corporation
47.
Now we can
make use of Custom Properties to make things Configurable! 47 © 2013 IBM Corporation
48.
Now we can
make use of Custom Properties to make things Configurable! Use #(javascript:compositeData.yourproperty) to replace the 'old' value in your source code 48 © 2013 IBM Corporation
49.
Now we can
make use of Custom Properties to make things Configurable! This is what you can configure with the Custom Properties when you use the custom control on your XPage 49 © 2013 IBM Corporation
50.
This was only a small piece of the Google Maps API The Google Maps API is big! You can download my version (not the complete API implemented) on OpenNTF http://www.openntf.org/internal/home.nsf/project.xsp? action=openDocument&name=Google%20Maps%20Custom%20Control ─ 50 © 2013 IBM Corporation
51.
Example 3: Bootstrap 51
© 2013 IBM Corporation
52.
Example 3: Bootstrap
Start with the documentation! Copy & Past example, make it work. Look for elements you can make variable, they will become custom properties. ─ 52 © 2013 IBM Corporation
53.
Example 3: Bootstrap http://twitter.github.com/bootstrap/index.html 53
© 2013 IBM Corporation
54.
Example 3: Bootstrap
Unzip the downloaded bootstrap file Drag & Drop the files (css, img and js) to your WebContent directory in the Package Explorer ─ 54 © 2013 IBM Corporation
55.
Example 3: Bootstrap 55
© 2013 IBM Corporation
56.
Example 3: Bootstrap 56
© 2013 IBM Corporation
57.
Example 3: Bootstrap
7-10 57 © 2013 IBM Corporation
58.
Example 3: Bootstrap
Create the new Custom Control 58 © 2013 IBM Corporation
59.
Example 3: Bootstrap
<head> – Source code from Bootstrap starter template 59 © 2013 IBM Corporation
60.
Example 3: Bootstrap
You can add the header info in your Custom Control 60 © 2013 IBM Corporation
61.
Example 3: Bootstrap
<body> – Source code from Bootstrap starter template 61 © 2013 IBM Corporation
62.
Example 3: Bootstrap
You can add the body info in your Custom Control 62 © 2013 IBM Corporation
63.
Example 3: Bootstrap
The result ... 63 © 2013 IBM Corporation
64.
Example 3: Bootstrap
make the brand configurable ... 64 © 2013 IBM Corporation
65.
Example 3: Bootstrap
make the brand configurable ... 65 © 2013 IBM Corporation
66.
Example 3: Bootstrap
make the brand configurable ... 66 © 2013 IBM Corporation
67.
Example 3: Bootstrap
make the menu configurable ... 67 © 2013 IBM Corporation
68.
Example 3: Bootstrap
make the menu configurable ... 68 © 2013 IBM Corporation
69.
Example 3: Bootstrap
make the menu configurable ... 69 © 2013 IBM Corporation
70.
Example 3: Bootstrap
make the menu configurable ... 70 © 2013 IBM Corporation
71.
Example 3: Bootstrap
make the menu configurable ... 71 © 2013 IBM Corporation
72.
Example 3: Bootstrap
make the content configurable ... 72 © 2013 IBM Corporation
73.
Example 3: Bootstrap
make the content configurable ... 73 © 2013 IBM Corporation
74.
Example 3: Bootstrap
make the content configurable ... 74 © 2013 IBM Corporation
75.
Example 3: Bootstrap
make the content configurable ... 75 © 2013 IBM Corporation
76.
OpenNTF 76
© 2013 IBM Corporation
77.
OpenNTF Import and
Export for Designer 77 © 2013 IBM Corporation
78.
Q&A 78
© 2013 IBM Corporation
Baixar agora