Recommendation for SWT/JFace Javascript Editor? - javascript

I'm building an app using SWT + JFace and I would like to integrate a Javascript editor (with Syntax Highlighting and Auto-Indent).
I'm looking for something simple like RSyntaxTextArea: just use the widget like as a TextArea and set the syntax to "Javascript".
So far I've come across examples with "JFace Text" but it seems I have to implement the Javascript part myself. Also, I don't want to integrate the whole Eclipse workbench if possible.
Do you know of any component that would do the job?

It's possible to use StyledText widget (so no dependency on JFace) to show syntax highlight (see Into the Deep End of the SWT StyledText Widget), but it's quite lot of work to do..
For additional example see Implements syntax coloring using the StyledText API.
It's also possible to use SWT_AWT bridge and put the RSyntaxTextArea to your application directly..

I found some interesting project, which might help you with the situation..
It's called The DJ Project (The Sweet library brings some rich components to SWT-based applications) and when you check the Gallery, you can find as last example SWT gui with javascript syntax highlighted text area.
The licence is LGPL, which is one of the best for any purpose..

Related

How to create a HTML5 Drag and Drop Editor?

feel like this is kind of weird question but still,
I want to create studio where people can create cards using different kind of contents, like Text, Images, Video, Audio, Links etc. and save them, so that I should be able to render them as they designed through some other view.
I am planning to built it with ReactJS Framework. I am new bee to ReactJS, just went through TODO tutorials. And done some work around to understand Drag and Drop features with ReactJS.
But I am still confused about How and Where to begin coding for my requirement. What should be the structure of my application. What all properties each components should have, totally got blocked.
I am not asking here exactly to give the structure for my application, I am looking for some resources/documents where it explains how to structure application for these kind of requirements.
Something like beefree.io is what I want to build.
Many Many Thanks for all your feedback.
I very recommend TinyMCE editor: https://www.tinymce.com/download/. This editor has a lot of features. I can also recommend http://hammerjs.github.io/, https://github.com/yabwe/medium-editor and http://premiumsoftware.net/cleditor/.
If you want to create standalone HTML5 editor, you should research GitHub sources of recommended editors and learn mainly jQuery and AngularJS.
Instructions how to create from basics HTML5 editor:
http://www.simonewebdesign.it/how-to-make-browser-editor-with-html5-contenteditable/
http://blog.teamtreehouse.com/building-an-html5-text-editor-with-the-filesystem-apis
http://buildwithreact.com/
I recommend trying out Unroll.io's react-email-editor: https://github.com/unroll-io/react-email-editor
It has a lot of features that you are looking for and is super easy to use in your web app. Also good documentation is available.
This React component is focused towards emails but if you plan to use it for HTML pages instead of emails, you can easily create a similar React component and change displayMode to web as per Unroll.io docs.
I have seen this being used in production on EmailMonster's email editor.

Using ScriptSharp to code YUI controls

I am in the process of choosing ScriptSharp for coding all my javascripts. I already use JQuery and it is great that there is built-in support for this.
But what about YUI? I need it in particular for the editor control..
How can I code the part for the editor control within Script# framework? Is there a place to enter custom javascript when a certain library is not supported or something similar?
Are there any future plans to add YUI to ScriptSharp?
It would be interesting to have YUI support, but there aren't specific plans to add support for it right now, at least not at the top of the priority list.
However, if folks in the community want to get it going and contribute, I can help with questions that come up.
The general idea is you create an import library (there is an Import Library project template when you install Script#), which defines a c# API corresponding to the OM that you program against. The C# API consists of classes and stub methods that define the signatures (think of this as a header file of sorts). There are a few metadata attributes to customize generation of script that references those APIs to get various transforms to happen ... so you can create a working, and often times more natural c# interface that then maps to runtime script constructs and APIs you are targeting.
When I see the sample at http://yuilibrary.com/ I see a bunch of parallels to jQuery, so I imagine building support for it is likely possible at a technical level.
The best way to understand how to do this would be to look at the sources of mscorlib.dll (represents the core script objects) Script.Web.dll (represents the DOM) and Script.jQuery.dll (represents core jQuery API). All of these are in the Script# repository on github ... https://github.com/nikhilk/scriptsharp ... if you haven't already seen them.
We are creating an import library for OpenLayers (http://openlayers.org) and I can say it is incredible easy to do. We started just doing what NikhilK says, inspecting the source code. The results are just great. YUI is a very well designed and documented api, so I think it would be stratightforward. You could just create the import clases you need for your project.

How to efficiently refactor in a qooxdoo project

I am just working on a big qooxdoo project and want to refactor it. For example, i want to move a class, that is referenced quite often from one package path (app.ui.) to another (app.view.), change variable names. Normal refactoring stuff.
In comparision to Delphi or C#, this seems to be terribly painful with a qooxdoo javascript project.
Is there any easy and uncomplicated way to do this?
FYI: I edit the project with gedit in linux mint.
moving a class shoud be easy within a qooxdoo project because usually every occurance is referenced absolut which means you can use your editor and "search an replace" the whole thing. The only thing you have to do additionally is to move the file to the desired location and thats it. So its more a question of the editor than of the file structure.
Best,
Martin

How to add Rich Text Editor to display code snippets

Im working on a Rails based application where I have the need to allow the user to format the text he enters and I would also like a way to highlight code snippets the way Stackoverflow does when I enter a code snippet.
Are there any plugins that do this.
And I would also like to know which is the RTE that is recommended and would be unobtrusive.
I see a lot of recommendations for FCKEditor but how do I implement the code snippets?
It seems like you might need something lighterweight than CKeditor. If you do choose to use CKeditor, I would use a rails plugin to install it. I use this one :
http://github.com/galetahub/rails-ckeditor
The directions are very straightforward on the git.
As for Syntax Highlighting , I recommend :
The GitHub crew loves Pygments. They are using it on many different places, including Jekyll and GitHub itself. The downside is that it's a python library so you would need to install python and execute it as a shell task.
Syntax Highlighter, jQuery Library <-- The easiest to implement
http://alexgorbatchev.com/SyntaxHighlighter/
Rails3 has these plugins :
Ruby offers 3 code highlighting Gems: Ultraviolet, Syntax and CodeRay. AFAIK, the last one is the most adopted.

What is a good javascript editor for editing custom DSL code?

I'm looking for a nice / customisable editor to put on a web page for editing scripts for a custom DSL. Ideally with syntax highlighting (and intellisense would be great! )
Anyone know of anything suitable?
For syntax highlighting, look at EditArea. Intellisense could be written as a plugin.
maybe you should have a look at codemirror:
http://codemirror.net/
it's "just" an editor-component and you will probably have to put some work into it. but it's easy to enhance and integrate it.
You should take a look at Bespin. You have a good description here:
http:// mozillalabs.com/bespin/2010/01/15/bespin-embedded-0-6-released-now-in-two-great-flavors/
It has a full support for being embedded. See the embedding doc :
https:// bespin.mozilla.com/docs/embedding/index.html
You can write a custom syntax highlighting plugin pretty easily if needed.
You can probably fork and adapt one of the built-in syntax highlighters.
The editor itself and its plugins are written in Javascript.
The project is aimed at being a complete web-based & collaborative code editor, so intellisense-like features should make their way in soon if they're no alreay present.
The successor of the Mozilla Skywriter (Bespin) project is ACE: http://ace.ajax.org/

Categories