https://software3d.com/

1<!DOCTYPE html>
2<html lang=en>
3<head>
4<meta charset="UTF-8">
5<meta name="viewport" content="width=device-width, initial-scale=1">
6<link rel="SHORTCUT ICON" href="favicon.ico">
7<link rel="stylesheet" href="w3.css">
8<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
9<title>Software3D - Geometric software by Robert Webb</title>
10<meta name="keywords" content="3d, minesweeper, 3dminesweeper, minesweeper3d, minesweeper 3d, 3d minesweeper, polyhedra, polyhedron, polyhedral, nets, net, polyhedra nets, polyhedron nets, polyhedral nets, polyhedron net, polyhedra net, 2D nets, dual, duals, polyhedrons, polyhedras, making polyhedra, building polyhedra, constructing polyhedra, construction, polyhedron models, dual models, model making, paper models, cardboard models, software, poliedro, polidros, polyedre, polyedres, polyeder, poliedri, great, small, stellar, great stella, small stella, stella, geometry, 3d geometry, mathematical models, education, educational, fun">
11<link rel="stylesheet" href="stylesBody.css">
12<link rel="stylesheet" href="styles.css?v=6b">
13<link rel="stylesheet" href="stylesCollapsible.css?v=1">

14<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-3665282332441900" crossorigin="anonymous"></script>

14

15<script>
16// Load the saved sidebar width. Do early, in the header.
17const savedWidth = localStorage.getItem('sidebarWidth');
18if (savedWidth) {
19	document.documentElement.style.setProperty('--sidebar-width', savedWidth + "px");
20	// Also move the resizer handle to the correct starting spot
21	const resizer = document.getElementById("sidebar-resizer");
22	if (resizer) {
23		resizer.style.left = parseInt(savedWidth) + "px";
24	}
25}
26</script>

26
27
28<meta name="description" content="Software3D describes software by Robert Webb,
29which includes software for viewing and building polyhedra">
30</head>
31
32<body>
33<style>
34.row-noindent {
35 position: relative !important;
36 left: 10px !important;
37 width: calc(100vw - 10px) !important;
38 margin-left: calc(100% - 100vw) !important;
39 padding: 0 !important;
40}
41@media screen and (min-width: 993px) {
42 .row-noindent {
43  width: calc(100vw - 10px - 170px) !important;
44  margin-left: calc(100% - 100vw + 170px) !important;
45 }
46}
47</style>
48

49<script>
50function openSidebar()
51{
52	//document.getElementById("main").style.marginLeft = "170px";
53	document.getElementById("menuPanel").style.display = "block";
54	//document.getElementById("closeSidebar").style.display = "block";
55}
56
57function closeSidebar()
58{
59	//document.getElementById("main").style.marginLeft = "0px";
60	document.getElementById("menuPanel").style.display = "none";
61}
62
63function toggleSidebar()
64{
65	if (document.getElementById("menuPanel").style.display == "none")
66		openSidebar();
67	else
68		closeSidebar();
69}
70
71function doDropdown(id)
72{
73	var x = document.getElementById(id);
74	if (x.className.indexOf("w3-show") == -1)
75	{
76		x.className += " w3-show";
77			}
78	else
79	{ 
80		x.className = x.className.replace(" w3-show", "");
81			}
82}
83</script>

83
84
85<style>
86:root {
87	--sidebar-width: 170px;
88}
89.sideBarItem {
90	width: max-content !important;
91	display: block;
92	min-width: 100%;
93	box-sizing: border-box;
94	align-items: left;
95	padding: 1px 0px 1px 0px !important;
96	font-weight: bold !important;
97	text-decoration: none !important;
98	white-space: nowrap !important;
99}
100.sideBarTopLevel {
101	margin-top: 17px;
102	font-size: 16px;
103}
104.sideBarChild {
105	margin-top: 0px;
106	font-size: 13px;
107}
108.sideBarSelected {
109	background-color: #4a5df9;
110	color: white;
111}
112.sideBarNotSelected {
113	background-color: #cccccc;
114	color: #0000c0;
115}
116.w3-main { /* Default for small screens (sidebar collapsed) */
117	margin-left: 0 !important;
118	transition: none !important;
119	background-color: #eeeeee;
120}
121#menuPanel {
122	overflow-x: auto !important;
123	overflow-y: auto;
124	width: var(--sidebar-width, 170) !important;
125	transition: none !important;
126	background-image: url(BG.png);
127}
128#sidebar-resizer {
129	/* display: none; */
130	width: 7px;
131	cursor: col-resize;
132	position: fixed;
133	left: var(--sidebar-width);
134	top: 0;
135	bottom: 0;
136	z-index: 9999;
137	background: transparent;
138}
139@media (min-width: 993px) {
140	.w3-main {
141		margin-left: var(--sidebar-width) !important;
142	}
143	
144	/* Hide the resizer handle when the sidebar is collapsed */
145	#sidebar-resizer {
146		/* display: block; */
147	}
148}
149</style>
150
151<div class="screen-only">
152<div class="w3-sidebar w3-animate-left w3-bar-block w3-collapse w3-card" id="menuPanel">
153<button id="closeSidebar" class="w3-bar-item w3-button w3-hide-large" onClick="closeSidebar()">Close &times;</button>
154
155<a class='sideBarItem w3-bar-item w3-hover-blue-grey w3-button sidetable sideBarTopLevel sideBarNotSelected' style='height:26px;' target='_blank' href='Convergle/'><img style='' src="StellaIcon.gif" width=22 height=22 hspace=10>Convergle</a>
156<a class='sideBarItem w3-bar-item w3-hover-blue-grey w3-button sidetable sideBarTopLevel sideBarNotSelected' style='height:26px;' target='_blank' href='Flippant/'><img style='' src="StellaIcon.gif" width=22 height=22 hspace=10>Flippant</a>
157<a class='sideBarItem w3-bar-item w3-hover-blue-grey w3-button sidetable sideBarTopLevel sideBarNotSelected' style='height:26px;' target='_blank' href='WorldsKaleid/'><img style='' src="StellaIcon.gif" width=22 height=22 hspace=10>Worlds Kaleid</a>
158<a class='sideBarItem w3-bar-item w3-hover-blue-grey w3-button sidetable sideBarTopLevel sideBarNotSelected' style='height:26px;' target='_blank' href='Mines3D/'><img style='' src="StellaIcon.gif" width=22 height=22 hspace=10>MineSweeper3D</a>
159<a class='sideBarItem w3-bar-item w3-hover-blue-grey w3-button sidetable sideBarTopLevel sideBarNotSelected' style='height:26px;' target='_blank' href='Stella.php'><img style='' src="StellaIcon.gif" width=22 height=22 hspace=10>Stella</a>
160<a class='sideBarItem w3-bar-item w3-hover-blue-grey w3-button sidetable sideBarTopLevel sideBarNotSelected' style='height:26px;' target='_blank' href='Forums/'><img style='' src="StellaIcon.gif" width=22 height=22 hspace=10>Forums</a>
161	<p></p>
162	<a href="https://www.facebook.com/Stella4D">
163	<img src="facebookSmall.png" width=24 height=24 border=0 hspace=10></a>	<p></p>
164	<table cellpadding="5" class="sidetable"><tr><td>
165	<p>See all my products at:<br><a href="index.php">https://software3d.com</a></p>
166<p>Copyright&nbsp;&copy;&nbsp;2001-2026, <a href="Contact.php">Robert&nbsp;Webb</a></p>
167</td></tr></table>
168
169<table style="margin-left:5px; margin-right:5px" cellpadding='0'><tr><td>
170		<p>&nbsp;</p>
171	<p><font size=-3 color=#666666>Search terms: <b>3d, minesweeper, 3dminesweeper, minesweeper3d, minesweeper 3d, 3d minesweeper, polyhedra, polyhedron, polyhedral, nets, net, polyhedra nets, polyhedron nets, polyhedral nets, polyhedron net, polyhedra net, 2D nets, dual, duals, polyhedrons, polyhedras, making polyhedra, building polyhedra, constructing polyhedra, construction, polyhedron models, dual models, model making, paper models, cardboard models, software, poliedro, polidros, polyedre, polyedres, polyeder, poliedri, great, small, stellar, great stella, small stella, stella, geometry, 3d geometry, mathematical models, education, educational, fun</b></font>
172		</td></tr></table>
173</div>
174<div id="sidebar-resizer">
175</div>
176</div>
177
178<div class="w3-main" id="main">
179
180<div class="screen-only">
181<div class="w3-cell-row" style="width=100%; background-color:#000080">
182
183<div class="w3-cell w3-hide-large">
184<button class="w3-button w3-xlarge" onclick="openSidebar()">
185<font color=#eeeeee>&#9776;</font></button></div>
186
187<div class='w3-cell w3-cell-middle' style='padding:4px 4px'>

187<img src='ScreenShots/FoldingFramed.gif' align=left vspace='0' style='width:100%; max-width:192px'>
188</div><div class='w3-cell w3-cell-middle' style='padding:4px 4px'><center><img src='ScreenShots/Title.gif' vspace='0' style='width:100%; max-width:742px'></center>
189</div><div class='w3-cell w3-cell-middle' style='padding:4px 4px'><img src='Flippant/images/Demo.gif' align=right vspace='0' style='width:100%; max-width:161px'>
190</div></div>
191</div>
192
193<div style="padding:0px 10px">
194
195<h1>Software3D</h1>
196<p>
197Welcome to software3d.com!  This site is dedicated to software written by
198Robert Webb.  Products available are:
199<ul>
200<li><a href="Stella.php#small"><b>Small Stella</b></a> - simple program for viewing
201polyhedra and printing nets for their physical construction.
202<li><a href="Stella.php#great"><b>Great Stella</b></a> - advanced polyhedron program,
203including tools such as <i>stellation</i> for creating an infinite variety of
204amazing polyhedra.  And you can still print all their nets!
205<li><a href="Stella.php#stella4D"><b>Stella4D</b></a> - includes everything from
206Great Stella, but adds four-dimensional polytopes to the equation.  The
207ultimate tool for 3D or 4D investigation.
208<li><a href="Mines3D"><b>MineSweeper3D</b></a> - 3D version of the popular
209Minesweeper game.  With new tilings and 3D graphics, this game offers a lot
210more interest and variety than the original!
211<li><a href="Flippant"><b>Flippant</b></a> - Tile-flipping puzzle game app.
212<li><a href="WorldsKaleid"><b>Worlds Kaleid!</b></a> - A live-camera
213<li><a href="Convergle"><b>Convergle</b></a> - Wordle variant with different rules.
214kaleidoscope app.
215<li><a href="https://disconnectica.com"><b>Music</b></a> - I also write alternative rock music under the name Disconnectica
216</ul>
217
218<h2>Small Stella</h2>
219<a href="Stella.php#small"><img src="ScreenShots/SmallScreen.png"
220	width=348 height=280 title="Small Stella screen-shot">
221<img src="JPeg/GreatIcos.jpg" width=408 height=272
222	title="Great Icosahedron,
223made from nets printed by Small Stella"><br>
224Small Stella</a> lets you view over 300 built-in
225polyhedra, which can be rotated on the screen.  Then you can print out nets to
226build your own physical model!  Just print the nets, cut them out, and glue
227them together.  Click <a href="Stella.php#small">here</a> for details.
228
229<h2>Great Stella</h2>
230<a href="Stella.php#great"><img src="ScreenShots/GreatScreen.png"
231	width=381 height=280 title="Great Stella screen-shot">
232<img src="JPeg/15RectTID.jpg" width=373 height=280
233	title="15 Cuboids - Faceted Truncated Icosidodecahedron,
234	made from nets printed by Great Stella"><br>
235Great Stella</a> is the ultimate polyhedral tool.
236It has all the features of Small Stella, plus many advanced tools for creating
237new models.  Click <a href="Stella.php#great">here</a> for all the details.
238
239<h2>Stella4D</h2>
240<a href="Stella.php#stella4D"><img src="ScreenShots/Stella4D2.png"
241	width=381 height=280 title="Stella4D screen-shot">
242<img src="JPeg/Grit.jpg" width=363 height=272
243	title="308-Grit, made from nets printed by Stella4D"><br>
244Stella4D</a> has all the 3D features from Great Stella, but also includes 4D
245polytopes.  Click <a href="Stella.php#stella4D">here</a> for all the details.
246
247<h2>MineSweeper3D</h2>
248<table><tr><td>
249<a href="Mines3D">
250<img src="Mines3D/images/2Dto3D.gif" width=179 height=213 hspace=15
251align=left title="Sick of 2D?  Try MineSweeper3D!"></a>
252</td><td>
253<a href="Mines3D">MineSweeper3D</a> takes the popular Minesweeper
254game into a whole new dimension!  Choose from many different 3D boards, with
255various new tilings to challenge your logic.  Best-times are remembered for
256each board, and world records are maintained online.  Can you be the fastest in
257the world?
258</td></tr></table>
259
260<h2>Flippant</h2>
261<table><tr><td>
262<a href="Flippant">
263<img src="Flippant/images/Tablet7Inch4.jpg" width=640 height=400 hspace=15
264align=left title="Tile-flipping puzzle game"></a>
265</td><td>
266<a href="Flippant/">Flippant</a> - A tile-flipping puzzle game app
267for Android (other platforms later depending on demand).
268</td></tr></table>
269
270<h2>Worlds Kaleid</h2>
271<table><tr><td>
272<a href="WorldsKaleid">
273<img src="WorldsKaleid/images/Kaleid02.jpg" width=400 height=326 hspace=15
274align=left title="Live-camera kaleidoscope"></a>
275</td><td>
276<a href="WorldsKaleid/">Worlds Kaleid</a> - A
277live-camera kaleidoscope app for Android (other platforms later depending on
278demand).
279</td></tr></table>
280
281<h2>Convergle</h2>
282<table><tr><td>

283<a href="Convergle">
284<img src="Convergle.png" width=210 height=350 hspace=15
285align=left title="Wordle variant puzzle game"></a>
286</td><td>
287<a href="Convergle/">Convergle</a> - A Wordle variant with different rules.
288Web-based, so available on all platforms.
289</td></tr></table>
290
291
292
293
294
295<p><center>
296<a href="Rob.php">Rob's personal home page</a>.
297</center>
298</div>
299</div>

300<script>
301const sidebar = document.getElementById("menuPanel");
302const resizer = document.getElementById("sidebar-resizer");
303
304resizer.addEventListener("mousedown", (e) => {
305	document.body.classList.add("no-select");
306	document.addEventListener("mousemove", resize);
307	document.addEventListener("mouseup", stopResize);
308});
309resizer.addEventListener("dblclick", () => {
310	const defaultWidth = "170px";
311
312	// Snap the CSS variable back to default
313	document.documentElement.style.setProperty('--sidebar-width', defaultWidth);
314	
315	// Update localStorage so the reset persists on the next page load
316	localStorage.setItem('sidebarWidth', 170);
317});
318
319let rafId = null;
320
321function resize(e) {
322	if (rafId)
323		return;		// Already processing frame
324
325	rafId = requestAnimationFrame(() => {
326		// We set the width based on the mouse X position
327		let newWidth = e.clientX;
328		
329		// Constraints
330		if (newWidth > 100 && newWidth < 390) {
331			// Update CSS variable with sidebar width
332			document.documentElement.style.setProperty('--sidebar-width', newWidth + "px");
333		}
334		rafId = null;
335	});
336}
337
338function stopResize() {
339	document.body.classList.remove("no-select");
340	document.removeEventListener("mousemove", resize);
341	
342	// Grab the current width from the CSS variable and save it
343	const currentWidth = getComputedStyle(document.documentElement).getPropertyValue('--sidebar-width');
344	localStorage.setItem('sidebarWidth', parseInt(currentWidth));
345}
346window.addEventListener('load', function() {
347	// Find the item you want to center
348	const activeItem = document.querySelector('.sideBarSelected');
349	const menuPanel = document.getElementById('menuPanel');
350
351	if (activeItem && menuPanel) {
352		activeItem.scrollIntoView({
353			behavior: 'auto',   // Use 'smooth' if you want a sliding effect
354			block: 'center',    // This is the magic: it centers it vertically

355			inline: 'nearest'   // Keeps horizontal scroll from jumping unnecessarily
356		});
357		menuPanel.scrollLeft = 0;
358	}
359});
360</script>

360
361
362<!-- Image Hover Preview Tooltip -->
363<style>
364  #img-preview-tooltip {
365	position: fixed; /* Relative to visible window, preventing document scrollbars */
366	display: none;
367	z-index: 99999;
368	pointer-events: none;
369	background: #ffffff;
370	border: 1px solid #ccc;
371	padding: 6px;
372	border-radius: 6px;
373	box-shadow: 0px 4px 12px rgba(0,0,0,0.25);
374	max-width: 90vw;
375	max-height: 90vh;
376  }
377
378  #img-preview-tooltip img {
379	display: block;
380	max-width: 100%;
381	max-height: 85vh;
382	border-radius: 4px;
383	width: auto;
384	height: auto;
385  }
386</style>
387
388<div id="img-preview-tooltip"><img src=""></div>
389

390<script>
391document.addEventListener("DOMContentLoaded", function () {
392  const tooltip = document.getElementById("img-preview-tooltip");
393  const tooltipImg = tooltip.querySelector("img");
394  const imageRegex = /\.(jpg|jpeg|png|gif|webp)(\?.*)?$/i;
395
396  document.querySelectorAll("a").forEach(link => {
397	// Check if href is an image OR if custom data attribute exists
398	const isDirectImage = imageRegex.test(link.href);
399	const customImage = link.getAttribute("data-preview");
400
401	if (isDirectImage || customImage) {
402	  
403	  link.addEventListener("mouseenter", function () {
404		// Priority: Use data-preview if defined, otherwise use href
405		tooltipImg.src = customImage ? customImage : link.href;
406		tooltip.style.display = "block";
407	  });
408
409	  link.addEventListener("mousemove", function (e) {
410		const padding = 15;
411		
412		const mouseX = e.clientX;
413		const mouseY = e.clientY;
414
415		const viewportWidth = window.innerWidth;
416		const viewportHeight = window.innerHeight;
417
418		const tooltipWidth = tooltip.offsetWidth;
419		const tooltipHeight = tooltip.offsetHeight;
420
421		let left = mouseX + padding;
422		let top = mouseY + padding;
423
424		// Flip left if overflowing right edge
425		if (left + tooltipWidth > viewportWidth - padding) {
426		  left = mouseX - tooltipWidth - padding;
427		}
428
429		// Flip top if overflowing bottom edge
430		if (top + tooltipHeight > viewportHeight - padding) {
431		  top = mouseY - tooltipHeight - padding;
432		}
433
434		// Safety clamp for screen edges
435		left = Math.max(padding, left);
436		top = Math.max(padding, top);
437
438		tooltip.style.left = left + "px";
439		tooltip.style.top = top + "px";
440	  });
441
442	  link.addEventListener("mouseleave", function () {
443		tooltip.style.display = "none";
444		tooltipImg.src = "";
445	  });
446	}
447  });
448});
449</script>

449
450

451<script type="module" src="https://static.cloudflareinsights.com/beacon.min.js/v31edd6df95cf4e85bb4c19e7a9bdbcba1788362987495" integrity="sha512-iIg7k2xntmwu6/uSb5tpc/hySgZc4eoL31yB29W6tJFo2akwjPWcEqnCEdJvGexCL0KEQwVYv5BlowfhVz26hg==" data-cf-beacon='{"version":"2024.11.0","token":"58b4abb7458647ee918be4b33a2c738e","r":1,"spa":2}' crossorigin="anonymous"></script>

451
452</body>
453</html>