Quantcast
Channel: Extensions - SketchUp Community
Viewing all articles
Browse latest Browse all 3637

An example to help you how to write SketchUp Ruby code with HtmlDialog

$
0
0

@Camlaman wrote:

I know how difficult it is to learn how to use the SketchUp Ruby HtmlDialog Class. Especially when the examples on the API documentation are so minimal. I hope this helps some beginner like myself.

The code snippet gets some user input from a web dialog and draws a box in SketchUp. I wrote this example myself so forgive me any programming mortal sins I’ve committed in it, I’m entirely to blame.

    	dialog = UI::HtmlDialog.new(
    	{
    	  :dialog_title => "Dialog Example",
    	  :scrollable => true,
    	  :resizable => true,
    	  :width => 500,
    	  :height => 300,
    	  :left => 200,
    	  :top => 200,
    	  :min_width => 50,
    	  :min_height => 50,
    	  :max_width =>1000,
    	  :max_height => 500,
    	  :style => UI::HtmlDialog::STYLE_DIALOG
    	})
    	html = "
    	<!DOCTYPE html>
    	<html>
    	<head>
    	<title>FMS Test Dialog
    	</title>
    	</head>
    	<h1>Draw a Box from a HtmlDialog</h1>
    	<script>
    	function sendDataToSketchUp() {
    		var inpObj1 = document.getElementById('id1');
    		var inpObj2 = document.getElementById('id2');
    		var inpObj3 = document.getElementById('id3');
    		sketchup.getUserInput(inpObj1.value, inpObj2.value, inpObj3.value)
    	}
    	</script>
    	<body>
    	<p>An example using SketchUp Ruby HtmlDialog</p>
    	<form>
    		length: <input id='id1' type='number' name='length' value=50 required><br>
    		bredth: <input id='id2' type='number' name='bredth' value=75 required><br>
    		depth: <input id='id3' type='number' name='depth' value=25 required>
    	</form>
    	<button onclick='sendDataToSketchUp()'>Draw Box</button>
    	</body>
    	</html>
    	"
    	dialog.set_html(html)
    	dialog.show
    	dialog.add_action_callback("getUserInput"){|action_context, inpObj1, inpObj2, inpObj3|
    		javaScript="var inpObj1 = document.getElementById('id1').value; var inpObj2 = document.getElementById('id2').value; var inpObj3 = document.getElementById('id3').value;"
    		dialog.execute_script(javaScript)
    		puts("JavaScript said inpObj1 is #{inpObj1}, inpObj2 is #{inpObj2} and inpObj3 is #{inpObj3}.")
    		width = inpObj1.to_f
    		bredth = inpObj2.to_f
    		depth = inpObj3.to_f
    		model = Sketchup.active_model
    		entities = model.active_entities
    		pts = []
    		pts[0] = [0, 0, 0]
    		pts[1] = [width, 0, 0]
    		pts[2] = [width, bredth, 0]
    		pts[3] = [0, bredth, 0]
    		# Add the face to the entities in the model
    		face = entities.add_face(pts)
    		face.pushpull depth
    	}

Posts: 1

Participants: 1

Read full topic


Viewing all articles
Browse latest Browse all 3637

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>