<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
        <title>Settings - Toyz for Data Reduction and Analysis</title>
        <script src="/third_party/jquery/jquery.min.js" type="text/javascript"></script>
        <script src="/static/web/static/toyz_core.js" type="text/javascript"></script>
    </head>
    <body>
        <div id='tabs'>
            <ul id='tab-links'>
                <li><a href='#account-settings'>Account Settings</a></li>
                <li><a href='#toyz-list'>Toyz</a></li>
                <li><a href='#job-queue'>Job Queues</a></li>
            </ul>
            <div id='account-settings'>
                <div id='account-settings-div'></div>
                <button id='submit-account-settings'>Submit</button>
            </div>
            <div id='job-queue'>Job Queue has not yet been added to Toyz</div>
            <div id='toyz-list'>
                <p>Eventually this will show all toyz loaded on the server</p>
                <a href='/workspace/'>New workspace</a>
            </div>
        </div>
        <script>
        var account_settings;
        var admin_settings;
        var user_settings;
        var group_settings;
        var config_settings;
        var websocket;
        var pwd_gui;
        var new_user_gui;
        var new_group_gui;
        
        function rxMsg(result){
            console.log('rx message:', result);
            if(result.id == 'user_settings'){
                var account_info = {
                    user_id: websocket.user_id,
                    pwd_gui: pwd_gui,
                    $parent: $('#account-settings-div'),
                    default: result,
                    params: {},
                    workspaces: Object.keys(result.workspaces)
                };
                if(result.hasOwnProperty('modules')){
                    account_info.params.approved_modules = 
                        Toyz.Console.Settings.getModuleSettings({
                            legend: 'Toyz Modules',
                            param_name: 'modules'
                    });
                };
                if(result.hasOwnProperty('toyz')){
                    account_info.params.approved_toyz = Toyz.Console.Settings.getToyzSettings({
                        legend: 'Toyz Paths',
                        param_name: 'toyz',
                    });
                };
                account_settings = new Toyz.Console.Settings.AccountSettings(account_info);
                //console.log('account_settings:',account_settings);
                
                // If the user is in the admin group, also load the
                // admin settings
                if(result.hasOwnProperty('config')){
                    var $user_div = $('<div/>')
                        .prop('id','user-settings');
                    var $group_div = $('<div/>')
                        .prop('id','group-settings');
                    var $admin_div = $('<div/>')
                        .prop('id','admin-settings');
                    
                    //console.log('admin_default', admin_default);
                    result.new_user_gui = new_user_gui;
                    result.new_group = new_group_gui;
                    result.websocket = websocket;
                    
                    // Alphebetize user id's and group names in the select boxes
                    //result.user_order = Object.keys(result.users);
                    //result.group_order = Object.keys(result.groups);
                    result.users.sort();
                    result.groups.sort();
                    
                    // Create the UI's
                    user_settings = Toyz.Console.Settings.getUserSettings(result, $user_div);
                    group_settings = Toyz.Console.Settings.getGroupSettings(result, $group_div);
                    admin_settings = Toyz.Console.Settings.getAdminSettings(result, $admin_div);
                    
                    // Add tabs for admin settings
                    $("#tab-links").append(
                        "<li><a href='#user-settings'>User Settings</a></li>"
                    );
                    $("#tabs").append($user_div);
                    
                    $("#tab-links").append(
                        "<li><a href='#group-settings'>Group Settings</a></li>"
                    );
                    $("#tabs").append($group_div);
                    $("#tab-links").append(
                        "<li><a href='#admin-settings'>Config Settings</a></li>"
                    );
                    $("#tabs").append($admin_div);
                    $("#tabs").tabs("refresh");
                };
            }else if(result.id == 'pwd_gui'){
                alert('Password saved correctly');
            }else if(result.id == 'update_user_settings'){
                alert('Settings saved correctly');
            }else if(result.id == 'new_user'){
                alert('New user created');
            }else{
                console.log('unknown result:', result);
                throw Error('Unknown result id returned')
            };
        };
        
        function init_pwd_gui(){
            var $div = $('<div/>');
            $('body').append($div);
            
            pwd_gui = new Toyz.Gui.Gui({
                params: {
                    type: 'div',
                    params: {
                        current_pwd: {
                            lbl: 'current password',
                            prop: {
                                type: 'password'
                            }
                        },
                        new_pwd: {
                            lbl: 'new password',
                            prop: {
                                type: 'password'
                            }
                        },
                        confirm_pwd: {
                            lbl: 'confirm new password',
                            prop: {
                                type: 'password'
                            }
                        }
                    }
                },
                $parent: $div
            });
            pwd_gui.root.$div.dialog({
                resizable:true,
                draggable:true,
                width:300,
                autoOpen:false,
                modal:true,
                buttons:{
                    'Change':function(){
                        var params = pwd_gui.get();
                        delete params.conditional;
                        websocket.send_task({
                            task: {
                                module: 'toyz.web.tasks',
                                task: 'change_pwd',
                                parameters: params
                            }
                        });
                        $(this).dialog('close');
                    },
                    'Cancel':function(){
                        $(this).dialog('close');
                    }
                },
            }).css("font-size", "12px");
        };
        
        function init_new_user_gui(){
            console.log('called init');
            var $div = $('<div/>');
            $('body').append($div);
            new_user_gui = new Toyz.Gui.Gui({
                params: {
                    type: 'div',
                    params: {
                        user_id: {
                            lbl: 'new user name',
                        }
                    }
                },
                $parent: $div
            });
            new_user_gui.root.$div.dialog({
                resizable:true,
                draggable:true,
                width:300,
                autoOpen:false,
                modal:true,
                buttons:{
                    'Add':function(){
                        websocket.send_task({
                            task: {
                                module: 'toyz.web.tasks',
                                task: 'add_new_user',
                                parameters: new_user_gui.get()
                            }
                        });
                        $(this).dialog('close');
                    },
                    'Cancel':function(){
                        $(this).dialog('close');
                    }
                },
            }).css("font-size", "12px");
        };
        
        function init_new_group_gui(){
            console.log('called init');
            var $div = $('<div/>');
            $('body').append($div);
            new_group_gui = new Toyz.Gui.Gui({
                params: {
                    type: 'div',
                    params: {
                        group_id: {
                            lbl: 'new group name',
                        }
                    }
                },
                $parent: $div
            });
            new_group_gui.root.$div.dialog({
                resizable:true,
                draggable:true,
                width:300,
                autoOpen:false,
                modal:true,
                buttons:{
                    'Add':function(){
                        websocket.send_task({
                            task: {
                                module: 'toyz.web.tasks',
                                task: 'add_new_user',
                                parameters: new_group_gui.get()
                            }
                        });
                        $(this).dialog('close');
                    },
                    'Cancel':function(){
                        $(this).dialog('close');
                    }
                },
            }).css("font-size", "12px");
        };
        
        function dependencies_onload(){
            console.log('called onload');
            $("#tabs").tabs();
            init_pwd_gui();
            init_new_user_gui();
            init_new_group_gui();
            $('#submit-account-settings').click(function(){
                var params = account_settings.gui.get();
                params['user_id'] = websocket.user_id;
                delete params['account'];
                delete params['logout'];
                delete params['workspace'];
                delete params['ws_users'];
                websocket.send_task({
                    task: {
                        module: 'toyz.web.tasks',
                        task: 'save_user_info',
                        parameters: params
                    }
                });
                console.log('Parameters:',params);
            });
            
            websocket = new Toyz.Core.Websocket({
                rx_action: rxMsg,
                onopen: function(){
                    websocket.send_task({
                        task: {
                            module: 'toyz.web.tasks',
                            task: 'load_user_settings',
                            parameters: {}
                        }
                    });
                }
            });
        };
        
        window.onload=function(){
            Toyz.Core.load_dependencies(
                {
                    core: true,
                    js: ['/static/web/static/settings.js']
                }, 
                dependencies_onload
            );
        };
        </script>
    </body>
</html>