Skip to content
login.html 3.64 KiB
Newer Older
<!DOCTYPE html>
<html>
    <head>
        {% for src in js %}
            <script type="text/javascript" src="{{ src }}"></script>
        {% endfor %}
        {% for src in css %}
            <link type="text/css" rel="stylesheet" href="{{ src }}">
        {% endfor %}
        
        <link type="text/css" rel="stylesheet" href="{{ url_for( 'send_app_files', path = 'app.css' ) }}">
        
        <script type="text/javascript">
            baseurl = "{{ baseurl }}";
        </script>
    </head>
    <body>
        <div class="icnml_login">
            <h1 style="margin-bottom: 0px">ICNML</h1>
            <h4 style="margin-top: 0px">International Close Non-Matches Library</h4>
            
            <div class="ui-widget-header ui-corner-top icnml_login_top">Please enter your login information</div>
            <form action="{{ url_for( 'do_login' ) }}" method="post" onsubmit="login_action();" id="login_form">
                <div class="ui-widget-content ui-corner-bottom icnml_login_form">
                    <div class="icnml_login_field">
                    	<div style="text-align: right;">
                    		<label for="username">Username</label>
                    	</div>
                    	<div>
                    		<input id="username" name="username" type="text" style="width: 100%">
                        </div>
                    	<div style="text-align: right;">
                    		<label for="password">Password</label>
                    	</div>
                    	<div>
                    		<input id="password" name="password" type="password" style="width: 100%">
                        </div>
                    </div>
                    <div id="icnml_login_error"></div>
                    <div class="icnml_login_button">
                    	<a class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" id="login_button" role="button" aria-disabled="false">
                            <span class="ui-button-text">Login</span>
                        </a>
                    </div>
                </div>
            </form>
        </div>
    </body>
    <script type="text/javascript">
    	login_action = function()
		{
    		$( '#icnml_login_error' ).html( '' );
    		$( '#login_button > span' ).text( "Please wait..." );
    		
        	$.ajax( {
	            url: '{{ url_for( 'do_login' ) }}',
	            dataType: 'json',
	            method: 'POST',
	            data: {
	            	username: $( '#username' ).val(),
	            	password: $( '#password' ).val()
	            },
	            success: function( data )
	            {
	                if( ! data.error )
	                {
	                	if( data.logged )
                		{
	                		location.href = "{{ url_for( 'home' ) }}";
                		} else {
                			if( typeof data.message !== 'undefined' )
                				var message = data.message;
                			else
                				var message = 'Invalid username/password';
                			
                			$( '#icnml_login_error' ).text( message );
    	                	$( '#login_button > span' ).text( "Login" );
                		}
	                }
	            }
	        } );
		}
    	
        $( '#login_button' ).on( 'click', login_action );
        
        $( '#username' ).on( 'keyup', function( event )
		{
        	if( event.keyCode == 13 )
        	{
        		event.preventDefault();
        		login_action();
        	}
		} );
        $( '#password' ).on( 'keyup', function( event )
		{
        	if( event.keyCode == 13 )
        	{
        		event.preventDefault();
        		login_action();
        	}
		} );
        
    </script>
</html>