Click here to Skip to main content
15,887,268 members
Articles / Web Development / HTML

Fully JavaScript Enabled Editor

Rate me:
Please Sign up or sign in to vote.
4.60/5 (33 votes)
7 Sep 2010CPOL1 min read 65.5K   2.1K   116  
Fully JavaScript enabled editor which also contains some server coding
  • editorvbnet.zip
    • EditorVBNet
      • Default.aspx
      • Default.aspx.vb
      • editorimages
        • BackColor.gif
        • Bold.gif
        • ButtonDesign.gif
        • ButtonHtml.gif
        • ButtonPreview.gif
        • close.gif
        • ConvertToLower.gif
        • ConvertToUpper.gif
        • Copy.gif
        • Cut.gif
        • Delete.gif
        • Delete2.gif
        • Font.gif
        • FontSize.gif
        • ForeColor.gif
        • FormatCodeBlock.gif
        • ImageMapDialog.gif
        • Indent.gif
        • InsertDate.gif
        • InsertHorizontalRule.gif
        • InsertOrderedList.gif
        • InsertSymbol.gif
        • InsertTable.gif
        • InsertTime.gif
        • InsertUnorderedList.gif
        • Italic.gif
        • JustifyCenter.gif
        • JustifyFull.gif
        • JustifyLeft.gif
        • JustifyRight.gif
        • LinkManager.gif
        • Outdent.gif
        • Paste.gif
        • Print.gif
        • Redo.gif
        • RemoveFormat.gif
        • SelectAll.gif
        • StrikeThrough.gif
        • Subscript.gif
        • Superscript.gif
        • Thumbs.db
        • toolbarstart.gif
        • Underline.gif
        • Undo.gif
        • zoomInIcon.gif
        • zoomOutIcon.gif
      • EditorScript.js
      • EditorStyle.css
      • imgWindow.aspx
      • imgWindow.aspx.vb
      • InsertLink.htm
      • InsertTable.htm
      • NEditor.ascx
      • NEditor.ascx.vb
      • SpecialChars.htm
      • uploadsDir
        • imagefiles
          • ball.gif
          • dog.jpg
          • dolphin.jpg
          • eye.jpg
          • image004.jpg
          • image009.jpg
          • mob1.jpg
          • Thumbs.db
          • WATERsky.jpg
  • editorphp.zip
    • EditorPHP
      • default.php
      • editorimages
        • BackColor.gif
        • Bold.gif
        • ButtonDesign.gif
        • ButtonHtml.gif
        • ButtonPreview.gif
        • close.gif
        • ConvertToLower.gif
        • ConvertToUpper.gif
        • Copy.gif
        • Cut.gif
        • Delete.gif
        • Delete2.gif
        • Font.gif
        • FontSize.gif
        • ForeColor.gif
        • FormatCodeBlock.gif
        • ImageMapDialog.gif
        • Indent.gif
        • InsertDate.gif
        • InsertHorizontalRule.gif
        • InsertOrderedList.gif
        • InsertSymbol.gif
        • InsertTable.gif
        • InsertTime.gif
        • InsertUnorderedList.gif
        • Italic.gif
        • JustifyCenter.gif
        • JustifyFull.gif
        • JustifyLeft.gif
        • JustifyRight.gif
        • LinkManager.gif
        • Outdent.gif
        • Paste.gif
        • Print.gif
        • Redo.gif
        • RemoveFormat.gif
        • SelectAll.gif
        • StrikeThrough.gif
        • Subscript.gif
        • Superscript.gif
        • Thumbs.db
        • toolbarstart.gif
        • Underline.gif
        • Undo.gif
        • zoomInIcon.gif
        • zoomOutIcon.gif
      • EditorScript.js
      • EditorStyle.css
      • imgWindow.php
      • InsertLink.htm
      • InsertTable.htm
      • NEditor.php
      • SpecialChars.htm
      • uploadsDir
        • imagefiles
          • ball.gif
          • dog.jpg
          • dolphin.jpg
          • eye.jpg
          • image004.jpg
          • image009.jpg
          • mob1.jpg
          • Thumbs.db
          • WATERsky.jpg
  • editorcs.zip
    • EditorCS
      • Default.aspx
      • Default.aspx.cs
      • editorimages
        • BackColor.gif
        • Bold.gif
        • ButtonDesign.gif
        • ButtonHtml.gif
        • ButtonPreview.gif
        • close.gif
        • ConvertToLower.gif
        • ConvertToUpper.gif
        • Copy.gif
        • Cut.gif
        • Delete.gif
        • Delete2.gif
        • Font.gif
        • FontSize.gif
        • ForeColor.gif
        • FormatCodeBlock.gif
        • ImageMapDialog.gif
        • Indent.gif
        • InsertDate.gif
        • InsertHorizontalRule.gif
        • InsertOrderedList.gif
        • InsertSymbol.gif
        • InsertTable.gif
        • InsertTime.gif
        • InsertUnorderedList.gif
        • Italic.gif
        • JustifyCenter.gif
        • JustifyFull.gif
        • JustifyLeft.gif
        • JustifyRight.gif
        • LinkManager.gif
        • Outdent.gif
        • Paste.gif
        • Print.gif
        • Redo.gif
        • RemoveFormat.gif
        • SelectAll.gif
        • StrikeThrough.gif
        • Subscript.gif
        • Superscript.gif
        • Thumbs.db
        • toolbarstart.gif
        • Underline.gif
        • Undo.gif
        • zoomInIcon.gif
        • zoomOutIcon.gif
      • EditorScript.js
      • EditorStyle.css
      • imgWindow.aspx
      • imgWindow.aspx.cs
      • InsertLink.htm
      • InsertTable.htm
      • NEditor.ascx
      • NEditor.ascx.cs
      • SpecialChars.htm
      • uploadsDir
        • imagefiles
          • ball.gif
          • dog.jpg
          • dolphin.jpg
          • eye.jpg
          • image004.jpg
          • image009.jpg
          • mob1.jpg
          • Thumbs.db
          • WATERsky.jpg
  • editor_php.zip
    • editor_php
      • default.php
      • editorimages
        • BackColor.gif
        • Bold.gif
        • ButtonDesign.gif
        • ButtonHtml.gif
        • ButtonPreview.gif
        • close.gif
        • ConvertToLower.gif
        • ConvertToUpper.gif
        • Copy.gif
        • Cut.gif
        • Delete.gif
        • Delete2.gif
        • Font.gif
        • FontSize.gif
        • ForeColor.gif
        • ImageMapDialog.gif
        • Indent.gif
        • InsertDate.gif
        • InsertFlash.gif
        • InsertFormButton.gif
        • InsertFormCheckbox.gif
        • InsertFormFileUpload.gif
        • InsertFormForm.gif
        • InsertFormHidden.gif
        • InsertFormPassword.gif
        • InsertFormRadio.gif
        • InsertFormReset.gif
        • InsertFormSelect.gif
        • InsertFormSelect2.gif
        • InsertFormSubmit.gif
        • InsertFormText.gif
        • InsertFormTextarea.gif
        • InsertHorizontalRule.gif
        • InsertMedia.gif
        • InsertOrderedList.gif
        • InsertSymbol.gif
        • InsertTable.gif
        • InsertTemplate.gif
        • InsertTime.gif
        • InsertUnorderedList.gif
        • Italic.gif
        • JustifyCenter.gif
        • JustifyFull.gif
        • JustifyLeft.gif
        • JustifyRight.gif
        • LinkManager.gif
        • Outdent.gif
        • Paste.gif
        • Print.gif
        • Redo.gif
        • RemoveFormat.gif
        • Save.gif
        • SaveLocal.gif
        • SelectAll.gif
        • StrikeThrough.gif
        • Subscript.gif
        • Superscript.gif
        • Thumbs.db
        • toolbarstart.gif
        • Underline.gif
        • Undo.gif
        • zoomInIcon.gif
        • zoomOutIcon.gif
      • EditorScripts.js
      • EditorStyle.css
      • flashWindow.php
      • imgWindow.php
      • InsertLinks.htm
      • InsertTable.htm
      • mediaWindow.php
      • NEditor.php
      • saveWindow.php
      • SpecialChars.htm
      • templateWindow.php
      • uploadsDir
        • flashfiles
        • imagefiles
          • Thumbs.db
        • mediafiles
          • Thumbs.db
        • templatefiles
  • editor_vb.net.zip
  • Editor.zip
<%@ Page Language="vb" AutoEventWireup="true" CodeFile="templateWindow.aspx.vb" Inherits="templateWindow" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Insert Template</title>
    <link href="EditorStyle.css" rel="stylesheet" type="text/css" />

    <script language="javascript">
        function chkFile()
        {
            var filupload = document.getElementById("<%= templateUpload.ClientID %>").value;
            if(filupload == "")
            {
                alert("Please select a HTML file");
                return false;
            }    
            else
            {
                if(filupload.lastIndexOf(".htm") == -1 && filupload.lastIndexOf(".HTM") == -1 && filupload.lastIndexOf(".html") == -1 && filupload.lastIndexOf(".HTML") == -1)
                {
                    alert("The File you selected is not a HTML File");
                    return false;
                }
            }
        }
    
        var tempSrc;
        function loadTemplate(tmpName)
        {           
            tempSrc = "uploadsDir/templatefiles/" + tmpName;
            document.getElementById("tempIFrame").src = tempSrc;
        }
        
        function setTemplate()
        {
            if(tempSrc)
            {
                var topWind = window.opener;
                topWind.editFrame.focus();
                var content = tempIFrame.document.body.innerHTML;
                var selectedRegion = topWind.editFrame.document.selection.createRange();
                selectedRegion.pasteHTML(content);
                window.close();
            }
            else
            {
                alert("You have not selected any HTML file");
            }
            
        }
        
    </script>

</head>
<body topmargin="0" bottommargin="0" rightmargin="0" leftmargin="0" class='txtStyle'
    bgcolor='#fffcd1'>
    <form id="form1" runat="server">
    <table align="Center" cellpadding="2" cellspacing="2">
        <tr>
            <td colspan="2" align="center">
                INSERT TEMPLATES
            </td>
        </tr>
        <tr>
            <td colspan="2" align="center">
                <asp:FileUpload ID="templateUpload" runat="server" Width="250px" CssClass="otherstyle" />&nbsp;<asp:Button
                    ID="btnUpload" runat="server" CssClass="buttonStyle2" Text="Upload" OnClick="btnUpload_Click" />
            </td>
        </tr>
        <tr>
            <td align="center" class="txtStyle">
                List of Templates
            </td>
            <td align="Center" class="txtStyle">
                Preview
            </td>
        </tr>
        <tr>
            <td align="center">
                <div id="listDiv" class="newDivStyle">
                    <%= listOfTemplates %>
                </div>
            </td>
            <td align="Center">
                <div class="newDivStyle">
                    <iframe id="tempIFrame" frameborder="0" width="150" height="150"></iframe>
                </div>
            </td>
        </tr>
        <tr>
            <td colspan="2" align="right">
                <button id="btnOK" class="buttonStyle2" onclick="setTemplate()">
                    OK</button>&nbsp;
                <button id="btnCancel" class="buttonStyle2" onclick="window.close()">
                    Cancel</button>
            </td>
        </tr>
    </table>
    </form>
</body>
</html>

By viewing downloads associated with this article you agree to the Terms of Service and the article's licence.

If a file you wish to view isn't highlighted, and is a text file (not binary), please let us know and we'll add colourisation support for it.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
India India
This member has not yet provided a Biography. Assume it's interesting and varied, and probably something to do with programming.

Comments and Discussions