• Login
sketchucation logo sketchucation
  • Login
🤑 SketchPlus 1.3 | 44 Tools for $15 until June 20th Buy Now

Syntax Highlighting in SU WebDialog

Scheduled Pinned Locked Moved Developers' Forum
13 Posts 4 Posters 1.5k Views
Loading More Posts
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • D Offline
    driven
    last edited by 18 Jan 2011, 01:44

    something I've finally got to work, on the mac at least... not the editor bits yet, but highting using html5, css and js

    don't know if there's any interest so I thought I'd post and see... if there is I'll try and use TT's keyword-list to tweak the ruby version... this example just html dictionary

    theme-able...
    SU Highlighting_02.jpg

    learn from the mistakes of others, you may not live long enough to make them all yourself...

    1 Reply Last reply Reply Quote 0
    • J Offline
      Jim
      last edited by 18 Jan 2011, 22:50

      Here's one:

      Link Preview Image
      CodeMirror

      In-browser code editor

      favicon

      (codemirror.net)

      Just saw a story that Google Code Hosting is now using this.

      Hi

      1 Reply Last reply Reply Quote 0
      • D Offline
        driven
        last edited by 18 Jan 2011, 23:00

        cheers I'll have a look...

        learn from the mistakes of others, you may not live long enough to make them all yourself...

        1 Reply Last reply Reply Quote 0
        • D Offline
          Dan Rathbun
          last edited by 19 Jan 2011, 00:37

          @jim said:

          Here's one:

          Link Preview Image
          CodeMirror

          In-browser code editor

          favicon

          (codemirror.net)

          Just saw a story that Google Code Hosting is now using this.

          (1) Go to this website: http://eloquentjavascript.net/chapter1.html

          (2) Scroll down till you see the sample JS codebox, that begins:
          var total = 0, count = 1;

          (3) on the right side of the codebox, click the "Load into Console" button...

          Look familiar Jim ?? 😛

          I'm not here much anymore.

          1 Reply Last reply Reply Quote 0
          • J Offline
            Jim
            last edited by 24 Jan 2011, 09:54

            I'm liking code mirror:

            http://i.min.us/ibK4jW.png

            Hi

            1 Reply Last reply Reply Quote 0
            • D Offline
              Dan Rathbun
              last edited by 24 Jan 2011, 10:03

              looks good!

              I'm not here much anymore.

              1 Reply Last reply Reply Quote 0
              • D Offline
                driven
                last edited by 24 Jan 2011, 10:37

                @jim said:

                I'm liking code mirror:

                that's great

                I started to put it into yours as well, but haven't had much time

                did you make a new SU Ruby library? or point it to something that exist?

                can you PM me a WIP to see if the Mac likes it?

                john

                learn from the mistakes of others, you may not live long enough to make them all yourself...

                1 Reply Last reply Reply Quote 0
                • D Offline
                  driven
                  last edited by 27 Jan 2011, 06:39

                  finally got rid of that off-set box

                  hi Jim,
                  I had a chance to play with CodeMirror in your new box...
                  Managed to get a clean fit, after a lot of looking.
                  I added a choice of 3 colours (shades of grey, really).
                  Border reduction and text-color's are next on list.

                  The pushed inner html is where you can tweek some of the .editbox things and you only need the textarea for pre-loading a template, so I put it back in.

                  I'll work through and update everything to the latest versions before sending.

                  ... and then work around your windows only features...

                  john

                  learn from the mistakes of others, you may not live long enough to make them all yourself...

                  1 Reply Last reply Reply Quote 0
                  • alexschreyerA Offline
                    alexschreyer Extension Creator
                    last edited by 7 Apr 2011, 15:06

                    Howdy!

                    Can't believe it took me until now to find Codemirror... I am working on adding it to my editor as well. In case you're curious, here's a live preview:

                    favicon

                    (media.alexschreyer.net)

                    I also added the other languages - in case someone wants to edit an HTML web dialog file etc.

                    Cheers,
                    Alex

                    Author of "Architectural Design with SketchUp":
                    http://sketchupfordesign.com/

                    1 Reply Last reply Reply Quote 0
                    • D Offline
                      Dan Rathbun
                      last edited by 7 Apr 2011, 21:38

                      @alexschreyer said:

                      Can't believe it took me until now to find Codemirror...

                      Well it's relatively new is is not? When this topic started I think it was still listed as beta.

                      @alexschreyer said:

                      In case you're curious, here's a live preview:

                      Looking really good Alex!

                      P.S.: Do you have a way to use standard Windows styling instead of that charcoal theme?

                      I'm not here much anymore.

                      1 Reply Last reply Reply Quote 0
                      • alexschreyerA Offline
                        alexschreyer Extension Creator
                        last edited by 8 Apr 2011, 13:13

                        @dan rathbun said:

                        Do you have a way to use standard Windows styling instead of that charcoal theme?

                        I still have to make the light and dark themes work. I started with the dark theme first...

                        Because Codemirror has an autocomplete function, I am looking into implementing this, too. What is the function that gives me access to all available methods in SU? I tried the following one but the list is limited to the Sketchup object.

                        puts Sketchup.methods.sort.join("\n").to_s

                        Cheers,
                        Alex

                        P.S. I put in the request to disable the single undo.

                        Author of "Architectural Design with SketchUp":
                        http://sketchupfordesign.com/

                        1 Reply Last reply Reply Quote 0
                        • D Offline
                          driven
                          last edited by 8 Apr 2011, 20:40

                          hi Alex, and all

                          just to muddy the waters, after trying to get Codemirror to play nice inside SU on the mac I've been working on Ace editor http://ace.ajax.org/ and it's fantastic... very well supported and with some tweaking, usable 'offline'. It's the same 'engine' in cloud9 which everyone should try out .

                          The css may not work the same on PC's but the js should and for now I'm only after a Mac solution, if you want to try it 'offline' from source, clone 'cloud9' from github, then find this index.html
                          ~/Sites/mysite/cloud9/cloud9/support/ace/index.html
                          It should run the demo in safari, chrome, firefox and maybe IE9 or if you have local host or install cloud9 you can run it with node.js.

                          the ruby support is very good...
                          that's a console for ace at the bottom
                          I've almost finished a new theme called 'blendin', which adds the 'scrollable' line stripes and chameleon tendencies. I'm struggling with the SU interface at the moment and using cut'n'paste...

                          learn from the mistakes of others, you may not live long enough to make them all yourself...

                          1 Reply Last reply Reply Quote 0
                          • alexschreyerA Offline
                            alexschreyer Extension Creator
                            last edited by 8 Apr 2011, 21:13

                            The Ace highlighter looks very good, too. Great to see a few of these popping up now. However, I just fixed my Ruby editor up with Codemirror, so I am not moving...

                            I'll have an updated version of my editor ready after a bit of testing. Here is a picture for now:

                            2011-04-08_1623.png

                            Cheers,
                            Alex

                            Author of "Architectural Design with SketchUp":
                            http://sketchupfordesign.com/

                            1 Reply Last reply Reply Quote 0
                            • 1 / 1
                            • First post
                              Last post
                            Buy SketchPlus
                            Buy SUbD
                            Buy WrapR
                            Buy eBook
                            Buy Modelur
                            Buy Vertex Tools
                            Buy SketchCuisine
                            Buy FormFonts

                            Advertisement