JavaScript Anagram Generator Alpha

Developer
Ash Blue
Size
5,260 Kb
Views
60,720
  1. JavaScript Anagram Generator Alpha Previews
  2. JavaScript Anagram Generator Alpha HTML Codes
  3. JavaScript Anagram Generator Alpha CSS Codes
  4. JavaScript Anagram Generator Alpha JS Codes

How do I make an javascript anagram generator alpha?

The anagram generator will find every single letter combination for your text. This prototype is filled with bugs but very useful for creative writers, artists, and those who want to explore all possible anagram combinations.. What is a javascript anagram generator alpha? How do you make a javascript anagram generator alpha? This script and codes were developed by Ash Blue on 18 July 2022, Monday.

JavaScript Anagram Generator Alpha Previews
IQ Test

JavaScript Anagram Generator Alpha - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>JavaScript Anagram Generator Alpha</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <h1>JavaScript Anagram Generator <small>Alpha 0.1</small></h1>
<p>Welcome to the amazing anagram generator that will find every single letter combination for your text. This prototype is filled with bugs but very useful for creative writers, artists, and those who want to explore all possible anagram combinations. Currently tested in <strong>Google Chrome</strong> only.</p>
<h2>Create Anagrams</h2>
<form class="form" id="form"> <label>Text</label> <input id="text" type="text" value="I Am Lord Voldemort" /> <label>Filter Text (only finds matches of your string)</label> <input id="search-filter" type="text" value="Tom Marvolo Ri" /> <label>Search Type</label> <select id="search-type"> <option value="random">Random</option> <option value="alphabetical">Alphabetical</option> </select> <label class="inline" for="search-spaces">Remove Spaces?</label> <input class="inline" id="search-spaces" type="checkbox" name="search-spaces" value="true" checked /> <label>Result Limit (limited to keep your browser from locking up)</label> <input id="limit" type="number" value="1000" max="1000" /> <input type="submit" />
</form>
<div id="result" class="hide"> <p class="hide">Total Results: <span id="total"></span></p> <button id="gallery-block">Block View</button> <button id="gallery-list">List View</button> <div class="result-search"> <ul id="result-list" class="gallery block"></ul> <div id="fav-wrapper"> <small>Click to add favorites</small> <ul id="fav" class="gallery list"></ul> </div> </div>
</div>
<p><small>This tool was created for <a href="http://clevercg.com">Clever Crow Games</a>' upcoming title A Dragon Named Coal</small></p> <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script> <script src="js/index.js"></script>
</body>
</html>

JavaScript Anagram Generator Alpha - Script Codes CSS Codes

html { font-family: Arial, Helvetica; color: #333;
}
h1 small { font-size: 50%;
}
.form input, .form label, .form select { display: block; margin-bottom: 6px;
}
.form input[type="submit"] { margin-top: 20px;
}
.form .inline { display: inline;
}
.hide { display: none;
}
.gallery { margin: 0; padding: 0; list-style: none;
}
.gallery li { font-size: 14px; padding: 5px 7px; background: #ccc; margin: 2px; border-radius: 5px; border: 2px solid #999; cursor: pointer;
}
.gallery li.fav { background: #0c0;
}
.gallery.block li { display: inline-block;
}
.gallery.list li { margin-bottom: 4px; padding: 4px 5px;
}
.result-search { position: relative;
}
.result-search #result-list { display: block; width: 100%; padding-right: 140px; box-sizing: border-box;
}
.result-search #fav-wrapper { width: 130px; position: fixed; top: 10px; right: 5px;
}

JavaScript Anagram Generator Alpha - Script Codes JS Codes

var $RESULT = $('#result-list');
var $TEXT = $('#text');
var $TOTAL = $('#total');
var $RESULT_CONTAINER = $('#result');
var $FORM_SEARCH = $('#form');
var $FAV = $('#fav');
var $SEARCH_MAX = $('#limit');
var $SEARCH_TYPE = $('#search-type');
var $SEARCH_SPACES = $('#search-spaces');
var $SEARCH_FILTER = $('#search-filter');
var _used; // Used result combinations
var _valid;
var _permArr;
var _usedChars;
var _anagrams;
var _favorites = {};
var _searchLimit;
var _searchType = $SEARCH_TYPE.val();
$FORM_SEARCH.submit(function (e) { e.preventDefault(); var text = $TEXT.val().toLowerCase(); _permArr = [], _usedChars = []; $RESULT.html(''); _searchLimit = parseInt($SEARCH_MAX.val(), 10); _searchType = $SEARCH_TYPE.val(); if ($SEARCH_SPACES.is(':checked')) text = text.replace(/ /g, ''); if (_searchType === 'random') { _anagrams = mixString(text); } else if (_searchType === 'alphabetical') { // Split text into text and prefix var filter = getFilter(text); for (var i = 0, len = filter.length; i < len; i++) { text = text.replace(filter[i], ''); } _anagrams = permute(text.split(''), filter); } for (var i = 0, len = _anagrams.length; i < len; i++) { addAnagram(_anagrams[i]); } updateTotal(_anagrams.length); $RESULT_CONTAINER.show();
});
function getFilter (text) { var test = text; if ($SEARCH_SPACES.is(':checked')) { var result = $SEARCH_FILTER.val().replace(/ /g, '').toLowerCase(); } else { var result = $SEARCH_FILTER.val().toLowerCase(); } for (var i = 0, len = result.length; i < len; i++) { // Check if the letter is present if (test.indexOf(result[i]) !== -1) { test = test.replace(result[i]); } else { result = ''; break; } // If so remove and update test // Otherwise test failed and result = '' } // @TODO Verify each letter is present //console.log(text, result); //if (text.indexOf(result) === -1) result = ''; return result;
}
// @TODO Kind of a hack, could be written much better
function mixString (text) { var blacklist = {}, // Previously hit items results = [], test, filter = getFilter(text); // Successful item matches // Strip the filter down to make sure it lines up with the text // For each letter in filter loop through the text and remove it for (var i = 0, len = filter.length; i < len; i++) { text = text.replace(filter[i], ''); } text = text.split(''); // Loop through and try combinations until result limit is hit for (var i = 0, len = _searchLimit; i < len; i++) { test = shuffle(text).join(''); if (!blacklist[test]) { blacklist[test] = true; results.push(filter + test); } } return results;
}
var fav = { add: function (text) { if (!_favorites[text]) { _favorites[text] = true; $('<li class="fav" id="fav-' + text + '">' + text + '</li>').click(function () { fav.remove($(this).html()); }).appendTo($FAV); } }, remove: function (text) { if (_favorites[text]) { _favorites[text] = false; $('#fav-' + text).detach(); } }
};
function addAnagram(text) { $('<li>' + text + '</li>').click(function () { $(this).addClass('fav'); fav.add(text); }).appendTo($RESULT);
}
function updateTotal (num) { $TOTAL.html(num); _anagrams.length > 0 ? $TOTAL.parent().show() : $TOTAL.parent().hide();
}
// @src http://stackoverflow.com/questions/9960908/permutations-in-javascript
function permute (input, prefix) { var i, ch; // Check if our max limit has been reached if (_permArr.length >= _searchLimit) return; // Loop through every letter for (i = 0; i < input.length; i++) { // Splice the character at the index we need ch = input.splice(i, 1)[0]; // Push the character into the used category _usedChars.push(ch); // We've run out of characters, push this combination into storage if (input.length == 0) { _permArr.push(prefix + _usedChars.slice().join('')); } // Recursively run the input without the characters we've removed permute(input, prefix); // Inject and shift our stored letter at the appropriate index, this is how arrange for all possible combinations input.splice(i, 0, ch); // Remove the last used character as we've exhausted its potential _usedChars.pop(); } return _permArr.sort();
};
function shuffle (array) { var currentIndex = array.length, temporaryValue, randomIndex; // While there remain elements to shuffle... while (0 !== currentIndex) { // Pick a remaining element... randomIndex = Math.floor(Math.random() * currentIndex); currentIndex -= 1; // And swap it with the current element. temporaryValue = array[currentIndex]; array[currentIndex] = array[randomIndex]; array[randomIndex] = temporaryValue; } return array;
}
$('#warning-btn').click(function () { $(this).hide(); $('#warning').hide();
});
$('#gallery-block').click(function () { $RESULT.addClass('block').removeClass('list'); });
$('#gallery-list').click(function () { $RESULT.addClass('list').removeClass('block'); });
$FORM_SEARCH.submit();
JavaScript Anagram Generator Alpha - Script Codes
JavaScript Anagram Generator Alpha - Script Codes
Home Page Home
Developer Ash Blue
Username ashblue
Uploaded July 18, 2022
Rating 3
Size 5,260 Kb
Views 60,720
Do you need developer help for JavaScript Anagram Generator Alpha?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Ash Blue (ashblue) Script Codes
Name
Responsive Gallery Grid Layout
Overflowing Gallery
CSS Sprite Animation
JavaScript Anagram Algorithm Explanation
Pure CSS Responsive Modal
Flow Chart Prototype
CSS Zoom Icon
HTML5 Editable Table
Fancy Image Zoom
HTML5 Canvas Progress Bar
Create amazing love letters with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!