Gists
On gists
PHP
DateTime
DateTimeTest.php #
<?php
require_once __DIR__ . '/DateTime.php';
class DateTimeTest extends \PHPUnit_Framework_TestCase
{
public function providerSetDate()
{
$now = new \MyNamespace\DateTime();
return array(
array('2014-02-28', 31, 2),
array('2014-02-01', 1, 2),
array('2014-06-30', 31, 6),
array($now->format('Y-m-d'), null, null, null),
);
}
/**
* @test
* @dataProvider providerSetDate
*/
public function setDate($result, $day, $month, $year = '2014')
{
$dateTime = new \MyNamespace\DateTime();
$dateTime->setDate($year, $month, $day);
$this->assertEquals($result, $dateTime->format('Y-m-d'));
}
public function providerModify()
{
return array(
array('2014-02-28', '0 day 0 month 0 year'),
array('2014-01-28', 'next month'),
array('2014-01-28', 'next months'),
array('2014-01-02', '+1 month', '2014-02-02'),
array('2014-01-31', '1 months'),
array('2014-03-31', '-1 month'),
array('2012-02-29', '24 month'),
array('2016-02-29', '-24 months'),
array('2014-02-27', 'next day'),
array('2014-02-27', '1 day'),
array('2014-02-27', '+1 day'),
array('2013-02-01', '-1 day next month next year'),
array('2013-01-27', '1 day 1 month 1 year'),
array('2015-04-01', '-1 day -1 month -1 year'),
array('2011-12-26', '2 day 2 month 2 year'),
array('2011-12-31', '2 month 2 year'),
);
}
/**
* @test
* @dataProvider providerModify
*/
public function modify($date, $shift, $result = '2014-02-28')
{
$dateTime = new \MyNamespace\DateTime($date);
$dateTime->modify($shift);
$this->assertEquals($result, $dateTime->format('Y-m-d'));
}
/**
* @test
* @expectedException PHPUnit_Framework_Error_Warning
*/
public function modifyError()
{
$dateTime = new \MyNamespace\DateTime();
$dateTime->modify('2 month sdfg year');
}
}
On gists
Quantity queries
•
CSS
CSS trick
examples.css #
/*
@see: https://www.hongkiat.com/blog/quantity-queries-css-quantity-aware/
*/
/* "At-least" query */
ul li:nth-last-child(n+5),
ul li:nth-last-child(n+5) ~ li {
background-color: orange;
}
/* "At-most" query */
ul li:nth-last-child(-n+5):first-child,
ul li:nth-last-child(-n+5):first-child ~ li {
background-color: orange;
}
/* "Between" query */
ul li:nth-last-child(n+5):nth-last-child(-n+6):first-child,
ul li:nth-last-child(n+5):nth-last-child(-n+6):first-child ~ li {
background-color: orange;
}
/* OR */
/* https://quantityqueries.com/ */
/* at-least 2 */
li:nth-last-child(n+2), li:nth-last-child(n+2) ~ li { }
/* at-most 2 */
li:nth-last-child(-n+2):first-child, li:nth-last-child(-n+2):first-child ~ li { }
/* at least / at most 2 - 4 */
li:nth-last-child(n+2):nth-last-child(-n+4):first-child, li:nth-last-child(n+2):nth-last-child(-n+4):first-child ~ li { }
On gists
JavaScript
JSON
local/session storage - get/set object wrapper
get-setObject.js #
Storage.prototype.setObject = function(key, value) {
this.setItem(key, JSON.stringify(value));
}
Storage.prototype.getObject = function(key) {
var value = this.getItem(key);
return value && JSON.parse(value);
}
On gists
Closures in JavaScript
•
JavaScript
in-loop.js #
// https://diskuse.jakpsatweb.cz/?action=vthread&forum=8&topic=103393
for(var i=0; stylNameArray.length>i; i++) {
(function(){
var n = i;
neco[i].onclick = function() {
zmenaStylu("styl_pozadi_oken_0" + n);
}
})();
}
for(var i=0; stylNameArray.length>i; i++) {
(function(i){
neco[i].onclick = function() {
zmenaStylu("styl_pozadi_oken_0" + i);
}
})(i);
}
On gists
JavaScript
jQuery.stringify() utility
jQuery.stringify.js #
/**
* converted stringify() to jQuery plugin.
* serializes a simple object to a JSON formatted string.
* Note: stringify() is different from jQuery.serialize() which URLEncodes form elements
* UPDATES:
* Added a fix to skip over Object.prototype members added by the prototype.js library
* USAGE:
* jQuery.ajax({
* data : {serialized_object : jQuery.stringify (JSON_Object)},
* success : function (data) {
*
* }
* });
*
* CREDITS: http://blogs.sitepointstatic.com/examples/tech/json-serialization/json-serialization.js
*/
jQuery.extend({
stringify : function stringify(obj) {
var t = typeof (obj);
if (t != "object" || obj === null) {
// simple data type
if (t == "string") obj = '"' + obj + '"';
return String(obj);
} else {
// recurse array or object
var n, v, json = [], arr = (obj && obj.constructor == Array);
for (n in obj) {
v = obj[n];
t = typeof(v);
if (obj.hasOwnProperty(n)) {
if (t == "string") v = '"' + v + '"'; else if (t == "object" && v !== null) v = jQuery.stringify(v);
json.push((arr ? "" : '"' + n + '":') + String(v));
}
}
return (arr ? "[" : "{") + String(json) + (arr ? "]" : "}");
}
}
});
On gists
JavaScript
jQuery
Events - target/currentTarget/delegateTarget
example.html #
// CLICK on button
<div class="box">
<button>Button</button>
</div>
$( "body" ).on( "click", ".box", function(e) {
e.delegateTarget; // body
e.currentTarget; // .box
e.target; // button
});
On gists
JavaScript
jQuery
PubSub events
2.html #
<!doctype html>
<html>
<head>
<meta charset=utf-8>
<title>Custom Events</title>
</head>
<body>
<h1>Hi There</h1>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>
// PubSub
(function( $ ) {
var o = $( {} );
$.each({
trigger: 'publish',
on: 'subscribe',
off: 'unsubscribe'
}, function( key, val ) {
jQuery[val] = function() {
o[key].apply( o, arguments );
};
});
})( jQuery );
$.getJSON('http://search.twitter.com/search.json?q=dogs&callback=?', function( results) {
$.publish( 'twitter/results', results );
});
// ...
$.subscribe( 'twitter/results', function( e, results ) {
$('body').html(
$.map( results.results, function( obj, index) {
return '<li>' + obj.text + '</li>';
}).join('')
);
});
</script>
</body>
</html>
On gists
JavaScript
jQuery
jQuery-plugins
Twitter plugin by JW
twitter.js #
// Utility
if ( typeof Object.create !== 'function' ) {
Object.create = function( obj ) {
function F() {};
F.prototype = obj;
return new F();
};
}
(function( $, window, document, undefined ) {
var Twitter = {
init: function( options, elem ) {
var self = this;
self.elem = elem;
self.$elem = $( elem );
self.url = 'https://api.twitter.com/1.1/search/tweets.json';
self.search = ( typeof options === 'string' )
? options
: options.search;
self.options = $.extend( {}, $.fn.queryTwitter.options, options );
self.refresh( 1 );
},
refresh: function( length ) {
var self = this;
setTimeout(function() {
self.fetch().done(function( results ) {
results = self.limit( results.results, self.options.limit );
self.buildFrag( results );
self.display();
if ( typeof self.options.onComplete === 'function' ) {
self.options.onComplete.apply( self.elem, arguments );
}
if ( self.options.refresh ) {
self.refresh();
}
});
}, length || self.options.refresh );
},
fetch: function() {
return $.ajax({
url: this.url,
data: { q: this.search },
dataType: 'jsonp'
});
},
buildFrag: function( results ) {
var self = this;
self.tweets = $.map( results, function( obj, i) {
return $( self.options.wrapEachWith ).append ( obj.text )[0];
});
},
display: function() {
var self = this;
if ( self.options.transition === 'none' || !self.options.transition ) {
self.$elem.html( self.tweets ); // that's available??
} else {
self.$elem[ self.options.transition ]( 500, function() {
$(this).html( self.tweets )[ self.options.transition ]( 500 );
});
}
},
limit: function( obj, count ) {
return obj.slice( 0, count );
}
};
$.fn.queryTwitter = function( options ) {
return this.each(function() {
var twitter = Object.create( Twitter );
twitter.init( options, this );
$.data( this, 'queryTwitter', twitter );
});
};
$.fn.queryTwitter.options = {
search: '@tutspremium',
wrapEachWith: '<li></li>',
limit: 10,
refresh: null,
onComplete: null,
transition: 'fadeToggle'
};
})( jQuery, window, document );
On gists
JavaScript
jQuery
Twitter object - @Jeffrey Wawy
index.html #
<!doctype html>
<html>
<head>
<meta charset=utf-8>
<title>Twitter</title>
<style>
body { width: 600px; margin: auto; }
ul { list-style: none; }
li { padding-bottom: 1em; }
img { float: left; padding-right: 1em; }
a { text-decoration: none; color: #333; }
</style>
</head>
<body>
<ul id="biebster-tweets">
<script id="tweets-template" type="text/x-handlebars-template">
{{#each this}}
<li>
<img src="{{thumb}}" alt="{{author}}">
<p><a href="{{url}}">{{tweet}}</a></p>
</li>
{{/each}}
</script>
</ul>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="http://cloud.github.com/downloads/wycats/handlebars.js/handlebars-1.0.0.beta.6.js"></script>
<script>
(function() {
var Twitter = {
init: function( config ) {
this.url = 'http://search.twitter.com/search.json?q=' + config.query + '&callback=?';
this.template = config.template;
this.container = config.container;
this.fetch();
},
attachTemplate: function() {
var template = Handlebars.compile( this.template );
this.container.append( template( this.tweets ) );
},
fetch: function() {
var self = this;
$.getJSON( this.url, function( data ) {
self.tweets = $.map( data.results, function( tweet ) {
return {
author: tweet.from_user,
tweet: tweet.text,
thumb: tweet.profile_image_url,
url: 'http://twitter.com/' + tweet.from_user + '/status/' + tweet.id_str
};
});
// For future lessons, research $.deferred, viewers. :)
self.attachTemplate();
});
}
};
Twitter.init({
template: $('#tweets-template').html(),
container: $('#biebster-tweets'),
query: 'Justin Bieber'
});
})();
</script>
</body>
</html>
On gists
JavaScript
jQuery
Jquery plugin with events
demo.html #
What about using triggers? Does anyone know any drawback using them? The benefit is that all internal variables are accessible via the triggers, and the code is very simple.
See on jsfiddle.
Example usage
<div id="mydiv">This is the message container...</div>
<script>
var mp = $("#mydiv").messagePlugin();
// the plugin returns the element it is called on
mp.trigger("messagePlugin.saySomething", "hello");
// so defining the mp variable is not needed...
$("#mydiv").trigger("messagePlugin.repeatLastMessage");
</script>