src/glkote/dialog.js
/* Dialog.open(tosave, usage, gameid, callback) -- open a file-choosing dialog
 *
 * The "tosave" flag should be true for a save dialog, false for a load
 * dialog.
 *
 * The "usage" and "gameid" arguments are arbitrary strings which describe the
 * file. These filter the list of files displayed; the dialog will only list
 * files that match the arguments. Pass null to either argument (or both) to
 * skip filtering.
 *
 * The "callback" should be a function. This will be called with a fileref
 * argument (see below) when the user selects a file. If the user cancels the
 * selection, the callback will be called with a null argument.
*/
Dialog.open(tosave, usage, gameid, callback) -- open a file-choosing dialog
The "tosave" flag should be true for a save dialog, false for a load
dialog.

The "usage" and "gameid" arguments are arbitrary strings which describe the
file. These filter the list of files displayed; the dialog will only list
files that match the arguments. Pass null to either argument (or both) to
skip filtering.

The "callback" should be a function. This will be called with a fileref
argument  when the user selects a file. If the user cancels the
selection, the callback will be called with a null argument.
Dialog . open ( tosave usage gameid callback ) -- open a file - choosing dialog The " tosave " flag should be true for a save dialog false for a load dialog . The " usage " and " gameid " arguments are arbitrary strings which describe the file . These filter the list of files displayed ; the dialog will only list files that match the arguments . Pass null to either argument ( or both ) to skip filtering . The " callback " should be a function . This will be called with a fileref argument when the user selects a file . If the user cancels the selection the callback will be called with a null argument .
function dialog_open(tosave, usage, gameid, callback) {
    if (is_open)
        throw new Error('Dialog: dialog box is already open.');
    if (localStorage == null)
        throw new Error('Dialog: your browser does not support local storage.');
    dialog_callback = callback;
    will_save = tosave;
    confirming = false;
    editing = false;
    editing_dirent = null;
    cur_usage = usage;
    cur_gameid = gameid;
    cur_usage_name = label_for_usage(cur_usage);
    var root_el_id = 'windowport';
    var iface = window.Game;
    if (window.GlkOte) 
        iface = window.GlkOte.getinterface();
    if (iface && iface.windowport)
        root_el_id = iface.windowport;
    var rootel = $('#'+root_el_id);
    if (!rootel.length)
        throw new Error('Dialog: unable to find root element #' + root_el_id + '.');
    var screen = $('#'+dialog_el_id+'_screen');
    if (!screen.length) {
        screen = $('<div>',
            { id: dialog_el_id+'_screen' });
        rootel.append(screen);
    }
    var frame = $('#'+dialog_el_id+'_frame');
    if (!frame.length) {
        frame = $('<div>',
            { id: dialog_el_id+'_frame' });
        rootel.append(frame);
    }
    var dia = $('#'+dialog_el_id);
    if (dia.length)
        dia.remove();
    dia = $('<div>', { id: dialog_el_id });
    var form, el, row;
    form = $('<form>');
    form.on('submit', 
        (will_save ? evhan_accept_save_button : evhan_accept_load_button));
    dia.append(form);
    row = $('<div>', { 'class': 'DiaButtonsFloat' });
    el = $('<button>', { id: dialog_el_id+'_edit', type: 'button' });
    el.append('Edit');
    el.on('click', evhan_edit_button);
    row.append(el);
    form.append(row);
    row = $('<div>', { id: dialog_el_id+'_cap', 'class': 'DiaCaption' });
    row.append('XXX'); 
    form.append(row);
    if (will_save) {
        row = $('<div>', { id: dialog_el_id+'_input', 'class': 'DiaInput' });
        form.append(row);
        el = $('<input>', { id: dialog_el_id+'_infield', type: 'text', name: 'filename' });
        row.append(el);
    }
    row = $('<div>', { id: dialog_el_id+'_body', 'class': 'DiaBody' });
    form.append(row);
    row = $('<div>', { id: dialog_el_id+'_cap2', 'class': 'DiaCaption' });
    row.hide();
    form.append(row);
    row = $('<div>', { id: dialog_el_id+'_buttonrow', 'class': 'DiaButtons' });
    {
        el = $('<button>', { id: dialog_el_id+'_cancel', type: 'button' });
        el.append('Cancel');
        el.on('click', evhan_cancel_button);
        row.append(el);
        el = $('<button>', { id: dialog_el_id+'_delete', type: 'button' });
        el.append('Delete');
        el.on('click', evhan_delete_button);
        el.hide();
        row.append(el);
        el = $('<button>', { id: dialog_el_id+'_display', type: 'button' });
        el.append('Display');
        el.on('click', evhan_display_button);
        el.hide();
        row.append(el);
        el = $('<button>', { id: dialog_el_id+'_accept', type: 'submit' });
        el.append(will_save ? 'Save' : 'Load');
        el.on('click', 
            (will_save ? evhan_accept_save_button : evhan_accept_load_button));
        row.append(el);
    }
    form.append(row);
    frame.append(dia);
    is_open = true;
    evhan_storage_changed();
    var focusfunc;
    if (will_save) {
        focusfunc = function() {
            var el = $('#'+dialog_el_id+'_infield');
            if (el.length) 
                el.focus();
        };
    }
    else {
        focusfunc = function() {
            var el = $('#'+dialog_el_id+'_select');
            if (el.length) 
                el.focus();
        };
    }
    defer_func(focusfunc);
}
function dialog_open ( tosave , usage , gameid , callback ) { if ( is_open ) throw new Error ( 'Dialog: dialog box is already open.' ) ; if ( localStorage == null ) throw new Error ( 'Dialog: your browser does not support local storage.' ) ; dialog_callback = callback ; will_save = tosave ; confirming = false ; editing = false ; editing_dirent = null ; cur_usage = usage ; cur_gameid = gameid ; cur_usage_name = label_for_usage ( cur_usage ) ; var root_el_id = 'windowport' ; var iface = window . Game ; if ( window . GlkOte ) iface = window . GlkOte . getinterface ( ) ; if ( iface && iface . windowport ) root_el_id = iface . windowport ; var rootel = $ ( '#' + root_el_id ) ; if ( ! rootel . length ) throw new Error ( 'Dialog: unable to find root element #' + root_el_id + '.' ) ; var screen = $ ( '#' + dialog_el_id + '_screen' ) ; if ( ! screen . length ) { screen = $ ( '<div>' , { id : dialog_el_id + '_screen' } ) ; rootel . append ( screen ) ; } var frame = $ ( '#' + dialog_el_id + '_frame' ) ; if ( ! frame . length ) { frame = $ ( '<div>' , { id : dialog_el_id + '_frame' } ) ; rootel . append ( frame ) ; } var dia = $ ( '#' + dialog_el_id ) ; if ( dia . length ) dia . remove ( ) ; dia = $ ( '<div>' , { id : dialog_el_id } ) ; var form , el , row ; form = $ ( '<form>' ) ; form . on ( 'submit' , ( will_save ? evhan_accept_save_button : evhan_accept_load_button ) ) ; dia . append ( form ) ; row = $ ( '<div>' , { 'class' : 'DiaButtonsFloat' } ) ; el = $ ( '<button>' , { id : dialog_el_id + '_edit' , type : 'button' } ) ; el . append ( 'Edit' ) ; el . on ( 'click' , evhan_edit_button ) ; row . append ( el ) ; form . append ( row ) ; row = $ ( '<div>' , { id : dialog_el_id + '_cap' , 'class' : 'DiaCaption' } ) ; row . append ( 'XXX' ) ; form . append ( row ) ; if ( will_save ) { row = $ ( '<div>' , { id : dialog_el_id + '_input' , 'class' : 'DiaInput' } ) ; form . append ( row ) ; el = $ ( '<input>' , { id : dialog_el_id + '_infield' , type : 'text' , name : 'filename' } ) ; row . append ( el ) ; } row = $ ( '<div>' , { id : dialog_el_id + '_body' , 'class' : 'DiaBody' } ) ; form . append ( row ) ; row = $ ( '<div>' , { id : dialog_el_id + '_cap2' , 'class' : 'DiaCaption' } ) ; row . hide ( ) ; form . append ( row ) ; row = $ ( '<div>' , { id : dialog_el_id + '_buttonrow' , 'class' : 'DiaButtons' } ) ; { el = $ ( '<button>' , { id : dialog_el_id + '_cancel' , type : 'button' } ) ; el . append ( 'Cancel' ) ; el . on ( 'click' , evhan_cancel_button ) ; row . append ( el ) ; el = $ ( '<button>' , { id : dialog_el_id + '_delete' , type : 'button' } ) ; el . append ( 'Delete' ) ; el . on ( 'click' , evhan_delete_button ) ; el . hide ( ) ; row . append ( el ) ; el = $ ( '<button>' , { id : dialog_el_id + '_display' , type : 'button' } ) ; el . append ( 'Display' ) ; el . on ( 'click' , evhan_display_button ) ; el . hide ( ) ; row . append ( el ) ; el = $ ( '<button>' , { id : dialog_el_id + '_accept' , type : 'submit' } ) ; el . append ( will_save ? 'Save' : 'Load' ) ; el . on ( 'click' , ( will_save ? evhan_accept_save_button : evhan_accept_load_button ) ) ; row . append ( el ) ; } form . append ( row ) ; frame . append ( dia ) ; is_open = true ; evhan_storage_changed ( ) ; var focusfunc ; if ( will_save ) { focusfunc = function ( ) { var el = $ ( '#' + dialog_el_id + '_infield' ) ; if ( el . length ) el . focus ( ) ; } ; } else { focusfunc = function ( ) { var el = $ ( '#' + dialog_el_id + '_select' ) ; if ( el . length ) el . focus ( ) ; } ; } defer_func ( focusfunc ) ; }
Dialog.open(tosave, usage, gameid, callback) -- open a file-choosing dialog
 The "tosave" flag should be true for a save dialog, false for a load
 dialog.
Dialog . open ( tosave usage gameid callback ) -- open a file - choosing dialog The " tosave " flag should be true for a save dialog false for a load dialog .
/* Figure out what the root div is called. The dialog box will be
       positioned in this div; also, the div will be greyed out by a 
       translucent rectangle. We use the same default as GlkOte: 
       "windowport". We also try to interrogate GlkOte to see if that
       default has been changed. */ /* Create the grey-out screen. */ /* And now, a lot of DOM creation for the dialog box. */ // the caption will be replaced momentarily. /* Row of buttons */ /* Set the input focus to the input field or the selection box.

       MSIE is weird about when you can call focus(). The element has just been
       added to the DOM, and MSIE balks at giving it the focus right away. So
       we defer the call until after the javascript context has yielded control
       to the browser. 
    */