Skip to content

Instantly share code, notes, and snippets.

View lutsen's full-sized avatar

Lútsen Stellingwerff lutsen

18 followers · 48 following
View GitHub Profile
@lutsen
lutsen / index.html
Created March 11, 2014 14:36
Make X-editable work with List.js in a Booststrap 3 styled table. The problem: X-editable will mess up the table layout when used on a <td> element. But List.js won't work if the table data is in another element inside the <td> element. The solution: create a <span> element every time the editable <td> is clicked, and remove it every time the X-…
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>X-editable and List.js Datagrid</title>
<!-- Bootstrap -->
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
@lutsen
lutsen / swapmainimg.js
Created April 13, 2014 11:52
Swap a "main" image by hovering over a thumb image.
// Swap a "main" image by hovering over a thumb image.
// They both need to have the same scr, except for the "template" part.
$(function () {
$( '.thumbimg' ).each( function (i) {
$( this ).on({
mouseenter: function() {
$('#mainimg').attr(
'src',
@lutsen
lutsen / Threaded.php
Last active August 29, 2015 14:04
Make a Threaded multi level array from a two level array with parent id's. For example comments or a page tree. The class returns an array. Original code from http://www.jongales.com/blog/2009/01/27/php-class-for-threaded-comments/
<?php
// From http://www.jongales.com/blog/2009/01/27/php-class-for-threaded-comments/
// This modified code now returns an array.
class Threaded {
public $parents = array();
public $children = array();
@lutsen
lutsen / togglemenu.js
Last active August 29, 2015 14:06
Hide a menu on the top of the page when scrolling down, and show it when scrolling up. Check out the example here: http://codepen.io/anon/pen/dPGggg
var menu_height = 80;
var menu_visible = true;
var old_scroll = $(window).scrollTop();
function checkMenu() {
new_scroll = $(window).scrollTop();
if (old_scroll < new_scroll && new_scroll > 0) {
// Scroll down
if (menu_visible == true) {
toggleMenu();
@lutsen
lutsen / ImageController.js
Created January 20, 2015 09:00
Serving files from Modulus Cloud Storage with Sails
module.exports = {
get: function (req, res) {
res.sendfile( sails.config.uploaddir + req.param('dir') + '/' + req.param('file') );
},
// List the app-storage directory
listdir: function (req, res) {
var fs = require('fs');
return res.json( fs.readdirSync(sails.config.uploaddir) );
@lutsen
lutsen / ngconfirmclick.js
Last active August 29, 2015 14:14
An Angular directive to show a javascipt confirmation message when the user clicks a page element. The ng-confirm-click attribute contains the text in the confirmation window. The confirmed-click attribute contains the actual ation that is executed if the user confirms.
// http://stackoverflow.com/questions/18313576/confirmation-dialog-on-ng-click-angularjs
// http://plnkr.co/edit/YWr6o2?p=preview
angular.module('yourApp')
.directive('ngConfirmClick', function () {
return {
link: function (scope, element, attr) {
var msg = attr.ngConfirmClick || "Are you sure?";
var clickAction = attr.confirmedClick;
element.bind('click',function (event) {
@lutsen
lutsen / removedirectory.php
Created April 19, 2015 13:12
Remove a directory and it's contents.
<?php
function removeDir($path) {
// Add trailing slash to $path if one is not there
if (substr($path, -1, 1) != "/") {
$path .= "/";
}
$normal_files = glob($path . "*");
$hidden_files = glob($path . "\.?*");
@lutsen
lutsen / getpath.php
Created April 19, 2015 13:09
Get the absolute path of a file in PHP
<?php echo dirname(__FILE__); ?>
@lutsen
lutsen / toggle_on_click.js
Last active December 27, 2015 06:49
This jQuery based script shows an element, and hides it again by clicking anywhere in the <body>You can use it to show popovers or modals for example.In the example, if you click on any element with the class "info", a child element with the class "info-tip" is shown.
// Shows an element, and hides it on clicking anywhere in the <body>
function toggleOnClick(target) {
// Show
$(target).fadeIn("fast", function() {
$('body').on('click', function() {
// Hide on click outside
$(target).fadeOut("fast");
});
});
}
@lutsen
lutsen / scaffolding.less
Last active December 27, 2015 06:49
My take on a 12 colum grid in css. The columns in this grid have a percentual width, but the gutter has a pixel width. This way the grid should work in a container of any width. It uses CSS calc().
// SCAFFOLDING
// Define gutter width
@gutter: 20px;
// Some mixins
// For clearing floats like a boss h5bp.com/q
.clearfix {
*zoom: 1;