Port simple files to es6; factor out Babel helpers

tgui/gulp/config/plugins.coffee

@@ -6,6 +6,7 @@ module.exports =
     componentify: require "ractive-componentify"
     es3ify:       require "es3ify"
     globify:      require "require-globify"
+    helpers:      require "babelify-external-helpers"
   gulp: require("gulp-load-plugins")({replaceString: /^gulp(-|\.)|-/g})
   postcss:
     autoprefixer: require "autoprefixer"

tgui/gulp/tasks/js.coffee

@@ -34,7 +34,8 @@ bundle = ->
     browserify file.path,
       extensions: [".coffee", ".ract"]
       debug: f.debug
-    .transform b.babelify, {presets: ["es2015"]}
+    .transform b.babelify, {presets: ["es2015"], plugins: ["external-helpers-2"]}
+    .plugin b.helpers
     .transform b.coffeeify
     .transform b.componentify
     .transform b.aliasify

tgui/package.json

@@ -4,8 +4,10 @@
   "dependencies": {
     "aliasify": "~1.8.0",
     "autoprefixer": "~6.2.3",
+    "babel-plugin-external-helpers-2": "^6.3.13",
     "babel-preset-es2015": "~6.3.13",
-    "babelify": "~7.2.0",
+    "babelify": "^7.2.0",
+    "babelify-external-helpers": "~1.0.0",
     "browserify": "~12.0.1",
     "coffee-script": "~1.10.0",
     "coffeeify": "~2.0.1",

tgui/scripts/byond.js

@@ -0,0 +1,18 @@
+const encode = encodeURIComponent
+
+// Helper to generate a BYOND href given 'params' as an object (with an optional 'url' for eg winset).
+export function href (params = {}, url = '') {
+  return `byond://${url}?` + Object.keys(params).map(key => `${encode(key)}=#{encode(params[key])}`).join("&")
+}
+
+// Helper to make a BYOND ui_act() call on the UI 'src' given an 'action' and optional 'params'.
+export function act (src, action, params = {}) {
+  params.src = src
+  params.action = action
+  location.href = href(params)
+}
+
+// Helper to make a BYOND winset() call on 'window', setting 'key' to 'value'
+export function winset (window, key, value) {
+  location.href = href({[`${window}.${key}`]: value}, "winset")
+}

tgui/scripts/components/bar.ract

@@ -4,7 +4,7 @@ component.exports =
     @observe "value", (newkey, oldkey, keypath) ->
       min = @get "min"
       max = @get "max"
-      value = Math.clamp newkey, min, max
+      value = Math.clamp min, max, newkey
       @animate "percentage", Math.round (value - min) / (max - min) * 100
 </script>
 

tgui/scripts/constants.js

@@ -0,0 +1,5 @@
+// Constants used in tgui; these are mirrored from the BYOND code.
+export const UI_INTERACTIVE = 2
+export const UI_UPDATE = 1
+export const UI_DISABLED = 0
+export const UI_CLOSE = -1

tgui/scripts/dragresize.coffee

@@ -26,8 +26,8 @@ module.exports =
   resize: (ractive, event) ->
     event.preventDefault()
     sane = (x, y) ->
-      x = Math.clamp x, 100, screen.width
-      y = Math.clamp y, 100, screen.height
+      x = Math.clamp 100, screen.width, x
+      y = Math.clamp 100, screen.height, y
       {x: x, y: y}
 
     if ractive.get "x"

tgui/scripts/main.coffee

@@ -2,7 +2,9 @@ require "core-js"
 require "html5shiv"
 require "ie8"
 require "dom4"
-require "./math"
+
+
+Object.assign(Math, require("./math"))
 
 
 Ractive = require "ractive"

tgui/scripts/math.js

@@ -0,0 +1,11 @@
+// Extensions to the built-in 'Math' object.
+
+// Helper to limit a number to be inside 'min' and 'max'.
+export function clamp (min, max) {
+  return Math.max(min, Math.min(number, max))
+}
+
+// Helper to round a number to 'decimals' decimals.
+export function fixed (number, decimals = 1) {
+  return Number(Math.round(number + 'e' + decimals) + 'e-' + decimals)
+}

tgui/scripts/text.js

@@ -0,0 +1,6 @@
+export function upperCaseFirst (str) {
+  return str[0].toUpperCase() + str.slice(1).toLowerCase()
+}
+export function titleCase (str) {
+  return str.replace(/\w\S*/g, upperCaseFirst)
+}