• Login
sketchucation logo sketchucation
  • Login
🤑 30% Off | Artisan 2 on sale until April 30th Buy Now

Web Dialog - how to

Scheduled Pinned Locked Moved Developers' Forum
16 Posts 3 Posters 2.2k 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.
  • J Offline
    Jim
    last edited by 26 Dec 2007, 22:05

    You need to think in terms of Events. Dialog elements have events. onMouseOver, onMouseOut, onClick, onBlur, etc.

    You can capture these events on most elements - one way follows:

    
    <input type=text onClick="someJavascriptFunction()" value="10">
    
    

    Even divs and spans have events: (tested in Firefox)

    
    <html>
       <head>
          <script>
    	 // javascript function
    	 function translate(element) {
    	    element.innerHTML = "Hello!";
    	 }
          </script>
       </head>
       <body>
          <span onClick="translate(this)">Hola!</span>
       </body>
    </html>
    
    
    

    @pixero said:

    When you say "you dont even need to press enter" what do you mean?
    Would the script start to execute as soon as I start typing in a value?
    I dont think I would want that for this script.
    Lets say I have a: x, y and z value but I dont want to "run" the script before I've finished typing in my values. How would I do that if press ENTER is buggy?

    Thanks!

    Hi

    1 Reply Last reply Reply Quote 0
    • J Offline
      Jim
      last edited by 26 Dec 2007, 22:05

      Pixero,

      To set a value from a ruby script...

      The webdialog. Let's say you have a text input field...

      
      <html>
      <head></head>
      <body>
      <input type=text id="name" value="Jim">
      </body></html>
      
      

      And the Ruby...

      
      name = "Pixero"
      # Miraculously, a dialog has been created.
      dialog.execute_script("document.getElementById('name').value='#{name}'")
      
      

      Hi

      1 Reply Last reply Reply Quote 0
      • P Offline
        Pixero
        last edited by 26 Dec 2007, 22:06

        Thanks for your answers but I still can't get it to work. 😕

        I've tried with:

        
        def activate
        	dialog = UI;;WebDialog.new("jsTest", true,"JS Test", 320, 160, 600, 60, true)
        	fn= File.dirname(__FILE__)+'/test.html'
        	dialog.set_file fn
        	dialog.show {}  	
        
        	name = "Pixero"
        	dialog.execute_script("document.getElementById('name').value='#{name}'")
        
        end # activate
        
        1 Reply Last reply Reply Quote 0
        • T Offline
          todd burch
          last edited by 26 Dec 2007, 22:06

          Are you sure you are building the filename properly?

          "What" does not work?

          1 Reply Last reply Reply Quote 0
          • T Offline
            todd burch
            last edited by 26 Dec 2007, 22:06

            Nevermind. Put the dialog.execute_script in a callback.

            1 Reply Last reply Reply Quote 0
            • P Offline
              Pixero
              last edited by 26 Dec 2007, 22:07

              This is what I've tried with this time. Still not working though...
              In ruby script:

              def activate
              	dialog = UI;;WebDialog.new("jsTest", true,"JS Test", 320, 160, 600, 60, true)
                  	fn= File.dirname(__FILE__)+'/jsTest.html'
                  	dialog.set_file fn
              	dialog.show {} 	
              
              	posX = "1"
              	dialog.add_action_callback("setup") {|d,p|
              		dialog.execute_script("document.getElementById('posX').value='#{posX}'")
              	}
                  end # activate
              

              In html file:

              	<script type="text/javascript">
                         function setup(id,value)
                         {
                            window.location = 'skp;setup@'+document.getElementById('posX').value; 
                         }
                     </script>
              
              1 Reply Last reply Reply Quote 0
              • P Offline
                Pixero
                last edited by 26 Dec 2007, 22:07

                Bump.
                Can you see whats wrong with my code?

                1 Reply Last reply Reply Quote 0
                • T Offline
                  todd burch
                  last edited by 26 Dec 2007, 22:07

                  Holy Cow!! What's wrong???? I don't think you've ever told us anything more than "it does not work".

                  We can't keep (well, I'm not going to keep) guessing at what you might have and might not have that you are not showing us or telling us!

                  There is HTML, javascript and ruby code that you are holding very close to yourself. Any of it might not be coded right.

                  Todd

                  1 Reply Last reply Reply Quote 0
                  • P Offline
                    Pixero
                    last edited by 26 Dec 2007, 22:08

                    Sorry, I didnt mean to be secret about it.
                    It´s just that for now it´s just a (non functioning) test how to get a value from sketchup to a webdialog as default value. If I just can get some help getting this working I'll be sure to post the script I'm working on. 💚

                    301 Moved Permanently

                    favicon

                    (www.sketchucation.com)

                    1 Reply Last reply Reply Quote 0
                    • J Offline
                      Jim
                      last edited by 26 Dec 2007, 22:09

                      For starters, you never call the javascript setup function, which in turn never calls the "setup" callback in the ruby.

                      Can I ask why you are using the Tool interface for the WebDialog? I never would have thought to use it, although it does work.

                      Hi

                      1 Reply Last reply Reply Quote 0
                      • P Offline
                        Pixero
                        last edited by 26 Dec 2007, 22:09

                        First of all, thanks for your help.
                        I'm crawling in the dirt here and it feels like you're teasing me with small bits that I can't quite get the grips on. 😉
                        I'm just a total noob when it comes to javascript and the script I´m working on need default values from SketchUp. Please give me an example so that (even) I can understand how to get it working. 😳
                        I've looked at the few webdialog based script I've found but havent seen any that gets their default value from sketchup. They all have "onClick" and other user activated functions.

                        Why a tool? Maybe it isnt necessary but later on I'm gonna need to save a value so that it will be remembered when using the script again. I dont know if that is something that can be done without the "suspend tool"?

                        1 Reply Last reply Reply Quote 0
                        • J Offline
                          Jim
                          last edited by 26 Dec 2007, 22:10

                          Short answer, add this to the html file, right before the </body> tag:

                          
                          <script>
                          setup(0,0)
                          </script>
                          
                          

                          Have a look at the totd.rb file in the Tools directory. It's a good example of a WebDialog.

                          Here's my re-write. Saving values between sessions can be done using Sketchup.write_default and Sketchup.read_default.

                          
                          require "sketchup.rb"
                          
                          #class JS_Test
                          # Inherit from the WebDialog. There's no need to use a Tool/
                          class JS_Test < UI;;WebDialog
                            #def activate # activate is a method of the Tool class.
                            def initialize 
                              # dialog = UI;;WebDialog.new("test", true,"test", 320, 160, 1100, 60, true)
                              # super called the parant class "new"
                              super "test", true,"test", 320, 160, 1100, 60, true
                              fn= File.dirname(__FILE__)+'/test.html'
                              #dialog.set_file fn
                              set_file fn
                              #dialog.show {} #show it    	
                              show {} #show it    	
                          
                              posX = "1"
                          
                              #dialog.add_action_callback("setup") {|d,p|
                              add_action_callback("setup") { |d, p| 
                                d.execute_script("document.getElementById('posX').value='#{posX}'")
                              }
                          
                              #end # activate
                            end # initialize
                          
                          end #class jsTest
                          
                          
                          if(not file_loaded?("test.rb"))
                            plugins_menu = UI.menu("Plugins")
                            #plugins_menu.add_item("test") { Sketchup.active_model.select_tool JS_Test.new } 
                            plugins_menu.add_item("test") { JS_Test.new } 
                            file_loaded("test.rb")
                          end
                          
                          
                          
                          
                          <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
                          
                          <html xmlns="http://www.w3.org/1999/xhtml">
                          
                             <head>
                                <meta http-equiv="content-type" content="text/html;charset=utf-8" />
                                <meta name="test" content="test" />
                                <title>test</title>
                                <script>
                          	 function setup(id,value)
                          	 {
                          	    window.location = 'skp;setup@'+document.getElementById('posX').value; 
                          	 }
                                </script>
                             </head>
                          
                             <body bgcolor="#e0dfe3">
                                <input type="text" size="8" id="posX" value="0"></div>	
                             <script>setup();</script>
                          </body>
                          </html>
                          
                          

                          301 Moved Permanently

                          favicon

                          (www.sketchucation.com)

                          Hi

                          1 Reply Last reply Reply Quote 0
                          • P Offline
                            Pixero
                            last edited by 26 Dec 2007, 22:11

                            Thanks Jim and Todd. Really appreciated.
                            Finally back on track... 😄

                            Don't worry, I'll probably be back with more stupid questions... 😉

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

                            Advertisement