Code Monkey home page Code Monkey logo

icecoder's Introduction

ICEcoder is for sale! Please contact [email protected]. Serious offers only.


ICEcoder

Code editor awesomeness ...in your browser

ICEcoder is a browser based code editor, which provides a modern approach to building websites. By allowing you to code directly within the web browser, online or offline, it means you only need one program (your browser) to develop sites, plus can test on actual web servers. After development, you can also maintain the website easily, all of which make for speedy and smart development.

ICEcoder code editor

Requirements

You can run ICEcoder either online or locally, on Linux, Windows or Mac based platforms. The only requirement is to have PHP 7 available (7.4 recommended). You can have this either as a vanilla installation or via a program such as WAMP or XAMPP (for Windows) or MAMP (for Mac).

Installation

Step 1: Get ICEcoder

Either download the zip or clone from Github into your wwwroot (document root) dir for your website (this is typically /var/www/html/) via:

$ git clone [email protected]:icecoder/icecoder /var/www/html/icecoder

Step 2: Set permissions on dirs & files

You'll need to ensure both the ICEcoder dir and the wwwroot dir have permissions to read, write and execute. This can be done by changing permissions (using chmod), but it it safer and so better, to use chown:

chown -R www-data.www-data /var/www/html

This will recursively set the www-data user as both the owner and group users for files on the /var/www/html dir (which ICEcoder dir is of course inside of, at say /var/www/html/ICEcoder).

Step 3: Start coding

Now you can visit yoursite.com/ICEcoder to view ICEcoder, sign in and start coding!

Tip: If using ICEcoder locally, you can use:

php -S localhost:8080

...to get PHP to start a simple web server. You can then visit localhost:8080/ICEcoder

Want to setup in other environments?

It's now possible to setup ICEcoder in a Docker container, via Composer, as an executable and more. Checkout https://icecoder.net/downloads for info on these setups!

It's free & open source for everyone!

Suitable for commercial & non-commercial projects, just let us know if it's useful to you and any cool customizations you make to it. We take no responsibility for anything, all usage is all down to you.

It's fully open source and MIT licensed. So we're happy for you to take it, make it your own and customize to your hearts content and/or contribute to this main repo! :)

Plenty of comments included in the code to assist with understanding, customizing etc.

Comments, improvements & feedback welcomed!

icecoder's People

Contributors

alelondon avatar andrey012 avatar atatoth avatar atorresbr avatar avgp avatar bhz6344 avatar ciubotaru avatar dutchcaveman avatar gurachan avatar jamieslome avatar koseelg avatar krisxoofoo avatar kucerarichard avatar lzh370 avatar marclaporte avatar martinhbramwell avatar mattpass avatar mbirth avatar mtpiercey avatar nippey avatar olliiee avatar paladitya avatar pietrondo avatar pushreset avatar rotelok avatar servius avatar skliew avatar smokeypell avatar unix4you2 avatar wimtibackx avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

icecoder's Issues

Nest Hover/Select States

Hovering your mouse over the nest positions (ie, DIV > DIV > SPAN) will select that section of text (so you can click delete, copy etc if you wish). Moving the mouse away will return to the original non hover state.

If you click the nest position, it will stay as this, so moving the mouse away will remain by effectively setting this as the selection.

Focusing improvements

When you switch tabs it should update the found results display. There are also issues with finding in the current document if you're not focused within it.

User login via POST

Add user login box(es), via email/username & password combo.

Form should work over POST and not GET.

Opening New Files in Window

Pressing CTRL+Enter opens the file in a new window, but this shouldn't be done for new files as they aren't yet saved and cannot be opened in the same way. Only allow CTRL+Enter for saved files.

Open last files on load

If you close ICE coder with files open, on next load of ICE coder the same files are loaded. This can be achieved simply by writing the openFiles array to the settings file on close. On load these files are loaded.

Improved CodeAssist Nesting

The CodeAssist auto nesting & tag ending might be improved in a couple of ways. Firstly by using the closetag.js lib that comes with codeMirror, though this is suited to XML and may not work amazingly, investigation needed.

Also, don't report a nest position if we don't have a doctype, html or body tag to suit templated websites. Perhaps better still, the nesting could be worked out intelligently, rather than omitting it altogether?

Backup plugin no longer working

The backup plugin is now has an incorrect target since ICE coder evolved to use multiple CodeMirror instances. Backups now either create a zip with empty files or don't create a zip at all.

Closing tabs doesn't shift CM instances along

When you click to close a tab, any subsequent tabs should collapse down by one, from that point until the rightmost one is reached, then clear & reset. This works fine, but the associated CodeMirror instance should do the same, however it doesn't. Extra code should be written to clone the next instance in sequence until the last is reached and setValue('') and clearHistory() can be called.

Shifting editot instances along can be done simply by setting cM2=cM3; cM3=cM4 and so on as it relates to a new CodeMirror instance. Some alterations are needed to make references within the object relative.

Properties option in File Manager Menu

Add a new option to the context menu that pops up when you right click a file/folder in the file manager for properties.

Should provide info on filesize, creation/modified date, owner & permissions.

The permissions should relate to CHMOD and be able to be modifed by clicking boxes or entering values (ie, 0755).

Files & folders upload function

Allow a drag & drop files & folders function to upload files (& create folders also) into the target folder.

Maybe Filesystem API or XHR should be used. Ideally want drag & drop instead of a dialog window.

$ownerInfo issue on some servers

Look into the $ownerInfo issue which provides the file owner name on servers but for some reason won't work on all and causes ICE Coder to fail loading altogether. Only affects files.php, and temporary files have been put in place to basically ignore the coding relating to actual file owner.

Drag to sort tabs

Allow user to drag tabs left & right to sort. Instance numbers need to be shifted around to accomodate changes.

Adjustable File Manager width

Allow user to click-drag the right side of the File Manager to adjust the width. Also use the horizontal move mouse cursor.

Close tab & changed tabs issue

Closing any tab apart from the end one will remove the tab, but the tab to the right of it is erroneaously shown as changed.

Expand & contract rounding on nav & content

Previously CSS3 transforms were used to expand & contract the nav & content area in unison, on mouseover of the nav area. Due to the computational rounding to the nearest pixel (or floor/ceil?), the width of nav + content area wouldn't always add up to the full width of the screen. As there are therefore sometimes a couple of pixels less than needed on some frames of the transition, an odd wobbling could be seen to the right side of the content area.

The only solution is to compute with JS on a setInterval. This way we can always ensure the total widths added will be the full width of the screen rather than leave to the browser.

Cancel via ESC key

Currently in order to login you need to visit /_coder, wait for it to load, then login & again wait for it to load. This is a bit annoying.

Maybe we could introduce a ESC keydown event so pressing it, whatever it is doing will stop. In the case of loading, it can simply stop loading the file manager. In the case of the server queue to save, delete, open, rename etc it can cancel everything in the queue.

This would be good to kill processes and therefore get you to the login box much quicker, only needing to really load once.

</textarea> in content ends it there

Having a </textarea> tag within the content will end the loaded content immediately before this tag. Reason is that loaded content is put into a textarea to use as a container and also deal with chars. Solution should simply be to alter any loaded </textarea> tags to something different so the container isn't escaped and then alter back to the real tag on load into CodeMirror instance.

ICEcoder future ideas & features

This was a dump list of ideas I've drawn up since ICEcoder v1. These are now put into seperate issues and so this issue finally closed.

Show results screen for multiple results

Create a results screen to show multiple results (ie, searching within open files, folders, filenames etc). Also create the extra functionality to perform these searches.

Cannot delete multiple files

While you can select multiple files and the file control system is able to delete multiple files, the context menu selects only your last file on right click and deselects others

CTRL+S in other tab before save happens causes issues

If you have 2 tabs open and make changes in both, CTRL+S in one to begin saving then jump to other tab and CTRL+S before first one has saved, it will end up saving contents in wrong document. Either stop user from saving, queue up save contents, or save via different iFrame channels (though this last option may involve looking into multiple concurrent data transfers and cause issues). Best solution is a save queue?

Move config settings to seperate file or DB

Both the storage of user config settings and usage of them are within same settings.php file right now. This was OK to begin with, but with the increasing no of settings, it being updatable now plus other code such as plugins handling moving into this file it's suggested that the config settings move into a new config.php file.

Another solution would be storing of config settings in a MySQL DB. While it is an extra resource & requirement for users, the benefits could be huge. Multi user account settings, file revision history and other future ideas would all be best handled by a DB and may be a better solution to implement?

Ruby language support

Add Ruby as a language and make work as expected with the already established functions.

Overwrite Permission

Ask for overwrite permission if saving a new or existing file over another files name.

CTRL+Shift+S = Save As

If the user uses the key combo CTRL+Shift+S, it will perform a 'save as' rather than just 'save'.

Switch tab issues

Sometimes loading a file of a reasonable size after an initial file is loaded, the editor instance wont display.

The text is loaded and hidden textarea is shown but there is no CodeMirror instance visible. This appears to be due to setting the CSS values to show/hide on demand. Doing this via display, opacity, visibility, left or top didn't work at all, but width appeared to at first and certainly with most small files.

However. It doesn't work perfectly and can cause issues.

When investigating this, I've noticed that the switchTab function is called many times. As setting of the CSS class is done within this function, its possibly due to this? Even if not, it should only be called once. It also appears as uf higher loaded instances obscure others?

Upon login, set session etc but don't reload page

It's a little frustrating when you make changes to a file, realise you can't save because you're not logged in and upon logging in, it reloads the page and you lose your changes. A better solution would be to login and it updates session vars etc to show icons, allow saving etc without the need for a reload.

Session Timeouts/Lost Connections?

ICEcoder on some servers seems to lose the connection and hang when saving, resulting in the file not being saved and nothing being able to be loaded either. Not sure if this is down to session timeouts or some other issue? Perhaps error catching needs to be in place for failed pageloads?

Add intro/features/benefits screen

When you open ICEcoder, if you're not logged in, it will show an intro screen. This is a 4 screen area which provides an intro to ICE coder including video, a list of features, a list of benefits and finally a list of shortcut keys. The shortcut keys should be accessable again via shortcut also.

Quicker denial warnings

If you attempt to do something such as save and aren't logged in, it takes a while to give you a response saying it can't due to actually doing the load to attempt to save and denying at last second. Denials to do something should give an instant response by moving the warning to function which triggers to sequence of events.

globalLeaks plugin

Use Maettigs globalLeaksDump script to check for leaked vars as you type, change content etc.

Alerts user if they create a global variable, helping to elminate this kind of thing.

Help key to open webpage info

When you have text highlighted and press CTRL+I, it will open a new tab with relevant search results or official documentation. For instance, highlighting 'date' within a block of PHP and pressing CTRL+I will open a new tab with Google search results for 'PHP date'. An alternative idea here is to open the official PHP webpage.

Account & icons area

Improve the login area, so that once logged in, icons are shown for save, open, delete, rename etc. This is because double click, keystrokes etc not avail on touchscreen devices such as mobiles & tablets and some people may want to use them. Grey out if not avail and show if possible. ie, click on a file to highlight and options show. Also remove userLevel 0-10, you are either logged in or not.

Changes to File Manager Don't Cause Refresh

Improve the file manager so that adding, editing, deleting, moving, pasting etc don't need to call a refresh to get the new file structure.

This instead can be handled by updating the LIs instead of reloading the SRC.

Keydown issue

Pressing CTRL+Enter opens new window. Close that window to return to ICE coder. Press Enter alone and it will open a new window. S alone will save, F alone will Find etc.

This is because while the focus is lost by opening a new window, the CTRL key is still registered as being down via the ctrlKeyDown var.

Solution is to turn the bool on the var to false, even though key is down to prevent any locking/sticking.

Allow collaborative editing

Allow files on the domain to be worked on collaboratively without unexpected overwrites. At it's most basic we could store file modification datetimes from PHP in a JS array. This could be pushed/popped when you load/close a file and updated when a successful save is made.

(When you save, it firstly checks it hasn't changed since your last load or save. If it finds the current datetime is different to our array item, alert the user that the file has changed since their last save).

Building on this idea, we could ask the user if they then want to refresh the changed file and move the new and unsaved code to a blank document. Ultimately in the future I would like to show the code difference between the files and who made these changes (though this requires multiple logins, accounts etc).

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.