sventon subversion web client - http://www.sventon.org
[show recent changes]
 
  Help
HEAD
Rev: 52248 - http://anonsvn.icesoft.org/repo / icemobile / trunk / icemobile / samples / jsf / mobileshowcase / src / main / webapp / WEB-INF / includes / examples / layout / viewmanager-example.xhtml
Show File - viewmanager-example.xhtml  [show properties]
spinner
1  <!--
2    ~ Copyright 2004-2014 ICEsoft Technologies Canada Corp.
3    ~
4    ~ Licensed under the Apache License, Version 2.0 (the "License");
5    ~ you may not use this file except in compliance with the
6    ~ License. You may obtain a copy of the License at
7    ~
8    ~ http://www.apache.org/licenses/LICENSE-2.0
9    ~
10    ~ Unless required by applicable law or agreed to in writing,
11    ~ software distributed under the License is distributed on an "AS
12    ~ IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either
13    ~ express or implied. See the License for the specific language
14    ~ governing permissions and limitations under the License.
15    -->
16 
17  <ui:composition xmlns="http://www.w3.org/1999/xhtml"
18               xmlns:h="http://java.sun.com/jsf/html"
19               xmlns:f="http://java.sun.com/jsf/core"
20               xmlns:ui="http://java.sun.com/jsf/facelets"
21               xmlns:mobi="http://www.icesoft.com/icefaces/mobile/component">
22 
23      <mobi:fieldsetGroup>
24          <mobi:fieldsetRow>
25              The View Manager component can automatically adapt the layout for a device.
26          </mobi:fieldsetRow>
27      </mobi:fieldsetGroup>
28 
29      <h:form>
30          <mobi:fieldsetGroup>
31              <script>
32            //<![CDATA[
33              /* View style properties need to be cleared for demo when changing transitionTypes */
34              var transitionType = '#{viewManagerBean.transitionType}';
35              function clearViewStyles(){
36                  var views = document.getElementsByClassName('mobi-vm-view'); 
37                  for( var i = 0 ; i < views.length ; i++ ){
38                      views[i].style.webkitTransform = '';
39                      views[i].style.opacity = '';
40                  }
41              }
42              clearViewStyles();
43            //]]>
44              </script>
45              <mobi:fieldsetRow>
46                  <h:outputLabel value="Transition Type:" for="transitionType" styleClass="ui-input-text"/>
47                  <h:selectOneMenu id="transitionType" value="#{viewManagerBean.transitionType}">
48                      <f:ajax execute="@this" render="@all"/>
49                      <f:selectItem itemLabel="Horizontal" itemValue="horizontal"/>
50                      <f:selectItem itemLabel="Vertical" itemValue="vertical"/>
51                      <f:selectItem itemLabel="Flip" itemValue="flip"/>
52                      <f:selectItem itemLabel="Fade" itemValue="fade"/>
53                      <!-- f:selectItem itemLabel="Page Turn" itemValue="pageturn"/-->
54                  </h:selectOneMenu>
55              </mobi:fieldsetRow>
56              <mobi:fieldsetRow rendered="#{not mobiClient.chromeBrowser}">
57                  <h:outputLabel value="Bar Style:" for="barStyle" styleClass="ui-input-text"/>
58                  <mobi:inputText id="barStyle" value="#{viewManagerBean.barStyle}"
59                      singleSubmit="true"/>
60              </mobi:fieldsetRow>
61              <mobi:fieldsetRow rendered="#{mobiClient.chromeBrowser}">
62                  <label>Header Color:</label>
63                  <input type="color" onchange="var sheet = ice.mobi.getStyleSheet('vm-example'); if( !sheet){ sheet = ice.mobi.addStyleSheet('vm-example', 'body'); } sheet.insertRule('.mobi-vm-bar{ background-color: ' + this.value + '}',0);"/>
64              </mobi:fieldsetRow>
65              
66              <mobi:fieldsetRow>
67                  <h:outputLabel value="Client Side:" for="clientside" styleClass="ui-input-text"/>
68                  <mobi:flipswitch id="clientside" value="#{viewManagerBean.clientSide}">
69                      <mobi:ajax render="@all" execute="@this"/>
70                  </mobi:flipswitch>
71              </mobi:fieldsetRow>
72          </mobi:fieldsetGroup>
73          
74      </h:form>
75  </ui:composition>


feed icon

sventon 2.5.1