Cam camAtGitHub

Basic How-to

to can have multiple lines, every one of them will be converted to a result URL. If # is the first character in a line then it marks the URL as hi-res.

If # is not the first then it may be followed by space separated strings closed by a # sign again. This will generate URLs for every variant. E.g. some.url/path/full-image.#jpg png gif#, which will generate three URLs, testing them in order.

Also, at the end of the line you can add #{media_extension} eg: #jpg, so the the extension will recognize it as video or audio, instead of image (default). E.g., https://some.url/path/without/extension?id=13#mp4

Javascript RegExp is used (obviously). In the code it's simply RegExp('yourRegexInput'). The conversion happens with a simple URL.replace(yourRegex, rule.to).

	// Modernized version of the MRI bookmarklet
	// To use, host the mri.js file somewhere then create a bookmarklet with URL of:
	// javascript:function%20loadScript(scriptURL)%20{%20var%20scriptElem%20=%20document.createElement('SCRIPT');%20scriptElem.setAttribute('language',%20'JavaScript');%20scriptElem.setAttribute('src',%20scriptURL);%20document.body.appendChild(scriptElem);}loadScript('http://yoursite.com/mri.js');
	// Then browse to a page and press your bookmarklet

	// You enter a CSS selector and MRI highlights all matching elements on the page with colored overlays
	// Click any element to get suggested CSS selectors for targeting that specific element
	// Shows element boundaries, margins, padding, and borders with semi-transparent colored overlays
	// Automatically suggests various selector combinations (tag, ID, class, descendant, child selectors) for clicked elements

	// Modern XRAY - Web Development Tool
	// Modernized version of the original XRAY bookmarklet
	// To use host the xray.js file somewhere then create a bookmarklet with URL of:
	// javascript:function%20loadScript(scriptURL)%20{%20var%20scriptElem%20=%20document.createElement('SCRIPT');%20scriptElem.setAttribute('language',%20'JavaScript');%20scriptElem.setAttribute('src',%20scriptURL);%20document.body.appendChild(scriptElem);}loadScript('http://yoursite.com/xray.js');
	// Then browse to a page and press your bookmarklet

	// - Element Box Model Visualization: Click any element to see its margins, padding, borders, and content area highlighted with different colored overlays
	// - CSS Property Inspector: Shows a detailed HUD with computed CSS values including dimensions, positioning, margins, padding, border widths, and inheritance hierarchy
	// - Visual Debugging: Helps developers understand how CSS properties affect element layout and spacing
	// - Keyboard Navigation: Use arrow keys to navigate between parent, chil

	<!DOCTYPE html>
	<html>
	<head>
	<title>Audio Visualizer</title>
	</head>
	<body>
	<svg preserveAspectRatio="none" id="visualizer" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
	<defs>
	<mask id="mask">
	<g id="maskGroup"></g>