matthewd673/index.html

## index.html
<!DOCTYPE html>
<html>
    <head>
        <title>codewread</title>
        <script src="codemirror-4.10/lib/codemirror.js"></script>
        <link rel="stylesheet" href="codemirror-4.10/lib/codemirror.css">
        <script src="codemirror-4.10/mode/javascript/javascript.js"></script>
        <style>
            #comment
            {
                width: 800px;
            }
        </style>
    </head>
    <body>

        <button id="write-button" onclick="writePress()">Write</button>
        <button id="read-button" onclick="readPress()">Read</button>
        <input type="text" placeholder="You can't comment in write mode" id="comment">
        <button id="submit-button" onclick="submitComment()">Submit comment</button>

        <script>
            var editor = CodeMirror(document.body, {
                value: "//code goes here\n",
                mode:  "javascript"
            });

            var commenting = false;

            var mouseDown = false;

            document.body.onmousedown = function()
            {
                mouseDown = true;
            }
            document.body.onmouseup = function()
            {
                mouseDown = false;
            }

            function writePress()
            {
                editor.setOption("readOnly", false);
                commenting = false;
                document.getElementById("comment").placeholder = "You can't comment in write mode";
            }

            function readPress()
            {
                editor.setOption("readOnly", true);
                commenting = true;
                document.getElementById("comment").placeholder = "Nothing to comment on";
            }

            function submitComment()
            {
                editor.focus();
                //editor.execCommand("goLineEnd");
                editor.replaceSelection(editor.getSelection() + " //" + document.getElementById("comment").value, "end");
            }

            editor.on("cursorActivity", function()
            {
                if(commenting)
                {
                    if(editor.getSelection() != "")
                    {
                        document.getElementById("comment").placeholder = "Comment on:" + editor.getSelection();
                    }
                }
            });
        </script>

    </body>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<title>codewread</title>
	<script src="codemirror-4.10/lib/codemirror.js"></script>
	<link rel="stylesheet" href="codemirror-4.10/lib/codemirror.css">
	<script src="codemirror-4.10/mode/javascript/javascript.js"></script>
	<style>
	#comment
	{
	width: 800px;
	}
	</style>
	</head>
	<body>

	<button id="write-button" onclick="writePress()">Write</button>
	<button id="read-button" onclick="readPress()">Read</button>
	<input type="text" placeholder="You can't comment in write mode" id="comment">
	<button id="submit-button" onclick="submitComment()">Submit comment</button>

	<script>
	var editor = CodeMirror(document.body, {
	value: "//code goes here\n",
	mode: "javascript"
	});

	var commenting = false;

	var mouseDown = false;

	document.body.onmousedown = function()
	{
	mouseDown = true;
	}
	document.body.onmouseup = function()
	{
	mouseDown = false;
	}

	function writePress()
	{
	editor.setOption("readOnly", false);
	commenting = false;
	document.getElementById("comment").placeholder = "You can't comment in write mode";
	}

	function readPress()
	{
	editor.setOption("readOnly", true);
	commenting = true;
	document.getElementById("comment").placeholder = "Nothing to comment on";
	}

	function submitComment()
	{
	editor.focus();
	//editor.execCommand("goLineEnd");
	editor.replaceSelection(editor.getSelection() + " //" + document.getElementById("comment").value, "end");
	}

	editor.on("cursorActivity", function()
	{
	if(commenting)
	{
	if(editor.getSelection() != "")
	{
	document.getElementById("comment").placeholder = "Comment on:" + editor.getSelection();
	}
	}
	});
	</script>

	</body>
	</html>