/ Gists / JavaScript

Gists - JavaScript

On gists

JS -OOP ways - SO + DJPW.cz

•
JavaScript-OOP JavaScript

1.js #

// define the objects:
var objLit = {
  x: 0,
  y: 0,
  z: 0,
  add: function () {
    return this.x + this.y + this.z;
  }
};

var ObjCon = function(_x, _y, _z) {
  var x = _x; // private
  var y = _y; // private
  this.z = _z; // public
  this.add = function () {
    return x + y + this.z; // note x, y doesn't need this.
  };
};

// use the objects:
objLit.x = 3; 
objLit.y = 2; 
objLit.z = 1; 
console.log(objLit.add());    

var objConIntance = new ObjCon(5,4,3); // instantiate an objCon
console.log(objConIntance.add());
console.log((new ObjCon(7,8,9)).add()); // another instance of objCon
console.log(objConIntance.add()); // same result, not affected by previous line
On gists

Ul to select (for responsive navigation)

JavaScript jQuery PHP Responsive

example.js #

$(function(){

    var select = $("select");
    $("nav a").each(function(){
        
        var $this = $(this);
        var text = $this.text();  
        var level = $this.parents("ul").length;
        var indent = '';
        if (level > 1)
        {
            indent = str_repeat("\u2013", level);
        }
        select.append('<option>'+indent + text+'</option>');
    
    
    });   



});


function str_repeat(string, times) {
  var repeatedString = "";
  while (times > 0) {
    repeatedString += string;
    times--;
  }
  return repeatedString;
}
On gists

Nested table rows (without nesting)

JavaScript jQuery

nested.css #

.parent {
    color: green;
}
.child {
    color: blue;
}
On gists

is element in view while a scrolling?

JavaScript jQuery

demo.html #

<h2>Scroll Down! &dArr;</h2>
<span></span>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
On gists

jQuery - proxy

JavaScript jQuery

jquery-proxy.js #

// immediately invoke fn
// nahrazka

 $('#myElement').click(function() {  
      (function(el){
         setTimeout(function() {
              // Problem! In this function "this" is not our element!
            el.addClass('colorme');
        }, 1000);
      })($(this)); // self executing function   
    });
On gists

form in popup

JavaScript jQuery

form-in-poup.js #

$(document).ready(function() {
  $('#myform').submit(function() {
    window.open('', 'formpopup', 'width=400,height=400,resizeable,scrollbars');
    this.target = 'formpopup';
  });
});
On gists

JS - remove diacritics fn

JavaScript Helpers-Filters-Plugins

make-url.js #

			function makeUrl(s)
			{

				var nodiac = { 'á': 'a', 'č': 'c', 'ď': 'd', 'é': 'e', 'ě': 'e', 'í': 'i', 'ň': 'n', 'ó': 'o', 'ř': 'r', 'š': 's', 'ť': 't', 'ú': 'u', 'ů': 'u', 'ý': 'y', 'ž': 'z' };
				s = s.toLowerCase();
			    var s2 = '';
			    for (var i=0; i < s.length; i++) {
			        s2 += (typeof nodiac[s.charAt(i)] != 'undefined' ? nodiac[s.charAt(i)] : s.charAt(i));
			    }

			    return s2;
			    //return s2.replace(/[^a-z0-9_]+/g, '-').replace(/^-|-$/g, '');
			}
On gists

nette - autocomplete - handle ** via JS

Nette JavaScript jQuery

nette-js-handle-autocomplete.js #

        $('#autocomplete').focus().keyup(function(event) {
                            $.getJSON("\/?do=autoComplete", {'text': $('#autocomplete').val()}, function(payload) {
                                    $('ul.autocomplete').remove();

                                    var list = $('<ul class="autocomplete"></ul>').insertAfter('#autocomplete');

                                    for (var i in payload.autoComplete) {
                                            $('<li></li>').html(payload.autoComplete[i]).appendTo(list);
                                    }
                            });
                    });
On gists

JS Caret

JavaScript Helpers-Filters-Plugins

caret.js #


jQuery.fn.extend({
insertAtCaret: function(myValue){
  return this.each(function(i) {
    if (document.selection) {
      //For browsers like Internet Explorer
      this.focus();
      sel = document.selection.createRange();
      sel.text = myValue;
      this.focus();
    }
    else if (this.selectionStart || this.selectionStart == '0') {
      //For browsers like Firefox and Webkit based
      var startPos = this.selectionStart;
      var endPos = this.selectionEnd;
      var scrollTop = this.scrollTop;
      this.value = this.value.substring(0, startPos)+myValue+this.value.substring(endPos,this.value.length);
      this.focus();
      this.selectionStart = startPos + myValue.length;
      this.selectionEnd = startPos + myValue.length;
      this.scrollTop = scrollTop;
    } else {
      this.value += myValue;
      this.focus();
    }
  })
}
});
On gists

Custom events $.trigger()

•
JavaScript jQuery

trigger.html #

<form id="msgbox" action="#" method="get">
<fieldset>
<label for="msg">your message</label>
<input id="msg" value="" />
<button>SEND</button>
</fieldset>
</form>