PHP breadcrumbs with list of paths - javascript

I have a breadcrumbs script that divides the URL with /and links each one to the same path. However, I am facing two issues:
I have an older website which didn't have index.php in many
folders, so I need to add an array for which file to go to for that folder.
Some folders could have the same name in different locations.. so there could be a path like example.com/something/Samename, and another like example.com/another/path/Samename, and I need to set the title that shows in the breadcrumbs, so it's meaningful more than the path names.
So I want to add something like an array to tell it if the path is /another/path/Samename link to thisfile.php, and if it is the other folder link to another file.. etc., and if there is no array for that path then it links normally to the foldername, which means it has index.php file.
My current script is:
var path = "";
var href = document.location.href;
var s = href.split("/");
for (var i=2;i<(s.length-1);i++) {
path+=""+s[i]+" / ";
}
i=s.length-1;
path+=""+s[i]+"";
var url = window.location.protocol + "//" + path;
document.writeln(url);
//-->
And this another script that does the same:
//this is a file named 'functions.php'
<?php
function breadcrumbs(){
$bread = explode('/', $_SERVER['PHP_SELF']);
$url = '/';
$returnString = "<span class='bc0'><a href='$url'>home</a>";
for($i=1;$i<count($bread)-1;$i++){
$url.=$bread[$i].'/';
$returnString .= " |</span> <span class='bc$i'><a href='$url'>$bread[$i]</a>";
}
echo $returnString.'</span>';
}
?>
//in header of path
<?php include ( $_SERVER['DOCUMENT_ROOT'] . 'functions.php'); ?>
//where the breadcrumbs show
<?php breadcrumbs(); ?>

Related

Working solution to get file names inside server folder

I've used multiple solutions here on Stackoverflow but I can't make any of them work properly (Nodejs is not accepted).
I have a path filled with mp3 files and I want to return the file names.
The lasted thing I tried was this:
in the getFiles folder of my server, I have a PHP file named files.php and a JS file named scripts.js and index.html
PHP code:
<?php
$dir = 'mysite/folderOf/audio/';
// Store the scandir results in a variable
$files = scandir($dir);
// Encode the array in JSON and echo it
echo json_encode($files);
?>
Javascript:
$.get( "files.php", function( data ) {
console.log(data);
});
The directory where the mp3 files exist is: mysite/folderOf/audio/
The result of the code above is:
I need to return an array with filenames of mysite/folderOf/audio/ directory.
try this if it works
<?php
// open this directory
$Directory = opendir('mysite/folderOf/audio');
// get each entry
while($entryName = readdir($Directory)) {
$fileArray[] = $entryName;
}
// close directory
closedir($Directory);
// count elements in array
sort($fileArray);
$indexCount = count($fileArray);
// loop through the array of files and print them all in a list
for($index=0; $index < $indexCount; $index++) {
$extension = substr($fileArray[$index], -3);
if ($extension == 'mp3'){
echo '<a class="iconMP3" href="mysite/folderOf/audio/' . $fileArray[$index] . '"/>' . $fileArray[$index] . '</a>';
}
}
?>

unable to access public_html/images from public_html/subdomainname

i m not able to access images present inside public_html/images/packages/72/all_images from public_html/subdomain_name/testing.php
tried with "../", "//", "http://websitename/images/packages/72/all_images" and much more
$images = glob("../images/packages/72//*");
echo "<img src = "'.$images[0].'" >"
needed to retrieve the image
src = "public_html/images/packages/72/image_name"
but it displays src=(unknown)
At first check your image directory
$dir = dirname(__FILE__);
echo $dir;//where you want to find your images
If your directory is correct then,
$images = glob($dir . '/*');
...

how to insert a php code in a jquery function

i'm coding a php site to serve on file sharing . i had a problem with hiding the delete file option from users and showing it for site admin , the actual logged in user name is stored in a php session so hiding or showing the delete option will be used in php condition .
the problem is the php code never worked to add the "hidden" option on delete img tag .
in 1st step, js, jquery and php code were separated in two files, so i had to copy jquery code in index.php (main page) since i had no other option to grab the logged in user from php session to js file.
function render(data) {
var scannedFolders = [],
scannedFiles = [];
if (scannedFiles.length) {
scannedFiles.forEach(function(f) {
var fileSize = bytesToSize(f.size),
name = escapeHTML(f.name),
fileType = name.split('.'),
icon = '<span class="icon file"></span>';
fileType = fileType[fileType.length - 1];
icon = '<span class="icon file f-' + fileType + '">.' + fileType + '</span>';
var x = f.path.replace(/\/\/+/g, '/');
var file = $('<li class="files">'+icon+'<span class="name">'+ name +'</span> <span class="details">'+fileSize+'</span></li><img src="assets/supp.png" height="42" width="42" id="logo" onclick=del("'+encodeURIComponent(x)+'") if($_SESSION['username']!='info') {?> hidden <?php } ?>>');
file.appendTo(fileList);
});
}
<?php if($_SESSION['username']!='info') echo 'hidden' ?>
You need to put your php code inside php tags. You had syntax errors in your example code.
That way if your if statement is true it will show the "hidden" parameter causing your html element to be invisible.

How to make a slideshow banner in html?

I want to make my banner changed automatically just like a slideshow. The banner I took from a folder and it can read all banner in that folder and display it on a website automatically changes. I already make it to read all banner and display it on the website, but it kind of random image, not changed except if I reload the page. This the code:
<?php
$imglist='';
//$img_folder is the variable that holds the path to the banner images.
// see that you dont forget about the "/" at the end
$img_folder = "images/";
mt_srand( (double)microtime()*1000 );
//use the directory class
$imgs = dir($img_folder);
//read all files from the directory, checks if are images and ads them to a list (see below how to display flash banners)
while ( $file = $imgs->read() )
{
if (eregi("gif", $file) || eregi("jpg", $file) || eregi("png", $file))
$imglist .= "$file ";
}
closedir($imgs->handle);
//put all images into an array
$imglist = explode(" ", $imglist); $no = sizeof($imglist)-2;
//generate a random number between 0 and the number of images
$random = mt_rand(0, $no); $image = $imglist[$random];
//display image
echo '<img class="img-responsive" src="'.$img_folder.$image.'" border=0>';
?>
And how to make that PHP into HTML? if I change the extention into html, the banner div show the code not the images. Thanks.
The psuedocode for what you're doing would go something like:
load images from a directory into an array
on page load select a random image from image array
display first image
every X seconds display another image from image array
to display properly, your php file needs to be loaded/served from a web server. To do this, deploy your php file to your web server and then test it out.
an example of a banner I created a few years agao, that is similar to what you are after, is here
First, make your PHP echo out a hidden <input> element, with value containing the JSON string of image paths. Using your code, something like:
<?php
$out = " /* Beginning of your page code */ "
$imgJSON = json_encode($imglist);
$out .= '<input id="bans" type="hidden" value="' .$imgJSON. '" />';
$out .= " /* Rest of your page code */ "
echo $out;
die();
Then, you can use the example below to swap the images in the banner div. I demonstrate a very simple animation, just to show how it is done.
jsFiddle Demo
HTML:
<!-- Not req if you echoed out a hidden input via PHP:
<input type="hidden" id="bans" value='["300/49","300/51","297/50","298/51"]' />
-->
<div id="banner"></div>
javascript/jQuery:
var i = $('#bans').val();
var j = JSON.parse(i);
var max = j.length - 1;
var cnt = 0;
var timerId = null;
function swapBannersTimer() {
doSwap();
timerId = setTimeout(swapBannersTimer, 3000);
}
function doSwap(){
var str = 'http://placekitten.com/' + j[cnt];
$('#banner')
.html('<img class="far_right" src="'+str+'" />')
.promise()
.done(function(){
$('img').animate({
marginLeft: '0px'
},500);
});
cnt = (cnt < max) ? cnt+1 : 0;
}
swapBannersTimer();
**CSS:*
#banner{width:300px;height:52px;overflow:hidden;}
.far_right{margin-left:300px;}
NOTE: Because this example uses the jQuery library, you must include it on your page -- usually between the DIV tags, like this:
<head>
<!-- other stuff in head -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
</head>
If you use a CDN to load jQuery, as in the above example, it is probably already be pre-loaded from other websites.
If you want some fast lessons on jQuery, find free video tuts here:
https://www.thenewboston.com/videos.php?cat=32
or at
https://phpacademy.org/videos/jquery-basics

get all images in an array from directory and sub-directories

Currently I've similar to the following tree structure:
+images
+sub-directory
-image1.jpg
-image2.jpg
+sub-directory-2
-image3.jpg
-image4.jpg
-some-image.jpg
-another.jpg
<script>
<?php
//path to directory to scan. i have included a wildcard for a subdirectory
$directory = "images/*/";
//get all image files with a .jpg extension.
$images = glob("" . $directory . "*.jpg");
$imgs = '';
// create array
foreach($images as $image){ $imgs[] = "$image"; }
echo "var allImages = ".$imgs.";\n";
?>
console.log(allImages);
</script>
As I'm extremely new to php, I'm blindly getting logged as Array() in the console.
Also, I've set $directory = "images/*/"; which will get all images inside the subfolders only but not getting images inside parent directory that likely to images/some-image.jpg and I wanted to get this too.
I want all the images in an array like this (when I use console.log(allImages);):
['some-image.jpg','another.jpg','image1.jpg','image2.jpg','image3.jpg','image4.jpg']
I love JSON, keeps things nice and simple:
<?php
$images = glob("images/*/*.jpg");
$imgs = array();
foreach($images as $image){ $imgs[] = $image; }
?>
<script>
var allImages = JSON.parse('<?php echo json_encode($imgs);?>');
console.log( allImages);
</script>
Now you have the php array available in javascript, with the same structure. You can loop them with a for, of if you have jQuery, $.each().
I changed a code more to your style (mixing php and html), but you should try to split those in htmltemplates.
Im not 100% sure about this, but you can regex in your glob, if this works you don't need the foreach, this will return only the filenames:
$images = glob("~(?:images/*/)*\.jpg~");
What about this:
<script>
<?php
$directory = "images/*/";
$images = glob("" . $directory . "*.jpg");
echo "var allImages = ['".implode("', '", $images)."'];\n";
?>
console.log(allImages);
</script>
How about a recursive function?
function loadImages($folder)
{
$files = glob($folder);
foreach( $files as $file )
{
if(is_dir($file))
{
loadImages($file);
} else {
$images[] = $file; // add some file type validation here
}
}
return $images;
}
$images = json_encode(loadImages($startFolderPath));
I'm on an iPad so I can't test it.

Categories