Permalink
Browse files

still have a mysterious data linking problem.

  • Loading branch information...
1 parent 23ca361 commit eb8e1bfcf9130f8c7f601b838612fddd8c5e1cee @luv2code committed Jun 13, 2011
@@ -135,12 +135,14 @@
<Compile Include="_App_Code\RavenController.cs" />
</ItemGroup>
<ItemGroup>
+ <Content Include="client\presenter.js" />
<Content Include="client\services\messenger.js" />
<Content Include="client\viewmodels\stickynoteboardViewModel.js" />
<Content Include="client\views\stickynoteboardView.tmpl.htm" />
<Content Include="client\views\stickynoteboardView.js" />
<Content Include="client\views\stickynoteView.js" />
<Content Include="client\views\stickynoteView.tmpl.htm" />
+ <Content Include="linking.htm" />
<Content Include="Scripts\jquery-require.js" />
<Content Include="client\lib\jquery.datalink.js" />
<Content Include="client\lib\jquery.tmpl.js" />
@@ -3,17 +3,8 @@
/// <reference path="../Scripts/jquery.datalink.js" />
/// <reference path="../Scripts/jquery.tmpl.js" />
-require(['services/messenger', 'lib/jquery.datalink', 'lib/jquery.tmpl'], function (messenger) {
- var sayHello = function (data) {
- alert(data);
- };
- messenger.subscribe('hello', sayHello);
-
- $('<p>${name}</p>').tmpl({ name: 'Matt' }).appendTo('#main');
- $(function () {
- $(document).click(function () {
- messenger.publish('hello', 'hello world');
- messenger.unsubscribe('hello', sayHello);
- });
+require(['presenter', 'services/messenger', 'lib/jquery.datalink', 'lib/jquery.tmpl'], function (presenter, messenger) {
+ var board = presenter.createForm('stickynoteboard', function (board) {
+ board.view.appendTo('#main');
});
});
@@ -3,26 +3,27 @@
/// <reference path="../Scripts/jquery.datalink.js" />
/// <reference path="../Scripts/jquery.tmpl.js" />
-define(['jquery.tmpl', 'jquery.datalink'], function () {
+define(['lib/jquery.tmpl', 'lib/jquery.datalink'], function () {
var presenter = function () { };
presenter.prototype = {
- createForm: function (pageName) {
- var viewModel = require('viewmodels/' + pageName + 'ViewModel');
- var view = require('views/' + pageName + 'View');
- var templateText = require('text!views/' + pageName + 'View.tmpl.htm');
- if (viewModel) {
- var vm = new viewModel();
- var templated = $(templateText)
- .tmpl(vm)
- .link(vm);
- return new view(templated, vm);
- }
- else {
- return new view(templateText);
- }
+ createForm: function (pageName, callback) {
+ require([
+ 'views/' + pageName + 'View',
+ 'text!views/' + pageName + 'View.tmpl.htm',
+ 'viewmodels/' + pageName + 'ViewModel'
+ ], function (view, templateText, viewModel) {
+ if (viewModel) {
+ var vm = new viewModel();
+ var templated = $.tmpl(templateText, vm).link(vm, vm.linkOptions);
+ callback(new view(templated, vm));
+ }
+ else {
+ callback(new view($(templateText)));
+ }
+ });
}
};
- return presenter;
+ return new presenter();
});
@@ -2,6 +2,23 @@
define(function () {
var viewModel = function () {
- }
+ this.text = (new Date()).getTime();
+ this.id = 'stickynote' + (new Date()).getTime();
+ };
+ viewModel.prototype = {
+ text: '',
+ linkOptions: {
+ text: {
+ convert: function (value, source, target) {
+ alert('convert fired for : ' + target.id);
+ return value.toUpperCase();
+ },
+ convertBack: function (value, source, target) {
+ alert('convertBack fired for : ' + source.id);
+ return value.toLowerCase();
+ }
+ }
+ }
+ };
return viewModel;
});
@@ -1,7 +1,17 @@
/// <reference path="../../Scripts/require.js" />
-define(function () {
+define(['presenter'], function (presenter) {
var viewModel = function () {
}
+ viewModel.prototype = {
+ createStickyNote : function (callback) {
+ presenter.createForm('stickynote', function(view) {
+ //add view.viewModel to the collection on the board.
+ //do anything else to the sticky.
+ view.viewModel.text = "Hello"
+ if(callback) callback(view);
+ });
+ }
+ };
return viewModel;
});
@@ -1,7 +1,9 @@
/// <reference path="../../Scripts/require.js" />
define(['viewmodels/stickynoteViewModel', 'text!views/stickynoteView.tmpl.htm'], function () {
- var stickynote = function (viewmodel, template) {
+ var stickynote = function (templated, viewmodel) {
+ this.viewModel = viewmodel;
+ this.view = templated;
}
return stickynote;
});
@@ -1 +1 @@
-<textarea name="text">${text}</textarea>
+<div id="${id}"><textarea name="text">${text}</textarea></div>
@@ -1,9 +1,18 @@
/// <reference path="../../Scripts/require.js" />
+/// <reference path="../../Scripts/jquery-1.6.1-vsdoc.js" />
-define(['viewmodels/stickynoteboardViewModel', 'text!views/stickynoteboardView.tmpl.htm'], function () {
+define(['viewmodels/stickynoteboardViewModel', 'text!views/stickynoteboardView.tmpl.htm', 'jquery'], function () {
var stickynoteboard = function (templated, viewmodel) {
+ var instance = this;
this.view = templated;
this.viewModel = viewmodel;
+ $(function () {
+ $('button[name="clickHere"]', instance.view).click(function () {
+ instance.viewModel.createStickyNote(function (stickyNote) {
+ stickyNote.view.appendTo(instance.view);
+ });
+ });
+ });
}
return stickynoteboard;
});
@@ -1 +1 @@
-<div class="sticky-note-board"></div>
+<div class="sticky-note-board"><button name="clickHere">click here to add something</button></div>
@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <script src="Scripts/jquery-1.6.1.min.js" type="text/javascript"></script>
+ <script src="Scripts/jquery.datalink.js" type="text/javascript"></script>
+</head>
+<body>
+
+
+<script>
+ $(function () {
+ var person = {};
+ $('<form><div>First Name:<input type="text" name="firstName" /></div><div>Last Name:<input type="text" name="lastName" /></div></form>Object.firstName: <span id="objFirst"></span><br/>Object.lastName: <span id="objLast"></span>').link(person).appendTo('body');
+
+ // Chain link the person object to these elements to show the results
+ $("#objFirst").link(person, {
+ firstName: {
+ name: "objFirst",
+ convertBack: function (value, source, target) {
+ $(target).text(value);
+ }
+ }
+ });
+ $("#objLast").link(person, {
+ lastName: {
+ name: "objLast",
+ convertBack: function (value, source, target) {
+ $(target).text(value);
+ }
+ }
+ });
+ });
+</script>
+
+</body>
+</html>

0 comments on commit eb8e1bf

Please sign in to comment.