MainView.ux

<App Theme="Basic" ClearColor="#eeeeeeff">
	<DockPanel>
		<JavaScript File="parse-1.6.7.js" ux:Global="Parse" />
		<JavaScript File="api-keys.js" ux:Global="ApiKeys" />
		<JavaScript>
			var Observable = require("FuseJS/Observable");
			var Parse = require("Parse").Parse;
			var ApiKeys = require("ApiKeys");

			Parse.initialize(ApiKeys.appId, ApiKeys.jsKey);
			Parse.serverURL="https://parseapi.back4app.com/"
			
			var Tag = Parse.Object.extend("Tag");

			var tags = Observable();

			var updateInterval = 500;

			function updateTags() {
				new Parse.Query("Tag").find().then(function(serverTags) {
					//debug_log("Query successful: " + JSON.stringify(serverTags));
					// Let's only add the ones that are newer than what we have
					for (var i = tags.length; i < serverTags.length; i++) {
						tags.add(serverTags[i].get("text"));
					}
				}, function(error) {
					debug_log("Could not update tags: " + error);
				});

				setTimeout(updateTags, updateInterval);
			}

			updateTags();

			var currentText = Observable("");

			function submit() {
				new Tag().save({
					text: currentText.value
				}).then(function(tag) {
					debug_log("Tag saved successfully!");
				}, function(error) {
					debug_log("Could not save tag: " + error);
				})
				//tags.add(currentText.value);
				currentText.value = "";
			}

			module.exports = {
				currentText: currentText,
				submit: submit,
				tags: tags
			};
		</JavaScript>

		<StatusBarBackground Dock="Top" />
		<BottomBarBackground Dock="Bottom" />

		<Text Dock="Top" Alignment="Center" FontSize="80" Margin="0,50,0,50" TextColor="#1e88e5">tag</Text>

		<StackPanel Dock="Bottom" Margin="0,50,0,0">
			<Button Text="tag" Clicked="{submit}" />
			<TextInput Value="{currentText}" TextAlignment="Center" />
		</StackPanel>

		<ScrollView ClipToBounds="true">
			<StackPanel>
				<Each Items="{tags}">
					<Text Value="{}" TextWrapping="Wrap" Margin="9" TextAlignment="Center" />
				</Each>
			</StackPanel>
		</ScrollView>
	</DockPanel>
</App>