JavaScript, NodeJS, AngularJS & WordPress

Blog

  • JavaScript & jQuery: kaskadowe łączenie wywołań (ang. method chaining)

    Aby moc kaskadowo łączyć wykonywanie funkcji (ang. method chaining), musisz się upewnić ze Twoje metody zwracają obiekt/instancje.

    Dla przykładu w vanilla JavaScript może to wyglądać następująco:

    js.js
    var value = 0;
var obj = {
    increase: function(val) {
        value = value + val;
        return obj;
    },
    decrease: function(val) {
        value = value - val;
        return obj;
    }
}
obj.increase(5).increase(2).decrease(1);
console.log(value); // 6

     

    W jQuery chcemy zwrócić “this” – jsFiddle demo:

    jquery.js
    $.fn.redBorder = function () {
    $(this).css("border", "1px solid red");
    return this;
    
    //  or shorter "return $(this).css("border", "1px solid red");"
    
};

$.fn.greyBackground = function () {
    return $(this).css("background-color", "grey");
};

$.fn.innTxt = function (txt) {
    return $(this).html(txt);

};


$('#main').redBorder().greyBackground().innTxt("testing chaining");

     

     

  • Git na Windows: jak zapisac hasło https

    Jeśli jesteś zmuszony pracować na Windows i nie chce Ci się za każdym razem wklepywać hasła HTTPS dla GIT-a (poddałem się z SSH po paru godzinach) to mam dla Ciebie dobra wiadomość.

    Jest narzędzie, które będzie w stanie zapisać dla Ciebie hasła oraz nazwy użytkowników przy połączeniach GIT przez HTTPS – git-credential-winstore.

    Pobrać można tutaj: http://gitcredentialstore.codeplex.com/

  • JavaScript: jak znaleźć liczby pierwsze (prime numbers)

    Zacznijmy od tego co to są liczby pierwsze a później dopiero jak je znaleźć. Liczba pierwsza – liczba naturalna, która ma dokładnie dwa dzielniki naturalne: jedynkę i siebie samą.

    W naszym przykładzie wykorzystamy dwie funkcje:

    • jedna która sprawdza czy dana liczba jest liczba pierwsza
    • oraz drugą która przygotowuje jakiś zbiór tych liczb

    Funkcja, która pozwoli sprawdzić czy liczba jest liczbą pierwszą może wyglądać następująco:

    isPrime.js
    function isPrime(num) {
    if(num < 2) return false;
    for (var i = 2; i < num; i++) {
        if(num % i == 0)
            return false;
    }
    return true;
}

    Kilka ważnych uwag:

    • zakłady, ze każda liczba poniżej 2 nie jest liczba pierwsza
    • jeśli liczba `num` nie jest mniejsza niż 2; próbujemy po kolei dzielić ją przez każdą liczbę mniejszą od `num`; np: jeśli `num = 5` to dzielimy przez 3 & 4

     

    Teraz dla przykładu chcemy uzyskać wszystkie liczby pierwsza mniejsze niż 100:

    primeNumbsLowerThan100.js
    var arr = [];
for(var i = 0; i < 100; i++){
    if(isPrime(i)) { arr.push(i); }
}
console.log(arr);
console.log(arr.length);

     

    Oraz kolejny przykład jak znaleźć 100 pierwszych liczb pierwszych:

    first100primeNumbers.js
    var arr = [];
var x = 0;
while(arr.length < 100){
    if(isPrime(x)) { arr.push(x); }
    x++;
}

console.log(arr);
console.log(arr.length)

     

     

  • WordPress: jak wyłączyć przypomnienia o updatach

    Czasami opcja wyłączenia updatow oraz notyfikacji jest bardzo przydatna, np kiedy nie chcesz aby klient tego ruszał 😉 Użyj kodu poniżej, aby wyłączyć updaty dla pluginow, wordpress core or themes:

     

    disable_updates.php
    // Disable Theme Updates # 3.0+
remove_action( 'load-update-core.php', 'wp_update_themes' );
add_filter( 'pre_site_transient_update_themes', create_function( '$a', "return null;" ) );
wp_clear_scheduled_hook( 'wp_update_themes' );

// Disable Plugin Updates #3.0+
remove_action( 'load-update-core.php', 'wp_update_plugins' );
add_filter( 'pre_site_transient_update_plugins', create_function( '$a', "return null;" ) );
wp_clear_scheduled_hook( 'wp_update_plugins' );

// Diasable Core Updates # 3.0+
add_filter( 'pre_site_transient_update_core', create_function( '$a', "return null;" ) );
wp_clear_scheduled_hook( 'wp_version_check' );

  • WordPress 3.8 – opcja ilości kolumn w dashboardzie

    Nie wiem dlaczego ale od wersji 3.8 nie ma domyślnie opcji ustawienia ilości kolumn w dashboardzie. Byc może ze względu na to ze dash jest teraz responsive? Aby przywrócić opcje ilości kolumn wystarczy dodać poniższy kod do functions.php.

    dash.php
    function dashboard_columns() {
     add_screen_option(
          'layout_columns',
          array(
               'max'     => 4,
               'default' => 1
               )
          );
}
add_action( 'admin_head-index.php', 'dashboard_columns' );

     

     

     

  • WordPress: wlasny breadcrumb bez pluginu

    Długo szukałem dobrego przykładu breadcrumbs (ścieżki), który by działał dobrze z Bootstrap. Poniższy kod jest mixem rzeczy znalezionych w internecie oraz własnej twórczości:

    wordpress_breadcrumbs.php
    function the_breadcrumbs() {

     global $post;
     global $wp_query;

     if ( ! is_home() ) {

          echo "<li><a href='http://website.com/'>WebSite</a></li>";
          echo "<li><a href='";
          echo get_option('home');
          echo "'>";
          echo bloginfo('name');
          echo "</a></li>";

          if (is_category() || is_single()) {

               //echo "<li>";
               $cats = get_the_category( $post->ID );
               //echo "</li>";

               foreach ( $cats as $cat ){

                    //var_dump($cat);
                    echo "<li>";
                    echo "<a href='".get_category_link($cat->term_id)."'>".$cat->cat_name."</a>";
                    echo "</li>";

               }
               if ( is_single()) {

                    echo "<li>";
                    the_title();
                    echo "</li>";

               }
          } elseif (is_page()) {

              
               $post = $wp_query->get_queried_object();

               if ( $post->post_parent == 0 ){

                    echo "<li>  ".the_title('','', FALSE)."</li>";

               } else {
                    $title = the_title('','', FALSE);
                    $ancestors = array_reverse( get_post_ancestors( $post->ID ) );
                    array_push($ancestors, $post->ID);

                    foreach ( $ancestors as $ancestor ){
                         if( $ancestor != end($ancestors) ){
                              echo '<li><a href="'. get_permalink($ancestor) .'">'. strip_tags( apply_filters( 'single_post_title', get_the_title( $ancestor ) ) ) .'</a></li>';
                         } else {
                              echo '<li>'. strip_tags( apply_filters( 'single_post_title', get_the_title( $ancestor ) ) ) .'</li>';
                         }
                    }
               }




          }
     }
     elseif (is_tag()) { single_tag_title(); }
     elseif (is_day()) { echo"Archive: "; the_time('F jS, Y'); echo'</li>';}
     elseif (is_month()) { echo"Archive: "; the_time('F, Y'); echo'</li>';}
     elseif (is_year()) { echo"Archive: "; the_time('Y'); echo'</li>';}
     elseif (is_author()) { echo"Author's archive: "; echo'</li>';}
     elseif (isset($_GET['paged']) && !empty($_GET['paged'])) {echo "Blogarchive: "; echo'';}
     elseif (is_search()) { echo"Search results: "; }
}

    Później używamy jak poniżej:

    breadcrumbs.php
    <!-- BREADCRUMB -->
<?php if( function_exists('the_breadcrumbs') ) { ?>
<ol class='breadcrumb '>
    <?php the_breadcrumbs(); ?>
</ol>
<?php } ?>
<!-- // BREADCRUMB -->

     

  • WordPress: jak zaladowac domysle style dla wordpress theme – plik style.css

    Mimo tego, ze w na codzien we wszystkich templatach korzystam z LESS, ktory pozniej jest kompilowany do CSS (np przy uzyciu WP LESS) to kazdy theme wymaga pliku style.css. Aby zaladowac nasz plik style.css w header.php mozemy skorzyctac z kodu jak ponizej:

    load_css_styles.php
    <link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" />

     

    W ramach przypomnienia plik style.css moglby wygladac tak:

    style.css
    /*
     
     Theme Name: ThemeName
     Author: John Doe @ CompanyCo LTD
     Author E-mail: john.doe@company.com
     Author URI: http://john.company.com
     Version: 1.0
     Last Update: 12/12/2012
     
*/

  • WordPress: lista adresów e-mail dla danej roli

    Jesli potrzebujesz stworzyc liste uzytkownikow nalezacych do konkretnej roli (administrator, edytor itd..) mozesz uzyc funkcji jak ponizej. Ja osobiscie uzywam takiej metody, aby wyslac email do wszystkich adminow powiadamaiajcy o nowym wpisie.

    get_emails_by_role.php
    function get_emails_by_role($role) {

    $arr = array();
    $args = array("role" => $role);
    $users = get_users($args );

    foreach ($users as $key => $value) {
        $arr[] = $value->data->user_email;
    }

    return $arr;
    
}