How to loop an image to represent a number - laravel-5

i was able to display repuations in a tab but i want an image to represent the reputation number.
<i class="fa fa-star-half-o"></i> {{$artists->reputations}} </a></li>
For instance if the reputation is 5 i want an image to repeat 5 times,
if the reputation is 1 i want the image to repeat once and so on.
the image is located in my 'assets/images' folder
i tired doing something like this below
<?php
$j = artists->reputations;
#for($j=1;$j<=5;$j++)
<i class="fa fa-star-half-o"></i> <img src="assets/images/star.png" style="height:60px;"></a></li>
;?>

You are overwriting $j in your loop condition.
So you always get 5 images.
it should be looking like this if you only want 3 stars if $artists->reputations = 3.
<?php
$j = artists->reputations;
for($i=1;$i<=$j;$i++){
<i class="fa fa-star-half-o"></i> <img src="assets/images/star.png"style="height:60px;"></a></li>
}
?>

Related

Weird bug with AlpingJS and Livewire

I have the following simple table with Livewire:
#foreach ($sms_lists as $sms_list)
<x-table.row>
#if($listForEdit && $listForEdit['id'] == $sms_list->id)
<x-table.cell>
<span wire:click="firstAction">FIRST</span>
<span wire:click="secondAction">SECOND</span>
</x-table.cell>
#else
<x-table.cell>
<span wire:click="thirdAction">THIRD</span>
<span wire:click="fourthAction">FOURTH</span>
</x-table.cell>
#endif
</x-table.row>
#endforeach
NOTE: For the problem described below I have tested in this environment mostly with button, but also with a and div. I have made it span just for clarity.
The SECOND item always performs fourthAction.
If I comment out the FOURTH item, SECOND starts working.
If I change to the fourth item just to <span></span> or ANY element - SECOND stops working.
It works only if the #else has only one span. I see the icon and text of SECOND but somehow all attributes are from FOURTH... including all events and onclicks etc.
PS: Adding an ID to the FOURTH makes it stay persistently and never hide, even if it's whole block is hidden in the #else, it just stays between the FIRST and SECOND...
You've to add wire:key="$loop->index" to the row for livewire to identify the rows.

How can I show up to 2 decimal points

I am making a ecommerce website in laravel 6.20 and in the product view page I wanted to show the discount at a percantage rate. I could show a round figure but I want to show the percentage at a 2 decimal point format. any help will be appreciated.
<ul class="product_marks">
#if($row->discount_price == NULL)
#else
<li class="product_mark product_discount">
-{{round(($row->discount_price/$row->selling_price)*100)}}%
</li>
#endif
<li class="product_mark product_new">NEW</li>
</ul>
Please check this image for reference
you can use number_format($number, $decimal_points) to define number of decimal points you want:
-{{number_format(round(($row->discount_price/$row->selling_price)*100), 2)}}%

Vue2: Change data inside of v-for loop

I have the following loop which displays images in a gallery:
<a href="#" v-for="(file, index) in files" v-bind:key="file.id" #click="file.selected = !file.selected">
<img :src="file.url" />
<span>{{file.name}}</span>
<i v-show="file.selected" class="fa fa-check-square"></i>
</a>
I would like to be able to select any image by clicking on it.
But nothing happens when I click on the image.
I did it the way I would do it in AngularJs - I modify the item within the loop.
I was expecting that:
- the view (inside of the loop) will be updated
- the change of the item will be taken over into the data array (files)
Ok, that was easy - it did not work the way I wanted, because I did not add a key "selected" to my initial data array.
In AnguarJS this would not matter - the key would just be added, but here the element is not known / watched if it does not exist from the beginning.

How to switch the (single/double) quotes for a Tweet me button

I spent about 2 hours trying to make a blending of 2 codes work, and feeling the weakness of my code skills, I am reaching out here for some help.
I think the problem lies in the single/double quotes. I tried many, many times to reformat the quotations (and both ways ie reformatting both scripts to accommodate each other).
The image (which should be linked) is added to the page in the functions.php -- the image is path/image.png in this example:
! is_admin() && add_filter( 'the_content', function( $content )
{
if( in_the_loop() ) // <-- Target the main loop
{
$prepend = "<div style='color:#808080 ; border:1px solid #909090 ; border-radius:5px; float:left; padding-top:1px;'> <**img src='/path/image.png' alt='Tweet this' style='margin-bottom: -4px; '**>Tweet this  </div> ";
$content = $prepend . $content;
}
return $content;
}, 9 );
This is the link -- When the user clicks the image, I want them to access this link:
<a href='https://twitter.com/share?url=<?php echo $post_url ?>&text=<?php echo $post_title ?>' onclick='window.open(this.href,"popupwindow", "width=800,height=500,left=200,top=5,scrollbars,toolbar=0,resizable"); return false;' Target='_blank' >twitter</a>
What I want to end up with is: Click the image on the page, (it opens the Twitter link,) user gets to Tweet (share) the post they are on on Twitter.
So user clicks image (path/image.png) and opens link (twitter.com...etc).
Still not sure of anything: you should realize that your question lacks clarity.
Notably because you don't say where $post_url and $post_title comes from, nor explain what are $prepend and $content, and don't explain at all your function's use and context.
But I'll talk about what I believe to have understood.
Your goal seems to result in this kind of HTML part:
<div style="color:#808080; border:1px solid #909090; border-radius:5px; float:left; padding-top:1px;">
<a href="https://twitter.com/share?url=the-post_url&text=the-post_title"
onclick="window.open(this.href,'popupwindow','width=800,height=500,left=200,top=5,scrollbars,toolbar=0,resizable'); return false;"
target="_blank">
<img src="/path/image.png" alt="Tweet this" style="margin-bottom:-4px;">
Tweet this  
</a>
</div>
(you'll notice that I've returned back to arbitrary give precedence to double-quotes, which is the most standard choice)
Say we call $div, $a, and $img the source main components, to output the desired block we simply have to write something like:
echo $div . $a . $img . 'Tweet this  </a></div';
I suppose the issue you're reporting comes from you have to define those components as strings, while they already include simple and double quotes.
So the answer is using the PHP heredoc syntax:
Heredoc text behaves just like a double-quoted string, without the double quotes. This means that quotes in a heredoc do not need to be escaped, but the escape codes listed above can still be used. Variables are expanded, but the same care must be taken when expressing complex variables inside a heredoc as with strings.
And the components definition should look like:
$div = <<<EOT
<div style="color:#808080; border:1px solid #909090; border-radius:5px; float:left; padding-top:1px;">
EOT;
$a = <<<EOT
<a href="https://twitter.com/share?url=$post_url&text=$post_title" onclick="window.open(this.href,'popupwindow','width=800,height=500,left=200,top=5,scrollbars,toolbar=0,resizable'); return false;" target="_blank">
EOT;
$img = <<<EOT
<img src="/path/image.png" alt="Tweet this" style="margin-bottom:-4px;">
EOT;
In fact many other variations may be considered, notably directly using a unique variable for the whole part...
EDIT:
Here is a working whole snippet, after integrating a value for $post_urland $post_title and corrected a typo in echo...:
$post_url="the-post-url";
$post_title="the-post-title";
$div = <<<EOT
<div style="color:#808080; border:1px solid #909090; border-radius:5px; float:left; padding-top:1px;">
EOT;
$a = <<<EOT
<a href="https://twitter.com/share?url=$post_url&text=$post_title" onclick="window.open(this.href,'popupwindow','width=800,height=500,left=200,top=5,scrollbars,toolbar=0,resizable'); return false;" target="_blank">
EOT;
$img = <<<EOT
<img src="/path/image.png" alt="Tweet this" style="margin-bottom:-4px;" />
EOT;
echo $div . $a . $img . 'Tweet this  </a></div>';

Add 3 images to the first post cross browser solution

I need to have a banner image for the first post but it needs to expand vertically because posts will vary in the amount of content. currently I have this in y loop.php
<article class="post <?php echo !is_single() ? "preview" : "" ?> <?php echo $count == 0 ? "first" : "" ?> <?php echo !is_home() ? "full" : "" ?>">
I cannot attached the image since I do not have the correct reputation on this site!
However, the image is a banner that will wrap the edges of the main content div. I sliced it into 3 separate images-- a top, middle, and bottom-- thinking I could just use :before and :after in my css but this will not work in IE7 or 8 for me.
My class currently for the first post is "first" but I would need to add a top and bottom to this I think but I would like the best solution and I am too much of a newbie.
I feel I am really stuck and need some help. Let me know if you need more to go off of I can see what I can do about getting an image on this site to show you what needs to happen here.
If your theme uses body_class as it should then there should be class named author attached to the <body> tag for author archives. You can use that to simple not display the divs-- via display:none.
You almost had the PHP solution though, if I understand you. You need is_author instead of is_single
<?php if (!is_author() && $count == 0): ?>
<div class="firsttop"></div>
<?php endif; ?>
<!-- more Loop code -->
<?php if (!is_author() & $count == 0): ?>
<div class="firstbottom"></div>
<?php endif; ?>
If that isn't it, I don't know you mean by "the author's page".

Resources