Wiki source code of Front-end Resources
Version 21.4 by beldaz on 2015/08/12
Hide last authors
| author | version | line-number | content |
|---|---|---|---|
 |
21.3 | 1 | {{box cssClass="floatinginfobox" title="**Contents**"}} |
| 2 | {{toc/}} | ||
| 3 | {{/box}} | ||
| 4 | |||
 |
21.1 | 5 | {{info}} |
| 6 | This section is a work in progress. | ||
| 7 | {{/info}} | ||
 |
4.1 | 8 | |
 |
20.1 | 9 | This section aims to document all the front-end resources available in XWiki for application developers and for developers of the XWiki products. Front-end resources are of two main types: |
| |
16.1 | 10 | |
 |
6.1 | 11 | * External Libraries |
| |
21.3 | 12 | * Internal components (based or not on some of the external libraries) |
| |
5.1 | 13 | |
| |
21.3 | 14 | Front-end resources are mainly composed of JavaScript libraries, CSS stylesheets and their corresponding HTML reusable snippets (or velocity macro to output this snippet) and velocity macros. |
| |
6.1 | 15 | |
| |
20.1 | 16 | Some of the resources presented in here are not included by default with all HTML-rendered wiki pages (it would be too much to send to the client!). You have to request their inclusion from a skin template or from the wiki page itself using the ##jsfx## plugin. For example, to request the inclusion of scriptaculous slider library, you can write, in [[XWiki Syntax 1.0>>Main.XWikiSyntax]]: |
| |
11.1 | 17 | |
| |
21.1 | 18 | {{code}} |
| 19 | $xwiki.jsfx.use("js/scriptaculous/slider.js") | ||
| 20 | {{/code}} | ||
| |
11.1 | 21 | |
| |
16.1 | 22 | In [[XWiki Syntax 2.0>>Main.XWikiSyntax]]: |
| |
11.1 | 23 | |
| |
16.1 | 24 | {{code}} |
| |
11.1 | 25 | {{velocity}} |
| 26 | $xwiki.jsfx.use("js/scriptaculous/slider.js") | ||
| 27 | {{/velocity}} | ||
| |
16.1 | 28 | {{/code}} |
| |
11.1 | 29 | |
| |
16.1 | 30 | The path you indicate to the ##jsfx## plugin is the relative path where the library can be found under the ##resources## directory of the XWiki webapp. Similarly to the ##jsfx## plugin, there is a ##ssfx## plugin that can be used to request the inclusion of CSS stylesheets files. |
| |
11.1 | 31 | |
| |
17.1 | 32 | = External resources = |
| |
6.1 | 33 | |
| |
21.3 | 34 | External resources are third party libraries bundled with the XWiki webapp as resources developers can use for their in-wiki applications or to enhance the wiki itself. External resources are not included by default in HTML-rendered wiki pages, except for ##prototype.js##. |
| |
11.1 | 35 | |
| 36 | Hereunder is a table presenting some of the external libraries XWiki comes with: | ||
| 37 | |||
| |
21.3 | 38 | |image:prototype.gif |image:smartclient.png |
| 39 | |[[Prototype>>http://prototypejs.org]] is a //"JavaScript framework that aims to ease development of web applications"//. It extends the JavaScript native objects and browser objects providing utilities for Ajax, OOP-style classes, and much more. Prototype is the only JavaScript library that is systematically shipped with any wiki page in XWiki.|[[Smartclient>>http://www.smartclient.com/]] is an AJAX RIA system that allows the easy development of rich interface components. Using it in XWiki, you can build powerful front-end widgets that can leverage [[XWiki's RESTful API>>Features.XWikiRESTfulAPI]]. | ||
| |
9.1 | 40 | |
| |
6.1 | 41 | * Scriptaculous |
| |
5.1 | 42 | * YUI |
| |
18.1 | 43 | * [[LiveValidation]] |
| |
5.1 | 44 | |
| |
17.1 | 45 | = Internal resources = |
| |
1.1 | 46 | |
| |
17.1 | 47 | == Front-end Components == |
| |
12.2 | 48 | |
| |
16.1 | 49 | * [[Modal Popup>>ModalPopup]] |
| 50 | * [[Confirmation Box>>ConfirmationBox]] | ||
| 51 | * [[LiveTable]] | ||
| 52 | * [[Auto Suggest Widget>>DevGuide.AutoSuggestWidget]] | ||
 |
19.1 | 53 | * [[Notification Widget>>DevGuide.XWikiNotifications]] |
 |
20.4 | 54 | * [[HTML5 Upload>>DevGuide.HTML5Upload]] |
| |
21.2 | 55 | * [[Autosave>>DevGuide.Autosave]] |
| |
12.2 | 56 | |
| |
17.1 | 57 | == JavaScript resources == |
| |
11.2 | 58 | |
| |
16.1 | 59 | * [[JavaScriptAPI]] |
| 60 | * [[XWiki RESTFul API>>Features.XWikiRESTfulAPI]] | ||
| |
11.2 | 61 | |
| |
17.1 | 62 | == StyleSheet resources == |
| |
11.2 | 63 | |
| |
16.1 | 64 | * [[Pagination>>Pagination]] |
| 65 | * [[Result List>>ListOfResults]] | ||
| 66 | * [[Search Box>>SearchBox]] | ||
| 67 | * [[Suggest Box>>SuggestBox]] | ||
| |
20.2 | 68 | * [[Special CSS Classes>>SpecialCSSClasses]] |
| |
21.1 | 69 | * [[CSS classes used for icons>>StandardIconClasses]] |
| |
20.3 | 70 | * Forms Layout Type: |
| 71 | ** [[Vertical Layout>>VerticalForms]] | ||
| 72 | ** [[Inline Layout>>InlineForms]] |
