Building a PHP Editor for CMS
I started looking around for a online PHP IDE. I didn't find too much. A few HTML WYSIWYG types, yet none that would do PHP editing or syntax highlighting. I know I can easily open a document via PHP and edit the content, yet I wanted just a little more finesse.
I usually use HTML-Kit as my editor (HTML-Kit 292 version), so I wanted to have a online editor work in similar ways. I am a big fan of TinyMCE so I started looking into how I could make this work for my needs. Downloaded the latest versions development code and manually built out a lot of the elements that are created via JavaScript. My goals were to be able to highlight the syntax of HTML, JavaScript, and PHP and using methods already laid out by TinyMCE, I should be able to do this.
The web application will use HTML, JQuery, and PHP to allow the user to select or create a file to edit. PHP will read the file content into a Textarea field. Using JQuery, The content of the Textarea is then display, via JQuery into iFrame that will highlight the syntax. Making use of the ContentEditable and DesignMode features, the iFrame can be edited and changed. Upon saving the changes, JQuery will POST the data back to the file or target.
This is what I have created so far, seen in FireFox.
The layout is good so far. I still need to build in a lot of the functionality. This will not be a WYSIWYG type of editor, yet if you highlight text and press the Bold button, it will wrap the text in the Bold html tags or just create them at the cursor. Selecting a common PHP Code will build that structure or function. When it detects code, it will change the color of that code to help highlight it. I also want to add in a line number count. That promises to be pretty difficult. The view menu should allow you to preview the file and might also allow you to suppress the PHP Code and view the HTML rendered.
This has been pretty exciting and I hope to get it to a point where it's easily shared and others might be interested in using it.
I usually use HTML-Kit as my editor (HTML-Kit 292 version), so I wanted to have a online editor work in similar ways. I am a big fan of TinyMCE so I started looking into how I could make this work for my needs. Downloaded the latest versions development code and manually built out a lot of the elements that are created via JavaScript. My goals were to be able to highlight the syntax of HTML, JavaScript, and PHP and using methods already laid out by TinyMCE, I should be able to do this.
The web application will use HTML, JQuery, and PHP to allow the user to select or create a file to edit. PHP will read the file content into a Textarea field. Using JQuery, The content of the Textarea is then display, via JQuery into iFrame that will highlight the syntax. Making use of the ContentEditable and DesignMode features, the iFrame can be edited and changed. Upon saving the changes, JQuery will POST the data back to the file or target.
This is what I have created so far, seen in FireFox.
The layout is good so far. I still need to build in a lot of the functionality. This will not be a WYSIWYG type of editor, yet if you highlight text and press the Bold button, it will wrap the text in the Bold html tags or just create them at the cursor. Selecting a common PHP Code will build that structure or function. When it detects code, it will change the color of that code to help highlight it. I also want to add in a line number count. That promises to be pretty difficult. The view menu should allow you to preview the file and might also allow you to suppress the PHP Code and view the HTML rendered.
This has been pretty exciting and I hope to get it to a point where it's easily shared and others might be interested in using it.