developersharif/Monaco-Editor.html

## Monaco-Editor.html
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>Monaco Editor</title>
    <link rel="stylesheet" href="https://unpkg.com/monaco-editor@0.25.2/min/vs/editor/editor.main.css">
</head>

<body>
    <select id="language-select">
        <option value="javascript">JavaScript</option>
        <option value="html">html</option>
        <option value="typescript">TypeScript</option>
        <option value="python">Python</option>
        <option value="java">Java</option>
        <option value="c">C</option>
        <option value="cpp">C++</option>
        <option value="csharp">C#</option>
        <option value="go">Go</option>
        <option value="php">PHP</option>
    </select>
    <div id="editor" style="height: 500px"></div>
    <script src="https://unpkg.com/monaco-editor@0.25.2/min/vs/loader.js"></script>
    <script>
        require.config({ paths: { 'vs': 'https://unpkg.com/monaco-editor@0.25.2/min/vs' } });
        require(['vs/editor/editor.main'], function () {
            var editor = monaco.editor.create(document.getElementById('editor'), {
                value: 'function hello() {\n\tconsole.log("Hello, world!");\n}',
                language: 'javascript'
            });
            var languageSelect = document.getElementById('language-select');
            languageSelect.addEventListener('change', function () {
                var language = languageSelect.value;
                monaco.editor.setModelLanguage(editor.getModel(), language);
            });
            monaco.editor.onDidChangeModelLanguage(function (event) {

                var selectedLanguage = event.model._languageIdentifier.language;

                // Change the editor value based on the selected language
                switch (selectedLanguage) {
                    case "javascript":
                        editor.setValue("console.log('Hello, world!');");
                        break;
                    case "html":
                        editor.setValue("<html>\n  <body>\n    <h1>Hello, world!</h1>\n  </body>\n</html>");
                        break;
                    case "php":
                        editor.setValue("<?php\n  echo 'Hello from world!';\n?>");
                        break;
                    // Add more cases for other languages
                }
            });
        });

    </script>
</body>

</html>
	<!DOCTYPE html>
	<html>

	<head>
	<meta charset="utf-8">
	<title>Monaco Editor</title>
	<link rel="stylesheet" href="https://unpkg.com/monaco-editor@0.25.2/min/vs/editor/editor.main.css">
	</head>

	<body>
	<select id="language-select">
	<option value="javascript">JavaScript</option>
	<option value="html">html</option>
	<option value="typescript">TypeScript</option>
	<option value="python">Python</option>
	<option value="java">Java</option>
	<option value="c">C</option>
	<option value="cpp">C++</option>
	<option value="csharp">C#</option>
	<option value="go">Go</option>
	<option value="php">PHP</option>
	</select>
	<div id="editor" style="height: 500px"></div>
	<script src="https://unpkg.com/monaco-editor@0.25.2/min/vs/loader.js"></script>
	<script>
	require.config({ paths: { 'vs': 'https://unpkg.com/monaco-editor@0.25.2/min/vs' } });
	require(['vs/editor/editor.main'], function () {
	var editor = monaco.editor.create(document.getElementById('editor'), {
	value: 'function hello() {\n\tconsole.log("Hello, world!");\n}',
	language: 'javascript'
	});
	var languageSelect = document.getElementById('language-select');
	languageSelect.addEventListener('change', function () {
	var language = languageSelect.value;
	monaco.editor.setModelLanguage(editor.getModel(), language);
	});
	monaco.editor.onDidChangeModelLanguage(function (event) {

	var selectedLanguage = event.model._languageIdentifier.language;

	// Change the editor value based on the selected language
	switch (selectedLanguage) {
	case "javascript":
	editor.setValue("console.log('Hello, world!');");
	break;
	case "html":
	editor.setValue("<html>\n <body>\n <h1>Hello, world!</h1>\n </body>\n</html>");
	break;
	case "php":
	editor.setValue("<?php\n echo 'Hello from world!';\n?>");
	break;
	// Add more cases for other languages
	}
	});
	});

	</script>
	</body>

	</html>