<style type="text/css">/* CONTAINERS AND GENERAL SETUP */
    body { overflow:hidden; }
    #fa_form_container { color:#666; font-size:12px; font-family:Arial, sans-serif; background:#FFF; position:fixed; top:0; left:0; right:0; bottom:0; z-index:999999; overflow:auto; }
    #fa_form_container a { color:#69C !important; }
    #fa_form_container a:hover { color:#369 !important; }
    .fa_login_maintitle { font-size:24px; font-weight:bold; text-align:center; text-transform:uppercase; margin:20px 0; }
    .fa_login_maintitle img { vertical-align:-5px; height:30px; margin-right:6px; }
    .fa_login_title { text-align:center; margin:30px 0; color:#666; font-size:28px; font-weight:bold; font-family:Arial, sans-serif; }
    .fa_login_desc { font-size:16px; text-align:center; margin:10px 0; }
    .fa_form_wrap { text-align:center; background:#EEE; border:1px solid #DDD; box-shadow:0 6px 12px rgba(0, 0, 0, 0.1); border-radius:3px; padding:30px 6px; width:300px; margin:30px auto; overflow:hidden; position:relative; transition:250ms; }
    .fa_login_row { margin:10px 0; }
    .fa_form_links { text-align:center; }
    .fa_login_origin { font-size:12px; position:fixed; bottom:10px; right:10px; z-index:-1; }
    .fa_login_origin a { font-weight:bold; }
   
    /* AVATAR AND USERNAME */
    .fa_login_avatar { background:#FFF; border:1px solid #DDD; border-radius:100px; padding:2px; display:inline-block; width:100px; height:100px; overflow:hidden; position:relative; }
    .fa_login_avatar img { height:100px; width:100px; border-radius:100px; }
    #fa_avatar_real { background:#FFF; position:absolute; top:50px; left:50px; right:2px; bottom:2px; height:0; width:0; transition:linear 150ms; }
    #fa_avatar_real.avatar_visible { top:2px; left:2px; height:100px; width:100px; }
    .fa_login_username { font-size:16px; font-weight:bold; }
   
    /* BUTTONS AND INPUTS */
    .fa_login_button { color:#69C; background:none; border:1px solid #69C; border-radius:3px; font-size:16px; font-weight:bold; font-family:Arial, sans-serif; display:block; height:30px; line-height:30px; width:240px; margin:10px auto; transition:250ms; outline:none; cursor:pointer; }
    .fa_login_button:hover { color:#FFF; background:#69C; }
    .fa_login_input { color:#666; background:#FFF; border:1px solid #CCC; border-radius:3px; padding: 0 3px; height:30px; width: 232px; outline:none; }
    .fa_login_input:focus { border-color:#69C; }
   
    /* FORM SLIDES AND BACK BUTTON */
    .fa_form_slide { position:absolute; width:100%; transition:300ms; }
    #fa_login_back { position:absolute; top:30px; left:40px; opacity:0; visibility:hidden; transition:250ms; }
    #fa_login_back.fa_login_visible { opacity:1; visibility:visible; }
   
   
    /* ACCOUNT LIST */
    #account_list { background:#EEE; position:absolute; top:0; left:0; width:100%; height:100%; overflow:auto; }
    .account_list_row { font-size:16px; text-align:left; width:80%; margin:10px auto; position:relative; }
    .account_list_inner { background:#FFF; border:1px solid #DDD; border-radius:3px; padding:3px; width:80%; cursor:pointer; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    .account_list_inner:hover { background:#FFD }
    .account_list_avatar { height:40px; width:40px; vertical-align:middle; margin-right:3px; }
    #fa_form_container a.account_list_delete { font-size:30px; color:#F33 !important; background:#FFF; border:1px solid #F33; border-radius:100px; width:20px; height:20px; line-height:22px; text-align:center; position:absolute; margin-top:-10px; top:50%; right:0; display:block; overflow:hidden; }
    #fa_form_container a.account_list_delete:hover { color:#333 !important; border-color:#333; }
   
    /* HIDE FIELDS */
    .logged_out #fa_form_logout, .logged_in #fa_form_login, .noscript #fa_form_login, .noscript #fa_form_logout, #account_list.accounts_hidden { display:none }
</style>
   

<div id="fa_form_container" class="logged_out noscript">

   
     
<!-- START_NOSCRIPT_LOGIN_FORM -->
     
<noscript>
       

<form action="/login" method="post">
          <h2 class="fa_login_title">تسجيل الدخول</h2>
         

<p class="fa_login_desc">الرجاء تسجيل الدخول للحصول على حق الوصول الكامل إلى هذا المنتدى</p>
         

<div class="fa_form_wrap">
           

<div class="fa_login_row">
             
<input id="fa_login_username" class="fa_login_input" type="text" name="username" placeholder="أدخل اسم المستخدم الخاص بك"/>
           
</div>
         
           

<div class="fa_login_row">
             
<input id="fa_login_password" class="fa_login_input" type="password" name="password" placeholder="كلمه السر"/>
           
</div>
         
           

<div class="fa_login_row">
             
<input class="fa_login_button" type="submit" name="login" value="الدخول"/>
             
             

<div style="width:240px;margin:auto;">
               

<div style="float:left;">
                 
<label for="fa_autologin">
<input id="fa_autologin" type="checkbox" name="autologin"/> تسجيل الدخول تلقائيا
</label>
               
</div>
               
               

<div style="float:right;">
                  <a href="/profile?mode=sendpassword">هل نسيت كلمة المرور؟</a>
               
</div>
               
               

<div class="clear">
</div>
             
</div>
           
</div>
         
</div>
       
         

<div class="fa_form_links">
           

<div class="fa_login_row">
              <a href="/register">انشاء حساب</a>
           
</div>
           

<div class="fa_login_row">
              <a href="/login#login_classic">تسجيل الدخول الكلاسيكية</a> | <a href="/login?logout=true#login_classic">الخروج الكلاسيكية</a>
           
</div>
         
</div>
       
</form>
     
</noscript>
     
<!-- END_NOSCRIPT_LOGIN_FORM -->
   
     
<!-- START_LOGIN_FORM -->
     

<form id="fa_form_login" action="/login" method="post">
        <h2 class="fa_login_title">تسجيل الدخول</h2>
       

<p class="fa_login_desc">الرجاء تسجيل الدخول للحصول على حق الوصول الكامل إلى
<script type="text/javascript">document.write('<a href="http://' + window.location.host + '">' + window.location.host + '</a>');
</script></p>
         

<div id="fa_form_wrap" class="fa_form_wrap" style="height:210px;">
           

<div class="fa_login_row">
              <a id="fa_login_back" href="#">رجوع</a>
             

<span class="fa_login_avatar">
                <img src="http://2img.net/i/fa/invision/pp-blank-thumb.png"/>
                <img id="fa_avatar_real" src="http://2img.net/i/fa/invision/pp-blank-thumb.png"/>
             
</span>
           
</div>
         
           
<!-- START_STEP_1 -->
           

<div id="login_step_1" class="fa_form_slide" style="left:0px;">
             

<div class="fa_login_row">
               
<input id="fa_login_username" class="fa_login_input" type="text" name="username" placeholder="أدخل اسم المستخدم الخاص بك"/>
               

<p id="fa_error_username" class="fa_login_row" style="color:#F00;display:none;">الرجاء إدخال اسم المستخدم الخاص بك .</p>
             
</div>
         
             

<div class="fa_login_row">
               
<input id="fa_button_next" class="fa_login_button" type="button" value="التالى"/>
             
</div>
           
</div>
           
<!-- END_STEP_1 -->
         
           
<!-- START_STEP_2 -->
           

<div id="login_step_2" class="fa_form_slide" style="left:400px;">
             

<div class="fa_login_row">
               

<span class="fa_login_username">
</span>
             
</div>
         
             

<div class="fa_login_row">
               
<input id="fa_login_password" class="fa_login_input" type="password" name="password" placeholder="كلمة السر"/>
               

<p id="fa_error_password" class="fa_login_row" style="color:#F00;width:240px;margin:10px auto;display:none;">لقد حددت اسم مستخدم أو كلمة المرور غير صالحة .</p>
             
</div>
         
             

<div class="fa_login_row">
               
<input class="fa_login_button" type="submit" name="login" value="الدخول"/>
             
               

<div style="width:240px;margin:auto;">
                 

<div style="float:left;">
                   
<label for="fa_autologin">
<input id="fa_autologin" type="checkbox" name="autologin"/> تسجيل الدخول تلقائيا
</label>
                 
</div>
               
                 

<div style="float:right;">
                    <a href="/profile?mode=sendpassword">هل نسيت كلمة المرور؟</a>
                 
</div>
               
                 

<div class="clear">
</div>
               
</div>
             
</div>
           
</div>
           
<!-- END_STEP_2 -->
         
</div>
       
         

<div class="fa_form_links">
           

<div id="account_list_holder" class="fa_login_row">
</div>
           

<div class="fa_login_row">
              <a href="/register">انشاء حساب</a>
           
</div>
           

<div class="fa_login_row">
              <a href="/login#login_classic">سجل الكلاسيكية في</a>
           
</div>
         
</div>
     
</form>
     
<!-- END_LOGIN_FORM -->
   
     
<!-- START_LOGOUT_FORM -->
     

<form id="fa_form_logout" action="/login?logout=true" method="post">
        <h2 class="fa_login_title">خروج</h2>
       

<p class="fa_login_desc">كنت على وشك تسجيل الخروج من
<script type="text/javascript">document.write('<a href="http://' + window.location.host + '">' + window.location.host + '</a>');
</script></p>
         

<div class="fa_form_wrap">
           

<div class="fa_login_row">
             

<span class="fa_login_avatar">
<script type="text/javascript">document.write(_userdata.avatar);
</script>
</span>
           
</div>
         
           

<div class="fa_login_row">
             

<span class="fa_login_username">
<script type="text/javascript">document.write('<a href="/u' + _userdata.user_id + '" target="_blank">' + _userdata.username + '</a>');
</script>
</span>
           
</div>
         
           

<div class="fa_login_row">هل أنت متأكد أنك تريد تسجيل الخروج ؟
</div>
           

<div class="fa_login_row">
             
<input class="fa_login_button" type="submit" name="confirm" value="نعم"/>
             
<input class="fa_login_button" type="submit" name="cancel" value="لا"/>
             
<script type="text/javascript">//<![CDATA[
              _userdata.session_logged_in && (function() {
                var logout = document.getElementById('logout'),
                    container = document.getElementById('fa_form_container'),
                    form_logout = document.getElementById('fa_form_logout');
                   
                document.title = 'خروج';
                container.className = 'logged_in';
             
                /* إذا كان الارتباط تسجيل الدخول الافتراضي هو الحاضر يمكننا الحصول على البيانات من الخاصية href . ( FASTER )
                ** وإلا فإننا سوف تحتاج إلى إرسال طلب أجاكس إلى صفحة تسجيل الدخول للبيانات ( SLOWER ) */
                if (logout) {
                  var tid = logout.href.replace(/.*?tid=(.*?)&.*/, '$1'),
                      key = logout.href.replace(/.*?key=(.*?)$/, '$1');
                     
                  form_logout.action += '&tid=' + tid;
                  document.write('
<input type="hidden" name="tid" value="' + tid + '">
<input type="hidden" name="key" value="' + key + '">');
                } else {
                  $.get('/login?logout=true&change_version=prosilver', function(d) {
                    var info = $('.submit-buttons', d)[0];
                    if (info) {
                      info.style.display = 'none';
                      form_logout.appendChild(info);
                      form_logout.action += '&tid=' + form_logout.tid.value;
                    }
                  });
                }
              }());
              //]]>
</script>
           
</div>
         
</div>
       
</form>
       
<!-- END_LOGOUT_FORM -->
     

   
</div>
   
   
<script type="text/javascript">//<![CDATA[
    !_userdata.session_logged_in && (function() {
      document.title = 'Log in';
   
      window.fa_form_login = {
        redirect : my_getcookie('fa_login_form_redirect') || '/forum', /* تغيير الصفحة إعادة توجيه بعد تسجيل الدخول */
        submitting : false, /* true if posting login info */
     
        accountList : document.createElement('DIV'), /* سجلت مخازن حسابات */
   
        /* الانتقال إلى الخطوة كلمة المرور      تمر على طول هوية المستخدم للحصول على صورة العضو أسرع */
        next : function(id) {
          var username = document.getElementById('fa_login_username');
       
          if (username.value) {
            var avatar = document.getElementById('fa_avatar_real'),
                row, accounts, i;
         
         
            fa_form_login.clearError('username');
            username.value = username.value.replace(/^\s+|\s+$/g, ''); // تقليم المساحة البيضاء إضافية
         
            // معرفة ما اذا كان يتم تخزين اسم المستخدم بالفعل
            if (!id && storage && storage.fa_accounts && window.JSON) {
              accounts = JSON.parse(storage.fa_accounts);
              for (i in accounts) {
                if (username.value.toLowerCase() == accounts[i].username.toLowerCase()) {
                  id = i;
                  break;
                }
              }
            }
         
            row = id ? null : document.getElementById('account_user_' + id);
         
            // معرفة ما اذا كان يتم إنشاء الصف حساب للحصول على صورة منها بالفعل تحميلها
            if (row) avatar.src = row.getElementsByTagName('IMG')[0].src;
            else {
              $.get(id ? '/ajax/index.php?f=m&user_id=' + id : '/profile?mode=viewprofile&u=' + username.value, function(d) {
                var ava = id ? $('.tooltip-content img', d)[0] : $('#profile-advanced-right .module:first div img:first,.forumline td.row1.gensmall:first > img:first, .frm-set.profile-view.left dd img,dl.left-box.details:first dd img, .row1 b .gen:first img, .real_avatar img', d)[0];
                avatar.src = ava ? ava.src : 'http://2img.net/i/fa/invision/pp-blank-thumb.png';
                avatar.className = 'avatar_visible';
              });
            }
       
            $('.fa_login_username').html('<a href="/profile?mode=viewprofile&u=' + username.value + '" target="_blank">' + username.value + '</a>');
         
            document.getElementById('fa_form_wrap').style.height = '260px';
            document.getElementById('login_step_1').style.left = '-400px';
            document.getElementById('login_step_2').style.left = '0px';
            document.getElementById('fa_login_back').className = 'fa_login_visible';
         
            window.setTimeout(function() {
              document.getElementById('fa_login_password').focus();
            }, 300);
          } else {
            fa_form_login.error('username');
          }
        },
     
        /* الرجوع إلى الخطوة اسم المستخدم */
        back : function() {
          fa_form_login.clearError('password');
       
          document.getElementById('fa_login_username').focus();
          document.getElementById('fa_avatar_real').className = '';
       
          document.getElementById('fa_form_wrap').style.height = '210px';
          document.getElementById('login_step_1').style.left = '0px';
          document.getElementById('login_step_2').style.left = '400px';
          document.getElementById('fa_login_back').className = '';
          return false;
        },
     
        /* تقديم نموذج تسجيل الدخول */
        submit : function() {
          if (!fa_form_login.submitting) {
            fa_form_login.submitting = true;
         
            document.getElementById('fa_form_wrap').style.height = '260px';
            fa_form_login.clearError('password');
         
            $.post('/login', $('#fa_form_login').serialize() + '&login=true', function(d) {
              fa_form_login.submitting = false;
              if (/_userdata\["session_logged_in"\] = 1/.test(d)) {
                var storage = window.localStorage,
                    id = d.match(/_userdata\["user_id"\] = (\d+)/)[1];
             
                /* تخزين هوية المستخدم و اسم المستخدم لتسجيل الدخول المقبل */
                if (storage && window.JSON) {
                  var accounts = storage.fa_accounts ? JSON.parse(storage.fa_accounts) : {}, i;
               
                  for (i in accounts) accounts[i].last_active = 0;
               
                  accounts[id] = {
                    last_active : 1, /* سيتم وضع علامة حساب نشط الماضي مع 1 */
                    username : document.getElementById('fa_login_username').value
                  };
               
                  storage.fa_accounts = JSON.stringify(accounts);
                }
             
                my_setcookie('fa_login_form_redirect', '');
                window.location.href = fa_form_login.redirect;
              } else {
                fa_form_login.error('password');
              }
            });
          }
          return false;
        },
     
        /* رمي خطأ شكل و عرض النص خطأ */
        error : function(type) {
          var error = document.getElementById('fa_error_' + type),
              wrap = document.getElementById('fa_form_wrap');
       
          if (/none/.test(error.style.display)) {
            document.getElementById('fa_login_' + type).style.borderColor = '#F00';
       
            error.style.display = 'block';
            wrap.style.height = +wrap.style.height.replace(/px/, '') + error.getBoundingClientRect().height + 'px';
          }
        },
     
        /* مسح الخطأ المحدد */
        clearError : function(type) {
          document.getElementById('fa_error_' + type).style.display = 'none';
          document.getElementById('fa_login_' + type).style.borderColor = '';
        },
     
        /* حذف ملف تعريف من قائمة الحساب */
        deleteProfile : function(id) {
          var storage = window.localStorage, accounts = JSON.parse(storage.fa_accounts),
              row = document.getElementById('account_user_' + id),
              i;
   
          delete accounts[id];
          for (i in accounts) {
            accounts[i].last_active = 1;
            break;
          }
          storage.fa_accounts = JSON.stringify(accounts);
       
          row.parentNode.removeChild(row);
          if (!fa_form_login.accountList.firstChild) fa_form_login.accountList.innerHTML = '

<div class="fa_login_row">هل أنت متأكد أنك تريد تسجيل الخروج
</div>

<div class="fa_login_row"><a href="javascript:fa_form_login.toggleAccounts();">العودة إلى تسجيل الدخول</a>
</div>';
        },
     
        /* إنشاء الصفوف الشخصية على أساس حسابات قمت بتسجيل الدخول إلى */
        createProfile : function(id, o) {
          var row = document.createElement('DIV');
          row.id = 'account_user_' + id;
          row.className = 'account_list_row';
          row.innerHTML = '

<div class="account_list_inner"><img class="account_list_avatar" src="http://2img.net/i/fa/invision/pp-blank-thumb.png"/>

<span class="account_list_username">' + o.username + '
</span>
</div><a class="account_list_delete" title="ازالة الحساب" href="javascript:fa_form_login.deleteProfile(\'' + id + '\');">X</a>';
          row.firstChild.onclick = function() {
            fa_form_login.toggleAccounts();
            document.getElementById('fa_login_username').value = $('.account_list_username', this).text();
            fa_form_login.next(this.parentNode.id.slice(13));
          };
       
          $.get('/ajax/index.php?f=m&user_id=' + id, function(d) {
            var ava = $('.tooltip-content img', d)[0];
            if (ava) row.getElementsByTagName('IMG')[0].src = ava.src;
          });
       
          fa_form_login.accountList.appendChild(row);
        },
     
        /* الإعداد الأساسي لل قائمة الحساب */
        initAccountList : function() {
          var a = document.createElement('A'),
              holder = document.getElementById('account_list_holder');
       
          a.href = '#';
          a.innerHTML = 'اختيار حساب آخر';
          a.onclick = fa_form_login.toggleAccounts;
       
          fa_form_login.accountList.id = 'account_list';
          fa_form_login.accountList.className = 'accounts_hidden';
       
          document.getElementById('fa_form_wrap').appendChild(fa_form_login.accountList);
          holder.appendChild(a);
        },
     
        /* عرض تبديل القائمة حساب */
        toggleAccounts : function() {
          if (/accounts_hidden/.test(fa_form_login.accountList.className)) {
            fa_form_login.accountList.className = '';
            document.getElementById('account_list_holder').firstChild.innerHTML = 'العودة إلى تسجيل الدخول';
          } else {
            fa_form_login.accountList.className = 'accounts_hidden';
            document.getElementById('account_list_holder').firstChild.innerHTML = 'اختيار حساب آخر';
          }
       
          if (!fa_form_login.accountList.firstChild) fa_form_login.accountList.innerHTML = '

<div class="fa_login_row">لا توجد حسابات المحفوظة.
</div>

<div class="fa_login_row"><a href="javascript:fa_form_login.toggleAccounts();">العودة إلى تسجيل الدخول</a>
</div>';
          return false;
        }
      };
   
      var container = document.getElementById('fa_form_container'),
          username = document.getElementById('fa_login_username'),
          storage = window.localStorage;
   
      container.className = 'logged_out';
   
      /* المضي قدما في النموذج عند الضغط على ENTER */
      username.onkeydown = function(e) {
        if (e.keyCode && e.keyCode == 13) {
          fa_form_login.next();
          return false;
        }
      };
     
      /* إذا كانت البيانات المحدد غير صالحة للاستعمال سنذهب من خلال الحسابات المخزنة في المتاجر المحلية و تشكيل قائمة للتبديل */
      if (storage && storage.fa_accounts && window.JSON) {
        var accounts = JSON.parse(storage.fa_accounts),
            i, last_active = false;
     
        for (i in accounts) {
          if (accounts[i].last_active) {
            last_active = true;
            username.value = accounts[i].username;
            fa_form_login.next(i);
          }
         
          fa_form_login.createProfile(i, accounts[i]);
        }
     
        fa_form_login.initAccountList();
        !last_active && username.focus();
      } else username.focus();
   
      document.getElementById('fa_button_next').onclick = function() {
        fa_form_login.next();
      };
      document.getElementById('fa_login_back').onclick = fa_form_login.back;
      document.getElementById('fa_form_login').onsubmit = fa_form_login.submit;
    }());
    //]]>
</script>

    (function() {
      var html_page = 'رابط الصفحة',
          link_change = true,
          redirect = true;
   
      $(function() {
        var regex = new RegExp(html_page);
   
        // link change
        if (link_change && !regex.test(window.location.href)) {
          $('a[href^="/login"], a[href^="http://' + window.location.host + '/login"]').attr('href', html_page);
        }
   
        // redirect to classic if login page isn't available
        if (!document.getElementById('fa_form_container') && regex.test(window.location.href)) {
          window.location.href = '/login#login_classic';
        }
      });
   
      // login redirection
      // saves redirect location so you're taken to the correct page upon login
      if (/\/login\?redirect/.test(window.location.href)) {
        my_setcookie('fa_login_form_redirect', window.location.search.replace(/.*?redirect=(.*?)(?:&|$)/, '$1'));
      }
   
      // redirect
      if (redirect && /\/login/.test(window.location.href)) {
        if (/login_classic/.test(window.location.hash) || /admin=1/.test(window.location.href)) return;
        window.location.href = html_page;
      }
    }());