Merge pull request #14409 from neersighted/more_tgui_fixes

Fix some typos, don't wash out button hover colors, fix APC delays

code/modules/tgui/tgui.dm

@@ -264,6 +264,7 @@
 	switch(action)
 		if("tgui:initialize")
 			user << output(url_encode(get_json(initial_data)), "[window_id].browser:initialize")
+			return
 		if("tgui:ie")
 			user << link("http://windows.microsoft.com/en-us/internet-explorer/download-ie")
 			return

tgui/scripts/components/button.ract

@@ -15,9 +15,9 @@ component.exports =
       state   = @get "state"
       style   = @get "style"
       if enabled
-        if not state then "normal #{[style]}"
-        else "#{state}"
-      else "disabled"
+        if not state then "active normal #{[style]}"
+        else "inactive #{state}"
+      else "inactive disabled"
   oninit: ->
     @on "press", (event) ->
       event.node.blur()

tgui/scripts/interfaces/apc.ract

@@ -70,9 +70,9 @@ component.exports =
   {{/if}}
 </ui-display>
 <ui-display title='Power Channels'>
-  {{#each adata.powerChannels}}
+  {{#each data.powerChannels}}
     <ui-section label='{{title}}' nowrap>
-      <div class='content'>{{Math.round(powerLoad)}} W</div>
+      <div class='content'>{{Math.round(adata.powerChannels[@index].powerLoad)}} W</div>
       <div class='content'><span class='{{status >= 2 ? "good" : "bad"}}'>{{status >= 2 ? "On" : "Off"}}</span></div>
       <div class='content'>[<span>{{status == 1 || status == 3 ? "Auto" : "Manual"}}</span>]</div>
       <div class='content' style='float:right'>

tgui/styles/components/button.styl

@@ -1,3 +1,14 @@
+buttoncolor(selector, color)
+  &.{selector}
+    transition: background-color 0.5s
+    background-color: color
+  &.{selector}.active:hover,
+  &.{selector}.active:focus
+    transition: background-color 0.25s
+    background-color: lighten(color, colors.hover)
+    outline: 0
+
+
 span.button
   @extend $fontReset
   display: inline-block
@@ -10,20 +21,11 @@ span.button
   .fa
     padding-right: 2px
 
-  transition: background-color 0.25s, box-shadow 0.25s
-  &.normal
-    background-color: colors.normal
-    &:hover, &:focus
-      outline: 0
-      box-shadow: inset 0 0 100px 100px alpha(#fff, colors.hover)
-  &.disabled
-    background-color: colors.disabled
-  &.selected
-    background-color: colors.selected
-  &.caution
-    background-color: colors.caution
-  &.danger
-    background-color: colors.danger
+  buttoncolor(normal, colors.normal)
+  buttoncolor(disabled, colors.disabled)
+  buttoncolor(selected, colors.selected)
+  buttoncolor(caution, colors.caution)
+  buttoncolor(danger, colors.danger)
 
   &.gridable
     width: 125px