Skip to content

Instantly share code, notes, and snippets.

View tlimpanont's full-sized avatar
🏠
Working from home

Theuy Limpanont tlimpanont

🏠
Working from home
9 followers · 5 following
View GitHub Profile
@tlimpanont
tlimpanont / before-icon.css
Last active December 14, 2015 14:08
How to use :before to show icon in thumbnail list
div[data-icon='facebook']:before {
content: url(http://lorempixel.com/output/nightlife-q-c-128-128-9.jpg);
display: inline-block;
vertical-align: bottom;
}
div[data-icon='facebook'] .block {
display: inline-block;
margin-left: 10px;
width: 500px;
}
@tlimpanont
tlimpanont / example.html
Last active December 17, 2015 18:59
display element depend on mousmove X cordinate.
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div class="head_images" style="width: 891px;">
<img src="images/bryan_vink_1.jpg"/>
<img src="images/bryan_vink_2.jpg"/>
@tlimpanont
tlimpanont / MapArea.js
Last active December 19, 2015 11:29
var MapArea = function() {
};
//pointX, pointY, radius
MapArea.prototype.circle = function(circleCords) {
var cx = circleCords[0];
var cy = circleCords[1];
var r = circleCords[2];
@tlimpanont
tlimpanont / index.html
Created August 15, 2013 09:26
Fluid grid container
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Nieuw document</title>
<script src="jquery-1.10.2.js"></script>
<script src="jquery-ui-1.10.3.custom.min.js"></script>
<script src="underscore-min.js"></script>
<script src="backbone-min.js"></script>
@tlimpanont
tlimpanont / ArrayIterator.js
Last active February 15, 2021 20:38
Provide an interface for navigating through array items.
(function() {
/**
* Provide an interface for navigating through array items.
* @constructor
* @class
* @classdesc
* @param {Array} items Any datatype is acceptable in Array form.
* @param {Boolean} infinite If set to true: we can navigate from last to first index like an infinite loop. If it set to false infinite loop is impossible.
*/
@tlimpanont
tlimpanont / deployd-utils.js
Last active December 31, 2015 15:19
Utility functions for creating query parameters URL for Deployd.com RESTful API mongodb
function createQueryString(query) {
var parts = [];
for (var k in query) {
if (query.hasOwnProperty(k)) {
parts.push(encodeURIComponent(k) + "=" + encodeURIComponent(query[k]));
}
}
return parts.join('&');
}
@tlimpanont
tlimpanont / dabblet.css
Last active January 1, 2016 08:19
Minimal setup for Flip3D CSS3 Animation
.flip3D {
width:240px;
height:200px;
float:left;
}
.flip3D > * {
width:240px;
height:200px;
position:absolute;
@tlimpanont
tlimpanont / GridManager.js
Last active January 1, 2016 10:38
Class for creating simple 2-dimensional grid with columns en rows. It provides query methods for searching a specific cell, row or column. jasmine test specs are also included.
/* required
underscore : http://underscorejs.org/underscore-min.js
*/
(function(window, _) {
/**
* Class for creating simple 2-dimensional grid with columns en rows. It provides query methods for searching a specific cell, row or column.
* @param {Object} options Setting columns and rows
*/
GridManager = function(options) {
@tlimpanont
tlimpanont / TEIMap.js
Last active January 4, 2016 08:49
TEIViewer Development Source code preview
(function(OpenLayers, NA, jQuery) {
/**
* TEIMap draws NA.TranscriptionHotspotLayer and NA.TranscriptionScanLayer on the map surface. The map settings (resolution, view bounds, max zoomlevel) depend on the scan graphic width and height.
* @constructor
* @augments OpenLayers.Map
*/
NA.TEIMap = OpenLayers.Class(OpenLayers.Map, {
/**
@tlimpanont
tlimpanont / eyecon-bootstrap-datepicker.js
Last active August 29, 2015 13:56
angular js modules for eyecon boostrap datepicker as a directive
// plugin src: http://www.eyecon.ro/bootstrap-datepicker/
(function(jQuery, _) {
angular.module('eyecon-bootstrap-datepicker', [])
.directive("eyeconBootstrapDatepicker", function() {
return {
replace: true,
scope: {
format : "@",
availableDates : "=",
selectedDate: "=",