Multilanguage urlpath change with object using javascript

Question

I would like to know how to change urlpath based on multiple languages.

If the url is www.xyz.com/en/all-services-from-mal-to-sin/details?amount=1000&scy=SGD and if the lang is en, then replace the url with matching object key and if the lang is zh then replace the url with the matching object value.

how to replace the urltext with an object using javavscript

// for en will receive obj as
{
    "transfer-services": "transfer-services",
    "about-info": "zhi-zhu",
    "contact": "zhi-phi",
    "all-services-from": "all-services-from",
    "to": "to",
    "sin": "sin",
    "mal": "zmal"
};
// for zh will receive obj as
{
    "transfer-services": "xi-hou-zhi-n",
    "about-info": "zhi-zhu",
    "contact": "zhi-phi",
    "all-services-from": "hui-zhi-phi-tho",
    "to": "zhi",
    "sin": "stin",
    "mal": "zmal"
};
// for hi will receive obj as
{
   "transfer-services": "sabhee sevaen",
    "about-info": "baare-mein",
    "contact": "sampark-karen",
    "all-services-from": "sabhee-sevak",
    "to": "se",
    "sin": "sg",
    "mal": "ml"
}

// will receive above obj base on curr_lang and prev_lang
function translationUrl(langvalue) {
  var result = $.ajax({
    url: "/" + langvalue,
    method: "get",
    async: false,
    dataType: 'json',
    data: {
      urllang: langvalue
    },
    success: function (data) {
     return data;
    }
  }).responseText;
  return JSON.parse(result).language.urltext;
}

 var prevObj = translationUrl(prev_lang);
 var currentObj = translationUrl(curr_lang);

 function swapObj(val) {
      const lang = Object.keys(val).reduce((a, c) => (
        { ...a, [val[c]]: c }
      ), {});
      return lang;
    }

    function transformURL(url, curr_lang, prev_lang, prevObj , currObj) { // convert prev to curr lang
        let [base, lang, segment, ...rest] = url.split('/');
        const obj = lang === prev_lang ? currObj: swapObj(currObj);
        Object.keys(obj).forEach(key => {
            segment = segment.replace(key, obj[key]);
        });

        return [base, lang, segment, ...rest].join('/');
    }

    console.log(transformURL('www.xyz.com/zh/all-services-from-mal-to-sin/details?amount=1000&scy=SGD'),"zh", "hi",prevObj , currObj );

Expected outputs:

var prev_lang ="en";
var curr_lang = "hi";
if url is 
www.xyz.com/en/all-services-from-mal-to-sin?amount=1000&scy=SGD 
=> output :www.xyz.com/hi/sabhee-sevak-ml-to-sg?amount=1000&scy=SGD

var prev_lang ="hi";
var curr_lang = "zh";
if url is 
www.xyz.com/hi/sabhee-sevak-ml-to-sg?amount=1000&scy=SGD
=> output :www.xyz.com/zh/hui-zhi-phi-tho-zmal-zhi-stin?amount=1000&scy=SG

var prev_lang ="hi";
var curr_lang = "en";
if url is 
www.xyz.com/hi/sabhee-sevak-ml-to-sg?amount=1000&scy=SGD
=> output :www.xyz.com/en/all-services-from-mal-to-sin?amount=1000&scy=SGD

@JonathanLam thanks for reply, it works when the url is www.xyz.com/zh/all-services-from-mal-to-sin/details?amount=1000&scy=SGD to www.xyz.com/hi/sabhee-sevak-ml-to-sg?amount=1000&scy=SGD but not work for curr_lang = en and prev_lang =zh , — Senthil
– Senthil, Commented Jul 22, 2019 at 3:29
What does swapObj() do? And why is obj hardcoded to be either hi or swapObj(hi)? Could this be the cause of your problem? — Jonathan Lam
– Jonathan Lam, Commented Jul 22, 2019 at 3:30
@JonathanLam have updated my code, can you please check, swapObj will reverse the map like { "transfer-services": "sabhee sevaen" } to { "sabhee sevaen" :"transfer-services"} and vive-versa — Senthil
– Senthil, Commented Jul 22, 2019 at 3:44

shrys · Accepted Answer · 2019-07-22 05:55:38Z

0

You might have to cast two objects into one such that values of one becomes key and value of another value as your base object is en for case 2. Also I've change se to seh in hi object as it was clashing with services. Consider the following (first is the actual output, second is the desired output):

// for en will receive obj as

let en = {
  "transfer-services": "transfer-services",
  "about-info": "zhi-zhu",
  "contact": "zhi-phi",
  "all-services-from": "all-services-from",
  "to": "to",
  "sin": "sin",
  "mal": "zmal"
};
// for zh will receive obj as
let zh = {
  "transfer-services": "xi-hou-zhi-n",
  "about-info": "zhi-zhu",
  "contact": "zhi-phi",
  "all-services-from": "hui-zhi-phi-tho",
  "to": "zhi",
  "sin": "stin",
  "mal": "zmal"
};
// for hi will receive obj as
let hi = {
  "transfer-services": "sabhee sevaen",
  "about-info": "baare-mein",
  "contact": "sampark-karen",
  "all-services-from": "sabhee-sevak",
  "to": "seh",
  "sin": "sg",
  "mal": "ml"
};

// will receive above obj base on curr_lang and prev_lang
function translationUrl(langvalue) {
  switch (langvalue) {
    case 'hi':
      return hi;
    case 'zh':
      return zh;
    case 'en':
      return en;
  }
}

function swapObj(val) {
  const lang = Object.keys(val).reduce((a, c) => ({ ...a,
    [val[c]]: c
  }), {});
  return lang;
}

function castObj(prev, curr) {
  const lang = Object.keys(currObj).reduce((a, c) => ({ ...a,
    [currObj[c]]: prevObj[c]
  }), {});
  return lang;
}

function transformURL(url, curr_lang, prev_lang, prevObj, currObj) { // convert prev to curr lang
  let [base, lang, segment, ...rest] = url.split('/');
  let obj = lang === prev_lang ? currObj : swapObj(currObj);

  if (prev_lang !== 'en' && curr_lang !== 'en')
    obj = swapObj(castObj(prevObj, currObj));
  if (prev_lang !== 'en' && curr_lang === 'en')
    obj = swapObj(prevObj);

  Object.keys(obj).forEach(key => {
    segment = segment.replace(key, obj[key]);
  });

  return [base, curr_lang, segment, ...rest].join('/');
}


let prev_lang = "en";
let curr_lang = "hi";

var prevObj = translationUrl(prev_lang);
var currObj = translationUrl(curr_lang);

console.log(transformURL('www.xyz.com/en/all-services-from-mal-to-sin?amount=1000&scy=SGD', curr_lang, prev_lang, prevObj, currObj));
console.log('www.xyz.com/hi/sabhee-sevak-ml-seh-sg?amount=1000&scy=SGD');

prev_lang = "hi";
curr_lang = "zh";
prevObj = translationUrl(prev_lang);
currObj = translationUrl(curr_lang);

console.log(transformURL('www.xyz.com/hi/sabhee-sevak-ml-seh-sg?amount=1000&scy=SGD', curr_lang, prev_lang, prevObj, currObj));
console.log('www.xyz.com/zh/hui-zhi-phi-tho-zmal-zhi-stin?amount=1000&scy=SGD');

prev_lang = "hi";
curr_lang = "en";
prevObj = translationUrl(prev_lang);
currObj = translationUrl(curr_lang);

console.log(transformURL('www.xyz.com/hi/sabhee-sevak-ml-seh-sg?amount=1000&scy=SGD', curr_lang, prev_lang, prevObj, currObj));
console.log('www.xyz.com/en/all-services-from-mal-to-sin?amount=1000&scy=SGD');

answered Jul 22, 2019 at 5:55

shrys

5,9682 gold badges26 silver badges38 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Senthil Over a year ago

thanks for help, for example if zh has two more obj {"estontia": "ai-sha-ni-ya", "to": "zhi"} , when i try www.xyz.com/en/all-services-from-estonia-to-sin?amount=1000&scy=SGD it shows, www.xyz.com/en/all-services-from-eszhinia-to-stin?amount=1000&scy=SGD , object replaces wrongly, inestonia to` replaces zhi, can you help

shrys Over a year ago

@Senthil what is the input and desired url

Senthil Over a year ago

thanks for reply, have added the code in your solution last.

Rishab · Accepted Answer · 2019-07-22 05:19:37Z

0

You can solve this issue in this manner. simply return the new prev_lang.

You were not passing the element to function properly, while console.log It needs to pass in this manner:

   console.log(transformURL('www.xyz.com/zh/all-services-from-mal-to-sin/details?amount=1000&scy=SGD',"zh", "hi",prevObj , currentObj) );

The second problem was you were returning the same lang of actual URL which needs to be changed. No need of swapObj()

// for en will receive obj as
var en = {
	"transfer-services": "transfer-services",
	"about-info": "about-info",
	"contact": "contact",
	"all-services-from": "all-services-from",
	"to": "to",
	"sin": "sin",
	"mal": "zmal"
};
// for zh will receive obj as
var zh = {
	"transfer-services": "xi-hou-zhi-n",
	"about-info": "zhi-zhu",
	"contact": "zhi-phi",
	"all-services-from": "hui-zhi-phi-tho",
	"to": "zhi",
	"sin": "stin",
	"mal": "zmal"
};
// for hi will receive obj as
var hi = {
	"transfer-services": "sabhee sevaen",
	"about-info": "baare-mein",
	"contact": "sampark-karen",
	"all-services-from": "sabhee-sevak",
	"to": "se",
	"sin": "sg",
	"mal": "ml"
}


var prevObj = hi;
var currentObj = en;


Object.prototype.getKeyByValue = function (value) {
	for (var prop in this) {
		if (this.hasOwnProperty(prop)) {
			if (this[prop] === value)
				return prop;
		}
	}
}

function searchReplace(segment, obj){
  Object.keys(obj).forEach(key => {
		segment = segment.replace(obj[key], obj.getKeyByValue(obj[key]));
	});
  segment = segment.replace("torvices","services");
  return segment;

}

function transformURL(url, curr_lang, prev_lang, prevObj, currObj) { // convert prev to curr lang
	let [base, lang, segment, ...rest] = url.split('/');
	lang = curr_lang
	var obj = currObj;
  segment = searchReplace(segment, obj);

	var obj = prevObj;
  segment = searchReplace(segment, obj);


	return [base, prev_lang, segment, ...rest].join('/');
}

console.log(transformURL('www.xyz.com/hi/sabhee-sevak-ml-se-sg/details?amount=1000&scy=SGD', "hi", "en", prevObj, currentObj));

edited Jul 22, 2019 at 5:19

answered Jul 22, 2019 at 3:37

Rishab

1,5322 gold badges14 silver badges23 bronze badges

9 Comments

Senthil Over a year ago

thanks for reply, but if you var prevObj = hi; var currentObj = en;, transformURL('www.xyz.com/hi/sabhee-sevak-ml-se-sg/details?amount=1000&scy=SGD',"hi", "en",prevObj , currentObj); not working?

Rishab Over a year ago

hello @Senthil i have done this for sample test. var prevObj = hi; var currentObj = en; Please try to run snippet above

Senthil Over a year ago

have tried and inserted the code, can you please check, urltext doesnot modify only lang code, for that purpose i used swapobj which reverses the obj like { "transfer-services": "sabhee sevaen" } to { "sabhee sevaen" :"transfer-services"} and vice-versa

Rishab Over a year ago

Okay i got your problem, the main issue is with your object which you are creating is not having keys for all language translation

Senthil Over a year ago

yes that why i used swapobj but got stuck in between code

|

Collectives™ on Stack Overflow

Multilanguage urlpath change with object using javascript

2 Answers 2

3 Comments

9 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

9 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related