contrib/gilbert/templates/gilbert/login.html

   1 {% extends 'gilbert/base.html' %}
   2 {% load staticmedia %}
   3
   4 {% block css %}{{ block.super }}
   5         <link rel="stylesheet" type="text/css" href="{% mediaurl 'gilbert/extjs/examples/ux/statusbar/css/statusbar.css' %}" />
   6         <style type="text/css">
   7                 .icon-door-open-in {
   8                         background: url({% mediaurl 'gilbert/fugue-icons/icons-shadowless' %}/door-open-in.png) no-repeat !important;
   9                 }
  10                 .x-statusbar .x-status-error {
  11                         cursor: help;
  12                         background-image: url({% mediaurl 'gilbert/fugue-icons/icons-shadowless' %}/exclamation-red.png) !important;
  13                 }
  14         </style>
  15 {% endblock %}
  16
  17 {% block js %}{{ block.super }}
  18         <script type="text/javascript" src="{% mediaurl 'gilbert/extjs/examples/ux/statusbar/StatusBar.js' %}"></script>
  19         <script type="text/javascript" charset="utf-8">
  20                 Ext.onReady(function () {
  21
  22                         var login_form = new Ext.FormPanel({
  23                                 border: false,{% if request.GET.theme %}
  24                                 bodyStyle: 'padding: 10px',{% else %}
  25                                 bodyStyle: 'padding: 0px 10px 0px;',{% endif %}
  26                                 items: [
  27                                         {
  28                                                 xtype: 'hidden',
  29                                                 name: 'csrfmiddlewaretoken',
  30                                                 value: '{{ csrf_token }}',
  31                                         },
  32                                         {
  33                                                 xtype: 'textfield',
  34                                                 anchor: '100%',
  35                                                 fieldLabel: 'Username',
  36                                                 name: 'username',
  37                                         },
  38                                         {
  39                                                 xtype: 'textfield',
  40                                                 inputType: 'password',
  41                                                 anchor: '100%',
  42                                                 fieldLabel: 'Password',
  43                                                 name: 'password',
  44                                         }
  45                                 ],
  46                                 url: '{{ form_url }}',
  47                                 standardSubmit: true,
  48                                 keys: [
  49                                         {
  50                                                 key: [Ext.EventObject.ENTER],
  51                                                 handler: function () {
  52                                                         var form = login_form.getForm();
  53                                                         form.submit();
  54                                                 },
  55                                         },
  56                                 ],
  57                         });
  58
  59                         var login_status_bar = window.status_bar = new Ext.ux.StatusBar({
  60                                 items: [
  61                                         {
  62                                                 xtype: 'button',
  63                                                 text: 'Log in',
  64                                                 iconCls: 'icon-door-open-in',
  65                                                 handler: function () {
  66                                                         var form = login_form.getForm();
  67                                                         form.submit();
  68                                                 },
  69                                         },
  70                                 ],
  71                         });
  72                         var login_window = new Ext.Window({
  73                                 header: false,
  74                                 closable: false,
  75                                 resizable: false,
  76                                 draggable: false,
  77                                 frame: true,
  78                                 autoHeight: true,
  79                                 width: 320,
  80                                 items: login_form,
  81                                 bbar: login_status_bar,
  82                         });
  83
  84                         login_window.show();
  85                         {% if error_message %}
  86                         login_status_bar.setStatus({
  87                                 iconCls: 'x-status-error',
  88                                 text: '{{ error_message_short }}',
  89                         });
  90
  91                         new Ext.ToolTip({
  92                                 target: login_status_bar.statusEl.el,
  93                                 anchor: 'top',
  94                                 title: '{{ error_message_short }}',
  95                                 html: '{{ error_message }}',
  96                         });
  97
  98                         Ext.QuickTips.init();
  99                         {% endif %}
 100                 });
 101         </script>
 102 {% endblock %}