rewards - got custom inputs loading

public/src/admin/extend/rewards.js

@@ -1,5 +1,5 @@
 "use strict";
-/* global define, app, socket, bootbox */
+/* global define, app, ajaxify, socket, templates, bootbox */
 
 define('admin/extend/rewards', function() {
 	var rewards = {};
@@ -9,17 +9,72 @@ define('admin/extend/rewards', function() {
 		active;
 
 	rewards.init = function() {
-		//available = JSON.parse($('#rewards').val());
-		//active = JSON.parse($('#active').val());
-
-
 		$(window).on('action:ajaxify.end', function() {
+			available = JSON.parse(ajaxify.variables.get('rewards'));
+			active = JSON.parse(ajaxify.variables.get('active'));
+
 			$('[data-selected]').each(function() {
-				console.log($(this).attr('data-selected'));
-				$(this).val($(this).attr('data-selected'));
+				select($(this));
+			}).on('change', function() {
+				update($(this));
 			});
 		});
 	};
 
+	function select(el) {
+		el.val(el.attr('data-selected'));
+		switch (el.attr('name')) {
+			case 'reward':
+					selectReward(el);
+				break;
+		}
+	}
+
+	function update(el) {
+		el.attr('data-selected', el.val());
+		switch (el.attr('name')) {
+			case 'reward':
+					selectReward(el);
+				break;
+		}
+	}
+
+	function selectReward(el) {
+		var div = el.parent().find('.inputs'),
+			inputs,
+			html = '';
+
+		for (var reward in available) {
+			if (available.hasOwnProperty(reward)) {
+				if (parseInt(available[reward].rewardID, 10) === parseInt(el.attr('data-selected'), 10)) {
+					inputs = available[reward].inputs;
+					break;
+				}
+			}
+		}
+
+		if (!inputs) {
+			app.alertError('Illegal reward - no inputs found! ' + el.attr('data-selected'));
+		}
+
+		inputs.forEach(function(input) {
+			html += '<label for="' + input.name + '">' + input.label;
+			switch (input.type) {
+				case 'select': 
+						html += '<select name="' + input.name + '">';
+						input.values.forEach(function(value) {
+							html += '<option value="' + value.value + '">' + value.name + '</option>';
+						});
+					break;
+				case 'text':
+						html += '<input type="text" name="' + input.name +'" />';
+					break;
+			}
+			html += '</label>';
+		});
+
+		div.html(html);
+	}
+
 	return rewards;
 });

src/rewards/admin.js

@@ -37,8 +37,8 @@ rewards.get = function(callback) {
 				"conditional": "lesserorequalthan"
 			},
 			{
-				"name": "is string:",
-				"conditional": "isstring"
+				"name": "string:",
+				"conditional": "string"
 			}
 		],
 		active: [
@@ -65,7 +65,21 @@ rewards.get = function(callback) {
 					{
 						"type": "select",
 						"name": "groupname",
-						"values": ["Group 1", "Group 2", "Group 3"],
+						"label": "Group Name:",
+						"values": [
+							{
+								"name": "Group 1",
+								"value": "group1"
+							},
+							{
+								"name": "Group 2",
+								"value": "group2"
+							},
+							{
+								"name": "Group 3",
+								"value": "group3"
+							}
+						],
 					}
 				]
 			},
@@ -76,10 +90,12 @@ rewards.get = function(callback) {
 					{
 						"type": "text",
 						"name": "title",
+						"label": "Title:"
 					},
 					{
 						"type": "text",
 						"name": "message",
+						"label": "Message:"
 					}
 				]
 			}

src/views/admin/extend/rewards.tpl

@@ -26,12 +26,13 @@
 								<option value="{rewards.rewardID}">{rewards.name}</option>
 								<!-- END rewards -->
 							</select>
+							<div class="inputs well inline-block"></div>
 						</li>
 						<!-- END active -->
 					</ul>
 				</form>
-				<input type="hidden" name="rewards" value="{function.stringify, rewards}" />
-				<input type="hidden" name="active" value="{function.stringify, active}" />
+				<input type="hidden" template-variable="rewards" value="{function.stringify, rewards}" />
+				<input type="hidden" template-variable="active" value="{function.stringify, active}" />
 			</div>
 		</div>
 	</div>