juanbrujo’s gists

juanbrujo / Lavalamp---CSS3.markdown

Created February 11, 2014 14:51

A Pen by Jorge Epuñan.

Lavalamp - CSS3

Lavalamp navigation menu with CSS3

juanbrujo / GetImagefromTwitter.js

Created March 12, 2014 14:27

Get Image from Twitter: bookmarklet that get's the image shown on certain timeline within Twitter

	// The Code:
	var url = $('.cards-media-container .media').attr('data-url');
	if(url){
	window.open(url,'_self');
	} else {
	alert('There\'s no photo.');
	}

	// The bookmarklet:
	javascript:(function(e,a,g,h,f,c,b,d)%7Bif(!(f%3De.jQuery)%7C%7Cg>f.fn.jquery%7C%7Ch(f))%7Bc%3Da.createElement("script")%3Bc.type%3D"text/javascript"%3Bc.src%3D"http://ajax.googleapis.com/ajax/libs/jquery/"%2Bg%2B"/jquery.min.js"%3Bc.onload%3Dc.onreadystatechange%3Dfunction()%7Bif(!b%26%26(!(d%3Dthis.readyState)%7C%7Cd%3D%3D"loaded"%7C%7Cd%3D%3D"complete"))%7Bh((f%3De.jQuery).noConflict(1),b%3D1)%3Bf(c).remove()%7D%7D%3Ba.documentElement.childNodes%5B0%5D.appendChild(c)%7D%7D)(window,document,"1.6.2",function(%24,L)%7Bvar url %3D %24(%27.cards-media-container .media%27).attr(%27data-url%27)%3Bif(url)%7Bwindow.open(url,%27_self%27)%3B%7D else %7Balert(%27There%5C%27s no photo.%27)%3B%7D%7D)%3B

juanbrujo / GetImagefromInstagram.js

Last active August 29, 2015 13:57

Get Image from Instagram: bookmarklet that get's the image shown on certain URL within Instagram

	// Code
	var url = $('.Item .iMedia .Image').attr('src');
	if(url){
	window.open(url,'_self');
	} else {
	alert('There\'s no photo.');
	}

	// The Bookmarklet
	javascript:(function(e,a,g,h,f,c,b,d)%7Bif(!(f%3De.jQuery)%7C%7Cg>f.fn.jquery%7C%7Ch(f))%7Bc%3Da.createElement("script")%3Bc.type%3D"text/javascript"%3Bc.src%3D"http://ajax.googleapis.com/ajax/libs/jquery/"%2Bg%2B"/jquery.min.js"%3Bc.onload%3Dc.onreadystatechange%3Dfunction()%7Bif(!b%26%26(!(d%3Dthis.readyState)%7C%7Cd%3D%3D"loaded"%7C%7Cd%3D%3D"complete"))%7Bh((f%3De.jQuery).noConflict(1),b%3D1)%3Bf(c).remove()%7D%7D%3Ba.documentElement.childNodes%5B0%5D.appendChild(c)%7D%7D)(window,document,"1.6.2",function(%24,L)%7Bvar url %3D %24(%27.Item .iMedia .Image%27).attr(%27src%27)%3Bif(url)%7Bwindow.open(url,%27_self%27)%3B%7D else %7Balert(%27There%5C%27s no photo.%27)%3B%7D%7D)%3B

juanbrujo / jquery.findLinkMakeLink.js

Created March 26, 2014 18:09

Find URL's within an element and wrap them

	// THE FUNCTION
	(function($) {
	$.fn.findLinkMakeLink = function() {
	// Test a text node's contents for URLs and split and rebuild it with an anchor
	var testAndTag = function(el) {
	// Test for URLs along whitespace and punctuation boundaries
	var m = el.nodeValue.match(/(https?:\/\/.*?)[.!?;,]?(\s+\|"\|$)/);
	// If we've found a valid URL
	if (m) {
	// Clone the text node to hold the "tail end" of the split node

juanbrujo / FB-resize-tab

Created April 3, 2014 21:04

This small script for Facebook tabs initializes FB Connect API and set's it's size acording to the iframe's width and height.

	$.ajaxSetup({ cache: true });
	$.getScript('//connect.facebook.net/es_LA/all.js', function(){
	FB.init({
	appId: 'appid',
	});
	increaseIframeSize(w,h);
	});

	function increaseIframeSize(w,h){
	var obj = new Object;

juanbrujo / less-mediaqueries-mixin.less

Last active October 19, 2019 17:17

LESS mediaqueries mixin

	// Declare your mediaqueries breakpoints
	@mobile: ~"only screen and (max-width: 529px)";
	@tablet: ~"only screen and (min-width: 530px) and (max-width: 949px)";
	@desktop: ~"only screen and (min-width: 950px) and (max-width: 1128px)";
	@desktop-xl: ~"only screen and (min-width: 1129px)";

	// Use them easily in your CSS declaration:
	element {
	property: value;

juanbrujo / loop.jade

Created July 1, 2014 14:11

How to loop in jade-lang

	- for (var x = 0; x < 6; x++)
	input(type="checkbox")

juanbrujo / makeRandom.less

Last active May 27, 2017 09:56

Mixin to generate random number with LESS

	/* Mixin to generate random number
	int should be 0 or 1, 1 being to make it an integer
	*/
	.makeRandom(@min: 0, @max: @min+1, @int: 0) {
	.checkInt() {
	@getNum: `Math.random() * (@{max} - @{min} + @{int})`;
	@base: unit(`@{int} == 1 ? Math.floor(@{getNum}) : @{getNum}`);
	}
	.checkInt();
	@randNum: @base + @min;

juanbrujo / querySelectorAll-loop.js

Last active April 27, 2025 00:01

looping through querySelectorAll elements

	var elem = document.querySelectorAll(element)

	// IE8+
	if (elem.length) {
	for (var i = 0; i < elem.length; i++) {
	elem[i] // iterate over this
	}
	}

	// IE9+

juanbrujo / randomColor.less

Created July 9, 2014 02:46

Mixin to generate random color in LESS

	.randomColor(){
	@randomColor: `Math.floor(Math.random()*16777215).toString(16)`;
	@colorHex: e(@randomColor);
	@color: ~"#@{colorHex}";
	}

	// USE

	body {
	.randomColor();