aboutsummaryrefslogtreecommitdiff
path: root/js/document/templates
diff options
context:
space:
mode:
authorValerio Virgillito2012-05-16 00:54:40 -0700
committerValerio Virgillito2012-05-16 00:54:40 -0700
commita9672abd32c2e03b8607c1af4903c90f7ff9531c (patch)
tree30da60ed624d3d60b09fc04672c502bbed3b11f8 /js/document/templates
parent6dfe2e62b1d7a71daf097aac3a31213d564e6122 (diff)
parent2b21e91a3343229bb87179e08be1e532fcf9b8f9 (diff)
downloadninja-a9672abd32c2e03b8607c1af4903c90f7ff9531c.tar.gz
Merge branch 'dom-architecture' of github.com:Motorola-Mobility/ninja-internal into dom-architecture
Diffstat (limited to 'js/document/templates')
-rwxr-xr-xjs/document/templates/banner/index.html46
-rwxr-xr-xjs/document/templates/preview/banner.html64
2 files changed, 94 insertions, 16 deletions
diff --git a/js/document/templates/banner/index.html b/js/document/templates/banner/index.html
index 2cd82f51..91ef06de 100755
--- a/js/document/templates/banner/index.html
+++ b/js/document/templates/banner/index.html
@@ -27,8 +27,6 @@
27 margin: 0; 27 margin: 0;
28 padding: 0; 28 padding: 0;
29 position: absolute; 29 position: absolute;
30 -webkit-transform-style: preserve-3d;
31 -webkit-transform: perspective(1400) matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
32 } 30 }
33 31
34 html { 32 html {
@@ -40,10 +38,6 @@
40 height: 100%; 38 height: 100%;
41 background: #666; 39 background: #666;
42 } 40 }
43
44 ninjaloadinghack {
45 display: none;
46 }
47 41
48 .active-element-outline { 42 .active-element-outline {
49 outline: #adff2f solid 2px; 43 outline: #adff2f solid 2px;
@@ -53,16 +47,29 @@
53 -webkit-transition: all 450ms linear !important; 47 -webkit-transition: all 450ms linear !important;
54 } 48 }
55 49
56 ninja-banner { 50 ninjaloadinghack {
51 display: none;
52 }
53
54 ninja-viewport, ninja-content {
57 display: block; 55 display: block;
58 margin: 0; 56 margin: 0;
59 padding: 0; 57 padding: 0;
60 border: 0; 58 border: 0;
61 position: absolute; 59 position: absolute;
62 overflow: visible; 60 overflow: visible;
63 top: 50%; 61 top: 0;
64 left: 50%; 62 left: 0;
65 background: #FFF; 63 background: transparent;
64 }
65
66 ninja-viewport {
67 background: #FFF;
68 }
69
70 ninja-content {
71 -webkit-transform-style: preserve-3d;
72 -webkit-transform: perspective(1400) matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
66 } 73 }
67 </style> 74 </style>
68 75
@@ -87,8 +94,15 @@
87 </head> 94 </head>
88 95
89 <body> 96 <body>
97
90 <ninjaloadinghack></ninjaloadinghack> 98 <ninjaloadinghack></ninjaloadinghack>
91 <ninja-banner></ninja-banner> 99
100 <ninja-viewport>
101
102 <ninja-content></ninja-content>
103
104 </ninja-viewport>
105
92 </body> 106 </body>
93 107
94</html> \ No newline at end of file 108</html> \ No newline at end of file
diff --git a/js/document/templates/preview/banner.html b/js/document/templates/preview/banner.html
new file mode 100755
index 00000000..5838ec91
--- /dev/null
+++ b/js/document/templates/preview/banner.html
@@ -0,0 +1,64 @@
1<!DOCTYPE html>
2<!-- <copyright>
3 This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
4 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
5 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
6 </copyright> -->
7
8<html>
9
10 <head>
11
12 <style type="text/css">
13
14 html, body {
15 width: 100%;
16 height: 100%;
17 margin: 0;
18 padding: 0;
19 background: #333;
20 }
21
22 .preview {
23 position: absolute;
24 top: 50%;
25 left: 50%;
26 margin: 0;
27 padding: 0;
28 border: 1px solid #000;
29 background: #FFF;
30 -webkit-box-shadow: 0 0 16px #000;
31 }
32
33 </style>
34
35 <script type="text/javascript">
36 //
37 window.addEventListener('load', loadBanner, false);
38 //
39 function loadBanner (e) {
40 var iframe = document.getElementsByTagName('iframe')[0];
41 iframe.src = qs('url');
42 iframe.style.width = qs('width')+'px';
43 iframe.style.height = qs('height')+'px';
44 iframe.style.marginLeft = -1*qs('width')/2+'px';
45 iframe.style.marginTop = -1*qs('height')/2+'px';
46 }
47 /*
48 Taken from:
49 http://stackoverflow.com/questions/7731778/jquery-get-query-string-parameters
50 */
51 function qs(key) {
52 key = key.replace(/[*+?^$.\[\]{}()|\\\/]/g, "\\$&"); // escape RegEx meta chars
53 var match = location.search.match(new RegExp("[?&]"+key+"=([^&]+)(&|$)"));
54 return match && decodeURIComponent(match[1]);
55 }
56 </script>
57
58 </head>
59
60 <body>
61 <iframe class="preview"></iframe>
62 </body>
63
64</html> \ No newline at end of file