EncodeTheCode/mock_operating_system5c_opt_bad2.htm

## mock_operating_system5c_opt_bad2.htm
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Mock File System</title>
    <style>
        body {
            font-family: 'Courier New', Courier, monospace;
            background-color: #f4f4f4;
            padding: 20px;
        }
        .filesystem {
            border: 1px solid #000;
            background-color: #fff;
            padding: 10px;
            width: 300px;
        }
        .directory, .file {
            margin-left: 20px;
            cursor: pointer;
        }
        .directory > .folder-name {
            font-weight: bold;
            color: #0066cc;
        }
        .file {
            color: #333;
        }
    </style>
</head>
<body>
    <h1>Mock File System</h1>
    <div class="filesystem">
        <div class="directory" id="c-drive">
            <div class="folder-name" ondblclick="rename(this)" onclick="toggleVisibility('c-drive-contents')">C:\</div>
            <div class="contents" id="c-drive-contents">
                <div class="file" ondblclick="rename(this)">notepad.exe</div>
                <div class="file" ondblclick="rename(this)">bills.txt</div>
                <div class="directory">
                    <div class="folder-name" ondblclick="rename(this)" onclick="toggleVisibility('my-folder-contents')">MyFolder</div>
                    <div class="contents" id="my-folder-contents">
                        <div class="file" ondblclick="rename(this)">document.docx</div>
                        <div class="file" ondblclick="rename(this)">photo.jpg</div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div>
        <h2>Current Working Directory: <span id="cwd">C:\</span></h2>
        <input type="text" id="command-line" placeholder="Enter command (e.g., cd MyFolder)">
        <button onclick="executeCommand()">Execute</button>
    </div>
    <div>
        <h2>Create New File</h2>
        <input type="text" id="new-file-name" placeholder="File name (e.g., newfile.txt)">
        <button onclick="create('file')">Create File</button>
    </div>
    <div>
        <h2>Create New Folder</h2>
        <input type="text" id="new-folder-name" placeholder="Folder name (e.g., NewFolder)">
        <button onclick="create('folder')">Create Folder</button>
    </div>

    <script>
        let currentDir = document.getElementById('c-drive-contents');
        let currentPath = ['C:'];

        function toggleVisibility(id) {
            document.getElementById(id).style.display ^= 2;
        }

        function create(type) {
            var name = document.getElementById(`new-${type}-name`).value.trim();
            if (!name) {
                alert(`Please enter a ${type} name.`);
                return;
            }
            if (type === 'file' && fileExists(currentDir, name) || type === 'folder' && folderExists(currentDir, name)) {
                alert(`${type.charAt(0).toUpperCase() + type.slice
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Mock File System</title>
	<style>
	body {
	font-family: 'Courier New', Courier, monospace;
	background-color: #f4f4f4;
	padding: 20px;
	}
	.filesystem {
	border: 1px solid #000;
	background-color: #fff;
	padding: 10px;
	width: 300px;
	}
	.directory, .file {
	margin-left: 20px;
	cursor: pointer;
	}
	.directory > .folder-name {
	font-weight: bold;
	color: #0066cc;
	}
	.file {
	color: #333;
	}
	</style>
	</head>
	<body>
	<h1>Mock File System</h1>
	<div class="filesystem">
	<div class="directory" id="c-drive">
	<div class="folder-name" ondblclick="rename(this)" onclick="toggleVisibility('c-drive-contents')">C:\</div>
	<div class="contents" id="c-drive-contents">
	<div class="file" ondblclick="rename(this)">notepad.exe</div>
	<div class="file" ondblclick="rename(this)">bills.txt</div>
	<div class="directory">
	<div class="folder-name" ondblclick="rename(this)" onclick="toggleVisibility('my-folder-contents')">MyFolder</div>
	<div class="contents" id="my-folder-contents">
	<div class="file" ondblclick="rename(this)">document.docx</div>
	<div class="file" ondblclick="rename(this)">photo.jpg</div>
	</div>
	</div>
	</div>
	</div>
	</div>

	<div>
	<h2>Current Working Directory: <span id="cwd">C:\</span></h2>
	<input type="text" id="command-line" placeholder="Enter command (e.g., cd MyFolder)">
	<button onclick="executeCommand()">Execute</button>
	</div>
	<div>
	<h2>Create New File</h2>
	<input type="text" id="new-file-name" placeholder="File name (e.g., newfile.txt)">
	<button onclick="create('file')">Create File</button>
	</div>
	<div>
	<h2>Create New Folder</h2>
	<input type="text" id="new-folder-name" placeholder="Folder name (e.g., NewFolder)">
	<button onclick="create('folder')">Create Folder</button>
	</div>

	<script>
	let currentDir = document.getElementById('c-drive-contents');
	let currentPath = ['C:'];

	function toggleVisibility(id) {
	document.getElementById(id).style.display ^= 2;
	}

	function create(type) {
	var name = document.getElementById(`new-${type}-name`).value.trim();
	if (!name) {
	alert(`Please enter a ${type} name.`);
	return;
	}
	if (type === 'file' && fileExists(currentDir, name) \|\| type === 'folder' && folderExists(currentDir, name)) {
	alert(`${type.charAt(0).toUpperCase() + type.slice