Skip to content
This repository
Browse code

Updated line endings

  • Loading branch information...
commit 4d11bafee40e19503f728f8e0c50984a750bab8a 1 parent ccd7567
Paul Lewis paullewis authored
22 frameless-window/background.js
... ... @@ -1,11 +1,11 @@
1   -chrome.app.runtime.onLaunched.addListener(function() {
2   - chrome.app.window.create("frameless_window.html",
3   - { frame: "none", width: 360,
4   - height: 300,
5   - minWidth: 220,
6   - minHeight: 220,
7   - left: 600
8   - }
9   - );
10   -});
11   -
  1 +chrome.app.runtime.onLaunched.addListener(function() {
  2 + chrome.app.window.create("frameless_window.html",
  3 + { frame: "none", width: 360,
  4 + height: 300,
  5 + minWidth: 220,
  6 + minHeight: 220,
  7 + left: 600
  8 + }
  9 + );
  10 +});
  11 +
74 frameless-window/frameless_window.html
... ... @@ -1,37 +1,37 @@
1   -<html>
2   -
3   -<head>
4   -
5   -<title>Frameless Window</title>
6   -
7   -<link rel="stylesheet" type="text/css" href="style.css" />
8   -<script src="titlebar.js"></script>
9   -<script src="frameless_window.js"></script>
10   -
11   -</head>
12   -
13   -<body>
14   -
15   -<div id="content">
16   -
17   -<div id="inner-content">
18   -
19   -Select the titlebar to enable:<br/>
20   -<input type="checkbox" id="top-box">Top Titlebar
21   -<br/>
22   -<input type="checkbox" id="bottom-box">Bottom Titlebar
23   -<br/>
24   -<input type="checkbox" id="left-box">Left Titlebar
25   -<br/>
26   -<input type="checkbox" id="right-box">Right Titlebar
27   -<br/>
28   -<br/>
29   -<button id="close-window-button">Close Window</button>
30   -
31   -</div>
32   -
33   -</div>
34   -
35   -</body>
36   -
37   -</html>
  1 +<html>
  2 +
  3 +<head>
  4 +
  5 +<title>Frameless Window</title>
  6 +
  7 +<link rel="stylesheet" type="text/css" href="style.css" />
  8 +<script src="titlebar.js"></script>
  9 +<script src="frameless_window.js"></script>
  10 +
  11 +</head>
  12 +
  13 +<body>
  14 +
  15 +<div id="content">
  16 +
  17 +<div id="inner-content">
  18 +
  19 +Select the titlebar to enable:<br/>
  20 +<input type="checkbox" id="top-box">Top Titlebar
  21 +<br/>
  22 +<input type="checkbox" id="bottom-box">Bottom Titlebar
  23 +<br/>
  24 +<input type="checkbox" id="left-box">Left Titlebar
  25 +<br/>
  26 +<input type="checkbox" id="right-box">Right Titlebar
  27 +<br/>
  28 +<br/>
  29 +<button id="close-window-button">Close Window</button>
  30 +
  31 +</div>
  32 +
  33 +</div>
  34 +
  35 +</body>
  36 +
  37 +</html>
122 frameless-window/frameless_window.js
... ... @@ -1,61 +1,61 @@
1   -function updateCheckbox() {
2   - var top_checkbox = document.getElementById("top-box");
3   - var bottom_checkbox = document.getElementById("bottom-box");
4   - var left_checkbox = document.getElementById("left-box");
5   - var right_checkbox = document.getElementById("right-box");
6   - if (top_checkbox.checked || bottom_checkbox.checked) {
7   - left_checkbox.disabled = true;
8   - right_checkbox.disabled = true;
9   - } else if (left_checkbox.checked || right_checkbox.checked) {
10   - top_checkbox.disabled = true;
11   - bottom_checkbox.disabled = true;
12   - } else {
13   - left_checkbox.disabled = false;
14   - right_checkbox.disabled = false;
15   - top_checkbox.disabled = false;
16   - bottom_checkbox.disabled = false;
17   - }
18   -}
19   -
20   -function initCheckbox(checkboxId, titlebar_name, titlebar_icon_url, titlebar_text) {
21   - var elem = document.getElementById(checkboxId);
22   - if (!elem)
23   - return;
24   - elem.onclick = function() {
25   - if (document.getElementById(checkboxId).checked)
26   - addTitlebar(titlebar_name, titlebar_icon_url, titlebar_text);
27   - else
28   - removeTitlebar(titlebar_name);
29   - focusTitlebars(true);
30   -
31   - updateContentStyle();
32   - updateCheckbox();
33   - }
34   -}
35   -
36   -window.onfocus = function() {
37   - console.log("focus");
38   - focusTitlebars(true);
39   -}
40   -
41   -window.onblur = function() {
42   - console.log("blur");
43   - focusTitlebars(false);
44   -}
45   -
46   -window.onresize = function() {
47   - updateContentStyle();
48   -}
49   -
50   -window.onload = function() {
51   - initCheckbox("top-box", "top-titlebar", "top-titlebar.png", "Top Titlebar");
52   - initCheckbox("bottom-box", "bottom-titlebar", "bottom-titlebar.png", "Bottom Titlebar");
53   - initCheckbox("left-box", "left-titlebar", "left-titlebar.png", "Left Titlebar");
54   - initCheckbox("right-box", "right-titlebar", "right-titlebar.png", "Right Titlebar");
55   -
56   - document.getElementById("close-window-button").onclick = function() {
57   - window.close();
58   - }
59   -
60   - updateContentStyle();
61   -}
  1 +function updateCheckbox() {
  2 + var top_checkbox = document.getElementById("top-box");
  3 + var bottom_checkbox = document.getElementById("bottom-box");
  4 + var left_checkbox = document.getElementById("left-box");
  5 + var right_checkbox = document.getElementById("right-box");
  6 + if (top_checkbox.checked || bottom_checkbox.checked) {
  7 + left_checkbox.disabled = true;
  8 + right_checkbox.disabled = true;
  9 + } else if (left_checkbox.checked || right_checkbox.checked) {
  10 + top_checkbox.disabled = true;
  11 + bottom_checkbox.disabled = true;
  12 + } else {
  13 + left_checkbox.disabled = false;
  14 + right_checkbox.disabled = false;
  15 + top_checkbox.disabled = false;
  16 + bottom_checkbox.disabled = false;
  17 + }
  18 +}
  19 +
  20 +function initCheckbox(checkboxId, titlebar_name, titlebar_icon_url, titlebar_text) {
  21 + var elem = document.getElementById(checkboxId);
  22 + if (!elem)
  23 + return;
  24 + elem.onclick = function() {
  25 + if (document.getElementById(checkboxId).checked)
  26 + addTitlebar(titlebar_name, titlebar_icon_url, titlebar_text);
  27 + else
  28 + removeTitlebar(titlebar_name);
  29 + focusTitlebars(true);
  30 +
  31 + updateContentStyle();
  32 + updateCheckbox();
  33 + }
  34 +}
  35 +
  36 +window.onfocus = function() {
  37 + console.log("focus");
  38 + focusTitlebars(true);
  39 +}
  40 +
  41 +window.onblur = function() {
  42 + console.log("blur");
  43 + focusTitlebars(false);
  44 +}
  45 +
  46 +window.onresize = function() {
  47 + updateContentStyle();
  48 +}
  49 +
  50 +window.onload = function() {
  51 + initCheckbox("top-box", "top-titlebar", "top-titlebar.png", "Top Titlebar");
  52 + initCheckbox("bottom-box", "bottom-titlebar", "bottom-titlebar.png", "Bottom Titlebar");
  53 + initCheckbox("left-box", "left-titlebar", "left-titlebar.png", "Left Titlebar");
  54 + initCheckbox("right-box", "right-titlebar", "right-titlebar.png", "Right Titlebar");
  55 +
  56 + document.getElementById("close-window-button").onclick = function() {
  57 + window.close();
  58 + }
  59 +
  60 + updateContentStyle();
  61 +}
26 frameless-window/manifest.json
... ... @@ -1,13 +1,13 @@
1   -{
2   - "name": "Frameless Window",
3   - "description": "Chrome platform app.",
4   - "manifest_version": 2,
5   - "version": "0.1",
6   - "app": {
7   - "background": {
8   - "scripts": ["background.js"]
9   - }
10   - },
11   - "permissions": ["experimental"],
12   - "icons": { "128": "icon_128.png" }
13   -}
  1 +{
  2 + "name": "Frameless Window",
  3 + "description": "Chrome platform app.",
  4 + "manifest_version": 2,
  5 + "version": "0.1",
  6 + "app": {
  7 + "background": {
  8 + "scripts": ["background.js"]
  9 + }
  10 + },
  11 + "permissions": ["experimental"],
  12 + "icons": { "128": "icon_128.png" }
  13 +}
390 frameless-window/style.css
... ... @@ -1,195 +1,195 @@
1   -html {
2   - margin: 0px;
3   - padding: 0px;
4   - overflow: hidden;
5   -}
6   -
7   -body {
8   - margin: 0px;
9   - padding: 0px;
10   -}
11   -
12   -::-webkit-scrollbar-thumb {
13   - display: none;
14   -}
15   -
16   -input[type="checkbox"]:disabled
17   -{
18   - opacity: .3;
19   -}
20   -
21   -div#content {
22   - background-color: #dddddd;
23   - margin: 0px;
24   - padding: 0px;
25   -}
26   -
27   -div#inner-content {
28   - background-color: #dddddd;
29   - margin: 10px;
30   - width: 100%;
31   - height: 100%;
32   -}
33   -
34   -.top-titlebar {
35   - position: absolute;
36   - left: 0px;
37   - top: 0px;
38   - width: 100%;
39   - height: 32px;
40   - background-color: #7a7c7c;
41   -}
42   -
43   -.bottom-titlebar {
44   - position: absolute;
45   - left: 0px;
46   - bottom: 0px;
47   - width: 100%;
48   - height: 32px;
49   - background-color: #7a7c7c;
50   -}
51   -
52   -.left-titlebar {
53   - position: absolute;
54   - left: 0px;
55   - top: 0px;
56   - width: 32px;
57   - height: 100%;
58   - background-color: #7a7c7c;
59   -}
60   -
61   -.right-titlebar {
62   - position: absolute;
63   - right: 0px;
64   - top: 0px;
65   - width: 32px;
66   - height: 100%;
67   - background-color: #7a7c7c;
68   -}
69   -
70   -.top-titlebar-icon,
71   -.bottom-titlebar-icon {
72   - position: absolute;
73   - left: 6px;
74   - margin-top: 6px;
75   - margin-bottom: 6px;
76   -}
77   -
78   -.left-titlebar-icon {
79   - position: absolute;
80   - bottom: 6px;
81   - margin-left: 6px;
82   - margin-right: 6px;
83   -}
84   -
85   -.right-titlebar-icon {
86   - position: absolute;
87   - top: 6px;
88   - margin-left: 6px;
89   - margin-right: 6px;
90   -}
91   -
92   -.top-titlebar-text,
93   -.bottom-titlebar-text {
94   - position: absolute;
95   - left: 32px;
96   - width: 80%;
97   - margin-top: 6px;
98   - margin-bottom: 6px;
99   - font-style: Arial;
100   - font-size: 11pt;
101   - color: #ffffff;
102   -}
103   -
104   -.left-titlebar-text {
105   - position: absolute;
106   - bottom: 32px;
107   - width: 100px;
108   - margin-left: 6px;
109   - margin-right: 6px;
110   - font-style: Arial;
111   - font-size: 12pt;
112   - color: #ffffff;
113   - -webkit-transform: rotate(-90deg) translate(0, 100%);
114   - -webkit-transform-origin: 0% 100%;
115   -}
116   -
117   -.right-titlebar-text {
118   - position: absolute;
119   - top: 0px;
120   - width: 100px;
121   - margin-left: 6px;
122   - margin-right: 6px;
123   - font-style: Arial;
124   - font-size: 12pt;
125   - color: #ffffff;
126   - -webkit-transform: rotate(90deg) translate(0, 100%);
127   - -webkit-transform-origin: 0% 200%;
128   -}
129   -
130   -.top-titlebar-close-button,
131   -.bottom-titlebar-close-button {
132   - position: absolute;
133   - right: 11px;
134   - width: 17px;
135   - height: 17px;
136   - margin-top: 6px;
137   - margin-bottom: 6px;
138   - -webkit-widget-region: region(control rectangle);
139   -}
140   -
141   -.left-titlebar-close-button {
142   - position: absolute;
143   - top: 11px;
144   - width: 17px;
145   - height: 17px;
146   - margin-left: 6px;
147   - margin-right: 6px;
148   - -webkit-widget-region: region(control rectangle);
149   -}
150   -
151   -.right-titlebar-close-button {
152   - position: absolute;
153   - bottom: 11px;
154   - width: 17px;
155   - height: 17px;
156   - margin-left: 6px;
157   - margin-right: 6px;
158   - -webkit-widget-region: region(control rectangle);
159   -}
160   -
161   -.top-titlebar-divider {
162   - position: absolute;
163   - left: 0px;
164   - top: 31px;
165   - width: 100%;
166   - height: 1px;
167   - background-color: #2a2c2c;
168   -}
169   -
170   -.bottom-titlebar-divider {
171   - position: absolute;
172   - left: 0px;
173   - bottom: 31px;
174   - width: 100%;
175   - height: 1px;
176   - background-color: #2a2c2c;
177   -}
178   -
179   -.left-titlebar-divider {
180   - position: absolute;
181   - left: 31px;
182   - top: 0px;
183   - width: 1px;
184   - height: 100%;
185   - background-color: #2a2c2c;
186   -}
187   -
188   -.right-titlebar-divider {
189   - position: absolute;
190   - right: 31px;
191   - top: 0px;
192   - width: 1px;
193   - height: 100%;
194   - background-color: #2a2c2c;
195   -}
  1 +html {
  2 + margin: 0px;
  3 + padding: 0px;
  4 + overflow: hidden;
  5 +}
  6 +
  7 +body {
  8 + margin: 0px;
  9 + padding: 0px;
  10 +}
  11 +
  12 +::-webkit-scrollbar-thumb {
  13 + display: none;
  14 +}
  15 +
  16 +input[type="checkbox"]:disabled
  17 +{
  18 + opacity: .3;
  19 +}
  20 +
  21 +div#content {
  22 + background-color: #dddddd;
  23 + margin: 0px;
  24 + padding: 0px;
  25 +}
  26 +
  27 +div#inner-content {
  28 + background-color: #dddddd;
  29 + margin: 10px;
  30 + width: 100%;
  31 + height: 100%;
  32 +}
  33 +
  34 +.top-titlebar {
  35 + position: absolute;
  36 + left: 0px;
  37 + top: 0px;
  38 + width: 100%;
  39 + height: 32px;
  40 + background-color: #7a7c7c;
  41 +}
  42 +
  43 +.bottom-titlebar {
  44 + position: absolute;
  45 + left: 0px;
  46 + bottom: 0px;
  47 + width: 100%;
  48 + height: 32px;
  49 + background-color: #7a7c7c;
  50 +}
  51 +
  52 +.left-titlebar {
  53 + position: absolute;
  54 + left: 0px;
  55 + top: 0px;
  56 + width: 32px;
  57 + height: 100%;
  58 + background-color: #7a7c7c;
  59 +}
  60 +
  61 +.right-titlebar {
  62 + position: absolute;
  63 + right: 0px;
  64 + top: 0px;
  65 + width: 32px;
  66 + height: 100%;
  67 + background-color: #7a7c7c;
  68 +}
  69 +
  70 +.top-titlebar-icon,
  71 +.bottom-titlebar-icon {
  72 + position: absolute;
  73 + left: 6px;
  74 + margin-top: 6px;
  75 + margin-bottom: 6px;
  76 +}
  77 +
  78 +.left-titlebar-icon {
  79 + position: absolute;
  80 + bottom: 6px;
  81 + margin-left: 6px;
  82 + margin-right: 6px;
  83 +}
  84 +
  85 +.right-titlebar-icon {
  86 + position: absolute;
  87 + top: 6px;
  88 + margin-left: 6px;
  89 + margin-right: 6px;
  90 +}
  91 +
  92 +.top-titlebar-text,
  93 +.bottom-titlebar-text {
  94 + position: absolute;
  95 + left: 32px;
  96 + width: 80%;
  97 + margin-top: 6px;
  98 + margin-bottom: 6px;
  99 + font-style: Arial;
  100 + font-size: 11pt;
  101 + color: #ffffff;
  102 +}
  103 +
  104 +.left-titlebar-text {
  105 + position: absolute;
  106 + bottom: 32px;
  107 + width: 100px;
  108 + margin-left: 6px;
  109 + margin-right: 6px;
  110 + font-style: Arial;
  111 + font-size: 12pt;
  112 + color: #ffffff;
  113 + -webkit-transform: rotate(-90deg) translate(0, 100%);
  114 + -webkit-transform-origin: 0% 100%;
  115 +}
  116 +
  117 +.right-titlebar-text {
  118 + position: absolute;
  119 + top: 0px;
  120 + width: 100px;
  121 + margin-left: 6px;
  122 + margin-right: 6px;
  123 + font-style: Arial;
  124 + font-size: 12pt;
  125 + color: #ffffff;
  126 + -webkit-transform: rotate(90deg) translate(0, 100%);
  127 + -webkit-transform-origin: 0% 200%;
  128 +}
  129 +
  130 +.top-titlebar-close-button,
  131 +.bottom-titlebar-close-button {
  132 + position: absolute;
  133 + right: 11px;
  134 + width: 17px;
  135 + height: 17px;
  136 + margin-top: 6px;
  137 + margin-bottom: 6px;
  138 + -webkit-widget-region: region(control rectangle);
  139 +}
  140 +
  141 +.left-titlebar-close-button {
  142 + position: absolute;
  143 + top: 11px;
  144 + width: 17px;
  145 + height: 17px;
  146 + margin-left: 6px;
  147 + margin-right: 6px;
  148 + -webkit-widget-region: region(control rectangle);
  149 +}
  150 +
  151 +.right-titlebar-close-button {
  152 + position: absolute;
  153 + bottom: 11px;
  154 + width: 17px;
  155 + height: 17px;
  156 + margin-left: 6px;
  157 + margin-right: 6px;
  158 + -webkit-widget-region: region(control rectangle);
  159 +}
  160 +
  161 +.top-titlebar-divider {
  162 + position: absolute;
  163 + left: 0px;
  164 + top: 31px;
  165 + width: 100%;
  166 + height: 1px;
  167 + background-color: #2a2c2c;
  168 +}
  169 +
  170 +.bottom-titlebar-divider {
  171 + position: absolute;
  172 + left: 0px;
  173 + bottom: 31px;
  174 + width: 100%;
  175 + height: 1px;
  176 + background-color: #2a2c2c;
  177 +}
  178 +
  179 +.left-titlebar-divider {
  180 + position: absolute;
  181 + left: 31px;
  182 + top: 0px;
  183 + width: 1px;
  184 + height: 100%;
  185 + background-color: #2a2c2c;
  186 +}
  187 +
  188 +.right-titlebar-divider {
  189 + position: absolute;
  190 + right: 31px;
  191 + top: 0px;
  192 + width: 1px;
  193 + height: 100%;
  194 + background-color: #2a2c2c;
  195 +}
242 frameless-window/titlebar.js
... ... @@ -1,121 +1,121 @@
1   -function closeWindow() {
2   - window.close();
3   -}
4   -
5   -function updateImageUrl(image_id, new_image_url) {
6   - var image = document.getElementById(image_id);
7   - if (image)
8   - image.src = new_image_url;
9   -}
10   -
11   -function createImage(image_id, image_url) {
12   - var image = document.createElement("img");
13   - image.setAttribute("id", image_id);
14   - image.src = image_url;
15   - return image;
16   -}
17   -
18   -function createButton(button_id, button_name, normal_image_url,
19   - hover_image_url, click_func) {
20   - var button = document.createElement("div");
21   - button.setAttribute("class", button_name);
22   - var button_img = createImage(button_id, normal_image_url);
23   - button.appendChild(button_img);
24   - button.onmouseover = function() {
25   - updateImageUrl(button_id, hover_image_url);
26   - }
27   - button.onmouseout = function() {
28   - updateImageUrl(button_id, normal_image_url);
29   - }
30   - button.onclick = click_func;
31   - return button;
32   -}
33   -
34   -function focusTitlebars(focus) {
35   - var bg_color = focus ? "#3a3d3d" : "#7a7c7c";
36   -
37   - var titlebar = document.getElementById("top-titlebar");
38   - if (titlebar)
39   - titlebar.style.backgroundColor = bg_color;
40   - titlebar = document.getElementById("bottom-titlebar");
41   - if (titlebar)
42   - titlebar.style.backgroundColor = bg_color;
43   - titlebar = document.getElementById("left-titlebar");
44   - if (titlebar)
45   - titlebar.style.backgroundColor = bg_color;
46   - titlebar = document.getElementById("right-titlebar");
47   - if (titlebar)
48   - titlebar.style.backgroundColor = bg_color;
49   -}
50   -
51   -function addTitlebar(titlebar_name, titlebar_icon_url, titlebar_text) {
52   - var titlebar = document.createElement("div");
53   - titlebar.setAttribute("id", titlebar_name);
54   - titlebar.setAttribute("class", titlebar_name);
55   -
56   - var icon = document.createElement("div");
57   - icon.setAttribute("class", titlebar_name + "-icon");
58   - icon.appendChild(createImage(titlebar_name + "icon", titlebar_icon_url));
59   - titlebar.appendChild(icon);
60   -
61   - var title = document.createElement("div");
62   - title.setAttribute("class", titlebar_name + "-text");
63   - title.innerText = titlebar_text;
64   - titlebar.appendChild(title);
65   -
66   - var closeButton = createButton(titlebar_name + "-close-button",
67   - titlebar_name + "-close-button",
68   - "button_close.png",
69   - "button_close_hover.png",
70   - closeWindow);
71   - titlebar.appendChild(closeButton);
72   -
73   - var divider = document.createElement("div");
74   - divider.setAttribute("class", titlebar_name + "-divider");
75   - titlebar.appendChild(divider);
76   -
77   - document.body.appendChild(titlebar);
78   -}
79   -
80   -function removeTitlebar(titlebar_name) {
81   - var titlebar = document.getElementById(titlebar_name);
82   - if (titlebar)
83   - document.body.removeChild(titlebar);
84   -}
85   -
86   -function updateContentStyle() {
87   - var content = document.getElementById("content");
88   - if (!content)
89   - return;
90   -
91   - var left = 0;
92   - var top = 0;
93   - var width = window.outerWidth;
94   - var height = window.outerHeight;
95   -
96   - var titlebar = document.getElementById("top-titlebar");
97   - if (titlebar) {
98   - height -= titlebar.offsetHeight;
99   - top += titlebar.offsetHeight;
100   - }
101   - titlebar = document.getElementById("bottom-titlebar");
102   - if (titlebar) {
103   - height -= titlebar.offsetHeight;
104   - }
105   - titlebar = document.getElementById("left-titlebar");
106   - if (titlebar) {
107   - width -= titlebar.offsetWidth;
108   - left += titlebar.offsetWidth;
109   - }
110   - titlebar = document.getElementById("right-titlebar");
111   - if (titlebar) {
112   - width -= titlebar.offsetWidth;
113   - }
114   -
115   - var contentStyle = "position: absolute; -webkit-widget-region: region(control rectangle); ";
116   - contentStyle += "left: " + left + "px; ";
117   - contentStyle += "top: " + top + "px; ";
118   - contentStyle += "width: " + width + "px; ";
119   - contentStyle += "height: " + height + "px; ";
120   - content.setAttribute("style", contentStyle);
121   -}
  1 +function closeWindow() {
  2 + window.close();
  3 +}
  4 +
  5 +function updateImageUrl(image_id, new_image_url) {
  6 + var image = document.getElementById(image_id);
  7 + if (image)
  8 + image.src = new_image_url;
  9 +}
  10 +
  11 +function createImage(image_id, image_url) {
  12 + var image = document.createElement("img");
  13 + image.setAttribute("id", image_id);
  14 + image.src = image_url;
  15 + return image;
  16 +}
  17 +
  18 +function createButton(button_id, button_name, normal_image_url,
  19 + hover_image_url, click_func) {
  20 + var button = document.createElement("div");
  21 + button.setAttribute("class", button_name);
  22 + var button_img = createImage(button_id, normal_image_url);
  23 + button.appendChild(button_img);
  24 + button.onmouseover = function() {
  25 + updateImageUrl(button_id, hover_image_url);
  26 + }
  27 + button.onmouseout = function() {
  28 + updateImageUrl(button_id, normal_image_url);
  29 + }
  30 + button.onclick = click_func;
  31 + return button;
  32 +}
  33 +
  34 +function focusTitlebars(focus) {
  35 + var bg_color = focus ? "#3a3d3d" : "#7a7c7c";
  36 +
  37 + var titlebar = document.getElementById("top-titlebar");
  38 + if (titlebar)
  39 + titlebar.style.backgroundColor = bg_color;
  40 + titlebar = document.getElementById("bottom-titlebar");
  41 + if (titlebar)
  42 + titlebar.style.backgroundColor = bg_color;
  43 + titlebar = document.getElementById("left-titlebar");
  44 + if (titlebar)
  45 + titlebar.style.backgroundColor = bg_color;
  46 + titlebar = document.getElementById("right-titlebar");
  47 + if (titlebar)
  48 + titlebar.style.backgroundColor = bg_color;
  49 +}
  50 +
  51 +function addTitlebar(titlebar_name, titlebar_icon_url, titlebar_text) {
  52 + var titlebar = document.createElement("div");
  53 + titlebar.setAttribute("id", titlebar_name);
  54 + titlebar.setAttribute("class", titlebar_name);
  55 +
  56 + var icon = document.createElement("div");
  57 + icon.setAttribute("class", titlebar_name + "-icon");
  58 + icon.appendChild(createImage(titlebar_name + "icon", titlebar_icon_url));
  59 + titlebar.appendChild(icon);
  60 +
  61 + var title = document.createElement("div");
  62 + title.setAttribute("class", titlebar_name + "-text");
  63 + title.innerText = titlebar_text;
  64 + titlebar.appendChild(title);
  65 +
  66 + var closeButton = createButton(titlebar_name + "-close-button",
  67 + titlebar_name + "-close-button",
  68 + "button_close.png",
  69 + "button_close_hover.png",
  70 + closeWindow);
  71 + titlebar.appendChild(closeButton);
  72 +
  73 + var divider = document.createElement("div");
  74 + divider.setAttribute("class", titlebar_name + "-divider");
  75 + titlebar.appendChild(divider);
  76 +
  77 + document.body.appendChild(titlebar);
  78 +}
  79 +
  80 +function removeTitlebar(titlebar_name) {
  81 + var titlebar = document.getElementById(titlebar_name);
  82 + if (titlebar)
  83 + document.body.removeChild(titlebar);
  84 +}
  85 +
  86 +function updateContentStyle() {
  87 + var content = document.getElementById("content");
  88 + if (!content)
  89 + return;
  90 +
  91 + var left = 0;
  92 + var top = 0;
  93 + var width = window.outerWidth;
  94 + var height = window.outerHeight;
  95 +
  96 + var titlebar = document.getElementById("top-titlebar");
  97 + if (titlebar) {
  98 + height -= titlebar.offsetHeight;
  99 + top += titlebar.offsetHeight;
  100 + }
  101 + titlebar = document.getElementById("bottom-titlebar");
  102 + if (titlebar) {
  103 + height -= titlebar.offsetHeight;
  104 + }
  105 + titlebar = document.getElementById("left-titlebar");
  106 + if (titlebar) {
  107 + width -= titlebar.offsetWidth;
  108 + left += titlebar.offsetWidth;
  109 + }
  110 + titlebar = document.getElementById("right-titlebar");
  111 + if (titlebar) {
  112 + width -= titlebar.offsetWidth;
  113 + }
  114 +
  115 + var contentStyle = "position: absolute; -webkit-widget-region: region(control rectangle); ";
  116 + contentStyle += "left: " + left + "px; ";
  117 + contentStyle += "top: " + top + "px; ";
  118 + contentStyle += "width: " + width + "px; ";
  119 + contentStyle += "height: " + height + "px; ";
  120 + content.setAttribute("style", contentStyle);
  121 +}
3,790 webgl/js/three.min.js
@@ -6336,409 +6336,409 @@ THREE.SpotLight = function ( hex, intensity, distance, angle, exponent ) {
6336 6336 };
6337 6337
6338 6338 THREE.SpotLight.prototype = Object.create( THREE.Light.prototype );
6339   -/**
6340   - * @author alteredq / http://alteredqualia.com/
6341   - */
6342   -
6343   -THREE.Loader = function ( showStatus ) {
6344   -
6345   - this.showStatus = showStatus;
6346   - this.statusDomElement = showStatus ? THREE.Loader.prototype.addStatusElement() : null;
6347   -
6348   - this.onLoadStart = function () {};
6349   - this.onLoadProgress = function () {};
6350   - this.onLoadComplete = function () {};
6351   -
6352   -};
6353   -
6354   -THREE.Loader.prototype = {
6355   -
6356   - constructor: THREE.Loader,
6357   -
6358   - crossOrigin: 'anonymous',
6359   -
6360   - addStatusElement: function () {
6361   -
6362   - var e = document.createElement( "div" );
6363   -
6364   - e.style.position = "absolute";
6365   - e.style.right = "0px";
6366   - e.style.top = "0px";
6367   - e.style.fontSize = "0.8em";
6368   - e.style.textAlign = "left";
6369   - e.style.background = "rgba(0,0,0,0.25)";
6370   - e.style.color = "#fff";
6371   - e.style.width = "120px";
6372   - e.style.padding = "0.5em 0.5em 0.5em 0.5em";
6373   - e.style.zIndex = 1000;
6374   -
6375   - e.innerHTML = "Loading ...";
6376   -
6377   - return e;
6378   -
6379   - },
6380   -
6381   - updateProgress: function ( progress ) {
6382   -
6383   - var message = "Loaded ";
6384   -
6385   - if ( progress.total ) {
6386   -
6387   - message += ( 100 * progress.loaded / progress.total ).toFixed(0) + "%";
6388   -
6389   -
6390   - } else {
6391   -
6392   - message += ( progress.loaded / 1000 ).toFixed(2) + " KB";
6393   -
6394   - }
6395   -
6396   - this.statusDomElement.innerHTML = message;
6397   -
6398   - },
6399   -
6400   - extractUrlBase: function ( url ) {
6401   -
6402   - var parts = url.split( '/' );
6403   - parts.pop();
6404   - return ( parts.length < 1 ? '.' : parts.join( '/' ) ) + '/';
6405   -
6406   - },
6407   -
6408   - initMaterials: function ( scope, materials, texturePath ) {
6409   -
6410   - scope.materials = [];
6411   -
6412   - for ( var i = 0; i < materials.length; ++ i ) {
6413   -
6414   - scope.materials[ i ] = THREE.Loader.prototype.createMaterial( materials[ i ], texturePath );
6415   -
6416   - }
6417   -
6418   - },
6419   -
6420   - hasNormals: function ( scope ) {
6421   -
6422   - var m, i, il = scope.materials.length;
6423   -
6424   - for( i = 0; i < il; i ++ ) {
6425   -
6426   - m = scope.materials[ i ];
6427   -
6428   - if ( m instanceof THREE.ShaderMaterial ) return true;
6429   -
6430   - }
6431   -
6432   - return false;
6433   -
6434   - },
6435   -
6436   - createMaterial: function ( m, texturePath ) {
6437   -
6438   - var _this = this;
6439   -
6440   - function is_pow2( n ) {
6441   -
6442   - var l = Math.log( n ) / Math.LN2;
6443   - return Math.floor( l ) == l;
6444   -
6445   - }
6446   -
6447   - function nearest_pow2( n ) {
6448   -
6449   - var l = Math.log( n ) / Math.LN2;
6450   - return Math.pow( 2, Math.round( l ) );
6451   -
6452   - }
6453   -
6454   - function load_image( where, url ) {
6455   -
6456   - var image = new Image();
6457   -
6458   - image.onload = function () {
6459   -
6460   - if ( !is_pow2( this.width ) || !is_pow2( this.height ) ) {
6461   -
6462   - var width = nearest_pow2( this.width );
6463   - var height = nearest_pow2( this.height );
6464   -
6465   - where.image.width = width;
6466   - where.image.height = height;
6467   - where.image.getContext( '2d' ).drawImage( this, 0, 0, width, height );
6468   -
6469   - } else {
6470   -
6471   - where.image = this;
6472   -
6473   - }
6474   -
6475   - where.needsUpdate = true;
6476   -
6477   - };
6478   -
6479   - image.crossOrigin = _this.crossOrigin;
6480   - image.src = url;
6481   -
6482   - }
6483   -
6484   - function create_texture( where, name, sourceFile, repeat, offset, wrap ) {
6485   -
6486   - var texture = document.createElement( 'canvas' );
6487   -
6488   - where[ name ] = new THREE.Texture( texture );
6489   - where[ name ].sourceFile = sourceFile;
6490   -
6491   - if( repeat ) {
6492   -
6493   - where[ name ].repeat.set( repeat[ 0 ], repeat[ 1 ] );
6494   -
6495   - if ( repeat[ 0 ] !== 1 ) where[ name ].wrapS = THREE.RepeatWrapping;
6496   - if ( repeat[ 1 ] !== 1 ) where[ name ].wrapT = THREE.RepeatWrapping;
6497   -
6498   - }
6499   -
6500   - if ( offset ) {
6501   -
6502   - where[ name ].offset.set( offset[ 0 ], offset[ 1 ] );
6503   -
6504   - }
6505   -
6506   - if ( wrap ) {
6507   -
6508   - var wrapMap = {
6509   - "repeat": THREE.RepeatWrapping,
6510   - "mirror": THREE.MirroredRepeatWrapping
6511   - }
6512   -
6513   - if ( wrapMap[ wrap[ 0 ] ] !== undefined ) where[ name ].wrapS = wrapMap[ wrap[ 0 ] ];
6514   - if ( wrapMap[ wrap[ 1 ] ] !== undefined ) where[ name ].wrapT = wrapMap[ wrap[ 1 ] ];
6515   -
6516   - }
6517   -
6518   - load_image( where[ name ], texturePath + "/" + sourceFile );
6519   -
6520   - }
6521   -
6522   - function rgb2hex( rgb ) {
6523   -
6524   - return ( rgb[ 0 ] * 255 << 16 ) + ( rgb[ 1 ] * 255 << 8 ) + rgb[ 2 ] * 255;
6525   -
6526   - }
6527   -
6528   - // defaults
6529   -
6530   - var mtype = "MeshLambertMaterial";
6531   - var mpars = { color: 0xeeeeee, opacity: 1.0, map: null, lightMap: null, normalMap: null, bumpMap: null, wireframe: false };
6532   -
6533   - // parameters from model file
6534   -
6535   - if ( m.shading ) {
6536   -
6537   - var shading = m.shading.toLowerCase();
6538   -
6539   - if ( shading === "phong" ) mtype = "MeshPhongMaterial";
6540   - else if ( shading === "basic" ) mtype = "MeshBasicMaterial";
6541   -
6542   - }
6543   -
6544   - if ( m.blending !== undefined && THREE[ m.blending ] !== undefined ) {
6545   -
6546   - mpars.blending = THREE[ m.blending ];
6547   -
6548   - }
6549   -
6550   - if ( m.transparent !== undefined || m.opacity < 1.0 ) {
6551   -
6552   - mpars.transparent = m.transparent;
6553   -
6554   - }
6555   -
6556   - if ( m.depthTest !== undefined ) {
6557   -
6558   - mpars.depthTest = m.depthTest;
6559   -
6560   - }
6561   -
6562   - if ( m.depthWrite !== undefined ) {
6563   -
6564   - mpars.depthWrite = m.depthWrite;
6565   -
6566   - }
6567   -
6568   - if ( m.visible !== undefined ) {
6569   -
6570   - mpars.visible = m.visible;
6571   -
6572   - }
6573   -
6574   - if ( m.flipSided !== undefined ) {
6575   -
6576   - mpars.side = THREE.BackSide;
6577   -
6578   - }
6579   -
6580   - if ( m.doubleSided !== undefined ) {
6581   -
6582   - mpars.side = THREE.DoubleSide;
6583   -
6584   - }
6585   -
6586   - if ( m.wireframe !== undefined ) {
6587   -
6588   - mpars.wireframe = m.wireframe;
6589   -
6590   - }
6591   -
6592   - if ( m.vertexColors !== undefined ) {
6593   -
6594   - if ( m.vertexColors == "face" ) {
6595   -
6596   - mpars.vertexColors = THREE.FaceColors;
6597   -
6598   - } else if ( m.vertexColors ) {
6599   -
6600   - mpars.vertexColors = THREE.VertexColors;
6601   -
6602   - }
6603   -
6604   - }
6605   -
6606   - // colors
6607   -
6608   - if ( m.colorDiffuse ) {
6609   -
6610   - mpars.color = rgb2hex( m.colorDiffuse );
6611   -
6612   - } else if ( m.DbgColor ) {
6613   -
6614   - mpars.color = m.DbgColor;
6615   -
6616   - }
6617   -
6618   - if ( m.colorSpecular ) {
6619   -
6620   - mpars.specular = rgb2hex( m.colorSpecular );
6621   -
6622   - }
6623   -
6624   - if ( m.colorAmbient ) {
6625   -
6626   - mpars.ambient = rgb2hex( m.colorAmbient );
6627   -
6628   - }
6629   -
6630   - // modifiers
6631   -
6632   - if ( m.transparency ) {
6633