From richfaces-svn-commits at lists.jboss.org Thu Aug 27 12:12:29 2009 Content-Type: multipart/mixed; boundary="===============3545616747890286208==" MIME-Version: 1.0 From: richfaces-svn-commits at lists.jboss.org To: richfaces-svn-commits at lists.jboss.org Subject: [richfaces-svn-commits] JBoss Rich Faces SVN: r15353 - branches/community/3.3.X/docs/userguide/en/src/main/docbook/included. Date: Thu, 27 Aug 2009 12:12:29 -0400 Message-ID: <200908271612.n7RGCT4b008660@svn01.web.mwc.hst.phx2.redhat.com> --===============3545616747890286208== Content-Type: text/plain; charset="utf-8" MIME-Version: 1.0 Content-Transfer-Encoding: quoted-printable Author: atsebro Date: 2009-08-27 12:12:28 -0400 (Thu, 27 Aug 2009) New Revision: 15353 Modified: branches/community/3.3.X/docs/userguide/en/src/main/docbook/included/ric= h_hotKey.xml Log: RF-7756: Rich Miscellaneous component group description review --> rich:hot= Key Modified: branches/community/3.3.X/docs/userguide/en/src/main/docbook/inclu= ded/rich_hotKey.xml =3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D= =3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D= =3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D --- branches/community/3.3.X/docs/userguide/en/src/main/docbook/included/ri= ch_hotKey.xml 2009-08-27 16:08:52 UTC (rev 15352) +++ branches/community/3.3.X/docs/userguide/en/src/main/docbook/included/ri= ch_hotKey.xml 2009-08-27 16:12:28 UTC (rev 15353) @@ -1,102 +1,69 @@
- - < - rich:hotKey - > - <emphasis role=3D"since"> - <superscript> available since <emphasis role=3D"version">3.2.2</e= mphasis> - </superscript> - </emphasis> - -
- Description - The - <rich:hotKey> - component allows to register hot keys for the page or= particular elements and to define client-side processing functions for the= se keys. - = -
-
- Key Features = - - - - Includes all features of the Javascript jQuery Hotkeys Plugin - - - - - Hot key registration by request through JavaScript API - - - - - Possibility to attach - <rich:hotKey> - to a whole page or = - to a particular element using - "selector" - attribute - - - - - Hot key registration timing = - - + < rich:hotKey > <emphasis role=3D"since"> + <superscript> available since <emphasis role=3D"version"= >3.2.2</emphasis> + </superscript> + </emphasis> + +
+ Description + + The <rich:hotKey>= ; component allows to register hot keys for the page = or particular elements and to define client-side processing functions for t= hese keys. + +
+
+ Key Features + + + Includes all features of the Javascript jQuery Hotkeys Plugin + + + + + Hot key registration by request through Java= Script API + + + + + Possibility to attach <rich:hotKey> to a whole page or to= a particular element using "selector" attribute + + + + + Hot key registration timing + + = - - - Enabling/disabling the - <rich:hotKey> - using JavaScript API = - - - -
-
- Details of Usage - - There are two ways to register - <rich:hotKey> - : - - - - - just place it anywhere on the page. In this case the - <rich:hotKey> - - component is attached to the whole page (html[0] element). This is default scenario. - - - - - attach it with - "selector" - attribute to all the elements defined using thi= s selector. = - This attribute uses defined by w3c cons= ortium syntax for CSS rule selector with some jQuery extensions. = - - - - - The - "key" - attribute defines the hot key itself = - which is processed by the component. = - - - After the hot key has been registered and defined you could se= t the - "handler" - = - attribute which determines a JavaScript function to be called = every time when corresponding keys are pressed. = - - - - Example: - - - ... -<rich:listShuttle var=3D"cap" sourceValue=3D"#{capitalsBean.capitals}" = id=3D"ls"> + + + Enabling/disabling the <rich:hotKey> using JavaScript API + + + +
+
+ Details of Usage + + There are two ways to register <= property><rich:hotKey>: + + + + + place it anywhere on the page. In this case = the <rich:hotKey> component is attached to the whole page (html[0] element)= . This is default scenario. + + + + + attach it with "selector= " attribute to all the elements defined using this se= lector. This attribute uses defined by w3c= consortium syntax for CSS rule selector with some jQuery extension= s. + + + + + The "key" attr= ibute defines the hot key itself which is processed by the component. + + + After the hot key has been registered and defined you co= uld set the "handler" attribute w= hich determines a JavaScript function to be called every time when correspo= nding keys are pressed. + + <rich:listShuttle var=3D"cap" = sourceValue=3D"#{capitalsBean.capitals}" id=3D"ls"> <rich:column> <f:facet name=3D"header"> <h:outputText value=3D"State flag"/> @@ -110,172 +77,137 @@ <h:outputText value=3D"#{cap.name}"/> </rich:column> </rich:listShuttle> -<rich:hotKey selector=3D"#ls" key=3D"right" handler=3D"#{rich:component= ('ls')}.copy()"/> -<rich:hotKey selector=3D"#ls" key=3D"left" handler=3D"#{rich:component(= 'ls')}.remove()"/> -<rich:hotKey selector=3D"#ls" key=3D"end" handler=3D"#{rich:component('= ls')}.copyAll()"/> -<rich:hotKey selector=3D"#ls" key=3D"home" handler=3D"#{rich:component(= 'ls')}.removeAll()"/> -... - - In the example above the - "selector" - attribute is used. = - So the keys work only if - <rich:listShuttle> - component is focused. = - - - You could press Right or Left= keys in order to move some selected items between lists. = - You could press Home or End b= uttons in order to move all items between lists. = - - - With the help of the - "timing" - attribute - you could manage - <rich:hotKey> - registration timing. = - There are three possible values of this attribute: - - - - - "immediate" - the component is rendered in browser imm= ediately (by default) = - - - - - "onload" - the component is rendered after the page is= fully loaded - - - - - "onregistercall" - the component is rendered only afte= r JavaScript API for the key registration is used. - - - - - The - "type" - attribute defines the type of keyboard event. Possibl= e values are: = - "onkeyup", "onkeypress" and "onkeydown". - - = - - The - "disableInInput" - attribute disables the - <rich:hotKey> - if it is activated on input elements and the value of= this attribute is "true". - - - The - "checkParent" - attribute defines the hotkey handling of events gener= ated by child components nested into the parent component to which the - <rich:hotKey> - is attached. - - - The - <rich:hotKey> - component also provides a number of JavaScript API fu= nctions. There is an example below. - - - Example: - = - ... -<h:form id=3D"myForm"> +<rich:hotKey selector=3D"#ls" key=3D"right" handler=3D"#{rich:compon= ent('ls')}.copy()"/> +<rich:hotKey selector=3D"#ls" key=3D"left" handler=3D"#{rich:comp= onent('ls')}.remove()"/> +<rich:hotKey selector=3D"#ls" key=3D"end" handler=3D"#{rich:compone= nt('ls')}.copyAll()"/> +<rich:hotKey selector=3D"#ls" key=3D"home" handler=3D"#{rich:component(= 'ls')}.removeAll()"/> + In the example above the + "selector" + attribute is used. So the keys work only if = + <rich:listShuttle> + component is focused. + You could press Right or Left keys in order to move some selected items between lists. Y= ou could press Home or End button= s in order to + move all items between lists. + With the help of the + "timing" + attribute you could manage + <rich:hotKey> + registration timing. There are three possibl= e values of this attribute: + + + + immediate =E2=80=94 the compone= nt is rendered in browser immediately (default value); + + + + + onload =E2=80=94 the component = is rendered after the page is fully loaded; + + + + + onregistercall =E2=80=94 the co= mponent is rendered only after JavaScript API for the key registration is u= sed. = + + + + The "type" att= ribute defines the type of keyboard event. Possible values are: onkey= up, onkeypress and onkeydown. + + + The + "disableInInput" + attribute disables the + <rich:hotKey> + if it is activated on input elements and the= value of this attribute is true. + The + "checkParent" + attribute defines the hotkey handling of eve= nts generated by child components nested into the parent component to which= the + <rich:hotKey> + is attached. + The + <rich:hotKey> + component also provides a number of JavaScri= pt API functions. There is an example below. + <h:form id=3D"myForm"> <rich:hotKey id=3D"myKey" key=3D"ctrl+g" handler=3D"alert('Ctrl+G is p= ressed')" /> <button onclick=3D"${rich:component('myKey')}.enable(); return false;"= >Turn Ctrl+G On</button> <button onclick=3D"${rich:component('myKey')}.disable(); return false;= ">Turn Ctrl+G Off</button> -</h:form> = -... = - - In the example above the Ctrl+G is registered as a = global hotkey, = - so if you press this key combination the alert window with the "Ctrl+G is pressed" text appears. With the help - of enable(), disable() JavaScr= ipt API fucntions you could enable or disable registered hotkey. - -
-
- Reference Data - - Table of = - <rich:hotKey> = - attributes. - - - Component Identification Parameters - - - - Name - Value - - - - - component-type - org.richfaces.HotKey - - - component-class - org.richfaces.component.html.HtmlHotKey - - - component-family - org.richfaces.HotKey - - - renderer-type - org.richfaces.HotKeyRenderer - - - - -
- - JavaScript API - - - - Function - Description - - - - - - add(selector, key, handler) - - - Adds the hotkey(from key param) for elements targeted by selector. it = assigns a handler function to the key - - - - remove() - Removes hotkey registration - - - enable() - Enables registered hotkey - - - disable() - Disables registered hotkey - - - -
-
-
- Relevant Resources Links - - On RichFaces LiveDemo page you can see an = example of = - - <rich:hotKey> - usage and sources for the given example. = - = -
-
\ No newline at end of file + + + + + JavaScript API + + + + Function + Description + + + + + add(selector, key, handler) + Adds the hotkey(from key param= ) for elements targeted by selector. it assigns a handler function to the k= ey + + + remove() + Removes hotkey registration + + + enable() + Enables registered hotkey + + + disable() + Disables registered hotkey + + + +
+
+
+ Relevant Resources Links + + On RichFaces LiveDemo page you ca= n see an example of + <rich:hotKey> + usage and sources for the given example. +
+ --===============3545616747890286208==--