Skip to content

Commit f68c688

Browse files
TavinaCTavinaC
committed
screen size fix 2
1 parent 58d22d3 commit f68c688

File tree

2 files changed

+30
-117
lines changed

2 files changed

+30
-117
lines changed

‎Pizzaman/PizzaMan.css‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,9 @@ body {
1616
font-weight: 400px;
1717
text-align: center;
1818

19+
width: 100vw;
20+
height: 100vh;
21+
1922
}
2023

2124
.rotation {
@@ -28,7 +31,7 @@ body {
2831

2932
/**If the device is a touch screen and in landscape*/
3033
@media only screen and (orientation: landscape){
31-
#unity-container, .title {
34+
#unity-canvas, .title {
3235
display: none;
3336
}
3437

@@ -53,8 +56,8 @@ body {
5356
}
5457

5558
#unity-canvas {
56-
width: calc(100vw - 100px*2);
57-
height: calc(2*(100vw - 100px*2));
59+
width: calc(100vw - 75px*2);
60+
height: calc(2*(100vw - 75px*2));
5861
background: #281A34;
5962
border: 5px solid #FF3B7F;
6063
border-radius: 20px;

‎Pizzaman/PizzaMan.html‎

Lines changed: 24 additions & 114 deletions
Original file line numberDiff line numberDiff line change
@@ -5,147 +5,57 @@
55
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
66
<title>Chuck N' Cheese</title>
77
<link rel="shortcut icon" href="../assets/favicon.ico">
8-
<link rel="stylesheet" href="TemplateData/style.css">
98
<link rel="stylesheet" href="PizzaMan.css">
10-
<script src="Authorization.js"></script>
119

1210
<!--Google material symbols-->
1311
<link
1412
href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined"
1513
rel="stylesheet"
16-
/>
14+
/>
1715

18-
<!--Pixel Font-->
19-
<link rel="preconnect" href="https://fonts.googleapis.com">
20-
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
21-
<link href="https://fonts.googleapis.com/css2?family=Pixelify+Sans:[email protected]&display=swap" rel="stylesheet">
16+
<!--Pixel Font-->
17+
<link rel="preconnect" href="https://fonts.googleapis.com">
18+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
19+
<link href="https://fonts.googleapis.com/css2?family=Pixelify+Sans:[email protected]&display=swap" rel="stylesheet">
2220

2321
</head>
24-
<body>
22+
<body style="text-align: center; padding: 0; border: 0; margin: 0;">
2523

2624
<div class = rotation>Please Rotate Or Resize The Screen Into Portrait Mode. <br>
2725
<span class="material-symbols-outlined" style= "font-size: 3rem;">
2826
sync
2927
</span>
3028
</div>
3129

32-
<div id="unity-container" class="unity-desktop">
33-
<canvas id="unity-canvas"></canvas>
34-
<div id="unity-loading-bar">
35-
<div id="unity-logo"></div>
36-
<div id="unity-progress-bar-empty">
37-
<div id="unity-progress-bar-full"></div>
38-
</div>
39-
</div>
40-
<div id="unity-warning"> </div>
41-
<div id="unity-footer">
42-
<div id="unity-webgl-logo"></div>
43-
<div id="unity-fullscreen-button"></div>
44-
<div id="unity-build-title">Pacman</div>
45-
</div>
46-
</div>
30+
<canvas id="unity-canvas"></canvas>
31+
<script src="Build/Pizzaman.loader.js"></script>
4732
<script>
48-
49-
var container = document.querySelector("#unity-container");
50-
var canvas = document.querySelector("#unity-canvas");
51-
var loadingBar = document.querySelector("#unity-loading-bar");
52-
var progressBarFull = document.querySelector("#unity-progress-bar-full");
53-
var fullscreenButton = document.querySelector("#unity-fullscreen-button");
54-
var warningBanner = document.querySelector("#unity-warning");
55-
56-
// Shows a temporary message banner/ribbon for a few seconds, or
57-
// a permanent error message on top of the canvas if type=='error'.
58-
// If type=='warning', a yellow highlight color is used.
59-
// Modify or remove this function to customize the visually presented
60-
// way that non-critical warnings and error messages are presented to the
61-
// user.
62-
function unityShowBanner(msg, type) {
63-
function updateBannerVisibility() {
64-
warningBanner.style.display = warningBanner.children.length ? 'block' : 'none';
65-
}
66-
var div = document.createElement('div');
67-
div.innerHTML = msg;
68-
warningBanner.appendChild(div);
69-
if (type == 'error') div.style = 'background: red; padding: 10px;';
70-
else {
71-
if (type == 'warning') div.style = 'background: yellow; padding: 10px;';
72-
setTimeout(function() {
73-
warningBanner.removeChild(div);
74-
updateBannerVisibility();
75-
}, 5000);
76-
}
77-
updateBannerVisibility();
78-
}
79-
80-
var buildUrl = "Build";
81-
var loaderUrl = buildUrl + "/Pizzaman.loader.js";
82-
var config = {
83-
dataUrl: buildUrl + "/Pizzaman.data",
84-
frameworkUrl: buildUrl + "/Pizzaman.framework.js",
85-
codeUrl: buildUrl + "/Pizzaman.wasm",
86-
streamingAssetsUrl: "StreamingAssets",
87-
companyName: "DefaultCompany",
88-
productName: "Pacman",
89-
productVersion: "1.0",
90-
};
91-
92-
// By default, Unity keeps WebGL canvas render target size matched with
93-
// the DOM size of the canvas element (scaled by window.devicePixelRatio)
94-
// Set this to false if you want to decouple this synchronization from
95-
// happening inside the engine, and you would instead like to size up
96-
// the canvas DOM size and WebGL render target sizes yourself.
97-
// config.matchWebGLToCanvasSize = false;
98-
99-
// If you would like all file writes inside Unity Application.persistentDataPath
100-
// directory to automatically persist so that the contents are remembered when
101-
// the user revisits the site the next time, uncomment the following line:
102-
// config.autoSyncPersistentDataPath = true;
103-
// This autosyncing is currently not the default behavior to avoid regressing
104-
// existing user projects that might rely on the earlier manual
105-
// JS_FileSystem_Sync() behavior, but in future Unity version, this will be
106-
// expected to change.
107-
10833
/*if (/iPhone|iPad|iPod|Android/i.test(navigator.userAgent)) {
10934
// Mobile device style: fill the whole browser client area with the game canvas:
110-
11135
var meta = document.createElement('meta');
11236
meta.name = 'viewport';
11337
meta.content = 'width=device-width, height=device-height, initial-scale=1.0, user-scalable=no, shrink-to-fit=yes';
11438
document.getElementsByTagName('head')[0].appendChild(meta);
115-
container.className = "unity-mobile";
116-
canvas.className = "unity-mobile";
117-
118-
// To lower canvas resolution on mobile devices to gain some
119-
// performance, uncomment the following line:
120-
// config.devicePixelRatio = 1;
121-
12239
123-
} else {
124-
// Desktop style: Render the game canvas in a window that can be maximized to fullscreen:
40+
var canvas = document.querySelector("#unity-canvas");
41+
canvas.style.width = "100%";
42+
canvas.style.height = "100%";
43+
canvas.style.position = "fixed";
12544
126-
canvas.style.width = "200px";
127-
canvas.style.height = "200px";
45+
document.body.style.textAlign = "left";
12846
}*/
12947

130-
//loadingBar.style.display = "block";
131-
132-
var script = document.createElement("script");
133-
script.src = loaderUrl;
134-
script.onload = () => {
135-
createUnityInstance(canvas, config, (progress) => {
136-
//progressBarFull.style.width = 100 * progress + "%";
137-
}).then((unityInstance) => {
138-
loadingBar.style.display = "none";
139-
fullscreenButton.onclick = () => {
140-
unityInstance.SetFullscreen(1);
141-
};
142-
}).catch((message) => {
143-
alert(message);
144-
});
145-
};
146-
147-
document.body.appendChild(script);
148-
48+
createUnityInstance(document.querySelector("#unity-canvas"), {
49+
dataUrl: "Build/Pizzaman.data",
50+
frameworkUrl: "Build/Pizzaman.framework.js",
51+
codeUrl: "Build/Pizzaman.wasm",
52+
streamingAssetsUrl: "StreamingAssets",
53+
companyName: "DefaultCompany",
54+
productName: "Pacman",
55+
productVersion: "1.0",
56+
// matchWebGLToCanvasSize: false, // Uncomment this to separately control WebGL canvas render size and DOM element size.
57+
// devicePixelRatio: 1, // Uncomment this to override low DPI rendering on high DPI displays.
58+
});
14959
</script>
15060
</body>
15161
</html>

0 commit comments

Comments
 (0)