Updated mobile stylesheet for demo

[platform/core/uifw/dali-demo.git] / resources / style / mobile / demo-theme.json.in

diff --git a/resources/style/mobile/demo-theme.json.in b/resources/style/mobile/demo-theme.json.in
index 86a6b57..893bfac 100644 (file)
--- a/resources/style/mobile/demo-theme.json.in
+++ b/resources/style/mobile/demo-theme.json.in
@@ -18,67 +18,173 @@
 {
   "styles":
   {
-    "textlabel-Rosemary":
+    "CustomPopupStyle":{
+      "popupBackgroundImage":"{APPLICATION_RESOURCE_PATH}/images/popup.9.png",
+      "popupBackgroundBorder":[0,4,4,0],
+      "tailUpImage":"{APPLICATION_RESOURCE_PATH}/images/popup-tail-up.png",
+      "tailDownImage":"{APPLICATION_RESOURCE_PATH}/images/popup-tail-down.png",
+      "tailLeftImage":"{APPLICATION_RESOURCE_PATH}/images/popup-tail-left.png",
+      "tailRightImage":"{APPLICATION_RESOURCE_PATH}/images/popup-tail-right.png"
+    },
+
+    "DemoTile":
+    {
+      "states":
+      {
+        "NORMAL":
+        {
+          "color":[0.4, 0.6, 0.9, 0.6],
+          "visuals":
+          {
+            "image":
+            {
+              "url":"{APPLICATION_RESOURCE_PATH}/images/demo-tile-texture.9.png",
+// TILE_BACKGROUND_ALPHA
+// This shader takes a texture.
+// An alpha discard is performed.
+// The shader uses the tiles position within the scroll-view page and the scroll-views rotation position to create a parallax effect.
+              "shader":
+              {
+                "fragmentShader":[
+                  "  varying mediump vec2  vTexCoord;",
+                  "  uniform lowp    vec4  uColor;",
+                  "  uniform sampler2D     sTexture;",
+                  "  uniform mediump vec3  uCustomPosition;",
+                  "",
+                  "  void main()",
+                  "  {",
+                  "    if( texture2D( sTexture, vTexCoord ).a <= 0.0001 )",
+                  "    {",
+                  "      discard;",
+                  "    }",
+                  "",
+                  "    mediump vec2 wrapTexCoord = vec2( ( vTexCoord.x / 4.0 ) + ( uCustomPosition.x / 4.0 ) + ( uCustomPosition.z / 2.0 ), vTexCoord.y / 4.0 );",
+                  "    mediump vec4 color = texture2D( sTexture, wrapTexCoord );",
+                  "    mediump float positionWeight = ( uCustomPosition.y + 0.3 ) * color.r * 2.0;",
+                  "",
+                  "    gl_FragColor = vec4( positionWeight, positionWeight, positionWeight, 0.9 ) * uColor + vec4( uColor.xyz, 0.0 );",
+                  "  }"
+                ]
+              }
+            }
+          }
+        },
+        "FOCUSED":
+        {
+          "color":[0.3, 0.5, 0.8, 0.5],
+          "visuals":
+          {
+            "image":
+            {
+              "url":"{APPLICATION_RESOURCE_PATH}/images/demo-tile-texture-focused.9.png",
+// TILE_BACKGROUND_ALPHA
+// This shader takes a texture.
+// An alpha discard is performed.
+// The shader uses the tiles position within the scroll-view page and the scroll-views rotation position to create a parallax effect.
+              "shader":
+              {
+                "fragmentShader":[
+                  "  varying mediump vec2  vTexCoord;",
+                  "  uniform lowp    vec4  uColor;",
+                  "  uniform sampler2D     sTexture;",
+                  "  uniform mediump vec3  uCustomPosition;",
+                  "",
+                  "  void main()",
+                  "  {",
+                  "    if( texture2D( sTexture, vTexCoord ).a <= 0.0001 )",
+                  "    {",
+                  "      discard;",
+                  "    }",
+                  "",
+                  "    mediump vec2 wrapTexCoord = vec2( ( vTexCoord.x / 4.0 ) + ( uCustomPosition.x / 4.0 ) + ( uCustomPosition.z / 2.0 ), vTexCoord.y / 4.0 );",
+                  "    mediump vec4 color = texture2D( sTexture, wrapTexCoord );",
+                  "    mediump float positionWeight = ( uCustomPosition.y + 0.3 ) * color.r * 2.0;",
+                  "",
+                  "    gl_FragColor = vec4( positionWeight, positionWeight, positionWeight, 0.9 ) * uColor + vec4( uColor.xyz, 0.0 );",
+                  "  }"
+                ]
+              }
+            }
+          }
+        }
+      }
+    },
+    "FocusActor":
+    {
+      "visuals":
+      {
+        "image":
+        {
+          "url":"{APPLICATION_RESOURCE_PATH}/images/tile-focus.9.png"
+        }
+      }
+    },
+    "DemoTileBorder":
+    {
+      "visuals":
+      {
+        "image":
+        {
+          "url":"{APPLICATION_RESOURCE_PATH}/images/item-background.9.png" // TILE_BACKGROUND
+        }
+      }
+    },
+    "TextLabelRosemary":
     {
       "fontFamily":"Rosemary"
     },
-    "textlabel":
+    "TextLabel":
     {
-      "fontStyle":"Regular",
+      "fontStyle":{"weight":"normal"},
       "pointSize":18
     },
-    "textlabelFontSize0":
+    "TextLabelFontSize0":
     {
       "pointSize":8
     },
-    "textlabelFontSize1":
+    "TextLabelFontSize1":
     {
       "pointSize":10
     },
-    "textlabelFontSize2":
+    "TextLabelFontSize2":
     {
       "pointSize":15
     },
-    "textlabelFontSize3":
+    "TextLabelFontSize3":
     {
       "pointSize":19
     },
-    "textlabelFontSize4":
+    "TextLabelFontSize4":
     {
       "pointSize":25
     },
 
-    "launcherlabel":
+    "Launcherlabel":
     {
       "pointSize":8
     },
 
-    "toolbarlabel":
+    "ToolbarLabel":
     {
       "pointSize":10
     },
 
-    "builderlabel":
+    "BuilderLabel":
     {
       "pointSize":10
     },
 
-    "scrollview":
+    "ScrollView":
     {
       "overshootEffectColor":"B018"
     },
 
-    "grouplabel":
+    "GroupLabel":
     {
       "pointSize":6
     },
 
-    "buttonlabel":
-    {
-      "pointSize":8
-    },
-
-    "launcherbackground":
+    "LauncherBackground":
     {
       "background":
       {