HTML Need help to add gifs or video in my game

[worgenxtream67]

Hello everyone, I'm using twine with sugarcube to create my first html real porn game, and i want to add gifs and vidéo in my game, i know how to add 1 or more vidéo on the same page, but not how to create random vidéo, i want that in the player room, he can click on computer, and clickon look porn and there is 1 random gifs or vidéo appear and i don't know how to do this ?
I'm bad in english and it's my first game so i'm a real beginner x)

 

[KillerCat!]

You can add Images/Gifs [img[Here/is/My/Img.png]] like so.
Here is the

You must be registered to see the links

documentation (Sugarcube Docs)

You can also just add them as basic HTML Elements using:
<img src="Here/is/my/image.png">
<video src="Here/is/my/video.mp4" autoplay></video>

You must be registered to see the links

documentation

You must be registered to see the links

documentation

You can make something random by doing something a little like this:
<<set _Video = ["Here/is/my/Video.mp4", "Here/is/my/Video2.mp4", "Here/is/my/Video3.mp4"].random()>>
<video @src=_Video autoplay></video
Do not forget the @ symbol or it will not work! (It lets Sugarcube know you want it to run logic first!)

If you are this brand new to Sugarcube, I would recommend you watch/read some tutorials first, to get a hang of things like this!
Have a great rest of your day!

 

[worgenxtream67]

You can add Images/Gifs [img[Here/is/My/Img.png]] like so.
Here is the

You must be registered to see the links

documentation (Sugarcube Docs)

You can also just add them as basic HTML Elements using:
<img src="Here/is/my/image.png">
<video src="Here/is/my/video.mp4" autoplay></video>

You must be registered to see the links

documentation

You must be registered to see the links

documentation

You can make something random by doing something a little like this:
<<set _Video = ["Here/is/my/Video.mp4", "Here/is/my/Video2.mp4", "Here/is/my/Video3.mp4"].random()
<video @src=_Video autoplay></video
Do not forget the @ symbol or it will not work! (It lets Sugarcube know you want it to run logic first!)

If you are this brand new to Sugarcube, I would recommend you watch/read some tutorials first, to get a hang of things like this!
Have a great rest of your day!

Thank you, i will try this tomorrow,yes i'm really new, have begin yesterday x) i've read sugarcube documentation, watch tuto on youtube ect but i've never find what i was looking for, so thank you, and hope i can do it

 

[worgenxtream67]

Hello, i have try today and i've found how to do it, thank you !

that's what i've done:

<<nobr>><<switch random(1, 4)>>
<<case 1>>
<img src="URL" /><br>
<<case 2>>
<img src="URL" /><br>
<<case 3>>
<img src="URL" /><br>
<<case 4>>
<img src="URL" /><br>
<</switch>><</nobr>>

 

[Feyschek]

Hello everyone, I'm using twine with sugarcube to create my first html real porn game, and i want to add gifs and vidéo in my game, i know how to add 1 or more vidéo on the same page, but not how to create random vidéo, i want that in the player room, he can click on computer, and clickon look porn and there is 1 random gifs or vidéo appear and i don't know how to do this ?
I'm bad in english and it's my first game so i'm a real beginner x)

Here's the code I'm currently using to create random videos.
The only disadvantage may be for you that the video should be named in the form of numbers.

<video autoplay loop muted><source @src='"Content/Pornohub/"+random(1,200)+".webm"' type="video/webm"></video>

After that, you need to create a button that will update the video content.

<span id="videocontent">\
<video autoplay loop muted><source @src='"Content/Pornohub/"+random(1,200)+".webm"' type="video/webm"></video>\
</span>\

<<button "repeat">>\
<<done>><<replace "#videocontent">>\

<video autoplay loop muted><source @src='"Content/Pornohub/"+random(1,200)+".webm"' type="video/webm"></video>\

<</replace>><</done>>\
<</button>>\

After clicking the "repeat" button, the game will update this section of the content which is in the <span> macro.
Have fun.

 

[KillerCat!]

Hello, i have try today and i've found how to do it, thank you !

that's what i've done:

<<nobr>><<switch random(1, 4)>>
<<case 1>>
<img src="URL" /><br>
<<case 2>>
<img src="URL" /><br>
<<case 3>>
<img src="URL" /><br>
<<case 4>>
<img src="URL" /><br>
<</switch>><</nobr>>

My Way of doing it would look a little like this:
<<set _img to ["URL1", "URL2", "URL3"].random()>>
<img @src=_img>
As this is a little more compact for my linking, but I understand if you choose a different route, as many paths lead to the same exit.

Also if you're using a <<nobr>> macro you might as well use some spaces and indentation, for it to be easier to read.
Something a little like this:

Hope you're having a great day, and good luck on making your game!

 

[Feyschek]

My Way of doing it would look a little like this:
<<set _img to ["URL1", "URL2", "URL3"].random()>>
<img @src=_img>
As this is a little more compact for my linking, but I understand if you choose a different route, as many paths lead to the same exit.

Also if you're using a <<nobr>> macro you might as well use some spaces and indentation, for it to be easier to read.
Something a little like this:
View attachment 3804624
Hope you're having a great day, and good luck on making your game!

It's enough to do these things and that's it, you'll have spaces between the lines.

<<button "repeat">>\

<</button>>\

<<nobr>> it is convenient, but it is better to do manual control.

 

[KillerCat!]

<<button "repeat">>\

<</button>>\

Why are you putting in a button? Maybe I understood this wrong, I thought the Author wanted a random image to appear, and not for there to be a functionality of cycling through all the random images?

It's enough to do these things and that's it, you'll have spaces between the lines.

Every game looks a little different, as well as the code, I added indentation because I feel it adds very much to the visibility/readability, I don't know if the author rewrote the code here and struggled with the spacing or if this is his 1 to 1 copy of his in Twine Code, so I was just putting this out for him to see that's it a possibility.

<<nobr>> it is convenient, but it is better to do manual control.

What do you mean by Manual Control?
<<nobr>> or using Config.passages.nobr = true is basically manual control?
As the game will never generate a <br> tag for you, you can add them manually by using <br>.

Also, for all of my projects,
I add nobr where ever possible or toggle it permanently, as widgets and or macros might generate unwanted break lines, and make a passage have a ridiculous 5-line break between content.

Hope you're also having a nice day!

 

[worgenxtream67]

My Way of doing it would look a little like this:
<<set _img to ["URL1", "URL2", "URL3"].random()>>
<img @src=_img>
As this is a little more compact for my linking, but I understand if you choose a different route, as many paths lead to the same exit.

Also if you're using a <<nobr>> macro you might as well use some spaces and indentation, for it to be easier to read.
Something a little like this:
View attachment 3804624
Hope you're having a great day, and good luck on making your game!

Thank you, yes i have do it like this, with indentation, it's easier to read

 

[Feyschek]

Why are you putting in a button? Maybe I understood this wrong, I thought the Author wanted a random image to appear, and not for there to be a functionality of cycling through all the random images?

Have you read my code? I just thought that the author wanted to create an excerpt in which the player could watch porn on the computer.

Spoiler

You don't have permission to view the spoiler content. Log in or register now.

As soon as the player clicks the button, the <span> section is updated because in the code for the video "+random"

Well, let's say the author wants to put pictures instead of videos, this code can be easily changed.

Spoiler

You don't have permission to view the spoiler content. Log in or register now.

Every game looks a little different, as well as the code, I added indentation because I feel it adds very much to the visibility/readability, I don't know if the author rewrote the code here and struggled with the spacing or if this is his 1 to 1 copy of his in Twine Code, so I was just putting this out for him to see that's it a possibility.

I'm sorry, I made a mistake here, I meant "that you won't have any problems."

Why are you putting in a button? Maybe I understood this wrong, I thought the Author wanted a random image to appear, and not for there to be a functionality of cycling through all the random images?


Every game looks a little different, as well as the code, I added indentation because I feel it adds very much to the visibility/readability, I don't know if the author rewrote the code here and struggled with the spacing or if this is his 1 to 1 copy of his in Twine Code, so I was just putting this out for him to see that's it a possibility.


What do you mean by Manual Control?
<<nobr>> or using Config.passages.nobr = true is basically manual control?
As the game will never generate a <br> tag for you, you can add them manually by using <br>.

Also, for all of my projects,
I add nobr where ever possible or toggle it permanently, as widgets and or macros might generate unwanted break lines, and make a passage have a ridiculous 5-line break between content.

Hope you're also having a nice day!

I think I put it a little wrong in my expression. For me, manual control of the space between the lines is the use of such a technique.

<<button "repeat">>\

<</button>>\

I just put this sign at the end of each code or macro and that's it.
By the way, have you tried using the <<nobr>> tag?) It's just that, for example, I use <<nobr>> in widgets, because these critters really create a lot of spaces between lines -_-

By the way, I advise you to play around with these things in the stylesheets section.

letter-spacing: 0em;
line-height: 0;

Put them in this section.

Spoiler

You don't have permission to view the spoiler content. Log in or register now.

Although I personally create individual elements that will contain content and insert this into their element and customize it.

 

[KillerCat!]

I just put this sign at the end of each code or macro and that's it.
By the way, have you tried using the <<nobr>> tag?) It's just that, for example, I use <<nobr>> in widgets, because these critters really create a lot of spaces between lines -_-

I understand, but I usually find that whenever I find myself using the Backslashes ( \ ), I end up having to go over the passage multiple times due to missed lines. That's why I mostly either do a [nobr] tags, or I just disable nobr in the whole project over the

You must be registered to see the links

. and if I ever need an empty line I'll just add a <br>

By the way, I advise you to play around with these things in the stylesheets section.

letter-spacing: 0em;
line-height: 0;

Yeah, these are the usual hidden culprits when it comes to wasted space hehe...
But it also depends on your Font, it works pretty well until you actually have a funky font like the Pixel-art Fonts, and then you tweak these for it to work in a legible manner.

There are also quite a few default CSS elements that have very terrible paddings/margins.

using a all: unset; in your CSS can also work wonders from time to time.

 

[Feyschek]

I understand, but I usually find that whenever I find myself using the Backslashes ( \ ), I end up having to go over the passage multiple times due to missed lines. That's why I mostly either do a [nobr] tags, or I just disable nobr in the whole project over the

You must be registered to see the links

. and if I ever need an empty line I'll just add a <br>

As you said, everyone has a method of working with code.

Yeah, these are the usual hidden culprits when it comes to wasted space hehe...
But it also depends on your Font, it works pretty well until you actually have a funky font like the Pixel-art Fonts, and then you tweak these for it to work in a legible manner.

There are also quite a few default CSS elements that have very terrible paddings/margins.

using a all: unset; in your CSS can also work wonders from time to time.

It's quite interesting.
Although I think it is clearly not needed in my new project.