I want to use GLOB to get all images from a directory, but I keep getting an htmlentities() error.
htmlentities() expects parameter 1 to be string, array given
My code:
VIEW:
#extends('layouts.templates.master')
#section('content')
<div class="container-fluid">
<div class="row">
<img class="header-image" width="100%" height="200px" src="/assets/events/training.jpg" />
<div class="container">
<h1 class="page-title">FOTO'S</h1>
</div>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-md-12">
#foreach($images as $image)
<h3 style="color: white;font-family:'Michroma',sans-serif;">{{ $image->title }}</h3>
{{{ $fotos = glob($image->img_folder . "/*.jpg") }}}
#foreach( $fotos as $foto )
<a href="{{ $foto }}" class="fullsizable">
<img src="{{ $foto }}">
</a>
#endforeach
#endforeach
</div>
</div>
</div>
</div>
#stop
CONTROLLER
<?php
Class ImagesController extends BaseController
{
public function show($slug)
{
$images = Images::where('slug', '=', $slug)->get();
return View::make('layouts.images.imagegallery')->with('images', $images);
}
public function all(){
$images = Images::orderBy('created_at', 'desc')->paginate(10);
return View::make('layouts.images.imageslist')->with('images', $images);
}
}
This is my code, hope you can help me
Related
I am trying to remove item using ng-if and ng-else-if.
"ng-if="navItem.gbn.indexOf('12345') !== -1" is true then array item only show contains('12345') items.
but the item still remain in array so I think ng-else-if is not working.
I don't know how to delete it.
I have the following Angular code:
<div ng-controller="PIDAEController">
<div class="container-fluid" style="padding-top:30px;">
<div class="row">
<div class="col-lg-2 col-md-3 col-xs-6 tubmbimg" ng-repeat="navItem in navItems | Fpage: curPage * pageSize | limitTo:pageSize" ng-if="navItem.gbn.indexOf('12345') !== -1">
<a class="thumbnail border" href="#/item/{{navItem.site}}">
<div class="b-marjin">
<span align="center" class="label label-primary full-width" >{{ navItem.gbn }}</span>
</div>
<div>
<img style="border: 1px solid black;" class="img-responsive full-width" src="{{navItem.pimg}}" alt="">
</div>
<div align="center" class="under-block">
<span title="{{ navItem.pname }}" align="center">{{ navItem.pname2}}</span>
</div>
</a>
</div>
<div ng-else-if="navItems.splice(navItem, 1)"></div>
</div>
</div>
</div>
angular.forEach(item, function (value, key) {
var keepGoing = true;
if(keepGoing) {
if(value.gbn.indexOf("11600") != -1) {
$scope.initialized = true;
$scope.navItems = item;
$scope.curPage=0;
$scope.pageSize=20;
$scope.numberOfPage = Math.ceil(item.length / $scope.pageSize);
keepGoing = false;
}
else {
$scope.navItems.splice(key, 1);
}
}
});
ng-else-if does NOT EXIST. its neither angular or angularJS.
In the line
<div ng-else-if="navItems.splice(navItem, 1)"></div>
splice requires navItem to be an index/int, not an object.
As an alternative to ng-else-if you can simply do:
ng-if="navItem.gbn.indexOf('12345') == -1
Also, splice would return the removed array item when found, not sure if "ng-if" handles that as being TRUE.
Hello guys,
I have a problem with back slash in background-image style in Vuejs and string replace in HTML not work and solution.
URL from inspecting element
http://localhost:8000/storage/banar-pages\July2018\WPNrFE6eXopKnjMqjNgW.jpg
From DB
banar-pages\July2018\WPNrFE6eXopKnjMqjNgW.jpg
Code from component file
<div class="block-entry fixed-background" :style="'background-image: url(' +link + '/storage/' + about.image +');'">
<div class="container">
<div class="row">
<div class="col-sm-6 col-sm-offset-3">
<div class="cell-view simple-banner-height text-center">
<div class="empty-space col-xs-b35 col-sm-b70"></div>
<h1 class="h1 light">{{ about.name }}</h1>
<div class="title-underline center"><span></span></div>
<div class="simple-article light transparent size-4">{{ about.details }}</div>
<div class="empty-space col-xs-b35 col-sm-b70"></div>
</div>
</div>
</div>
</div>
</div>
Thank you
I need to replace image link it but flage not work image.replace('/\\/g', '/')
It looks like you're incorrectly passing a string as the first argument to String#replace(), which would result in a literal replacement (i.e., it would replace the first occurrence of /\/g in the string):
console.log('XX/\\/gXX/\\/gXX'.replace('/\\/g', '/'))
Remove the quotes from the first argument to make it a regular expression:
console.log('\\path\\to\\foo.png'.replace(/\\/g, '/'))
Then, your Vue template could be similar to this:
<div :style="'background-image: url(' +link.replace(/\\/g, '/') + '/storage/' + about.image.replace(/\\/g, '/') +');'">
new Vue({
el: '#app',
data() {
return {
link: 'http:\\placekitten.com',
about: {
image: '\\100\\100'
}
}
}
})
.dummy {
width: 100px;
height: 100px;
}
<script src="https://unpkg.com/vue#2.5.16"></script>
<div id="app">
<div class="dummy"
:style="`background-image: url(${link.replace(/\\/g, '/')}${about.image.replace(/\\/g, '/')})`">
</div>
</div>
You could have a method for processing that string and returning a revised URL:
methods: {
prepareURL(string) {
return string.replace('/\\/g', '/');
}
}
Component code:
<div class="block-entry fixed-background" :style="'background-image: url(' +link + '/storage/' + prepareURL(about.image) +');'">
<div class="container">
<div class="row">
<div class="col-sm-6 col-sm-offset-3">
<div class="cell-view simple-banner-height text-center">
<div class="empty-space col-xs-b35 col-sm-b70"></div>
<h1 class="h1 light">{{ about.name }}</h1>
<div class="title-underline center"><span></span></div>
<div class="simple-article light transparent size-4">{{ about.details }}</div>
<div class="empty-space col-xs-b35 col-sm-b70"></div>
</div>
</div>
</div>
</div>
My problem is handlebars don't operate Json data output. I don't understand this problem. How can i handle it???
This is my JSON data
{
"boardInfo":
[
{"no":1,"title":"히히","url":null,"writerNick":"cheolhan","contents":"하하","createdDate":"2016-10-24","createdDate2":"2016-10-24","like":0,"viewCount":19,"email":null,"userNo":"1","categoryNo":2,"category":"스포츠","linkTitle":null,"linkURL":null,"linkDetailUrl":null,"linkImage":null,"linkDesc":null,"userProfilePath":null},
{"no":2,"title":"히히","url":null,"writerNick":"cheolhan","contents":"하하","createdDate":"2016-10-24","createdDate2":"2016-10-24","like":0,"viewCount":15,"email":null,"userNo":"1","categoryNo":2,"category":"스포츠","linkTitle":null,"linkURL":null,"linkDetailUrl":null,"linkImage":null,"linkDesc":null,"userProfilePath":null},
{"no":3,"title":"후후","url":null,"writerNick":"cheolhan","contents":"후후","createdDate":"2016-10-24","createdDate2":"2016-10-24","like":0,"viewCount":276,"email":null,"userNo":"1","categoryNo":2,"category":"스포츠","linkTitle":null,"linkURL":null,"linkDetailUrl":null,"linkImage":null,"linkDesc":null,"userProfilePath":null}
]
}
This is script code
var source = $('#liTemplateText').html();
var template = Handlebars.compile(source);
var data = result.data.boardInfo
data.stringify = JSON.stringify(data);
console.log(data)
var boards = template(data);
$("#post_wrapper").append(boards);
{{#each data}}
<li id="each_post_wrap">
<div id="each_post">
<div id="user_Nick">
<img class="user_Nonepht userInfoLink" src="/TeamProject/upload/{{userProfilePath}}" alt="userImg" data-userNo="{{userNo}}" data-userNick="{{writerNick}}">
<span class="userInfoLink" data-userNo="{{userNo}}" data-userNick="{{writerNick}}">{{writerNick}}</span>
</div>
<div class="post_photoWrap titleLink" data-no="{{no}}" data-userNo="{{userNo}}">
<a href="#">
<img src="{{linkImage}}" alt="Image File">
</a>
</div>
<a class="post_contsWrap">
<span class="each_post_title titleLink" data-no="{{no}}" data-userNo="{{userNo}}">{{title}}</span>
<span class="each_post_contents titleLink" data-no="{{no}}" data-userNo="{{userNo}}"><p>{{{contents}}}</p></span>
</a>
<div class="post_ctgWrap">
<span class="categoryLink" data-ctgNo="{{categoryNo}}">{{category}}</span>
</div>
<div class="post_BtnWrap">
<div class="post_leftBtn">
<img class="viewCount" src="/TeamProject/mainpage/mainpage_images/viewCount.png" alt="view">
<span>{{viewCount}}</span>
</div>
<div class="post_rightBtn">
<img class="like_Onclick" src="/TeamProject/mainpage/mainpage_images/likeOnClick.png" alt="like">
<span>{{like}}</span>
</div>
<div>
</div>
</li>
{{/each}}
This is HTML code
<div id="tabs" class="all_post_wrap">
<ul id="post_wrapper" class="tabs-1-contents">
</ul>
</div>
Any help much appreciated.
<div id="archive_content_block">
<div class="row">
<div class="col-md-6 col-sm-6">
<div class="archive_cat_caption">
<h4>অর্থনীতি</h4>
</div>
<ul>
<li><i class="fa fa-square-o"></i>
<a href="http://67.227.189.112/~rtvnews24/economy/2126/বাধ্যতামূলক-করারোপের-প্রস্তাব-অর্থমন্ত্রীর">
<font style="color:rgb(33, 33, 33)">বাধ্যতামূলক করারোপের প্রস্তাব অর্থমন্ত্রীর</font>
</a>
</li>
</ul>
</div>
<div class="col-md-6 col-sm-6">
<div class="archive_cat_caption">
<h4>খেলাধুলা</h4>
</div>
<ul>
<li><i class="fa fa-square-o"></i> <font style="color:rgb(33, 33, 33)">অস্ট্রেলিয়া রেকর্ড</font></li>
</ul>
</div>
</div>
</div>
[this is my scraping html page code]
here i have a function which for get scraping title and link. but not work
public function get_dom()
{
$this->load->library('scraping');
$date = date('Y/m/d'); // custom date
$url = "http://67.227.189.112/~rtvnews24/archive/$date"; //my link
$html = file_get_html($url);
$row = $html->find('div.archive_content_block',0); // select content
foreach($row->find('div.archive_cat_caption', 0) as $title) {
echo $title->find('h4', 0)->plaintext.'</br>'; //title
foreach($row->find('ul',0) as $link) {
echo $link->find('li',0)->find('a', 0)->href.'</br>'; //link
}
}
}
here i am try to get title and link. please help me. Thanks in advance
I am building a product grid built upon AngularJS data - where there will be images and product details (text)
The text sometimes extends to the 2nd line, causing havoc.
Here is my code:
<div class="row">
<div data-ng-repeat="s in Results">
<div class="col-xs-4">
<a href="#" class="thumbnail">
<div>
<img ng-src="{{s.ProductImage}}" class="img-responsive">
</div>
<div>
{{s.Store}} {{s.Category}} {{s.ProductName}}
</div>
</a>
</div>
<div class="clearfix visible-xs-block"></div>
</div>
</div>
This is what it looks like:
How do I fix it so that <div>s all have the same height?
I tried to look online for solutions, but I think I am 50% there. Please help.
Note: I Don't want to hide content.
This is what I ended up doing for anyone who stumbles on this again in the future.
Javascript
function ResizeToLargestElement(element) {
var maxHeight = -1;
if ($(element).length > 0) {
$(element).each(function () {
maxHeight = maxHeight > $(this).height() ? maxHeight : $(this).height();
});
$(element).each(function () {
$(this).height(maxHeight);
});
}
}
Without AngularJS
For those who aren't using AngularJS, just call ResizeToLargestElement() when data changes or the window is resized using
$(window).resize(function() {
ResizeToLargestElement('.AutoResizeToLargestElement');
});`
With AngularJS
The idea is to call the ResizeToLargestElement() function whenever $scope.Results changes or when the window resizes.
To know when $scope.Results changed is easy, but to know when elements (that are bound to it) finished rendering is not easy. To do that, you need a AngularJS directive.
To know when the window re-sizes, use angular.element($window).on('resize', function () {...});
HTML
<div class="row">
<div data-ng-repeat="s in Results" data-ng-repeat-finished> <!--ADDED Directive-->
<div class="col-xs-4">
<a href="#" class="thumbnail AutoResizeToLargestElement"> <!--ADDED Class-->
<div>
<img ng-src="{{s.ProductImage}}" class="img-responsive">
</div>
<div>
{{s.Store}} {{s.Category}} {{s.ProductName}}
</div>
</a>
</div>
<!--REMOVED clearfix-->
</div>
</div>
MyDirectives.js
angular.module('myApp').directive('ngRepeatFinished', function ($timeout) {
return {
restrict: 'A',
link: function (scope, element, attr) {
if (scope.$last === true) {
$timeout(function () {
scope.$emit('ngRepeatFinished');
});
}
}
}
});
mycontroller.js
$scope.$on('ngRepeatFinished', function (ngRepeatFinishedEvent) {
ResizeToLargestElement(".AutoResizeToLargestElement");
});
angular.element($window).on('resize', function () {
ResizeToLargestElement(".AutoResizeToLargestElement");
});
Note: this requires you to include $window in the AngularJS dependency list.
I.E. angular.module('myApp').controller('....', ['...., '$window', ....]);
If you want to keep the height of each product dynamic, you will need to split the results into columns. And then use ng-if to put the right items in the right column. Every 3rd item will go into the same column. To set them to different columns, just reduce the $index by 1 for each extra column.
<div class="row">
<div class="col-xs-4">
<div ng-repeat="s in Results"> <a href="#" class="thumbnail" ng-if="$index%3==0">
<div>
<img ng-src="{{s.ProductImage}}" class="img-responsive" />
</div>
<div>{{s.Store}} {{s.Category}} {{s.ProductName}}</div>
</a>
<div class="clearfix visible-xs-block"></div>
</div>
</div>
<div class="col-xs-4">
<div ng-repeat="s in Results"> <a href="#" class="thumbnail" ng-if="($index-1)%3==0">
<div>
<img ng-src="{{s.ProductImage}}" class="img-responsive" />
</div>
<div>{{s.Store}} {{s.Category}} {{s.ProductName}}</div>
</a>
<div class="clearfix visible-xs-block"></div>
</div>
</div>
<div class="col-xs-4">
<div ng-repeat="s in Results"> <a href="#" class="thumbnail" ng-if="($index-2)%3==0">
<div>
<img ng-src="{{s.ProductImage}}" class="img-responsive" />
</div>
<div>{{s.Store}} {{s.Category}} {{s.ProductName}}</div>
</a>
<div class="clearfix visible-xs-block"></div>
</div>
</div>
</div>
You can manually restrict the height of the div and use an overflow. Use something like
<div class="col-xs-4" style="height:200px; overflow: auto;">Content</div>
Or, you could always use a responsive table (<table class="table table-responsive">) for your layout.
The best solution for this problem is to add clearfix class to hidden divs for earch size of viewport. for example:
Large size: i want 6 columns (large desktops)
Medium size: i want 4 columns (Desktops)
Tablets: i want 3 coumns
phones: i want 2 columns
so i have the products list:
<?php $count=1; foreach($productList as $product) : ?>
<div class="item col-xs-6 col-sm-4 col-md-3 col-lg-2">
Picture and description
</div><!-- /item -->
<?php if( ($count%2)==0) {?><div class="clearfix visible-xs-block"></div><?php }?>
<?php if( ($count%3)==0) {?><div class="clearfix visible-sm-block"></div><?php }?>
<?php if( ($count%4)==0) {?><div class="clearfix visible-md-block"></div><?php }?>
<?php if( ($count%6)==0) {?><div class="clearfix visible-lg-block"></div><?php }?>
<?php $count++; endforeach?>