Guide:Bipsi - Revision history

Rjt: jargon links

2021-10-12T14:18:11Z

jargon links

← Older revision		Revision as of 14:18, 12 October 2021
Line 1:		Line 1:
	==General Tips==		==General Tips==
	===Looking In Other Games===		===Looking In Other Games===
	If you see something you like in another game you can download it and ''import'' that HTML file into the Bipsi editor to learn how it was done. The trick is that you need to download only the game part; if it's on [[Guide:Itch.io\|Itch]] this will be in a ~~''[[Guide:Glossary#~~Frame\|frame~~]]''~~. If you use Firefox you can:		If you see something you like in another game you can download it and ''import'' that HTML file into the Bipsi editor to learn how it was done. The trick is that you need to download only the game part; if it's on [[Guide:Itch.io\|Itch]] this will be in a {{jargon\|Frame\|frame}}. If you use Firefox you can:

	# Right-click on the game		# Right-click on the game
Line 66:		Line 66:
	To play a piece of music while the game is running you can use this code in your exported HTML file.		To play a piece of music while the game is running you can use this code in your exported HTML file.

	Put it down the bottom, after the last <code></script></code> ~~''[[Guide:Glossary#~~Tag\|tag~~]]''~~, but before the <code></body></code> one.		Put it down the bottom, after the last <code></script></code> {{jargon\|Tag\|tag}}, but before the <code></body></code> one.

	<audio id="'''[id]'''" src="'''[path]'''" '''loop'''></audio>		<audio id="'''[id]'''" src="'''[path]'''" '''loop'''></audio>
Line 84:		Line 84:

	To explain the code:		To explain the code:
	* The <code>audio</code> ~~''[[Guide:Glossary#~~Element\|element~~]]''~~ is regular HTML for playing sounds.		* The <code>audio</code> {{jargon\|Element\|element}} is regular HTML for playing sounds.
	* The stuff in the <code>script</code> ''element'' is what controls it. The ~~''[[Guide:Glossary#~~Function\|function~~]]''~~ finds the item with the specified ''ID'', and tells it to start playing.		* The stuff in the <code>script</code> ''element'' is what controls it. The {{jargon\|Function\|function}} finds the item with the specified ''ID'', and tells it to start playing.
	* The two <code>document.addEventListener</code> pieces are triggered when a mouse button is released, or a keyboard key is pressed, and they tell the ''function'' to run, thus playing the audio.		* The two <code>document.addEventListener</code> pieces are triggered when a mouse button is released, or a keyboard key is pressed, and they tell the ''function'' to run, thus playing the audio.

Rjt: /* Hacking The Exported HTML */ Some suggestions

2021-08-27T04:02:12Z

Hacking The Exported HTML: Some suggestions

← Older revision		Revision as of 04:02, 27 August 2021
Line 54:		Line 54:
	==Hacking The Exported HTML==		==Hacking The Exported HTML==
	Because Bipsi exports regular HTML files, if you know enough HTML, CSS, and or JavaScript, you can have fun adding extra features.		Because Bipsi exports regular HTML files, if you know enough HTML, CSS, and or JavaScript, you can have fun adding extra features.

			Some ideas:

			* Overlay an image. Could be useful for a HUD or a shadowy forest scene, or ...
			* Use a different font.
			* Use a form to get info. from the player. Could use it to refer to a player by name.
			* ...

	===Music===		===Music===

Rjt: Music feature related updates

2021-08-26T07:14:48Z

Music feature related updates

← Older revision		Revision as of 07:14, 26 August 2021
Line 24:		Line 24:
	\|-		\|-
	\| is-player \|\| tag \|\| Tells game where to start the player. Not sure if it's useful later.		\| is-player \|\| tag \|\| Tells game where to start the player. Not sure if it's useful later.
			\|-
			\| music \|\| file \|\| Play an music file. The user guide for advanced features, like having a library of multiple songs.
	\|-		\|-
	\| one-time \|\| tag \|\| Run event only once.		\| one-time \|\| tag \|\| Run event only once.
Line 54:		Line 56:

	===Music===		===Music===
			{{nb\|Bipsi now has music stuff built-in! I'll leave this here for now as an example though — [[User:Rjt\|rjt]] ([[User talk:Rjt\|talk]])}}
	To play a piece of music while the game is running you can use this code in your exported HTML file.		To play a piece of music while the game is running you can use this code in your exported HTML file.

Line 71:		Line 74:
	* The two instances of '''<code>[id]</code>''' with a name to represent your audio.		* The two instances of '''<code>[id]</code>''' with a name to represent your audio.
	* The one instance of '''<code>[path]</code>''' with the directory path of your audio file. Remember to use forward slash <code>/</code> to separate directories, unlike the backslashes Windows uses. If your audio file's in the same directory as your HTML file you can just enter the audio files name on its own.		* The one instance of '''<code>[path]</code>''' with the directory path of your audio file. Remember to use forward slash <code>/</code> to separate directories, unlike the backslashes Windows uses. If your audio file's in the same directory as your HTML file you can just enter the audio files name on its own.
	* If you don't want the audio to loop, you can remove '''loop''' from the audio element.		* If you don't want the audio to loop, you can remove '''<code>loop</code>''' from the audio element.

	To explain the code:		To explain the code:

Rjt: /* Music */ audio looping

2021-08-25T04:47:05Z

Music: audio looping

← Older revision		Revision as of 04:47, 25 August 2021
Line 58:		Line 58:
	Put it down the bottom, after the last <code></script></code> ''[[Guide:Glossary#Tag\|tag]]'', but before the <code></body></code> one.		Put it down the bottom, after the last <code></script></code> ''[[Guide:Glossary#Tag\|tag]]'', but before the <code></body></code> one.

	<audio id="'''[id]'''" src="'''[path]'''"></audio>		<audio id="'''[id]'''" src="'''[path]'''" '''loop'''></audio>
	<script>		<script>
	function PlayAudio() {		function PlayAudio() {
Line 71:		Line 71:
	* The two instances of '''<code>[id]</code>''' with a name to represent your audio.		* The two instances of '''<code>[id]</code>''' with a name to represent your audio.
	* The one instance of '''<code>[path]</code>''' with the directory path of your audio file. Remember to use forward slash <code>/</code> to separate directories, unlike the backslashes Windows uses. If your audio file's in the same directory as your HTML file you can just enter the audio files name on its own.		* The one instance of '''<code>[path]</code>''' with the directory path of your audio file. Remember to use forward slash <code>/</code> to separate directories, unlike the backslashes Windows uses. If your audio file's in the same directory as your HTML file you can just enter the audio files name on its own.
			* If you don't want the audio to loop, you can remove '''loop''' from the audio element.

	To explain the code:		To explain the code:

Rjt: Code for playing music, shuffling, and example game with neat JS

2021-08-24T17:08:41Z

Code for playing music, shuffling, and example game with neat JS

@@ Line 1: / Line 1: @@
 ==General Tips==
-If you see something you like in another game you can download it and ''import'' that HTML file into the Bipsi editor to learn how it was done. The trick is that you need to download only the game part; if it's on [[Guide:Itch.io|Itch]] this will be in a ''[[Guide:Glossary#frame|frame]]''. If you use Firefox you can:
+===Looking In Other Games===
-# Right-click on the game and select
+# Right-click on the game
 # Go to the 'T<u>h</u>is Frame' option
 # Select 'Save <u>F</u>rame As...'
-==Keyboard Shortcuts==
+===Keyboard Shortcuts===
 * The arrow keys will move your selection, indicated by a thick, white outline.
 * Q, W, E, R, T selects tabs in order.
@@ Line 43: / Line 44: @@
 Please add more!
 ==See Also==

Rjt: General Tips section with info on downloading other peoples' games

2021-08-24T13:46:14Z

General Tips section with info on downloading other peoples' games

← Older revision		Revision as of 13:46, 24 August 2021
Line 1:		Line 1:
			==General Tips==
			If you see something you like in another game you can download it and ''import'' that HTML file into the Bipsi editor to learn how it was done. The trick is that you need to download only the game part; if it's on [[Guide:Itch.io\|Itch]] this will be in a ''[[Guide:Glossary#frame\|frame]]''. If you use Firefox you can:

			# Right-click on the game and select
			# Go to the 'T<u>h</u>is Frame' option
			# Select 'Save <u>F</u>rame As...'

	==Keyboard Shortcuts==		==Keyboard Shortcuts==
	* The arrow keys will move your selection, indicated by a thick, white outline.		* The arrow keys will move your selection, indicated by a thick, white outline.

Rjt: /* Events */ transparent/tag, js section

2021-08-24T10:20:38Z

Events: transparent/tag, js section

← Older revision		Revision as of 10:20, 24 August 2021
Line 5:		Line 5:

	==Events==		==Events==
			===Quick Reference===
	For better explanations see the [https://kool.tools/bipsi/user-guide.pdf user guide], but I've found it helpful to keep this quick reference list.		For better explanations see the [https://kool.tools/bipsi/user-guide.pdf user guide], but I've found it helpful to keep this quick reference list.

	{\| class="wikitable sortable"		{\| class="wikitable sortable"
	! ~~Part 1~~ !! ~~Part 2~~ !! Description		! Field !! Type !! Description
	\|-		\|-
	\| exit \|\| location \|\| Move player to another place.		\| exit \|\| location \|\| Move player to another place.
Line 23:		Line 24:
	\|-		\|-
	\| solid \|\| tag \|\| Makes event impassable.		\| solid \|\| tag \|\| Makes event impassable.
			\|-
			\| touch \|\| javascript \|\| Add your own custom code. See §[[#JavaScript\|JavaScript]] for some examples.
			\|-
			\| transparent \|\| tag \|\| Makes background colour of tile transparent.
	\|-		\|-
	\| page-color \|\| text \|\| Changes page's background colour. Use [https://developer.mozilla.org/en-US/docs/Web/CSS/color_value#color_keywords CSS colour names] only.		\| page-color \|\| text \|\| Changes page's background colour. Use [https://developer.mozilla.org/en-US/docs/Web/CSS/color_value#color_keywords CSS colour names] only.
	\|}		\|}

			===JavaScript===
			Some examples of JavaScript you can insert. See the [https://kool.tools/bipsi/scripting-guide.pdf scripting guide] for more information.

			Please add more!

	==See Also==		==See Also==

Rjt: Started event quick reference

2021-08-24T07:56:24Z

Started event quick reference

@@ Line 1: / Line 1: @@
 ==Keyboard Shortcuts==
-* Switch tabs:
+* The arrow keys will move your selection, indicated by a thick, white outline.
-** Arrow keys will move through tabs.
+* Q, W, E, R, T selects tabs in order.
-** Q, W, E, R, T selects tabs in order.
+* Draw Room tab: Holding Alt will use eyedropper/pick tile.
 * Draw Room tab:
-** Holding Alt will use eyedropper/pick tile.
+==Events==
 ==See Also==

Rjt: Link to main Bipsi page

2021-08-19T20:03:41Z

Link to main Bipsi page

← Older revision		Revision as of 20:03, 19 August 2021
Line 7:		Line 7:

	==See Also==		==See Also==
			* [[Bipsi]]
	* [https://kool.tools/bipsi/user-guide.pdf bipsi game maker user guide] - Game making beginner friendly! PDF format.		* [https://kool.tools/bipsi/user-guide.pdf bipsi game maker user guide] - Game making beginner friendly! PDF format.
	* [https://kool.tools/bipsi/scripting-guide.pdf bipsi game maker scripting guide] - Guide for advanced scripting. Also PDF.		* [https://kool.tools/bipsi/scripting-guide.pdf bipsi game maker scripting guide] - Guide for advanced scripting. Also PDF.

Rjt: Some keyboard shorties I've found

2021-08-19T20:02:28Z

Some keyboard shorties I've found

New page

==Keyboard Shortcuts==
* Switch tabs:
** Arrow keys will move through tabs.
** Q, W, E, R, T selects tabs in order.
* Draw Room tab:
** Holding Alt will use eyedropper/pick tile.

==See Also==
* [https://kool.tools/bipsi/user-guide.pdf bipsi game maker user guide] - Game making beginner friendly! PDF format.
* [https://kool.tools/bipsi/scripting-guide.pdf bipsi game maker scripting guide] - Guide for advanced scripting. Also PDF.