Compare commits
3 Commits
Author | SHA1 | Date |
---|---|---|
Rudis Muiznieks | d13f5cd27b | |
Rudis Muiznieks | f407ad8b46 | |
Rudis Muiznieks | 5e1b125f80 |
|
@ -0,0 +1,21 @@
|
||||||
|
MIT License
|
||||||
|
|
||||||
|
Copyright (c) 2020 Rudis Muiznieks
|
||||||
|
|
||||||
|
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||||
|
of this software and associated documentation files (the "Software"), to deal
|
||||||
|
in the Software without restriction, including without limitation the rights
|
||||||
|
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||||
|
copies of the Software, and to permit persons to whom the Software is
|
||||||
|
furnished to do so, subject to the following conditions:
|
||||||
|
|
||||||
|
The above copyright notice and this permission notice shall be included in all
|
||||||
|
copies or substantial portions of the Software.
|
||||||
|
|
||||||
|
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||||
|
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||||
|
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||||
|
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||||
|
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||||
|
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||||
|
SOFTWARE.
|
|
@ -1,6 +1,6 @@
|
||||||
# Ficdown.js
|
# Ficdown.js
|
||||||
|
|
||||||
Ficdown is a system for building interactive fiction using MarkDown syntax, and Ficdown.js is a Javascript library for presenting Ficdown stories interactively in a web browser. See [Ficdown.com](http://www.ficdown.com/) for more information.
|
Ficdown is a system for building interactive fiction using MarkDown syntax, and Ficdown.js is a Javascript library for presenting Ficdown stories interactively in a web browser.
|
||||||
|
|
||||||
## Dependencies
|
## Dependencies
|
||||||
|
|
||||||
|
@ -25,7 +25,7 @@ You can combine all three `build`, `pack`, and `minify` steps with this command:
|
||||||
|
|
||||||
## Usage
|
## Usage
|
||||||
|
|
||||||
You can obtain *ficdown.js* or *ficdown.min.js* from the latest version on the [releases](https://github.com/rudism/Ficdown.js/releases) page. See the example [test.html](https://github.com/rudism/Ficdown.js/blob/master/test.html) file for basic usage and styling. The example includes the story content in a hidden text area so it can run locally in a browser.
|
You can obtain *ficdown.js* or *ficdown.min.js* from the latest version on the [releases](https://code.sitosis.com/rudism/ficdown.js/releases) page. See the example [test.html](https://github.com/rudism/Ficdown.js/blob/master/test.html) file for basic usage and styling. The example includes the story content in a hidden text area so it can run locally in a browser.
|
||||||
|
|
||||||
```javascript
|
```javascript
|
||||||
var player = new Ficdown(playerOptions);
|
var player = new Ficdown(playerOptions);
|
||||||
|
@ -37,6 +37,7 @@ Your `playerOptions` should be an object with the following properties:
|
||||||
- `source`: Your story's ficdown code. Either store it right in the html document, or make an XHR to pull the story content in from an external file, and put its content here.
|
- `source`: Your story's ficdown code. Either store it right in the html document, or make an XHR to pull the story content in from an external file, and put its content here.
|
||||||
- `id`: The id of a div on the page to inject the game into. For example if your html is `<div id='game'/>` then you would pass `game` here.
|
- `id`: The id of a div on the page to inject the game into. For example if your html is `<div id='game'/>` then you would pass `game` here.
|
||||||
- `scroll` (optional): Set this to `true` if you want the player's full game history to remain on the screen and automatically scroll the page down whenever a new scene is added to the bottom. By default each scene will replace the previous one and the page will be scrolled to the top.
|
- `scroll` (optional): Set this to `true` if you want the player's full game history to remain on the screen and automatically scroll the page down whenever a new scene is added to the bottom. By default each scene will replace the previous one and the page will be scrolled to the top.
|
||||||
|
- `scrollParent` (optional): The container to scroll. Used even if `scroll=false` to reset the page position to the top whenever a new scene is displayed. Defaults to the document or `body` element of the page.
|
||||||
- `html` (optional): Set this to true if your ficdown file contains raw html that you want rendered. By default html will not be rendered.
|
- `html` (optional): Set this to true if your ficdown file contains raw html that you want rendered. By default html will not be rendered.
|
||||||
- `startText` (optional): Set this to override the link text that begins the game.
|
- `startText` (optional): Set this to override the link text that begins the game.
|
||||||
- `endMarkdown` (optional): Set this to override the "game over" content that is displayed when the player reaches a scene with no more links to follow. Include an anchor with the href set to `restart()` if you want a link that will start the story over from the beginning.
|
- `endMarkdown` (optional): Set this to override the "game over" content that is displayed when the player reaches a scene with no more links to follow. Include an anchor with the href set to `restart()` if you want a link that will start the story over from the beginning.
|
||||||
|
|
|
@ -1,7 +1,8 @@
|
||||||
{
|
{
|
||||||
"name": "ficdown.js",
|
"name": "ficdown.js",
|
||||||
"version": "2.0.3",
|
"version": "2.0.4",
|
||||||
"description": "A parser and player for Interactive Fiction written in Ficdown",
|
"description": "A parser and player for Interactive Fiction written in Ficdown",
|
||||||
|
"license": "MIT",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"build": "rm -rf ./build && tsc",
|
"build": "rm -rf ./build && tsc",
|
||||||
"pack": "browserify build/unpacked/main.js --standalone Ficdown > ./build/ficdown.js",
|
"pack": "browserify build/unpacked/main.js --standalone Ficdown > ./build/ficdown.js",
|
||||||
|
|
|
@ -2,6 +2,7 @@ export type PlayerOptions = {
|
||||||
source: string, // ficdown story source
|
source: string, // ficdown story source
|
||||||
id: string, // id of div to inject game into
|
id: string, // id of div to inject game into
|
||||||
scroll?: boolean, // continuous scroll mode
|
scroll?: boolean, // continuous scroll mode
|
||||||
|
scrollParent?: string, // id of the parent container to scroll
|
||||||
html?: boolean, // allow html in story source
|
html?: boolean, // allow html in story source
|
||||||
startText?: string, // custom link text to start game
|
startText?: string, // custom link text to start game
|
||||||
endMarkdown?: string, // custom markdown when game ends
|
endMarkdown?: string, // custom markdown when game ends
|
||||||
|
|
|
@ -104,12 +104,19 @@ export class Player {
|
||||||
const scrollId = `move-${ this.moveCounter++ }`;
|
const scrollId = `move-${ this.moveCounter++ }`;
|
||||||
this.container.append($('<span/>').attr('id', scrollId));
|
this.container.append($('<span/>').attr('id', scrollId));
|
||||||
this.container.append(newHtml);
|
this.container.append(newHtml);
|
||||||
$([document.documentElement, document.body]).animate({
|
const scrollParent = this.options.scrollParent
|
||||||
|
? $(`#${ this.options.scrollParent }`)
|
||||||
|
: $([document.documentElement, document.body]);
|
||||||
|
scrollParent.animate({
|
||||||
scrollTop: $(`#${ scrollId }`).offset()!.top,
|
scrollTop: $(`#${ scrollId }`).offset()!.top,
|
||||||
}, 1000);
|
}, 1000);
|
||||||
} else {
|
} else {
|
||||||
this.container.html(newHtml);
|
this.container.html(newHtml);
|
||||||
window.scrollTo(0, 0);
|
if (this.options.scrollParent) {
|
||||||
|
$(`#${ this.options.scrollParent }`)[0].scrollTop = 0;
|
||||||
|
} else {
|
||||||
|
window.scrollTo(0, 0);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
this.wireLinks();
|
this.wireLinks();
|
||||||
this.checkGameOver();
|
this.checkGameOver();
|
||||||
|
|
Loading…
Reference in New Issue