search

judge0 / ide

✨ Simple, free and open-source online code editor.
https://ide.judge0.com
MIT License
818 stars 257 forks source link

Resize property added #9

Closed manaswinidas closed 6 years ago

manaswinidas commented 6 years ago

Fixes #4 Resizable editors in the required directions added

hermanzdosilovic commented 6 years ago

Hey @manaswinidas,

I don't think this solves #4. Take a look what happens when I resize input editor to the left. screenshot from 2017-10-07 13-53-26

This should work as on Try Kotlin for example. You can easily see that you can resize each editor because your cursor changes.

Can you please fix this?

Let me know if you need more instructions on this issue.

manaswinidas commented 6 years ago

I have solved the label inconsistency issue up to some extent. The input and output editors seem to be replicated due to CodeMirror-gutter. How can it be resolved? @hermanzdosilovic Can you help?

hermanzdosilovic commented 6 years ago

Take a look at cm-resize. Before using cm-resize, you should probably remove all height and min-height attributes from #sourceEditor, #inputEditor and #outputEditor.

Let me know if I can help you more.

manaswinidas commented 6 years ago

cm-resize needs to be added in ide.js, right? After adding cm-resize I am facing the following issue. Only input and output labels are visible. CodeMirror resize is not working. image

hermanzdosilovic commented 6 years ago

cm-resize should be downloaded and added to js/cm-resize.js. After that it should be included in index.html like download.js for example. After that you can use cm-resize in js/ide.js.

If you take a look at cm-resize.js you can see that you can give cmResize method some config, for example:

cmResize(sourceEditor, {
  resizableWidth: false
});

I suggest that you consider my comments in previews comment I made and that you also undo your changes with labels.

Let me know if you need any more help with this. :smile: