have a problem with translation is Symfony2.1
I tried almost all methods provided in the symfony_book but, only the translation from english to frensh that works, the reverse doesn't work
here is my routing.yml
_acceuil:
pattern: /{_locale}/acceuil/
defaults: { _controller: gestionConferenceApplicationBundle:acceuil:acceuil, _locale: en }
requirements:
_locale: en|fr|de
is my layout page I have thoses to links that allaw to switch between langage:
<a style="padding-top: -10px;" href="{{ path('_acceuil', {'_locale': 'fr' }) }}" >FRANCAIS</a>
<a style="padding-top: -10px;" href="{{ path('_acceuil', {'_locale': 'en' }) }}" >ANGLAIS</a>
and this line for test
{{ 'welcome in my site'|trans }}
and here is my messages.fr.xlf
<?xml version="1.0"?>
<xliff version="1.2" xmlns="urn:oasis:names:tc:xliff:document:1.2">
<file source-language="en" datatype="plaintext" original="file.ext">
<body>
<trans-unit id="1">
<source>welcome in my site</source>
<target>bienvenue dans mon site</target>
</trans-unit>
</body>
</file>
</xliff>
and here is my messages.en.xlf
<?xml version="1.0"?>
<xliff version="1.2" xmlns="urn:oasis:names:tc:xliff:document:1.2">
<file source-language="fr" datatype="plaintext" original="file.ext">
<body>
<trans-unit id="1">
<source>bienvenue dans mon site</source>
<target>welcome in my site</target>
</trans-unit>
</body>
</file>
</xliff>
and here is the part wwe are interested in my config.yml :
framework:
#esi: ~
translator: { fallback: en }
secret: "%secret%"
router:
resource: "%kernel.root_dir%/config/routing.yml"
strict_requirements: "%kernel.debug%"
form: true
csrf_protection: true
validation: { enable_annotations: true }
templating: { engines: ['twig'] } #assets_version: SomeVersionScheme
default_locale: en
trust_proxy_headers: false # Whether or not the Request object should trust proxy headers (X_FORWARDED_FOR/HTTP_CLIENT_IP)
session: ~
and when I run I have always :
bienvenue dans mon site
how can I achieve that
thank you in advance
I know why your translations don't work.
Because the translation source is still this same. It's string from your template.
So ex:
{{'My Trans'|trans()}}
messages catalogues shoudl look like this fr:
'My Trans': 'My trans FR'
and the en trans:
'My Trans': 'My trans EN'
I hope this example will help you.
Related
doctype html
html(lang="en")
head
meta(charset="UTF-8")
meta(http-equiv="X-UA-Compatible", content="IE=edge")
meta(name="viewport", content="width=device-width, initial-scale=1.0")
title Document
body
div
img(src='./tree.jpg' alt='login' style='width:100px; height:100px;')
#form
form(action="/" method="post")
label(for="name") name
input(type="text" name="name" id="name" placeholder="okay")
input(type="submit" value="dingoo")
Install the pug-loader:
npm install #webdiscus/pug-loader --save-dev
In webpack config module add following rules:
module.exports = {
// ...
module: {
rules: [
// ...
{
test: /\.pug$/,
loader: '#webdiscus/pug-loader'
},
{
test: /\.(png|jpg|jpeg|svg|ico)/,
type: 'asset/resource',
generator: {
filename: 'assets/images/[name].[hash:8][ext]',
},
},
]
},
}
In pug use require() for image:
img(src=require('./path/to/tree.jpg)')
Generated HTML:
<img src="/assets/images/tree.23fe5de2.jpg">
This works fine with the #webdiscus/pug-loader.
Trying to setup pagination with data, where {{ title }} in <head><title>{{ title }}</title></head> is the title of the current page as defined in projects.json
Assumed this could be done:
# main.njk
<head>
<title>{{ title }}</title>
</head>
# page.njk
---
layout: main.njk
pagination:
data: projects
size: 1
alias: project
permalink: "work/{{ project.title | slug }}/"
title: {{ project.title }}
Might have misunderstood some fundamentals but {{ title }} renders out as [object, object] instead. Permalink works fine...
Now eleventyComputed can be used
# main.njk
<head>
<title>{{ title }}</title>
</head>
# page.njk
---
layout: main.njk
pagination:
data: projects
size: 1
alias: project
permalink: "work/{{ project.title | slug }}/"
eleventyComputed:
title: "{{ project.title }}"
The project title can actually be accessed with {{ project.title }} in the master template main.njk, as with any other project data defined for that project in projects.json.
For any other page (not defined as an object in projects.json), a conditional statement can be used:
<title>{{ project.title if project.title else title}}</title>
So that:
# main.njk
<head>
<title>{{ project.title if project.title else title}}</title>
</head>
# page.njk
---
layout: main.njk
pagination:
data: projects
size: 1
alias: project
permalink: "work/{{ project.title | slug }}/"
---
# other_page.njk
---
layout: main.njk
title: Other Page
---
# projects.json
[
{
"title": "Project 1"
},
{
"title": "Project 2"
}
]
Outputs:
# work/project-1/
<head>
<title>Project 1</title>
</head>
# work/project-2/
<head>
<title>Project 2</title>
</head>
# other-page/
<head>
<title>Other Page</title>
</head>
In a njk file, you generally cannot use data variables or template syntax in the frontmatter.
The permalink variable is an exception.
See the official Eleventy documentation about permalink
To solve your issue, you could either:
hard-code your title in your page.njk
use a javascript .11ty.js templating file, either to replace page.njk or main.njk, or as a layout to main.njk.
.11ty.js files can generally use data variables in the frontmatter.
e.g. of a .11ty.js file with a variable in the frontmatter:
let thing = "whatever";
class Sample {
data() {// data() is the .11ty.js equivalent of frontmatter
return {
myCustomFrontmatterVariable: thing,
};
}
render(data){
return data.content;
}
}
module.exports = Sample;
i'm a beginner in bootstrap,i was trying to build an Xpage with the BootstrapValidator to validate an inputText but it dosen't work,below the code source,can we help me to find a solution!
<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core"
xmlns:xc="http://www.ibm.com/xsp/custom">
<xp:this.resources>
<xp:styleSheet href="/bootstrapValidator/css/bootstrap.css"></xp:styleSheet>
<xp:styleSheet href="/bootstrapValidator/css/bootstrapValidator.css"></xp:styleSheet>
<xp:script src="/JQueryXSnippet.js" clientSide="true"></xp:script>
<xp:script src="/bootstrapValidator/js/bootstrap.min.js" clientSide="true"> </xp:script>
<xp:script src="/bootstrapValidator/js/bootstrapValidator.js" clientSide="true"></xp:script>
</xp:this.resources>
<div class="col-md-5">
<xp:inputText id="username" title=" username"></xp:inputText>
</div>
<xp:scriptBlock id="scriptBlock1">
<xp:this.value><![CDATA[$(document).ready(
function() {
$("#{id:username}" ).bootstrapValidator({
message: 'This value is not valid',
feedbackIcons: {
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
fields: {
username: {
message: 'The username is not valid',
validators: {
notEmpty: {
message: 'The username is required and can\'t be empty'
},
stringLength: {
min: 6,
max: 30,
message: 'The username must be more than 6 and less than 30 characters long'
},
regexp: {
regexp: /^[a-zA-Z0-9_\.]+$/,
message: 'The username can only consist of alphabetical, number, dot and underscore'
}
}
} } });
]]></xp:this.value>
</xp:scriptBlock>
</xp:view>
Use the XPages compatible jQuery selector x$ instead of the native jQuery $ selector.
Also try using XSP.addOnLoad() instead of (document).ready().
Furthermore, your XPages xp:inputText field called "username" has an id in the browser called something like "view:_id1:_id2:_id8:username". So it's not called "username" as stated in your fields definition for bootstrapValidator. Therefore bootstrapValidator is unable to find the field. Try adding this to your scriptBlock instead of "username: {":
#{id:username}: {
In Grunt I used to use a plugin called env. That would allow me to define an environment in specific build. I had 3 builds. One was DEV which would use all the files split up individually. PROD would concat everything and RELEASE would concat and uglify. I'm looking to do the same in Gulp. I do see a preprocessor for Gulp but nothing to define environment.
The question is. What can I do? Obviously I don't want to define all JS files all the time, and I don't want 3 different HTML pages with different script tags.
In my HTML I would have something like this:
<!-- #if NODE_ENV == 'DEVELOPMENT' -->
<script src="js/example1.js" type="text/javascript"></script>
<script src="js/example2.js" type="text/javascript"></script>
<script src="js/example3.js" type="text/javascript"></script>
<!-- #endif -->
<!-- #if NODE_ENV == 'PRODUCTION' -->
<script src="js/project.js" type="text/javascript"></script>
<!-- #endif -->
<!-- #if NODE_ENV == 'RELEASE' -->
<script src="js/project.min.js" type="text/javascript"></script>
<!-- #endif -->
And my grunt plugins would look like this:
env: {
dev: {
NODE_ENV: 'DEVELOPMENT'
},
prod: {
NODE_ENV: 'PRODUCTION'
},
release: {
NODE_ENV: 'RELEASE'
}
},
preprocess: {
options: {
context: {
name: '<%= pkg.outputName %>',
version: '<%= pkg.version %>',
port: '<%= pkg.port %>'
}
},
dev: {
src: 'index.html',
dest: '<%= pkg.outputFolder %>/index.html'
},
prod: {
src: 'index.html',
dest: '<%= pkg.outputFolder %>/index.html'
},
release: {
src: 'index.html',
dest: '<%= pkg.outputFolder %>/index.html'
}
},
You should probably use gulp-preprocess and do stuff like this in gulp
var preprocess = require('gulp-preprocess');
.pipe(preprocess({context: { NODE_ENV: 'PRODUCTION', RELEASE_TAG: '2.6.4', DEBUG: false}}))
with stuff like this in your html
<!-- #if NODE_ENV='DEVELOPMENT' -->
<a href="test?v<!-- #echo RELEASE_TAG -->" />
<!-- #endif -->
Here is how I accomplished what I think you want.
I have set up a folder that contains html pages to be preprocessed.
Within that folder I have folders corresponding to each page where I store html fragments and a json file.
Each JSON file has variables defining page assets for a specific page.
For example, say my page is index.html. It looks something like this:
<html>
<head>
... Meta stuff title etc ...
<!-- #ifdef pagecss1 -->
<link href="<!-- #echo pagecss1 -->" rel="stylesheet">
<!-- #endif -->
<!-- #ifdef pagecss2 -->
<link href="<!-- #echo pagecss2 -->" rel="stylesheet">
<!-- #endif -->
</head>
/// so on - same stuff with scripts at bottom
In my JSON file for that page I either have pagecss1 define or not.
Then I use gulp.watch.
I don't want to write out the whole thing, but the upshot is every time any of the files in the sub folders change a function intercepts the already existing global context variable, and reads the JSON file for that page. Then I use node.util._extend to overwrite the variables with page specific variables. I then pass the changed object to the preprocessor task as the context. It's all lightening quick and returns a callback that livereload know which page to reload.
I wrote this on mobile, so I may come back to edit for clarity, but solving this riddle saved me an incredible amount of time and effort.
I want to implement a kind of file-browser, where the user can navigate using the folder-tree, and see the folder-content in a grid.
I want to use the same data-store for both widgets, but can't see how to achive this - the tree needs items with e.g. a children-attribute, the grid only needs those children.
because ther may be a huge dataset, I'm planning to use the jsonreststore.
i was trying with this, and got one solution like this, Please note that the grid and tree are using the same store.. Here the catch is if folder has id of fld1 then all the files under that folder should have id pattern like "fld1f1","fld1f2".
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html dir="ltr">
<head>
<style type="text/css">
body, html { font-family:helvetica,arial,sans-serif; font-size:90%; }
</style>
<script src="djlib/dojo/dojo.js" djConfig="parseOnLoad: true"></script>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.6/dijit/themes/claro/claro.css"/>
<link rel="stylesheet" type="text/css" href="djlib/dojox/grid/resources/Grid.css"/>
<link rel="stylesheet" type="text/css" href="djlib/dojox/grid/resources/claroGrid.css"/>
</head>
<body class=" claro ">
<div id="treeOne"></div>
<div id="gridHolder" style="height:500px"></div>
</body>
<script type="text/javascript">
s =[];
dojo.require("dijit.tree.ForestStoreModel");
dojo.require("dojo.data.ItemFileReadStore");
dojo.require("dijit.Tree");
dojo.require("dojox.grid.DataGrid");
dojo.addOnLoad(function(){
baseStore = new dojo.data.ItemFileReadStore({
data:{
identifier: 'id',
label: 'name',
items: [
{id:'fld1',name:'folder 1', type:"folder", files:[{_reference:'fld1f1'},{_reference:'fld1f2'}]},
{id:'fld1f1',name:'file 1 of folder 1', type:"file", size:'1KB', dateLstMod:'15/15/2001'},
{id:'fld1f2',name:'file 2 of folder 1', size:'1KB', type:"file", dateLstMod:'15/15/2001'},
{id:'fld2',name:'folder 2', type:"folder", files:[{_reference:'fld2f1'},{_reference:'fld2f2'}]},
{id:'fld2f1',name:'file 1 of folder 2', size:'1KB', type:"file", dateLstMod:'15/15/2001'},
{id:'fld2f2',name:'file 2 of folder 2', size:'1KB', type:"file",dateLstMod:'15/15/2001'},
{id:'fld3',name:'folder 3', type:"folder"}
]
}
});
treeModel = new dijit.tree.ForestStoreModel({
store: baseStore,
query:{
type:'folder'
},
rootId: "root",
rootLabel: "List of folders on this drive",
childrenAttrs:['files']
})
t = new dijit.Tree({
model: treeModel
},"treeOne")
dojo.connect(t,'onClick', function(item, node, evt){
if(node.isExpandable){
updateGrid(baseStore.getValues(item,"id"));
}
})
function updateGrid(folderId){
grid.filter({
type:'file' , id:folderId+'*'
},true);
}
var gridStr = [{
cells:[
[
{ field: "name", name: "File Name", width: 'auto' },
{ field: "size", name: "Size", width: 'auto'},
{ field: "dateLstMod", name: "Date Last Modified", width: 'auto'}
]
]
}]
grid = new dojox.grid.DataGrid({
store:baseStore,
structure: gridStr,
noDataMessage:"NO DATA"
}, 'gridHolder');
grid.startup();
grid.filter({
type:'filee'
},true);
})
I think this link has the answer, you don't point the grid at the store, you create the grid and add items by iterating across the relevant children in the store
http://groups.google.com/group/dojo-interest/browse_thread/thread/af7265b19edeeb0/9fee8b5498746dd8