Im working in a project using symfony, and I've a view in which i've to display an image of an entity, i used the same method of the upload recommanded by the documentation, the upload is working fine, but the problem I faced when I want to display the image, I get an exception as following :
A hash key must be followed by a colon (:). Unexpected token "punctuation" of value "." ("punctuation" expected with value ":") in StockStockBundle:Payantfournisseur:imprime.html.twig at line 135
There is the code that gives me this exception :
In the controller side :
$em = $this->getDoctrine()->getManager();
$entity = new Payantfournisseur();
$entity = $em->getRepository('StockStockBundle:Payantfournisseur')->find($id);
$user = $this->get('security.context')->getToken()->getUser();
$societe = new \User\UserBundle\Entity\Societe();
$societe = $em->getRepository('UserUserBundle:Societe')->find(2);
//$societe = $user->getSociete();
$facture = $entity->getIdfacturefournisseur();
$fournisseur = $facture->getIdfournisseur();
$articles = $em->getRepository('StockStockBundle:Lignefacturefournisseur')
->getArtFromLines($facture);
if (!$entity) {
throw $this->createNotFoundException('Unable to find Devis entity.');
}
$deleteForm = $this->createDeleteForm($id);
return $this->render('StockStockBundle:Payantfournisseur:imprime.html.twig', array(
'entity' => $entity,
'fournisseur' => $fournisseur,
'facture' => $facture,
'articles' => $articles,
'delete_form' => $deleteForm->createView(),
'societe' => $societe,
// 'ayoub'=>'yes ayoub',
));
In the view side :
<img src="{{ asset({societe.pjs.getWebPath}) }}" alt="{{ societe.pjs.alt }}" class="spaced img-responsive" />
to give more explaination, pjs is a oneToOne related entity with the societe, pjs is the entity responsible for the uploaded files.
If someone has an idea, plz it could be very helpful
thanks in advance!!!!!!!
I found parsing error in twig
Remove brace from asset function, use variable like here:
<img src="{{ asset(societe.pjs.getWebPath) }}" alt="{{ societe.pjs.alt }}" class="spaced img-responsive" />
Related
I'm trying to use an API for the first time. Here is how I currently call it :
url = 'https://data.economie.gouv.fr/api/records/1.0/search/?dataset=prix-carburants-fichier-instantane-test-ods-copie&q=aire+sur+l%27adour&lang=fr&facet=id&facet=adresse&facet=ville&facet=prix_maj&facet=prix_nom&facet=com_arm_name&facet=epci_name&facet=dep_name&facet=reg_name&facet=services_service&facet=horaires_automate_24_24&refine.ville=Aire-sur-l%27Adour';
datas = [];
constructor(private http: HttpClient){
this.http.get(this.url).toPromise().then((data: any) => {
this.datas = data
})
}
And HTML :
<pre class="text-white">
{{ datas | json }}
</pre>
The result shows a JSON like this :
Now, how do I access it? I already tried things like :
let data of datas :
data.records
data[0][records]
etc
Here an example, where json property rappresents your entire object:
<span *ngFor="let element of json.records">
{{element.datasetid }}
{{element.geometry }}
{{element.recordid }}
</span>
Here, Please try to create a new method and use async/await.
Create a new method something like this -
public async getData()
{
await this.http.get(this.URL)
.toPromise()
.then(response => this.datas = response['records'])
.catch(err => { console.log ('error');
});
}
Now, You can call this method from your constructor something like this -
constructor(private http: HttpClient) {
this.getData()
}
Now, You should use *ngFor directive to iterate over the datas as it is an array so you can use this data to develop HTML.
<div *ngFor="let data of datas">
{{data?.fields?.id}}
</div>
In this way, you can use this .
let me know if you need any further help on this .
please find the working link of stackblitz- https://stackblitz.com/edit/angular-dukmlc?file=src/app/app.component.ts
Thank you.
Within the user's profile, I'm utilizing the cropper api to get the user's image cropped. However, I'm not sure how I am able to obtain that image.
I'm currently attempting to retrieve the image in two places:
The site's header (through my .theme file for the account--menu.html.twig file).
In the groups module
For the header, originally I would retrieve the original image through this line of code:
function kropotkin_preprocess_menu__account(&$variables)
{
$uid = \Drupal::currentUser()->id();
if($uid > 0)
{
$user = \Drupal\user\Entity\User::load($uid);
if (!$user->user_picture->isEmpty()) {
$picture = file_create_url($user->user_picture->entity->getFileUri());
}else{
$picture = 'nothing here';
}
// Set variables
$variables['comradery'] = [
'profile_picture' => $picture
];
}
}
This is retrieving the original (uncropped) image into the header. The crop type machine name is profile_picture I have tried $user->profile_picture->entity->getFileUri() but it returned null.
Within the group's module I already have images being displayed properly (again uncropped images) like so:
{% for contributor, child in content.field_project_contributor if contributor|first != '#' %}
<a href="{{ path('entity.user.canonical', {'user': child["#options"].entity.id}) }}" class="mr-_5">
<div class="image-profile image-profile-md">
<img src="{{ file_url(child['#options'].entity.user_picture.entity.fileuri) }}" alt="">
</div>
</a>
{% endfor %}
So universally, how do I display the cropped version of the image?
The "crop API" :
You are probably misunderstanding how modules Crop API and Image Widget Crop work. They allow the user to crop the image manually during upload like this:
If all you want is to crop the image programmatically, you don't need the above modules. Follow these steps:
Go to: Admin menu > Configuration > Media > Image styles > Add image style (let's say profile_picture)
Add Crop effect for that style and set Width, Height, Anchor as you want
In your hook function:
use Drupal\image\Entity\ImageStyle;
function kropotkin_preprocess_menu__account(&$variables) {
$uid = \Drupal::currentUser()->id();
if ($uid > 0) {
$user = \Drupal\user\Entity\User::load($uid);
if (!$user->user_picture->isEmpty()) {
$uri = $user->user_picture->entity->getFileUri();
$picture = ImageStyle::load('profile_picture')->buildUrl($uri);
} else {
$picture = 'nothing here';
}
// Set variables
$variables['comradery'] = [
'profile_picture' => $picture
];
}
}
EJS2 can only do character to be use with angle brackets for open/close:
ejs.delimiter = '$';
ejs.render('<$= users.join(" | "); $>', {users: users});
I would like to use {{ }} instead of <% %>, previous version will allow this esj.open = '{{' and esj.close = '}}'.
Any help?
EJS has been updated & changed maintainers, so the main site is found here: https://ejs.co/
and the Github is here: https://github.com/mde/ejs
Unlike previous versions of EJS, you can't use completely custom delimiters now - you can use 'partial' custom delimiters - the first set of brackets aren't optional, but the following character is. To set up a custom delimiter you can do the following:
// app.js
const ejs = require('ejs');
ejs.delimiter = '?';
app.get('/', (req, res) => {
res.render('index', {
myVariable: 'Hey!'
});
});
// index.ejs
<div>
<p>
<?=myVariable ?>
</p>
</div>
// index.html (rendered output)
<div>
<p>
Hey!
</p>
</div>
You can add a complete options object and other things, but hopefully that gets you started if you want to change the default delimiters.
Documentation states that custom delimiters are supported:
https://github.com/tj/ejs#custom-delimiters
This isn't possible without modifying the module's source code.
My solution to using custom delimiters is be doing a string replace on the template
const template = fs.readFileSync(path.join(__dirname, './template.html'), 'utf8').replace('{{', '<%').replace('}}', '%>')
const render = ejs.compile(template)
This allows me to declare my template like this:
{{ if (someVar) { }}
{{= someVar }}
{{ } }}
For many of Custom Types created, we have a Query for them. These queries are being used by Projection Widgets (Within Zones).
Few of the custom types have Media Picker field.The Layout type I used for my Queries is the Shape type as seen below:
=>>> Queries:
=>>> Layout:
. I have followed the steps from here.. I specified the name of the shape as : UpcomingHighlightsImages as seen below:
and then included the view: UpcomingHighlightsImages.cshtml in my Themes/MyFirstTheme/Views folder.
Everything works fine upto here.
In the View, problem is that there is NO way to read the Image Metadata such as altText, altHeight etc... Neither there seems to be a way to set these metadata firstly in Orchard itself.
#using Orchard.ContentManagement
#using Orchard.Core.Title.Models
#using Orchard.Fields.Fields
#using Orchard.Taxonomies.Fields
#using Orchard.Core.Common.Fields;
#using Orchard.MediaLibrary.Fields;
#{
var HighlightItems = ((IEnumerable<ContentItem>)Model.ContentItems).ToList();
}
#foreach (var item in HighlightItems)
{
String LinkUrl = ((TextField)item.Parts.SelectMany(x => x.Fields).Single(x => x.Name == "LinkURL")).Value;
String ImagePath = ((MediaLibraryPickerField)item.Parts.SelectMany(x => x.Fields).Single(x => x.Name == "MainImage")).MediaParts.First().MediaUrl;
<div>
<a target="_blank" href="#LinkUrl">
<img src="#ImagePath" />
</a>
</div>
}
So, as seen in above code and the tag, I need:
Set the altText, altHeight property of Image in ORchard CMS
Read these in my view , the way I read LinkUrl and ImagePath
Please guide me !
See how you got the first media part in that ImagePath expression? Well, then you can take that part and get Title, Caption, AlternateText, etc. from it. You can also As<ImagePart>() it and get its Width and Height.
Quip
phpthumbof
I have Quip running on my site and I am using a snippet to call a extended profile field from the author of the comment to display the user profile image.
SNIPPET
<?php
if (!empty($userid)) {
$user = $modx->getObject('modUserProfile', array('id' => $userid) );
$extendedfields = $user->get('extended');
$output = $extendedfields[$field];
}
if (isset($output)) { return $output;}
return $default;
In my Quip.comment TPL
<div class="quip-comment-right">
<img src="[[!quip_profile_image? &userid=`[[+author]]` &field=`nomination_file` &default=`text`]]" />
</div>
The above works perfectly and I can see the image, but I cant figure out how to add PHPthumbof, to change size etc....
$output = $modx->runSnippet('phpthumbof',array(
'input' => $output,
'options' => '&w=640&h=480&zc=0&aoe=0&far=0'
));