Multi language website for FidoCadJ

MigthyThor commented 8 years ago

We need to add multi language support for the website. That's my plan to do it:

I'm going to transform the current web site (in html) in a PHP web site.

PHP web sites don't run on GitHub, but in the future who knows... for now we use it to generate the html code.

With a multi language web site made in PHP we will have a common file for the template, and many content file per page as many language we will use. Technically speaking, we separate the content from the viewer.

So, all we have to do, is run the PHP site on a local server, for every chang on web site (that aren't so frequently) copy and paste the html source code in the GitHub directory.

I'll try to make an example on a piece of html code from page index.html

Now the title of the page is defined by this code: <title>FidoCadJ Free Graphical Editor for Electronics and more</title>

In the PHP version there'll be an include about a language file(for example italian): include("languages/italian/index.php"); that contain the languages definition, the title will change in: <title><?php echo $TITLE; ?></title>

If you will look at the output/source code of the new index.php, will see only the result: <title>FidoCadJ Software gratuito per il disegno di circuiti elettronici e altro</title>

So will have a new structure for the other (not english) languages: Italian -> http://darwinne.github.io/FidoCadJ/italian/index.html Spanish -> http://darwinne.github.io/FidoCadJ/spanish/index.html Klingon -> http://darwinne.github.io/FidoCadJ/klingon/index.html

and so on...

Of course, I will tell Google wich languages we ar going to serve and I'll make some beautiful flags for the user to choose the language he prefers.

I will translate the website in italian and I'll make a little guide for new translators about how to edit the language file.

Hope I've been clear enough.

Cheers!

marclr commented 8 years ago

And why not use angularJS? I think that github could host the web

MigthyThor commented 8 years ago

DarwinNE doesn't like libraries, so...neither Jquery

DarwinNE commented 8 years ago

Hi to all! Indeed, I prefer to handle simple code, when possible. I employed PHP in the past for multilanguage websites and it seemed to work correctly. The advantage of PHP is that I understand a little the language (that I do not like very much). However, the need of running a website server to compile it is quite a PITA :-)

What I like for that solution is that the result is a HTML-only website which has the advantage that it can easily be made very responsive.

If it can help, here is the source code of my homepage, I wrote circa 2006 and it still works. I had to be hyper-attentive about employing the "input" command, since I had an hacker attack in the past, on another website.

<?php

ob_start();

function validateLanguage($lang)
{
    $isValidLanguage['English']=true;
    $isValidLanguage['Francais']=true;
    $isValidLanguage['Italiano']=true;

    if($isValidLanguage[$lang]==true) {
        return $lang;
    }else{
        return "";
    }
}

/* Leggi gli argomenti passati tramite l'URL 
   Per compatibilità con Alice, uto HTTP_GET_VARS per avere un codice
   che funziona con il loro vetusto PHP 4.0.1 */

if(substr(phpversion(),0,1)<"5")
    $oldphp=true;
else
    $oldphp=false;

if($oldphp) {
    $page=$HTTP_GET_VARS["argument"];
    $language=$HTTP_GET_VARS["language"];
    $exp=$HTTP_GET_VARS["exp"];

} else {
    $page=$_GET["argument"];
    $language=$_GET["language"];
    $exp=$_GET["exp"];

}

/* Piccolo test, per la sicurezza */
$language=validateLanguage($language);

/* Se non viene fornito nulla, mostra la home page*/
if($page=="") {
    $page="home.inc";
}

/* Se la lingua è specificata espressamente, memorizza l'impostazione
   in un cookie che dura un anno */

if($language!="") {
    setcookie("language", $language, time()+365*24*8644);
}   

/* Se la lingua non è specificata espressamente, cerca un cookie. 
   Se questo non è presente, prediligi la versione in francese, sempreché 
   questa sia disponibile */

 if($language=="") {
    if($oldphp) 
        $ll=$HTTP_COOKIE_VARS["language"];
    else
        $ll=$_COOKIE["language"];
    if($ll=="")
        $language="Francais";
    else
        $language=$ll;
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="%LANGUAGE%">
<HEAD>
  <META content="text/html; charset=ISO-8859-1"
 http-equiv="content-type">
 <meta name=viewport content="width=device-width, initial-scale=1">
 <title>%TITLE%</title>
 %DESCRIPTION%
<?php
/* Versione sperimentale */
if($exp=="p") {?>
<LINK rel="stylesheet" href="main_3col_min.css" type="text/css">
<?php } else { ?>
<LINK rel="stylesheet" href="main_3col_min.css" type="text/css">
<?php } ?>

</HEAD>
<BODY>

<?php 
    ?>   
    <div id="header">
    <?php include("menu.inc") ?>
    </div> 
    <div id="main">
    <?php

    /* Security check: the pages MUST be present in the list */
    $allowed["home.inc"]=true;
    $allowed["index.inc"]=true;

    $allowed["fulvia/fulvia.inc"]=true;
    $allowed["se30/se30.inc"]=true;

    $allowed["elettronica/elettronica.inc"]=true;
    $allowed["elettronica/orologio/orologio_1.inc"]=true;
    $allowed["elettronica/orologio/orologio_2.inc"]=true;
    $allowed["elettronica/orolnixie/orolnixie.inc"]=true;
    $allowed["elettronica/orolnixie21/orolnixie21.inc"]=true;
    $allowed["elettronica/midi_splitter/midi_splitter.inc"]=true;
    $allowed["elettronica/pic_i2c/pic_i2c.inc"]=true;
    $allowed["elettronica/esr_meter/esr_meter.inc"]=true;
    $allowed["elettronica/fidoreadj/fidoreadj.inc"]=true;
    $allowed["elettronica/fidocadj/fidocadj.inc"]=true;
    $allowed["elettronica/fidocadj/version_history.inc"]=true;
    $allowed["elettronica/fc_libraries/fc_libraries.inc"]=true;
    $allowed["elettronica/inverter_neon/inverter_neon.inc"]=true;
    $allowed["elettronica/fidoreadj/fidocadj_applet.inc"]=true;
    $allowed["elettronica/amplificatore/amplificatore.inc"]=true;
    $allowed["elettronica/pre_riaa/pre_riaa.inc"]=true;

    $allowed["fisica/fisica.inc"]=true;
    $allowed["fisica/galileo/galileo.inc"]=true;
    $allowed["fisica/newton/newton.inc"]=true;
    $allowed["fisica/ipotesi/ipotesi.inc"]=true;
    $allowed["fisica/ottica/ottica.inc"]=true;
    $allowed["fisica/visione/visione.inc"]=true;

    $allowed["musica/musica.inc"]=true;
    $allowed["musica/scala/scala.inc"]=true;
    $allowed["musica/midi_sds/midi_sds.inc"]=true;

    $allowed["matematica/matematica.inc"]=true;
    $allowed["matematica/fract_applet/fract_applet.inc"]=true;
    $allowed["matematica/frattali/frattali.inc"]=true;
    $allowed["matematica/analysis/analysis.inc"]=true;
    $allowed["matematica/maxima/maxima.inc"]=true;
    $allowed["matematica/gnuplot/gnuplot.inc"]=true;

    $allowed["varie/innuh/innuh.inc"]=true;
    $allowed["varie/poliziesca/poliziesca.inc"]=true;
    $allowed["varie/hp9817/hp9817.inc"]=true;

    if($allowed[$page]==false) {
        $page="error.inc";
        /* In this way, only internal pages can be included in the PHP
           code, avoiding malicious code to be executed by the server, such
           as the hacker attack of February 2006 to the M20 site. */
    }

    include($page);

    ?>
    </div>
    <div id="nav">
    <?php //include('search.inc'); 
    ?>

    <?php 
        $locale="fr-FR";
        if ($english==true){
            echo('<a href="index.php?argument=');
            echo($page);
            echo('&amp;language=English">');
            echo('<img src="english.png" width="24" height="24" class="symbol" alt="">');
            echo("English version</a><br>");
        } if ($francais==true){
            echo('<a href="index.php?argument=');
            echo($page);
            echo('&amp;language=Francais">');
            echo('<img src="francese.png" width="24" height="24" class="symbol" alt="">');
            echo("Version française</a><br>");
        } if ($italiano==true){
            echo('<a href="index.php?argument=');
            echo($page);
            echo('&amp;language=Italiano">');
            echo('<img src="italiano.png" width="24" height="24" class="symbol" alt="">');
            echo("Versione italiana</a><br>");
        }

        if ($english==false && $language=="English") {
            echo('<div style="background-color:#FF9090;padding:10px;">');
            echo('<a href="http://translate.google.fr/translate?sl=auto&amp;tl=en&amp;js=n&amp;prev=_t&amp;hl=fr&amp;ie=UTF-8&amp;eotf=1&amp;u=http%3A%2F%2Fdavbucci.chez-alice.fr%2Findex.php%3Fargument%3D');
            echo($page);
            echo('&amp;act=url">No english translation.<br> Go babelfish?</a>');
            echo('</div>');
        } else if ($francais==false && $language=="Francais") {
            echo('<div style="background-color:#FF9090;padding:10px;">');
            echo('<a href="http://translate.google.fr/translate?sl=auto&amp;tl=fr&amp;js=n&amp;prev=_t&amp;hl=fr&amp;ie=UTF-8&amp;eotf=1&amp;u=http%3A%2F%2Fdavbucci.chez-alice.fr%2Findex.php%3Fargument%3D');
            echo($page);
            echo('&amp;act=url">Pas de version française.<br> On y va en automatique?</a>');
            echo('</div>');
        }

        if($language=="English" && $english==true)
            $locale="en-US";
        if($language=="Francais" && $francais==true)
            $locale="fr-FR";
        if($language=="Italiano" && $italiano==true)
            $locale="it-IT";

        ?>
        </div>  
<br><br>
</BODY>
<?php 
    $out = ob_get_contents();
    ob_end_clean();

    if($page_title=="") {
        $page_title="Davide Bucci";
    } else {
        $page_title .=" - Davide Bucci";
    }
    $out=str_replace("%TITLE%", $page_title, $out);

    if($description!="") 
        $desc = "<meta name=\"description\" content=\"".$description."\">";
    else
        $desc = " ";

    $out=str_replace("%DESCRIPTION%", $desc, $out);
    echo str_replace("%LANGUAGE%", $locale, $out);
?>
</HTML>

Retrospectively, I think that the URLs of my webpage are too long. Therefore, I think that employing the standard locale codes for the language would be enough. I am sure that a PHP wizard would find a way to improve it, but it has proven to be acceptable, at least for my small personal webpage.

However, I am not completely against employing external libraries. Here are my requirements:

very small overhead for the download (ex. 30 KiB is OK, 150 KiB not at all)
clean, small, understandable code
clean, simple, understandable structure
no security issues
no need of spending more time to upgrade the framework than the site

For example, my homepage still runs code written in 2006, since I can not upgrade versions of it every 2 months. /Always think for the long run/

Cheers, D.

MigthyThor commented 8 years ago

Hi, italian translation is done! Now I have to add a language-navigation system to change languages within the website.

It will be usefull to know how many languages you think will be integrated.

Thanks.

DarwinNE commented 8 years ago

That's truly great, @MigthyThor! In the name of the Italian user community, THANKS for the commitment and for your efforts!

Can I have a look at the code? Then when you finish the navigation system, may I propose that you do a pull request so it will be integrated in the current website?

Best regards,

Davide

MigthyThor commented 8 years ago

Sorry for delay in answer!

You can look at the code in my repository (go_multilanguage branch) I suppose. If not possible, I'll send you the files.

Bye.

DarwinNE commented 8 years ago

Hi, @MigthyThor I could have a look at the go_multilanguage. That's great! I have only a minor cosmetic remark: I noticed that the tab length seems to be rendered with 8 spaces here on GitHub. For that reason, I have chosen to get rid completely of the tab in FidoCadJ sources (my editor can "detab" very easily the sources). I substituted them with 4 spaces, which is what I employ usually.

Thanks again for your commitment: great work!

Cheers,

Davide

DarwinNE commented 8 years ago

Hi @MigthyThor thanks to your work, the site is now bilingual, in English as well as in Italian. Great work and thanks for the pull requests!

I think we can now close this Issue.

D.

DarwinNE / FidoCadJ

Multi language website for FidoCadJ #59