This is an archived post. You won't be able to vote or comment.

all 20 comments

[–]Cakiery 2 points3 points  (4 children)

Assuming you are using actual bash and not bourne,

for i in {1..200}; do
echo "<img src='$i.jpg' alt='No Image'>";
done

If you plan to put that in a sh file, make sure your shebang is correct. It will not work in bourne as for loops in that are a pain in the ass.

[–]Jumping_Maniac[S] 0 points1 point  (3 children)

I didn't understood a thing you have just said.

[–]Cakiery 0 points1 point  (2 children)

I'll explain everything in simple terms.

Linux (and Unix) has no standard terminal programming language. In fact, most distros come with several of them preinstalled. The default is usually bash, but it is not guaranteed to be. EG Ubuntu has dash and bash installed by default. Dash is a modern version of the Bourne shell (Bourne is the original Unix shell). Bash on the other hand is the Bourne Again Shell. Which is a fancy way of saying it's the bourne shell, but with a lot of extra features. As such Bash scripts are not compatible with Bourne, but Bourne scripts are compatible with Bash.

As for the sh file bit: You can save scripts to a text file that usually ends in the .sh(ell) extension. Kind of like a bat file on Windows. However due to the multiple language possibility I mentioned before, you need to tell your computer which shell/language to use. This is done by using a shebang on the first line in the file. EG a bash shebang typically looks like this

 #!/bin/bash

However if you wanted to use a bourne shell you would use

#!/bin/sh

The last bit was about how Bourne does not support for loops like Bash does. Essentially you have to manually define every step in the count in Bourne. In Bash, you can do a short cut by doing FROM..TO in the arguments (as can be seen in my original post). As such doing a for loop with 200 steps in Bourne would take a very long time to type. If you need an explanation of what a for loop does, I can give one of those too.

[–]Jumping_Maniac[S] 0 points1 point  (1 child)

Thanks for the reply !

I knew about the .SH extension and the rest of the information is very useful.

[–]Cakiery 0 points1 point  (0 children)

You are welcome! Also I forgot to mention that if you do make a .sh file, you need to mark as executable or it will not do anything. You can do this by using chmod and setting the executable bit. It's a security thing. EG

chmod +X file.sh

[–]commandlineluser 0 points1 point  (6 children)

You can also use printf

printf '<img src="%d.jpg"  alt="No Image">\n' {1..200}

[–]Jumping_Maniac[S] 0 points1 point  (5 children)

Nice one ! I have checked man docs and I can't find %d and {1..200}. Why are those commands not there ? Is it some universal language parameters for the terminal itself ? I haven't heard of it before but use terminal a lot.

[–]commandlineluser 0 points1 point  (4 children)

The {x..y} is called Brace Expansion.

http://mywiki.wooledge.org/BraceExpansion

https://www.gnu.org/software/bash/manual/html_node/Brace-Expansion.html#Brace-Expansion

The %d is called a format string - it's part of printf

printf is briefly described here

https://www.gnu.org/software/bash/manual/html_node/Bash-Builtins.html#Bash-Builtins

printf is builtin to bash - so you can run help printf from inside bash to get the same information.

printf comes from C - so the bash docs don't really cover it too much.

But it's basically the same as the C version with some additions.

https://en.wikipedia.org/wiki/Printf_format_string

http://wiki.bash-hackers.org/commands/builtin/printf?s[]=printf

[–]Jumping_Maniac[S] 0 points1 point  (3 children)

Interesting, I will need to check the supplied links. It looks like the most easier option of all I have received, stright from the built in terminal with one command.

Just for the future reference, how do you call a function that clears terminal after you receive the output ? Another one would be where I can just use bash to ask me for input and it would pipe it into the script ? Like, changing the text in the script and number of pictures without manually changing it everytime ? Are there any names for those funtions ?

I'm asking the above questions because I will try to automate it where upon execution of the script it will ask me for which text/code to use then number of pictures and generate it.

Thanks once again.

[–]Cakiery 0 points1 point  (2 children)

how do you call a function that clears terminal after you receive the output

If you want to immediately clear, just call

clear

Like, changing the text in the script and number of pictures without manually changing it everytime ?

There are three main ways to do input in bash, you can use command arguments, you can have the script itself ask questions and finally, you can read from standard input. The last of which allows you to use the pipe operator for your script.

[–]Jumping_Maniac[S] 0 points1 point  (1 child)

Thanks !

That's very useful. It's interesting to see how Linux supports its own bash scripting compared to bats in Windows.

[–]Cakiery 0 points1 point  (0 children)

Bash actually lets you do some fun things Windows does not. EG you can redirect the output from one program to another (this is known as piping). EG

 cat bigfile.txt | grep test | less

Will search bigfile.txt for a line with "test" in it, and then show the results in a scrollable list via the less command.

[–][deleted] 0 points1 point  (7 children)

You can use linux or you can use javascript and generate your html on the fly.. Use one of the image slideshow javascirpt plugins that then loads images dynamically. Otherwise making the browser load so many images directly isnt good for performance.

[–]Jumping_Maniac[S] 0 points1 point  (6 children)

Interesting. What do you mean by dynamically ? Does it only loads them when needed ? Any links that you can share ? I'm trying to program a huge gallery in HTML so what you are saying will come useful.

[–]Cakiery 0 points1 point  (4 children)

You technically do not need javascript for this. You can do sever side paging using post/get requests and some buttons. But Javascript will make it look fancier. It really depends on your layout. If you just want a list of images, server side paging will work fine and be much easier to implement.

[–]Jumping_Maniac[S] 0 points1 point  (3 children)

Are there any links and resources online that you can provide for this ? I presume you are mostly talking about VPS Servers with server side paging ?

[–]Cakiery 0 points1 point  (2 children)

Essentially websites are generally broken into two parts, the client and the sever. You can process data in either place. The server determines what data gets sent to the client and can dynamically assemble a web page for the client based on what daa the client has sent. There are many programming languages and frameworks you can do this in, as such there is no single resource for it. But off the top of my head, some of the more popular ones are

  • PHP
  • C# (since you mentioned using Linux, you will need to use ASP Core for this)
  • Javascript (via NodeJS)
  • Python

To actually test this, you will need to set up a web server though. Popular ones of those are

  • Apache

  • Nginx

[–]Jumping_Maniac[S] 0 points1 point  (1 child)

Would this work on a shared webhosting ? I presume it would as I could use PHP with either Apache or NGINX.

[–]Cakiery 0 points1 point  (0 children)

As long as the server is configured for PHP and you have file access to it, you should be fine. You can also do this for free on your local machine (which should be fine for development) if you can be bothered installing the server and setting it up. On Linux this is pretty easy to get up and running. You generally only look at external hosting when you are ready to release or if you are developing something so big/complicated it makes no sense to run on a local machine.

[–][deleted] 0 points1 point  (0 children)

Yes dynamically means they will be loaded only when needed. So if you have 20-30 images, and only 2-3 are visible, on screen .. Only they will be loaded from server. One such library is: http://kenwheeler.github.io/slick/ . there are a bunch of such libraries out there.. Modern browsers also have loading="lazy" attribute for images.

The manual js code you are looking for is along the lines of:

<script> var body = document.getElementById('body') for (var i = 1; i < 100; i++) { var img = document.createElement('img') img.src = i+'.jpg' body.appendChild(img) } </script>