jQuery input amount format

jQuery(selector).on("keypress keyup blur keydown",function(event) {
var t = jQuery(this).val();
// prevent letters and arrow
if((event.which >= 65 && event.keyCode <= 90) || (event.which >= 37 && event.which <= 40) || event.which == 32){
event.preventDefault();
}

// only 1 decimal point and 2 decimal places
if(t.indexOf(".") != -1){
var dec = t.toString().split(".");
if((event.which == 190 || event.which == 110) || (dec[1].length >= 2 && event.which != 8)){
event.preventDefault();
}
}

// format with commas every 3 digit
jQuery(this).val(function(index, value) {
var c = value.toString();

if(c.indexOf(".") != -1){
var x = c.split(".");
x[0] = x[0].toString().replace(/,/gi, "");
x[0] = x[0].toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");

return x.join(".");
}
else{
var z = c.toString().replace(/,/gi, "");
z = z.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
return z;
}
});
});

WP Custom Post Type Banner Slider with Settings

function create_post_type() {
    register_post_type( 'banner',
        array(
            'labels' => array(
                'name' => 'Banners',
                'singular_name' => 'Banner',
                'add_new' => 'Add New Banner',
                'add_new_item' => 'Add New Banner',
                'edit_item' => 'Edit Banner',
                'new_item' => 'New Banner',
                'all_items' => 'All Banner',
                'view_item' => 'View Banner',
                'search_items' => 'Search Banner',
                'not_found' => 'No Banners Found',
                'not_found_in_trash' => 'No Banners found in Trash',
                'parent_item_colon' => '',
                'menu_name' => 'Banners',
            ),
            'public' => true,
            'has_archive' => true,
            'supports' => array(
                'title',
                'editor',
                //'custom-fields',
                'post-formats',
                'thumbnail',
                'page-attributes'
            ),
            //'taxonomies' => array( 'post_tag', 'category' ),
            'exclude_from_search' => true,
            'capability_type' => 'post',
            'rewrite' => array( 'slug' => 'banner' ),
        )
    );
}
add_action( 'init', 'create_post_type' );

function add_custom_meta_boxes() { 
    add_meta_box('wp_custom_attachment', 'Banner Image', 'wp_custom_attachment', 'banner', 'normal', 'high'); 
}

function wp_custom_attachment() { 
    wp_nonce_field(plugin_basename(__FILE__), 'wp_custom_attachment_nonce');
    $filearray = get_post_meta( get_the_ID(), 'wp_custom_attachment', true );
    $this_file = ($filearray) ? $filearray['url'] : "";
   
    $html = "<table>";
        $html .= "<tr>";
            $html .= "<td>";
                $html .= ($this_file != "") ? '<p class="description">Replace you banner image.</p>' : '<p class="description">Upload your banner image here.</p>';
                $html .= '<input type="file" id="wp_custom_attachment" name="wp_custom_attachment" value="" size="25">';
            $html .= "</td>";
            $html .= "<td>";
                $html .= ($this_file != "") ? '<div>Preview:<br><img src="'.$this_file.'" style="width:75px;"></div>' : '<div>Preview:<br> Not available</div>';
            $html .= "</td>";
        $html .= "</tr>";
    $html .= "</table>";
   
    echo $html;
}

function save_custom_meta_data($id) {
    if(!empty($_FILES['wp_custom_attachment']['name'])) {
        $supported_types = array(
            'image/gif',
            'image/bmp',
            'image/png',
            'image/jpeg'
        );
        $arr_file_type = wp_check_filetype(basename($_FILES['wp_custom_attachment']['name']));
        $uploaded_type = $arr_file_type['type'];

        if(in_array($uploaded_type, $supported_types)) {
            $upload = wp_upload_bits($_FILES['wp_custom_attachment']['name'], null, file_get_contents($_FILES['wp_custom_attachment']['tmp_name']));
            if(isset($upload['error']) && $upload['error'] != 0) {
                wp_die('There was an error uploading your file. The error is: ' . $upload['error']);
            } else {
                update_post_meta($id, 'wp_custom_attachment', $upload);
            }
        }
        else {
            wp_die("The file type not supported.");
        }
    }
}

function update_edit_form() {
    echo ' enctype="multipart/form-data"';
}

function wp_taler_banner(){
    $args = array(
        'post_type' => "banner",
        'post_status' => 'publish'
    );
    $my_query = new WP_Query($args);
    if($my_query->have_posts()) {
        echo "<div id='slides'>";
        while ($my_query->have_posts()) : $my_query->the_post();
            ?>
                <img src="<?php echo get_post_meta(get_the_ID(), 'wp_custom_attachment', true)["url"];?>">
            <?php
        endwhile;
        echo "</div>";
    }
    wp_reset_query();
    ?>
    <style>
    /* Prevents slides from flashing */
    #slides {
        display:none;
    }
    </style>
    <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/slidesjs/3.0/jquery.slides.min.js"></script>
    <?php
    call_slides_js();
}

function call_slides_js(){
    $width=(get_option('image_width')=='') ? '500' : get_option('image_width');
    $height=(get_option('image_height')=='') ? '200' : get_option('image_height');
    $effect=(get_option('slidesjs_effect') == '') ? "slide" : get_option('slidesjs_effect');
    $hoverpause=(get_option('slidesjs_hoverpause') == '') ? "false" : get_option('slidesjs_hoverpause');
    $pagination=(get_option('slidesjs_pagination') == '') ? "false" : get_option('slidesjs_pagination');
    $navigation=(get_option('slidesjs_navigation') == '') ? "false" : get_option('slidesjs_navigation');
    $playstop=(get_option('slidesjs_playstop') == '') ? "true" : get_option('slidesjs_playstop');
    $interval=(get_option('slidesjs_interval') == '') ? 2000 : get_option('slidesjs_interval');
    $call_back_loaded=get_option('slidesjs_call_back_loaded');
    $call_back_complete=get_option('slidesjs_call_back_complete');
    $call_back_start=get_option('slidesjs_call_back_start');
   
    echo "
        <script style='text/javascript'>
        jQuery(function(){
            jQuery('#slides').slidesjs({
                width: ".$width.",
                height: ".$height.",
                navigation: {
                    active: ".$navigation.",
                    effect: '".$effect."'
                },
                pagination: {
                    active: ".$pagination.",
                    effect: '".$effect."'
                },
                effect: {
                    slide: {
                        speed: 1000
                    },
                    fade: {
                        speed: 1000,
                        crossfade: true
                    }
                },
                play: {
                    active: ".$playstop.", // with play or stop
                    effect: '".$effect."', // slide or fade
                    interval: ".$interval.",
                    auto: true,
                    swap: true,
                    pauseOnHover: ".$hoverpause.",
                    restartDelay: 2500
                },
                callback: {
                        loaded: function (number) {".$call_back_loaded."},
                        start: function (number) {".$call_back_start."},
                        complete: function (number) {".$call_back_complete."}
                }
            });
        });
        </script>
    ";
}


function  wp_taler_banner_settings_page(){
    ?>
    <div class="wrap">
        <h1>Banners Settings</h1>
    </div>
    <form method="post" action="options.php">
    <?php wp_nonce_field('update-options');?>
    <?php
        $slide_effect = (get_option('slidesjs_effect') == 'slide') ? 'selected="selected"' : '';
        $fade_effect = (get_option('slidesjs_effect') == 'fade') ? 'selected="selected"' : '';
        $hoverpause_true = (get_option('slidesjs_hoverpause') == 'true') ? 'selected="selected"' : '';
        $hoverpause_false = (get_option('slidesjs_hoverpause') == 'false') ? 'selected="selected"' : '';
        $activepagination_true = (get_option('slidesjs_pagination') == 'true') ? 'selected="selected"' : '';
        $activepagination_false = (get_option('slidesjs_pagination') == 'false') ? 'selected="selected"' : '';
        $activenavigation_true = (get_option('slidesjs_navigation') == 'true') ? 'selected="selected"' : '';
        $activenavigation_false = (get_option('slidesjs_navigation') == 'false') ? 'selected="selected"' : '';
        $activeplaystop_true = (get_option('slidesjs_playstop') == 'true') ? 'selected="selected"' : '';
        $activeplaystop_false = (get_option('slidesjs_playstop') == 'false') ? 'selected="selected"' : '';
    ?>
    <table class="form-table">
        <tr>
            <th class="row">Width:</th><td><input type="text" name="image_width" class="" value="<?php echo get_option('image_width');?>"/></td>
        </tr>
        <tr>
            <th class="row">Height:</th><td><input type="text" name="image_height" class="" value="<?php echo get_option('image_height');?>"/></td>
        </tr>
        <tr>
            <th class="row">Interval:</th><td><input type="text" name="slidesjs_interval" class="" value="<?php echo get_option('slidesjs_interval');?>"/></td>
        </tr>
        <tr>
            <th class="row">Effect:</th><td><select id="slidesjs_effect" name="slidesjs_effect" >
                  <option value="slide" <?php echo $slide_effect;?>>Slide</option>
                  <option value="fade" <?php echo $fade_effect;?>>Fade</option>
                </select></td>
        </tr>
        <tr>
            <th class="row">Activate Pagination:</th><td><select id="slidesjs_pagination" name="slidesjs_pagination" >
                  <option value="true" <?php echo $activepagination_true;?>>True</option>
                  <option value="false" <?php echo $activepagination_false;?>>False</option>
                </select></td>
        </tr>
        <tr>
            <th class="row">Activate Navigation:</th><td><select id="slidesjs_navigation" name="slidesjs_navigation" >
                  <option value="true" <?php echo $activenavigation_true;?>>True</option>
                  <option value="false" <?php echo $activenavigation_false;?>>False</option>
                </select></td>
        </tr>
        <tr>
            <th class="row">Activate Play and Stop:</th><td><select id="slidesjs_playstop" name="slidesjs_playstop" >
                  <option value="true" <?php echo $activeplaystop_true;?>>True</option>
                  <option value="false" <?php echo $activeplaystop_false;?>>False</option>
                </select></td>
        </tr>
        <tr>
            <th class="row">Hover Pause:</th><td><select id="slidesjs_hoverpause" name="slidesjs_hoverpause" >
                  <option value="true" <?php echo $hoverpause_true;?>>True</option>
                  <option value="false" <?php echo $hoverpause_false;?>>False</option>
                </select></td>
        </tr>
        <tr>
            <th class="row">Callbacks</th><td></td>
        </tr>
        <tr>
            <th class="row">Loaded:</th>
            <td><textarea id="slidesjs_call_back_loaded" name="slidesjs_call_back_loaded"><?php echo get_option('slidesjs_call_back_loaded');?></textarea></td>
        </tr>
        <tr>
            <th class="row">Start:</th>
            <td><textarea id="slidesjs_call_back_start" name="slidesjs_call_back_start"><?php echo get_option('slidesjs_call_back_start');?></textarea></td>
        </tr>
        <tr>
            <th class="row">Complete:</th>
            <td><textarea id="slidesjs_call_back_complete" name="slidesjs_call_back_complete"><?php echo get_option('slidesjs_call_back_complete');?></textarea></td>
        </tr>
    </table>

    <input type="hidden" name="action" value="update" />
    <input type="hidden" name="page_options" value="image_width,image_height,slidesjs_effect,slidesjs_interval,slidesjs_hoverpause,slidesjs_pagination,slidesjs_navigation,slidesjs_playstop,slidesjs_call_back_loaded,slidesjs_call_back_start,slidesjs_call_back_complete" />
    <p class="submit"><input type="submit" value="Save" class="button button-primary"/></p>
    </form>
    <?php
}

function wp_taler_banner_settings() {
    add_submenu_page('edit.php?post_type=banner', 'Banner Settings', 'Banner Settings', 'edit_posts', basename(__FILE__), 'wp_taler_banner_settings_page');
}
add_action('admin_menu', 'wp_taler_banner_settings');
add_action('add_meta_boxes', 'add_custom_meta_boxes'); 
add_action('save_post', 'save_custom_meta_data');
add_action('post_edit_form_tag', 'update_edit_form');

HTML :
<br />
<div id="wrapper">
<textarea cols="55" id="text" maxlength="250" name="msg" rows="4"></textarea>
    <input id="submit" name="submit" type="button" value="submit" />
</div>
JS :
jQuery("#wrapper").on("click","#submit",function(){
    var text = $("#text").val();
    var arrs = [];
    var word = /\{(.*?)\}/g;
    for(tags = word.exec(msg_data); tags; tags = word.exec(msg_data)){
        arrs.push(tags[1]);
    }
    alert(arrs);
});

custom facebook and twitter share links

This is how to make custom shares of social networking sites.
Put this inside <head></head> tag.
<meta property="og:image" content="SITE_LOGO" /> // for facebook

Put this on your site image/logo
<img src="SITE_IMAGE_PATH" itemprop="image"> // for google plus


Facebook
<a href="javascript:void(0);" onclick="window.open('https://www.facebook.com/sharer/sharer.php?u=SITE_URL','','menubar=0,resizable=1,width=500,height=300')">FACEBOOK</a>


Pinterest
<a href="javascript:void(0);" onclick="window.open('http://pinterest.com/pin/create/button/?url=SITE_URL&amp;media=SITE_LOGO&amp;description=','','menubar=0,resizable=1,width=500,height=300')">PINTEREST</a>

Google+
<a href="javascript:void(0);" onclick="window.open('https://plus.google.com/share?url=SITE_URL','','menubar=0,resizable=1,width=500,height=300')">GOOGLE+</a>

Twitter
<a href="javascript:void(0);" onclick="window.open('https://twitter.com/intent/tweet?text=SITE_DESCRIPTION&url=SITE_URL/&via=SITE_NAME','','menubar=0,resizable=1,width=500,height=300')">TWITTER</a>

input type text place holder

This is how to put a placeholder on input type text using simple javascript.

<input type="text" name="FullName" id="Fullname" value="Name" onblur="if(this.value == ''){this.value = 'Name'}" onfocus="if(this.value == 'Name'){this.value = ''}" onclick="this.value==''">

no domain in a string url

This is how to display a string url without its domain name.


var thisUrl="http://domain.com/directory/subdirectory/file.name"
var noDomainUrl = thisUrl.replace(/https?:\/\/[^\/]+/i, "");

alert(noDomainUrl);

jQuery back to top script

This is an example how to make a back to top button using html and jQuery.

html
<h2 class="backToTop">back-to-top</h2>
<h2 class="backToTopFix">back-to-top</h2>

css
.backToTopFix{
       position:fixed;
       top:5px;
      display:none;
}

jQuery
       // get the distance from .stop to top
        var checkIfTop = jQuery(".stop").offset().top;

checkIfTop

        jQuery(window).scroll(function() {
      // if window top is greater than or equal to checkIfTop condition
            if(jQuery(window).scrollTop()>=checkIfTop){
                jQuery(".backToTop").hide();
                jQuery(".backToTopFix").show();
            }
            else{
                jQuery(".backToTop").show();
                jQuery(".backToTopFix").hide();
            }
        });