Em muitos sistemas notei que tem váriaveis globais em JS que são
colocadas no head com as traduções. Existe uma técnica para trabalhar
com isso?
Que fique claro: isso aqui não é um tutorial. Vc já deve ter noção do framework, e eu apenas vou exemplificar a passagem de uma variável da $_SESSION
para o JavaScript
usando as ferramentas nativas do CodeIgniter. Também não me preocupei muito com segurança, mas creio que não haja falha grosseira nesse código.
O objetivo é que vc perceba como atribuir os dados da sessão do PHP
a uma variável JavaScript
, o que, se entendi direito, responde à sua pergunta. Ou seja, vamos manipular o valor da variável JavaScript
conforme ela for alterada no PHP
.
Assim, use sessions, hooks e helpers. O hook vai definir o valor de sessão padrão para a variável. O helper vai recuperar esse valor para o JavaScript e imprimir no documento HTML
.
- Habilitar o uso da biblioteca de sessão:
Eu gosto de autoload: entre em application/config/autoload.php
e insira session no array correspondente: $autoload['libraries'] = array('session')
.
- Definindo idiomas disponíveis:
Esses dados podem, logicamente, ser carregados do seu banco. No exemplo eu definirei o array $config['langs']
pra servir como referência. Entre em application/config/config.php
e insira isso: $config['langs'] = ['pt-br','en','es'];
.
Assim, essas serão as únicas hipóteses disponíveis para o método set_lang_var()
que define o idioma.
- Habilitar e criar um hook:
Habilite o uso de hooks definindo $config['enable_hooks'] = TRUE;
no arquivo application/config/config.php
;
Dentro de application/config/hooks.php
insira o seguinte:
$hook['post_controller_constructor'][] = array(
'function' => 'set_lang',
'filename' => 'set_lang.php',
'filepath' => 'hooks'
);
Agora crie o hook application/hooks/set_lang.php
e insira o seguinte:
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
function set_lang() {
$ci = & get_instance();
//$ci->session->unset_userdata('lang');
if(NULL == $ci->session->userdata('lang')){
//Se nao houver idioma na session, define o idioma padrao
$userdata = ['lang'=>'pt-br'];
$ci->session->set_userdata($userdata);
}
//Caso contrario, o metodo teste/set_lang_var() pode ser usado para mudar o idioma
}
A partir deste ponto o PHP
já sabe qual é o idioma padrão. Agora será necessário fazer o sistema repassar os dados da $_SESSION
do PHP
para uma variável JavaScript
legível.
- Habilitando e criando um helper:
Para usar os helpers vc deve carregá-los. Eu gosto de usar autoload: dentro de application/config/autoload.php
adicione o helper string ao array apropriado: $autoload['helper'] = array('string')
;
É uma boa prática não alterar os scripts originais do framework, então estenda o helper pra poder trabalhar sem medo: crie o arquivo application/helpers/MY_string_helper.php
e insira o seguinte:
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
if (!function_exists('string_lang')) {
function string_lang(){
$ci = & get_instance();
echo '<script type="text/javascript">';
echo "var lang='".$ci->session->lang."'";
echo "</script>\n";
}
}
- Controlador, métodos e view:
O controller application/controllers/Teste.php
tem dois métodos bem simples:
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class Teste extends CI_Controller {
function get_lang_var(){
$data['title'] = 'get_lang_var()';
$this->template_action = strtolower(__CLASS__."/".__FUNCTION__);
$this->load->view($this->template_action, $data);
}
function set_lang_var(){
$lang = $this->uri->segment(3, 0);
$userdata = ['lang'=>$lang];
if(in_array($lang, $this->config->item('langs'))){
$this->session->set_userdata($userdata);
redirect('teste/get_lang_var');
}
else{
redirect('teste/set_lang_var/pt-br');
}
}
}
A view application/views/teste/get_lang_var.php
também é bastante simples:
<?php defined('BASEPATH') OR exit('No direct script access allowed'); ?>
<?= doctype('html5'); ?>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title><?= $title ?></title>
<base href="<?= config_item('base_url') ?>">
<?=string_lang()?>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" integrity="sha384-h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm1" crossorigin="anonymous"></script>
<style>body{padding-top: 20px;}</style>
</head>
<body>
<div class="container">
<p>Mude o idioma: <?=$_SESSION['lang']?></p>
<?=anchor('teste/set_lang_var/pt-br', 'pt-br')?>
<?=anchor('teste/set_lang_var/en', 'en')?>
<?=anchor('teste/set_lang_var/es', 'es')?>
</div>
</body>
</html>
Observando o console do navegador (ou o código-fonte da página) vai ser possível perceber que a variável <script type="text/javascript">var lang='pt-br'</script>
muda de valor sempre que vc escolhe um idioma novo.
É isso. Estude este código e vc vai ter a noção de como fazer isso de outras maneiras, ou aplicar o conceito às bibliotecas que está usando.