javascript - How to refactor jQuery code? -
i'm jquery study student.
i've made source code, think it's long. code needs refactoring.
this code think good, not good. want better code.
how refactor code?
1) short function
2) short actions
3) , short code
$(function() { // setinitial var body = $('body'), header = body.find('.header'), aside = body.find('.sidebar'), content = body.find('.content'), entry = content.find('.entry'), footer = body.find('.footer'), account = body.find('.site > .account'); /* add links */ $('.addlinks').click(function() { window.open('/toolbar/popup/link', 'links add', 'width=400, height=185, scrollbars=no, status=no;'); return false; }); /* asidebutton */ var asidesecondary = aside.find('.secondary'), asidebutton = header.find($('.aside-button')), asideclosebutton = aside.find($('.aside-close-button')); asidebutton.click(function() { if (!body.hasclass('aside-open') && ((asidesecondary.attr('aria-hidden') === 'true' || asidesecondary.attr('aria-hidden') === undefined))) { // toggle body.addclass('aside-open'); // visible settimeout(function() { aside.addclass('open'); }, 10); // attr change settimeout(function() { asidesecondary.attr('aria-hidden', 'false'); }, 218); } }); /* asideclosebutton */ asideclosebutton.click(function() { if (body.hasclass('aside-open') && asidesecondary.attr('aria-hidden') === 'false') { // visible aside.removeclass('open') // toggle, attr change settimeout(function() { body.removeclass('aside-open'); asidesecondary.attr('aria-hidden', 'true'); }, 218); } }); /* search_none */ var currenturl = window.location.pathname, url = currenturl.split('/'); var pagetype, listitem = entry.find('> .article'), tagcontent = entry.find('> .entry-article.tag'); if ($.isnumeric(url[1])) { url[1] = 'article'; } switch (url[1]) { case 'tag': // check: tagcontent.length < 1 if (tagcontent.length < 1) { pagetype = 'list'; } break; case 'category': pagetype = 'list'; break; case 'search': pagetype = 'list'; break; case 'archive': pagetype = 'list'; break; default: } if (pagetype === 'list') { // check: listitem < 1 if (listitem.length < 1) { body.addclass('empty'); } } /* #################################################### */ /* ################## devolopers! #################### */ /* #################################################### */ /* checkaccountdropdown() */ function checkaccountdropdown() { if (!body.hasclass('account-open') && !account.hasclass('.open')) { // toggle body.addclass('account-open'); // visible settimeout(function() { account.addclass('open'); }, 10); // attr change settimeout(function() { account.attr('aria-hidden', 'false'); }, 218); } else { // visible account.removeclass('open'); // toggle, attr change settimeout(function() { body.removeclass('account-open'); account.attr('aria-hidden', 'true'); }, 218); } } /* dropdownclose(el) */ function dropdownclose(el) { // visible settimeout(function() { checkdropdownopen = 'close'; $(el).removeclass('open'); }, 10); // attr change settimeout(function() { $(el).attr('aria-hidden', 'true'); }, 218); } /* dropdownopen(el) */ function dropdownopen(el) { // visible settimeout(function() { checkdropdownopen = 'open'; $(el).addclass('open'); }, 10); // attr change settimeout(function() { $(el).attr('aria-hidden', 'false'); }, 218); } /* dropdown */ var dropdown = $('.dropdown'), dropdowntoggle = dropdown.find('.toggle'), dropdownmenu = dropdown.find('.menu'), checkdropdownopen = 'close'; dropdowntoggle.click(function() { dropdownclose(dropdownmenu); $(this).each(function() { // setinitial var thisdropdown = $(this).parent('.dropdown'), thisdropdowntoggle = $(this), thisdropdownmenu = $(this).next('.menu'); // checkaccountdropdown if (thisdropdown.hasclass('account-dropdown')) { checkaccountdropdown(); } // checkdropdownmenu = open if (!thisdropdownmenu.hasclass('open') && (thisdropdownmenu.attr('aria-hidden') === 'true' || thisdropdownmenu.attr('aria-hidden') === undefined)) { dropdownopen(thisdropdownmenu); } else if (thisdropdownmenu.hasclass('open') && thisdropdownmenu.attr('aria-hidden') === 'false') { dropdownclose(thisdropdownmenu); } }) }); /* login link */ var accounttoolbar = header.find('.account'), tistorytoolbar = $('#tistorytoolbarid'); if (tistorytoolbar.length > 0) { var toolbarlogin = tistorytoolbar.find('.tt_menubar_logout > a'), toolbarlogintext = toolbarlogin.text(), toolbarloginhref = toolbarlogin.attr('href'); accounttoolbar.find('.account-dropdown .menu > nav ul').append('<li><a class="primary" href="' + toolbarloginhref + '">' + toolbarlogintext + '</a>'); } /* document click */ $(document).click(function(e) { if (!body.hasclass('account-open') && !account.hasclass('.open')) { // closest dropdown if (!$(e.target).closest(dropdown).length) { dropdownclose(dropdownmenu); } } else { // closest dropdown, account if (!$(e.target).closest(dropdown).length && !$(e.target).closest(account).length) { dropdownclose(dropdownmenu); } } }); });
Comments
Post a Comment