JSFiddle - React, Tailwind, and code Playground
by Alexander Branchugov
HTML
<script src="https://code.angularjs.org/1.6.6/angular.js"></script>
JavaScript
var u = new Url('/p/admin/git-sync{/revision}{?preview}');
console.log(u);
console.log(u.stringify({revision: 124, preview:null}));
function Url ( pattern ) {
if ( !pattern ) return;
this.__proto__ = urlPrototype();
this.pattern = pattern;
this.parse();
}
function urlPrototype () {
var paramsRegEx = {
path: /\{\/[^\}]*\}/g,
search: /\{\?[^\}]*\}/g
},
paramNameRegEx = /[^\{(\/|\?)].*[^\}]/;
return {
parse: parsePrototype,
stringify: stringifyPrototype
}
function parsePrototype () {
if ( !this.pattern ) return;
this.params = getParams( this.pattern );
}
function getParams ( pattern ) {
var params = {path: [], search: []};
angular.forEach( paramsRegEx, function ( paramRegEx, paramRegExName ) {
if ( !hasMatches( pattern, paramRegEx ) ) return;
params[paramRegExName] = getMatches( pattern, paramRegEx ).reduce( function ( params, paramPattern ) {
params.push( getParam( paramPattern ) );
return params;
}, [] );
} );
return params;
}
function getMatches ( pattern, regEx ) {
return pattern.match( regEx );
}
function hasMatches ( pattern, regEx ) {
return !!getMatches ( pattern, regEx );
}
function getParam ( paramPattern ) {
return paramPattern.match( paramNameRegEx )[0];
}
function stringifyPrototype ( params ) {
if ( !params ) params = {};
var url = this.pattern;
angular.forEach( this.params, function ( params, paramsType ) {
url = params.reduce( function ( url, param ) {
var paramPattern = getParamPattern( param, paramsType == 'search' ),
paramValue = getParamValue( url, param, params[param], paramsType == 'search' );
console.log(paramPattern);
return...