JSFiddle

  • plot.ly bar chart sample

    sample for plot.ly bar chart

    var available = {
      x: ['vCPUs', 'vLANs', 'Memory', 'Disk'], 
      y: [21, 9, 115,1086,], 
      name: 'Available', 
      type: 'bar'
    };
    
    var allocated = {
      x: ['vCPUs ...
  • Plot.ly Pie chart #4 is the latest revision

    sample for Plot.ly Pie chart

    var vcpudata = [{
      values: [60,39,21],
      labels: ['Allocated', 'Used', 'Available'],
      type: 'pie'
    }];
    
    var vlandata = [{
      values: [12,3,9],
      labels: ['Allocated ...
  • AngularJS Example

    No-Library (pure JS), HTML, CSS, JavaScript

    var myApp = angular.module('MyApp',[])
    myApp.directive('updateOnBlur', function() {
        return {
            restrict: 'EA',
            require: 'ngModel',
            link: function(scope, elm, attr, ngModelCtrl ...
  • Check If an IP is v4 or v6

    Check the IP version, whether it is IPv4 or IPv6

    function check(){
      var exprv4 =/(^\s*((25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9 ...
  • Check Number of IPs in a Range #59 is the latest revision

    Check Number of IP Addresses in a IP Range

         
    function u(n) { return n >>> 0; } // we need to treat the numbers as unsigned
    function ip(n) {
      return [
        (n >>> 24 ...
  • Extending the AngularJS $logProvider

    Add your own to the $logProvider.

    angular.module('app', [])
    
    .config(['$provide', function ($provide) {
        $provide.decorator('$log', ['$delegate', function ($delegate) {
            // Keep track of the original debug method ...
  • Move placeholder to Top inside the input on focus-v2 #1 is the latest revision

    Move placeholder to Top inside the input on focus another version

    <div>
      email: <input type="text" class="inputText" required/>  
      <span class="floating-label">Your email address</span>
    </div>
    <div>
    Name:  <input type="text" class="inputText" required/>
      <span class="floating-label">Your Name</span>  
    </div> 
    
  • Move placeholder to Top inside the input on focus

    Move placeholder to Top inside the input on focus

    <div>
      <span class='blocking-span'>
        <input type="text" class="inputText" required/>
        <span class="floating-label">Your email address</span>
      </span>
    </div>
    <!-- <br/><br/> --> <!-- if you set position to absolute for the div tag, then you need to add these <BR> or need to put the
    fields in seperate rows -->
    <div>
      <span class='blocking-span'>
        <input type="text" class="inputText" required/>
        <span class="floating-label">Your Name</span>
      </span>
    </div>
  • skewed div borders

    No-Library (pure JS), HTML, CSS, JavaScript

    <div class="topNavMenu"><p>test 1</p></div>
    <div class="topNavMenu"><p>test 2</p></div>
    <div class="topNavMenu"><p>test 3</p></div>
  • Animated css3 border

    No-Library (pure JS), HTML, CSS, JavaScript

    <p>Gradually change the border-top-right-radius property from 0 to 50px then back:<p>
    <div id="myDIV"></div>
    
    <p>The border-top-right-radius is <em>animatable</em> in CSS.</p>
    <p><b>Note:</b> CSS Animations ...</p></p></p>