eneroth3 / dialogs-lib Goto Github PK
View Code? Open in Web Editor NEWSimple JS library for SketchUp HtmlDialogs
License: MIT License
dialogs-lib's People
Stargazers
Watchers
dialogs-lib's Issues
Tabs
Tabs similar to those in extension manager is a planned feature.
Tabs will consist of 2 parts: styling and javascript for controlling what content to show.
Tabs looking wrong in Chromium
Desired look (Firefox):
Look in Chromium:
Ding sound when pressing Alt+{key} on Windows
When running a dialog inside of SketchUp and using access keys a ding sound is played. The sound is not played in standalone browsers. The sound is very annoying and indicates some sort of error occured, even though access keys work just fine.
Steps to reproduce:
- Create dialog by pasting code below in Ruby console.
- Press Alt+Y or Alt+N
base_dir = UI.select_directory(title: "Locate modules/")
html = <<-HTML
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<base href="#{base_dir}/" />
<script src="controls.js"></script>
<script src="jquery-1.12.4.js"></script>
<script>
// Initialize the controls when the document is ready.
$(document).ready(function() {
Controls();
} );
</script>
</head>
<body>
<p>Is this a rhetorical question?</p>
<p>(Enter is shortcut for Yes, Esc is shortcut for Cancel)</p>
<button data-access-key="y" class="dlg-callback-yes">Yes</button>
<button data-access-key="n" class="dlg-callback-no">No</button>
<button class="dlg-callback-cancel">Cancel</button>
</body>
</html>
HTML
dialog = UI::HtmlDialog.new(
dialog_title: "Dialog Dialog",
width: 300,
height: 180
)
dialog.center
dialog.set_html(html)
dialog.add_action_callback("yes") { puts "Yes" }
dialog.add_action_callback("no") { puts "No" }
dialog.add_action_callback("cancel") { puts "Cancel" }
dialog.showTested in SketchUp 2017 and 2018 on Win 7.
Send input data in callback
Dialog's callbacks are not meant to be very advanced; complex callbacks that reads and processes data on the JS side can be manually made by the developer using dialogs. However it would be within the scope of Dialogs to simply gather the data in input elements (if there are any) and send in the default callbacks.
If implemented, the data should be gathered similar to how HTML forms work. All inputs/textares data should be indexed by the element name. Radio button groups should function as one name-value pair (not as individual boolean inputs).
Look over javascript style
I'm not very used to writing javascript, and haven't used JQuery before. The JS code I write may be quite unconventional, and I don't even know what JS style guides there are. It could benefit the project if someone looked over the javascript code quality.
Arrow key navigation
Native dialogs (at least on PC) can be navigated using arrow keys. Arrow keys move focus between all controls that are not text boxes (on these arrow keys move the text cursor and you have to use Tab to change focus).
Supporting arrow key navigation in dialogs would both be useful and make them feel more like native dialogs and less like web stuff.
Pressing F1 opens SketchUp help
In dialogs F1 is the shortcut key for activating the control with the dlg-callback-help class, e.g. a link to a help article. While this works in itself SketchUp also opens the SketchUp help center in a web browser.
Opening 2 help resources may be confusing and prevent the user from finding the relevant help resource. The desired result would be for F1 to not open SketchUp help inside a dialog that has a help control, but only activate the help control of that dialog.
Steps to reproduce:
- Run code below.
- Press F1
base_dir = UI.select_directory(title: "Locate modules/")
html = <<-HTML
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<base href="#{base_dir}/" />
<script src="controls.js"></script>
<script src="jquery-1.12.4.js"></script>
<script>
// Initialize the controls when the document is ready.
$(document).ready(function() {
Controls();
} );
</script>
</head>
<body>
<p>Pressing F1 both activates the button below, and open SketchUp help.</p>
<button data-access-key="h" class="dlg-callback-help">HELP!</button>
</body>
</html>
HTML
dialog = UI::HtmlDialog.new(
dialog_title: "Dialog Dialog",
width: 300,
height: 180
)
dialog.center
dialog.set_html(html)
dialog.add_action_callback("help") { puts "Help" }
dialog.showTested on SketchUp 2017 and 18, Win 7.
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.