I developed an app that runs from a Spreadsheet. It has a formatted screen, ie. doc.show(app
). There is a mass change function. I'd like to prompt the user for 'Are you sure ... OK to Continue'.
The ideal solution would be a pop-up form with an "OK to continue" response.
I can't find a way to prompt the user and accept a response that doesn't simultaneously take down the formatted screen.
I know there must be a easy way to do this. I searched this forum and others, but cannot find a solution that applies to Google Spreadsheets.
When using the GUI Builder I've found a very simple solution that is to create a panel or a label that is actually masking the whole UI (or part of it) and that is normally invisible.
When I make it visible I can click on it, it turns invisible again and I'm back on the standard UI. It uses the ability in GUI builder to move elements backwards and forwards so masking is very easy (a sort of multi layer design). I guess the same behavior is achievable with script defined UI but I'm not sure how...
regards,
Serge
EDIT : For information : I just set up an interface using this technique and I noticed that panels that have been made invisible must be restored along with all their elements otherwise they reappear empty. Using Clienthandlers here is an example with two panels and two buttons that do the job :
var panhandler0 = app.createClientHandler()
.forTargets(panel1).setVisible(false);// hide panel1 when button 'ENTER'on panel1 is pressed
enter.addClickHandler(panhandler0);
var panhandler1 = app.createClientHandler()
.forTargets(panel2,msg,grid2).setVisible(true);// show panel2 when button 'ENTER' on panel1 is pressed
enter.addClickHandler(panhandler1);
var panhandler2 = app.createClientHandler()
.forTargets(panel2,msg,grid2).setVisible(true);// re-show panel2 when button 'retry'on panel2 is pressed
retry.addClickHandler(panhandler2);
var panhandler3 = app.createClientHandler()
.forTargets(panel2).setVisible(false);// hide panel2 when button 'retry'on panel2 is pressed
retry.addClickHandler(panhandler3);
var panhandler4 = app.createClientHandler()
.forTargets(panel1,txt,grid,hpanel).setVisible(true);// re-show panel1 when button 'retry'on panel2 is pressed
Works nicely !
You can use Browser.MsgBox() and add buttons into it for users confirmation.
Refrence URL
https://developers.google.com/apps-script/class_browser
This is indeed not an easy thing to do. You'll have to use your own GUI (formatted screen) to show the message. This way you can restore the state of your GUI again. Here is an example:
function uiTest() {
var app = UiApp.createApplication().setTitle("UI");
app.add(app.createGrid(1,1).setId('main'));
createGUI(app,{});
SpreadsheetApp.getActive().show(app);
}
function createGUI(app,p) {
var panel = app.createVerticalPanel();
var handler = app.createServerHandler('handler').addCallbackElement(panel);
panel.add(
app.createTextBox().setName('text').setId('text').setText(p.text ? p.text : "")).add(
app.createButton('Do it').addClickHandler(handler));
app.getElementById('main').setWidget(0,0, panel);
}
function handler(e) {
var app = UiApp.getActiveApplication();
var hidden = app.createHidden('oldValues', JSON.stringify(e.parameter));
app.getElementById('main').setWidget(0,0, app.createVerticalPanel().add(
hidden).add(
app.createLabel("Question message")).add(
app.createButton('Ok').addClickHandler(app.createServerHandler('after').addCallbackElement(hidden))));
return app;
}
function after(e) {
var app = UiApp.getActiveApplication();
createGUI(app,JSON.parse(e.parameter.oldValues));
return app;
}
The difficulty will really depend on how much state you need to restore. If none, then it's a lot, lot easier. In this example I restore the value of the textbox. You can type in anything there to see that it will be there after the popup.
Related
I'm creating a large "movie" using flash professional CC and AS3. In one scene I want my character to be IMing his friend. The scene is already animated and shows the back of his head and the viewer can read his screen.
I want the user to be able to type for my character, so whatever the user types shows up in the bottom of the chat box, and then when the user presses enter the same text appears in a different place on the screen.
Unfortunately I haven't even gotten CLOSE to making that happen. So far I'm stuck on getting the text from the input box to appear in a dynamic textbox elsewhere, so I've been watching tons of tutorials. This code runs without errors but does not output the text like I want.
var outputString = outputBox.text; //get key presses only when textfield is edited
inputBox.addEventListener(KeyboardEvent.KEY_DOWN, handler);
function handler(event:KeyboardEvent) { //13 is enter key
function handler(event:KeyboardEvent) { //13 is enter key
if(event.charCode == 13) {
outputBox.text = "UserName: " + outputString;
}
}
(Please ignore the bad indentation, that's more of an issue with me not understanding how to paste code here haha.)
Anyways does anyone know what's wrong? I have been trying to figure this out for days so if anyone could share some example code for how to get what I described working properly it would be immensely appreciated. All I really need to be able to do is save the user input so I can display it whererever I want. Thanks for reading!
Simple enough. Just set the text value of your output to your input after the keypresses.
import flash.text.TextField;
import flash.events.KeyboardEvent;
var input:TextField = new TextField();
addChild(input);
input.type = "input";
input.text = "Type Here!";
input.addEventListener(KeyboardEvent.KEY_UP, handler);
var output:TextField = new TextField();
addChild(output);
output.text = "other text";
output.alpha = 0.5;
output.y = 25;
function handler(e:KeyboardEvent):void {
output.text = input.text;
}
I want to add tooltips to Labels in UiApp. I was thinking about MousOverHandlers on each (important) Label, as there is no function like Label.setTooltip().
Is there any way to implement this functionality? The only thing I can think of doing is:
Creating a hidden Label (eh, don't really want to)
Add a MouseOverHandler to the Label I want a tooltip on
Make the hidden Label visible in the event handler
I don't really like this solution - is there a better way?
Have you tried Label.setTitle("tooltip text") directly on your widget? (works also with other widgets of course)
I guess that's what you are looking for .
Basic example testable here :
function doGet() {
var app = UiApp.createApplication();
var abs = app.createAbsolutePanel().setStyleAttributes({"background":"#FFA","padding":"60px"});
var lab = app.createLabel('Hover your mouse over this label').setTitle('There it is !');
app.add(abs.add(lab));
return app;
}
The following code should write the inverse of true/false as found in the textbox back into the textbox when the button is clicked - but it doesn't work correctly. It will work correctly one way, but not the other (the one that works is whichever ClickHandler was defined last). I've tried using validateNotMatches too but no joy.
If I change the code so that the label's text is updated instead of the textbox's then that works fine.
I am aware of suggested workarounds such as using two buttons, but I just want to know if I'm doing something wrong or if this looks like a bug in GAS. Thanks.
function doGet(e)
{
var app = UiApp.createApplication();
var tb = app.createTextBox().setText('true');
var button = app.createButton('button');
var label = app.createLabel().setText('-');
button.addClickHandler(app.createClientHandler()
.validateMatches(tb, 'true')
//.forTargets(label).setText('false')
.forTargets(tb).setText('false')
);
button.addClickHandler(app.createClientHandler()
.validateMatches(tb, 'false')
//.forTargets(label).setText('true')
.forTargets(tb).setText('true')
);
return app.add(app.createHorizontalPanel().add(tb).add(button).add(label));
}
It's not a bug... both events fire. The validation happens on the current state of the widget, not on the state when the event was fired, so after you flip it to "false" the second handler validates and flips it back to "true".
I am having some problems getting this code to work properly. I want to change the text on a textfield inside a button. It works, but only for the upState. As soon as I hover or click the button, it changes back to the original name. Is there any way I can define it as anyState?
var doc:DisplayObjectContainer = m1.upState as DisplayObjectContainer;
var tf:TextField = doc.getChildAt(1) as TextField;
var boldText:TextFormat = new TextFormat();
boldText.bold = true;
tf.text = "Sterno Cleido Mastoid";
tf.setTextFormat(boldText);
Example:
http://www.testdummies.dk/dynamictext.fla
Your issue is that your code is only changing the text for the up state of the button. The other states remain unaffected.
You could simply copy and paste your code to do the same change for the over and down states - adding this code after your existing code would do just that:
doc = m1.overState as DisplayObjectContainer;
tf = doc.getChildAt(1) as TextField;
tf.text = "Neck";
tf.setTextFormat(boldText);
doc = m1.downState as DisplayObjectContainer;
tf = doc.getChildAt(1) as TextField;
tf.text = "Neck";
tf.setTextFormat(boldText);
This is an awkward way though to code a simple text change for a button. Creating a custom button class, or even making a movieClip work as a button would be much cleaner. Create a new question if you need help learning either of these things.
I would put the text field on its own layer on top of the button, so it always has the same text regardless of button state.
or, alternatively, you could copy and paste that code into each button state and then alter the code to reflect the current state. (the first solution is faster/easier though)
I am trying to put a button inside of an Openlayers popup. While the button appears to display correctly with the following code, the function 'handlerFunc' does not execute when the button is clicked. The segment of code I have posted is all within another function (so handlerFunc is actually a nested function). I'm using JQuery for the button itself. Any ideas on what might be going wrong? Thanks!
var feature = new OpenLayers.Feature(presences, ll);
feature.popupClass = popupClass;
feature.data.popupContentHTML = "<button id='popupButton'>Click me</button>";
feature.data.overflow = (overflow) ? "auto" : "hidden";
feature.data.icon = markerIcon;
$('#popupButton').button();
$('#popupButton').click(handlerFunc);
function handlerFunc() {
// do something
}
Most likely reason is that your button doesn't exist when you bind to a click event. $('#popupButton') returns null. Instead of using $('#popupButton').click(handlerFunc); try $('#popupButton').live('click', handlerFunc);. That means that we bind to an event not only when DOM is built, but when object appears.