Php / Js – Language detect and select

  javascript, php

Im trying to create a menu with language settings.

  • If cookies are set, load index.php normal with the language variable (either xml or json i think).

  • If the cookie is not set, detect lang and check in available. I want to load my index page with language select pop up, preferably css class add and remove, so it will be shown the same after closed with something like document.getElementById("langpick").classList.toggle("hide");

Next im getting stuck;

  • show message in selected language;
  • show other languages and on click change above message;
  • submit button with set to cookie selectedLang;
<?php

    if(isset($_COOKIE['selectedLang'])){
    $cookie = $_COOKIE['selectedLang'];
    echo "Cookies are set and load index page with xml or json<br>";}
else{ // rest
    ;}

?>
<?php 

$lang = substr($_SERVER['HTTP_ACCEPT_LANGUAGE'], 0, 2);
$sitelang = array("nl", "fr", "de", "en"); 
if (in_array($lang, $sitelang)) {
    echo "Browser set ";
    $langset = $lang;
    setcookie("selectedLang", $langset,time() + (86400 * 30 * 86400), "/");
}

else {
    echo "Auto set ";
        $langset = "en";
         setcookie("selectedLang", "en",time() + (86400 * 30 * 86400 ), "/");
}

?>

<head>
    <style type="text/css">
        .hide {width: 50; height: 50px; border: 3px solid black; transition: 0.6s; overflow: hidden;}
        .show {width: 200px; height: 200px; border: 3px solid black;transition: 0.6s; }
        .lang-no {background-color: orange; position: absolute; top: 50%; display: inline-block;}
        #condtent {width: 200px; height: 200px;}
        .but-lang {width: 50; height: 50px; background-color: green; margin-right: auto; margin-left: auto;}
    </style>

</head>
<body>


<div class="lang-no hide" id="langpick">
    <div id="but-lang" class="but-lang"></div>

    <div> -->> <br>
 <script type="text/javascript">
     var lang = document.cookie;
     lang2 = lang.replace('selectedLang=', '');
    // var Text = window["WORDS_"+lang][LangVar];
      
    document.write(" JS COOKIE SET : ");
    document.write(lang2);
    document.write("<br><br>");

 function SHOWLANG() {
   if (lang2 = "en" ) {
    document.write(lang2);
      document.write("Language = English");

} 
if ( lang2 = "nl" ) {
      


   document.write(lang);
   document.write(" Taal = Nederlands");

} 
if (lang2 = "fr") {
      


   document.write(lang2);
      document.write(" Langue = Francais");

} 
if (lang2 = "de") {
      


   document.write(lang2);
      document.write("Sprache = Deutsch");

}}


    </script>




<?php
$langpick = "<br><br>Show array - current<br>select button with set cookie value";





 echo $langpick; ?>

    </div>

</div>
    <script type="text/javascript">
    document.getElementById("but-lang").onclick = function(){
     document.getElementById("langpick").classList.toggle("hide");
     document.getElementById("langpick").classList.toggle("show");      
}


</script>
</body>
<?php

    if(isset($_COOKIE['selectedLang'])){
    $cookie = $_COOKIE['selectedLang'];
    echo "Cookies set";}
else{ 
$langpick = "Pick<br>pick<br>";
echo $langpick; 
echo '

<script type="text/JavaScript"> 
     document.getElementById("langpick").classList.toggle("hide");
     document.getElementById("langpick").classList.toggle("show");
     </script>

    '
    ;}

?>

(function SHOWLANG() doesnt give any output)

Maybe im starting all wrong.. im considering Ajax for a solution perhaps,
Its only a been few months of coding so mostly everyhing is new to me.
I know a little HTML Css and Javascript (front-end) but here, like i said, i dont see what to do anymore.

Many thanks in advance!

Source: Ask PHP

LEAVE A COMMENT