1
0
Fork 0
mirror of https://gitlab.com/Oreolek/salet.git synced 2024-05-02 00:59:39 +03:00

Switching to ES6/Vite

This commit is contained in:
Alexander Yakovlev 2023-11-17 12:21:42 +06:00
parent a67f14e385
commit e3b2b21fe6
6 changed files with 688 additions and 6385 deletions

View file

@ -1,216 +0,0 @@
import dialogue from './_dialogue'
import phrase from './_phrase'
salet.game_id = "your-game-id-here"
salet.game_version = "1.6"
$(document).ready(() ->
window.addEventListener('popstate', (event) ->
salet.goBack()
)
$("#night").on("click", () ->
if (window.night)
styles = {
"-webkit-filter": ""
"filter": ""
"background-color": ""
}
$("body").css(styles)
$("#night").removeClass("active")
window.night = false
else
styles = {
"-webkit-filter": "invert(1)hue-rotate(180deg)"
"filter": "invert(1)hue-rotate(180deg)"
"background-color": "#000"
}
$("body").css(styles)
$("#night").addClass("active")
window.night = true
)
salet.beginGame()
)
###
Element helpers. There is no real need to build monsters like a().id("hello")
because you won't use them as is. It does not make sense in context, the
author has Markdown and all utilities to *forget* about the markup.
###
way_to = (content, ref) ->
return "<a href='#{ref}' class='way'>#{content}</a>"
textlink = (content, ref) ->
return "<a href='./_writer_#{ref}' class='once'>#{content}</a>"
actlink = (content, ref) ->
return "<a href='./#{ref}' class='once'>#{content}</a>"
# The first room of the game.
# For accessibility reasons the text is provided in HTML, not here.
room "start",
enter: () ->
salet.character.bought_lamp = false
dsc: """
""",
choices: "#start"
# This is a special inventory room.
# The inventory button is a regular link to this room.
# You may alter these as much as you like or scrap it along with the button.
room "inventory",
canSave: false # saving the game here is forbidden. Aautosaving too.
enter: () ->
$("#inventory").hide()
exit: () ->
$("#inventory").show()
dsc: () ->
if salet.character.inventory.length == 0
text = "You are carrying nothing."
else
text = "You are carrying:\n\n"
for thing in salet.character.inventory
text += "* #{salet.character.listinv(thing.name)}\n"
return text+"\n\n"+"""
<div class="center"><a href="./exit"><button class="btn btn-lg btn-outline-primary">Go back</button></a></div>
"""
actions:
exit: () ->
return salet.goBack()
room "world",
tags: ["start"],
optionText: "Enter the world",
ways: ["plaza"]
dsc: """
### Rhinestone Room
You're in a large room carved inside a giant milky rock mountain.
The floor and walls are littered with signs and signatures of the previous visitors.
"""
units: [
unit "well",
dsc: "A steep narrow {{well}} proceeds upward."
act: "There is only one passage out. See the „Other rooms“ block popped up? Click it."
]
room "plaza",
title: (from) ->
if from == "world"
return "Upwards"
else
return "Town plaza"
cycle: ["quirky", "distinct", "kooky", "crazy", "quaint"]
ways: ["shop"]
before: (from) ->
if from == 'world'
"""
You climb up the well and come out to a central plaza of a #{salet.view.cycleLink("quaint")} little town.
A plaque nearby says it's the town of *Innsmouth,* wherever that is.
"""
else
"You quickly find the central plaza."
units: [
unit "policeman",
dsc: "There is a policeman nearby. You could ask him {{for directions.}}"
act: () ->
if salet.character.has_mark?
return "You already talked to him, no need to bug the man twice."
salet.character.has_mark ?= true
salet.getRoom("lair")
"""
Here, let me mark it on your map.
"""
unit "people",
dsc: "There are {{people shouting}} nearby."
act: 'Just some weirdos shouting "Viva la Cthulhu!". Typical.'
]
writers:
cyclewriter: () ->
responses = @cycle
if typeof responses == "function"
responses = responses()
cycleIndex = window.localStorage.getItem("cycleIndex")
cycleIndex ?= 0
response = responses[cycleIndex]
cycleIndex++
if cycleIndex == responses.length
cycleIndex = 0
window.localStorage.setItem("cycleIndex", cycleIndex)
return salet.view.cycleLink(response)
room "shop",
title: "The Shop"
#pic: "http://loremflickr.com/640/300/room,shop"
ways: ["plaza", "shop-inside", "lair"]
dsc: """
Being the only shop in town, this trendy establishment did not need a name.
It's an open question why it had one, especially because its name was "Hung Crossing".
You are standing in front of a picturesque sign. It's cold here.
"""
room "lair",
title: "The Lair"
before: "Finding The Lair is easy. Leaving it is impossible. Your game ends here."
dsc: """
The Lair of Yog-Sothoth is a very *n'gai* cave, full of *buggs-shoggogs* and *n'ghaa ng'aa*.
"""
ways: ["shop"]
units: [
unit "bugg",
dsc: "You see a particularly beautiful slimy {{bugg.}}"
takeable: false
display: "bugg"
act: () =>
salet.rooms[salet.current].drop("bugg")
return "You eat the bugg mass. Delicious and raw. Perhaps it's a good lair to live in."
]
phrase "Yes", "merchant", """
Yes.
"""
dialogue "No", "merchant", "merchant", """
No.
"""
room "sell-lamp",
ways: ["shop"]
tags: ["merchant"]
choices: ["#merchant"]
optionText: "May I buy this lamp?"
title: "Talking with merchant"
canView: () ->
return salet.character.has("lamp") and salet.character.bought_lamp == false
enter: () ->
salet.character.bought_lamp = true
dsc: """
"That'll be 30 pieces of your time."
You quickly pay the price and take the lamp as a rightful owner.
"""
room "shop-inside",
ways: ["shop"]
tags: ["merchant"]
optionText: "End the conversation"
title: "Inside the Shop"
dsc: """
The insides are painted pastel white, honouring The Great Milk Spill of 1985.
"""
units: [
unit "merchant",
dsc: "A {{merchant}} eyes you warily."
takeable: false
act: () =>
salet.processClick("merchdialogue")
return ""
]
lamp = unit "lamp",
display: "lamp"
takeable: true
lamp.put("shop-inside")
# The dialogue entry point has to be a room, in order to have an ID to go to.
room "merchdialogue",
choices: "#merchant",
dsc: """
Nice day, isn't it?
"""

240
game/story.js Normal file
View file

@ -0,0 +1,240 @@
import jQuery from 'jquery';
import dialogue from './_dialogue';
import phrase from './_phrase';
salet.game_id = "your-game-id-here";
salet.game_version = "1.6";
jQuery(document).on('ready', function($) {
window.addEventListener('popstate', function(event) {
return salet.goBack();
});
$("#night").on("click", function() {
var styles;
if (window.night) {
styles = {
"-webkit-filter": "",
"filter": "",
"background-color": ""
};
$("body").css(styles);
$("#night").removeClass("active");
return window.night = false;
} else {
styles = {
"-webkit-filter": "invert(1)hue-rotate(180deg)",
"filter": "invert(1)hue-rotate(180deg)",
"background-color": "#000"
};
$("body").css(styles);
$("#night").addClass("active");
return window.night = true;
}
});
return salet.beginGame();
});
/*
Element helpers. There is no real need to build monsters like a().id("hello")
because you won't use them as is. It does not make sense in context, the
author has Markdown and all utilities to *forget* about the markup.
*/
const way_to = function(content, ref) {
return "<a href='" + ref + "' class='way'>" + content + "</a>";
};
const textlink = function(content, ref) {
return "<a href='./_writer_" + ref + "' class='once'>" + content + "</a>";
};
const actlink = function(content, ref) {
return "<a href='./" + ref + "' class='once'>" + content + "</a>";
};
room("start", {
enter: function() {
return salet.character.bought_lamp = false;
},
dsc: " ",
choices: "#start"
});
room("inventory", {
canSave: false,
enter: function() {
return jQuery("#inventory").hide();
},
exit: function() {
return jQuery("#inventory").show();
},
dsc: function() {
var i, len, ref1, text, thing;
if (salet.character.inventory.length === 0) {
text = "You are carrying nothing.";
} else {
text = "You are carrying:\n\n";
ref1 = salet.character.inventory;
for (i = 0, len = ref1.length; i < len; i++) {
thing = ref1[i];
text += "* " + (salet.character.listinv(thing.name)) + "\n";
}
}
return text + "\n\n" + "<div class=\"center\"><a href=\"./exit\"><button class=\"btn btn-lg btn-outline-primary\">Go back</button></a></div>";
},
actions: {
exit: function() {
return salet.goBack();
}
}
});
room("world", {
tags: ["start"],
optionText: "Enter the world",
ways: ["plaza"],
dsc: "### Rhinestone Room\n\nYou're in a large room carved inside a giant milky rock mountain.\nThe floor and walls are littered with signs and signatures of the previous visitors.",
units: [
unit("well", {
dsc: "A steep narrow {{well}} proceeds upward.",
act: "There is only one passage out. See the „Other rooms“ block popped up? Click it."
})
]
});
room("plaza", {
title: function(from) {
if (from === "world") {
return "Upwards";
} else {
return "Town plaza";
}
},
cycle: ["quirky", "distinct", "kooky", "crazy", "quaint"],
ways: ["shop"],
before: function(from) {
if (from === 'world') {
return "You climb up the well and come out to a central plaza of a " + (salet.view.cycleLink("quaint")) + " little town.\nA plaque nearby says it's the town of *Innsmouth,* wherever that is.";
} else {
return "You quickly find the central plaza.";
}
},
units: [
unit("policeman", {
dsc: "There is a policeman nearby. You could ask him {{for directions.}}",
act: function() {
var base;
if (salet.character.has_mark != null) {
return "You already talked to him, no need to bug the man twice.";
}
if ((base = salet.character).has_mark == null) {
base.has_mark = true;
}
salet.getRoom("lair");
return "“Here, let me mark it on your map.”";
}
}), unit("people", {
dsc: "There are {{people shouting}} nearby.",
act: 'Just some weirdos shouting "Viva la Cthulhu!". Typical.'
})
],
writers: {
cyclewriter: function() {
var cycleIndex, response, responses;
responses = this.cycle;
if (typeof responses === "function") {
responses = responses();
}
cycleIndex = window.localStorage.getItem("cycleIndex");
if (cycleIndex == null) {
cycleIndex = 0;
}
response = responses[cycleIndex];
cycleIndex++;
if (cycleIndex === responses.length) {
cycleIndex = 0;
}
window.localStorage.setItem("cycleIndex", cycleIndex);
return salet.view.cycleLink(response);
}
}
});
room("shop", {
title: "The Shop",
ways: ["plaza", "shop-inside", "lair"],
dsc: "Being the only shop in town, this trendy establishment did not need a name.\nIt's an open question why it had one, especially because its name was \"Hung Crossing\".\n\nYou are standing in front of a picturesque sign. It's cold here."
});
room("lair", {
title: "The Lair",
before: "Finding The Lair is easy. Leaving it is impossible. Your game ends here.",
dsc: "The Lair of Yog-Sothoth is a very *n'gai* cave, full of *buggs-shoggogs* and *n'ghaa ng'aa*.",
ways: ["shop"],
units: [
unit("bugg", {
dsc: "You see a particularly beautiful slimy {{bugg.}}",
takeable: false,
display: "bugg",
act: (function(_this) {
return function() {
salet.rooms[salet.current].drop("bugg");
return "You eat the bugg mass. Delicious and raw. Perhaps it's a good lair to live in.";
};
})(this)
})
]
});
phrase("Yes", "merchant", "Yes.");
dialogue("No", "merchant", "merchant", "No.");
room("sell-lamp", {
ways: ["shop"],
tags: ["merchant"],
choices: ["#merchant"],
optionText: "May I buy this lamp?",
title: "Talking with merchant",
canView: function() {
return salet.character.has("lamp") && salet.character.bought_lamp === false;
},
enter: function() {
return salet.character.bought_lamp = true;
},
dsc: "\"That'll be 30 pieces of your time.\"\n\nYou quickly pay the price and take the lamp as a rightful owner."
});
room("shop-inside", {
ways: ["shop"],
tags: ["merchant"],
optionText: "End the conversation",
title: "Inside the Shop",
dsc: "The insides are painted pastel white, honouring The Great Milk Spill of 1985.",
units: [
unit("merchant", {
dsc: "A {{merchant}} eyes you warily.",
takeable: false,
act: (function(_this) {
return function() {
salet.processClick("merchdialogue");
return "";
};
})(this)
})
]
});
const lamp = unit("lamp", {
display: "lamp",
takeable: true
});
lamp.put("shop-inside");
room("merchdialogue", {
choices: "#merchant",
dsc: "Nice day, isn't it?"
});

View file

@ -5,7 +5,7 @@
<title>Salet showcase</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href='https://fonts.googleapis.com/css?family=PT+Sans:400,400italic|PT+Sans+Caption' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="styles/main.css">
<link rel="stylesheet" href="../sass/main.scss">
</head>
<body>
<div id="page">
@ -77,12 +77,6 @@
</div>
</div> <!-- End of div.page -->
<!-- CDN JS Libraries -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/marked/0.3.5/marked.min.js" crossorigin="anonymous"></script>
<script src="https://code.jquery.com/jquery-3.1.1.min.js" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/salet@2.0.1/lib/index.min.js" crossorigin="anonymous"></script>
<script src="game/manifest.js"></script>
<script defer="defer" src="game/story.js"></script>
<script type="module" src="../game/story.js"></script>
</body>
</html>

View file

@ -1,33 +1,22 @@
{
"private": true,
"dependencies": {
"bootstrap": "^4.6.0"
"bootstrap": "^4.6.2"
},
"version": "3.0.0",
"type": "module",
"scripts": {
"build-dev": "NODE_ENV=development mix",
"build": "NODE_ENV=production mix",
"start": "NODE_ENV=development mix watch",
"hot": "mix watch -- --hot"
"dev": "vite",
"build": "vite build",
"preview": "vite preview"
},
"private": true,
"devDependencies": {
"@babel/core": "^7.14.6",
"@babel/plugin-proposal-object-rest-spread": "^7.14.7",
"@babel/plugin-syntax-dynamic-import": "^7.8.3",
"@babel/plugin-transform-runtime": "^7.14.5",
"@babel/preset-env": "^7.14.7",
"babel-loader": "^8.2.2",
"browser-sync": "^2.27.4",
"browser-sync-webpack-plugin": "2.3.0",
"coffee-loader": "^3.0.0",
"vite": "^5.0.0",
"jquery": "^3.7.1",
"marked": "^10.0.0",
"@types/jquery": "^3.5.27",
"coffeescript": "^2.5.1",
"css-loader": "^5.2.6",
"laravel-mix": "^6.0.25",
"postcss-loader": "^6.1.1",
"sass": "^1.35.2",
"sass-loader": "^12.1.0",
"style-loader": "^3.1.0",
"webpack": "^5.44.0",
"webpack-cli": "^4.7.2"
"sass": "^1.35.2"
}
}

File diff suppressed because it is too large Load diff

14
vite.config.js Normal file
View file

@ -0,0 +1,14 @@
import { resolve } from 'path'
import { defineConfig } from 'vite'
export default defineConfig({
build: {
rollupOptions: {
input: {
main: resolve(__dirname, 'html/index.html'),
},
},
},
plugins: [
]
})