diff options
Diffstat (limited to 'node_modules/montage/ui/flow.reel/flow.html')
| -rw-r--r-- | node_modules/montage/ui/flow.reel/flow.html | 113 |
1 files changed, 43 insertions, 70 deletions
diff --git a/node_modules/montage/ui/flow.reel/flow.html b/node_modules/montage/ui/flow.reel/flow.html index 4d8cc16b..4e0e59f4 100644 --- a/node_modules/montage/ui/flow.reel/flow.html +++ b/node_modules/montage/ui/flow.reel/flow.html | |||
| @@ -5,85 +5,58 @@ | |||
| 5 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | 5 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. |
| 6 | </copyright> --> | 6 | </copyright> --> |
| 7 | <html> | 7 | <html> |
| 8 | <head> | 8 | <head> |
| 9 | <title></title> | 9 | <meta charset="utf-8"> |
| 10 | <link rel="stylesheet" href="flow.css"> | ||
| 10 | <script type="text/montage-serialization"> | 11 | <script type="text/montage-serialization"> |
| 11 | { | 12 | { |
| 12 | "repetition": { | 13 | "repetition": { |
| 13 | "prototype": "ui/repetition.reel", | 14 | "prototype": "ui/repetition.reel", |
| 14 | "properties": { | 15 | "properties": { |
| 15 | "element": { | 16 | "element": { |
| 16 | "#": "montage-flow-repetition" | 17 | "#": "montage-flow-repetition" |
| 17 | } | 18 | } |
| 18 | } | 19 | } |
| 20 | }, | ||
| 21 | "translateComposer": { | ||
| 22 | "prototype": "ui/composer/translate-composer", | ||
| 23 | "properties": { | ||
| 24 | "component": {"@": "owner"}, | ||
| 25 | "minTranslateX": 0, | ||
| 26 | "invertAxis": true, | ||
| 27 | "allowFloats": true | ||
| 28 | }, | ||
| 29 | "bindings": { | ||
| 30 | "element": {"<-": "@owner._element"}, | ||
| 31 | "maxTranslateX": {"<-": "@owner.maxTranslateX"} | ||
| 32 | } | ||
| 33 | }, | ||
| 34 | "owner": { | ||
| 35 | "properties": { | ||
| 36 | "element": { | ||
| 37 | "#": "montage-flow" | ||
| 19 | }, | 38 | }, |
| 20 | "translateComposer": { | 39 | "_repetition": { |
| 21 | "prototype": "ui/composer/translate-composer", | 40 | "@": "repetition" |
| 22 | "properties": { | ||
| 23 | "component": {"@": "owner"}, | ||
| 24 | "minTranslateX": 0, | ||
| 25 | "invertAxis": true, | ||
| 26 | "allowFloats": true | ||
| 27 | }, | ||
| 28 | "bindings": { | ||
| 29 | "element": {"<-": "@owner._element"}, | ||
| 30 | "maxTranslateX": {"<-": "@owner.maxTranslateX"} | ||
| 31 | } | ||
| 32 | }, | 41 | }, |
| 33 | "owner": { | 42 | "_translateComposer": { |
| 34 | "properties": { | 43 | "@": "translateComposer" |
| 35 | "element": { | ||
| 36 | "#": "montage-flow" | ||
| 37 | }, | ||
| 38 | "_repetition": { | ||
| 39 | "@": "repetition" | ||
| 40 | }, | ||
| 41 | "_translateComposer": { | ||
| 42 | "@": "translateComposer" | ||
| 43 | } | ||
| 44 | }, | ||
| 45 | "bindings": { | ||
| 46 | "isSelectionEnabled": { | ||
| 47 | "boundObject": {"@": "repetition"}, | ||
| 48 | "boundObjectPropertyPath": "isSelectionEnabled" | ||
| 49 | }, | ||
| 50 | "translateX": {"<-": "@translateComposer.translateX"} | ||
| 51 | } | ||
| 52 | } | 44 | } |
| 45 | }, | ||
| 46 | "bindings": { | ||
| 47 | "isSelectionEnabled": { | ||
| 48 | "boundObject": {"@": "repetition"}, | ||
| 49 | "boundObjectPropertyPath": "isSelectionEnabled" | ||
| 50 | }, | ||
| 51 | "translateX": {"<-": "@translateComposer.translateX"} | ||
| 53 | } | 52 | } |
| 53 | } | ||
| 54 | } | ||
| 54 | </script> | 55 | </script> |
| 55 | <style> | ||
| 56 | .montage-flow { | ||
| 57 | position: relative; | ||
| 58 | overflow: hidden; | ||
| 59 | -webkit-transform: translateZ(0); | ||
| 60 | } | ||
| 61 | .montage-flow-repetition { | ||
| 62 | position: absolute; | ||
| 63 | top: 0; | ||
| 64 | left: 0; | ||
| 65 | bottom: 0; | ||
| 66 | right: 0; | ||
| 67 | -webkit-transform-style: preserve-3d; | ||
| 68 | -webkit-transform: translateZ(0); | ||
| 69 | } | ||
| 70 | .montage-flow-repetition > div { | ||
| 71 | position: absolute; | ||
| 72 | top: 50%; | ||
| 73 | left: 50%; | ||
| 74 | width: 0; | ||
| 75 | height: 0; | ||
| 76 | -webkit-transform: translateZ(0); | ||
| 77 | -webkit-transform-style: preserve-3d; | ||
| 78 | } | ||
| 79 | .montage-flow-pointer-events-none { | ||
| 80 | pointer-events: none; | ||
| 81 | } | ||
| 82 | </style> | ||
| 83 | </head> | 56 | </head> |
| 84 | <body> | 57 | <body> |
| 85 | <div data-montage-id="montage-flow" class="montage-flow"> | 58 | <div data-montage-id="montage-flow" class="montage-flow"> |
| 86 | <div data-montage-id="montage-flow-repetition" class="montage-flow-repetition"></div> | 59 | <div data-montage-id="montage-flow-repetition" class="montage-flow-repetition"></div> |
| 87 | </div> | 60 | </div> |
| 88 | </body> | 61 | </body> |
| 89 | </html> | 62 | </html> \ No newline at end of file |