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

      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

        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

          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
          • Dan RathbunD Offline
            Dan Rathbun
            last edited by

            @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

              I'm liking code mirror:

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

              Hi

              1 Reply Last reply Reply Quote 0
              • Dan RathbunD Offline
                Dan Rathbun
                last edited by

                looks good!

                I'm not here much anymore.

                1 Reply Last reply Reply Quote 0
                • D Offline
                  driven
                  last edited by

                  @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

                    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

                      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
                      • Dan RathbunD Offline
                        Dan Rathbun
                        last edited by

                        @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

                          @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

                            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

                              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