Skip to content

Commit

Permalink
Added update method to template instance.
Browse files Browse the repository at this point in the history
This enabled simplification of all the interactive sample demos.
  • Loading branch information
BorisMoore committed Aug 4, 2010
1 parent eca932f commit 88e7520
Show file tree
Hide file tree
Showing 12 changed files with 51 additions and 69 deletions.
16 changes: 5 additions & 11 deletions demos/movies/PagesCore/movies.html
Original file line number Diff line number Diff line change
Expand Up @@ -219,7 +219,7 @@ <h1>Netflix: Book a Movie...</h1>
booking.quantity++;
} else {
cart.count++;
updateItem( cartTmplItem );
cartTmplItem.update();
booking = { movie: movie, date: new Date(), quantity: 1, movieTheater: "" };
}
selectBooking( booking );
Expand Down Expand Up @@ -311,14 +311,14 @@ <h1>Netflix: Book a Movie...</h1>
tmpl = $( edit ? "#bookingEditTmpl" : "#bookingTitleTmpl" ).templates();
if ( item.tmpl !== tmpl) {
item.tmpl = tmpl;
updateItem( item );
item.update();
(edit ? bookingEditRendered : bookingRendered)( item );
}
}

function updateBooking( item ) {
item.animate = false;
updateItem( item );
item.update();
(item.data === selectedBooking ? bookingEditRendered : bookingRendered)( item );
item.animate = true;
}
Expand All @@ -330,7 +330,7 @@ <h1>Netflix: Book a Movie...</h1>
}
delete cart.bookings[booking.movie.Id];
cart.count--;
updateItem( cartTmplItem );
cartTmplItem.update();
$( bookingTmplItems[booking.movie.Id].nodes ).remove();
delete bookingTmplItems[booking.movie.Id];
return false;
Expand All @@ -345,19 +345,13 @@ <h1>Netflix: Book a Movie...</h1>
cart.count = 0;
cart.bookings = {};
selectedBooking = null;
updateItem( cartTmplItem );
cartTmplItem.update();
}

function formatDate( date ) {
return date.toLocaleDateString();
}

function updateItem( item ) {
var coll = item.nodes;
$.tmpl( null, null, null, item ).insertBefore( coll[0] );
$( coll ).remove();
}

function removeContext( item ) {
$( item.nodes ).remove();
}
Expand Down
10 changes: 5 additions & 5 deletions demos/movies/PagesTmplPlus/movies1.html
Original file line number Diff line number Diff line change
Expand Up @@ -220,7 +220,7 @@ <h1>Netflix: Book a Movie...</h1>
booking.quantity++;
} else {
cart.count++;
$.tmplCmd( "update", cartTmplItem );
cartTmplItem.update();
booking = { movie: movie, date: new Date(), quantity: 1, movieTheater: "" };
}
selectBooking( booking );
Expand Down Expand Up @@ -312,14 +312,14 @@ <h1>Netflix: Book a Movie...</h1>
tmpl = $( edit ? "#bookingEditTmpl" : "#bookingTitleTmpl" ).templates();
if ( item.tmpl !== tmpl) {
item.tmpl = tmpl;
$.tmplCmd( "update", item );
item.update();
(edit ? bookingEditRendered : bookingRendered)( item );
}
}

function updateBooking( item ) {
item.animate = false;
$.tmplCmd( "update", item );
item.update();
(item.data === selectedBooking ? bookingEditRendered : bookingRendered)( item );
item.animate = true;
}
Expand All @@ -331,7 +331,7 @@ <h1>Netflix: Book a Movie...</h1>
}
delete cart.bookings[booking.movie.Id];
cart.count--;
$.tmplCmd( "update", cartTmplItem );
cartTmplItem.update();
$.tmplCmd( "remove", booking, bookingTmplItems );
return false;
}
Expand All @@ -342,7 +342,7 @@ <h1>Netflix: Book a Movie...</h1>
cart.count = 0;
cart.bookings = {};
selectedBooking = null;
$.tmplCmd( "update", cartTmplItem );
cartTmplItem.update();
}

function formatDate( date ) {
Expand Down
10 changes: 5 additions & 5 deletions demos/movies/PagesTmplPlus/movies2.html
Original file line number Diff line number Diff line change
Expand Up @@ -210,7 +210,7 @@ <h1>Netflix: Book a Movie...</h1>
booking.quantity++;
} else {
cart.count++;
$.tmplCmd( "update", cartTmplItem );
cartTmplItem.update();
booking = { movie: movie, date: new Date(), quantity: 1, movieTheater: "" };
}
selectBooking( booking );
Expand Down Expand Up @@ -260,7 +260,7 @@ <h1>Netflix: Book a Movie...</h1>
if ( item.rendered !== rendered) {
item.tmpl = $( edit ? "#bookingEditTmpl" : "#bookingTitleTmpl" ).templates();
item.rendered = rendered;
$.tmplCmd( "update", item );
item.update();
}
}

Expand Down Expand Up @@ -310,7 +310,7 @@ <h1>Netflix: Book a Movie...</h1>

function updateBooking( item ) {
item.animate = false;
$.tmplCmd( "update", item );
item.update();
item.animate = true;
}

Expand All @@ -321,7 +321,7 @@ <h1>Netflix: Book a Movie...</h1>
}
delete cart.bookings[booking.movie.Id];
cart.count--;
$.tmplCmd( "update", cartTmplItem );
cartTmplItem.update();
$.tmplCmd( "remove", booking, bookingTmplItems );
return false;
}
Expand All @@ -332,7 +332,7 @@ <h1>Netflix: Book a Movie...</h1>
cart.count = 0;
cart.bookings = {};
selectedBooking = null;
$.tmplCmd( "update", cartTmplItem );
cartTmplItem.update();
}

function formatDate( date ) {
Expand Down
10 changes: 5 additions & 5 deletions demos/movies/PagesTmplPlus/movies3.html
Original file line number Diff line number Diff line change
Expand Up @@ -204,7 +204,7 @@ <h1>Netflix: Book a Movie...</h1>
booking.quantity++;
} else {
cart.count++;
$.tmplCmd( "update", cartTmplItem );
cartTmplItem.update();
booking = { movie: movie, date: new Date(), quantity: 1, movieTheater: "" };
}
selectBooking( booking );
Expand Down Expand Up @@ -249,7 +249,7 @@ <h1>Netflix: Book a Movie...</h1>
if ( item.rendered !== rendered) {
item.tmpl = $( edit ? "#bookingEditTmpl" : "#bookingTitleTmpl" ).templates();
item.rendered = rendered;
$.tmplCmd( "update", item );
item.update();
}
}

Expand Down Expand Up @@ -299,7 +299,7 @@ <h1>Netflix: Book a Movie...</h1>

function updateBooking( item ) {
item.animate = false;
$.tmplCmd( "update", item );
item.update();
item.animate = true;
}

Expand All @@ -310,7 +310,7 @@ <h1>Netflix: Book a Movie...</h1>
}
delete cart.bookings[booking.movie.Id];
cart.count--;
$.tmplCmd( "update", cartTmplItem );
cartTmplItem.update();
$.tmplCmd( "remove", booking, bookingTmplItems );
return false;
}
Expand All @@ -321,7 +321,7 @@ <h1>Netflix: Book a Movie...</h1>
cart.count = 0;
cart.bookings = {};
selectedBooking = null;
$.tmplCmd( "update", cartTmplItem );
cartTmplItem.update();
}

function formatDate( date ) {
Expand Down
1 change: 1 addition & 0 deletions demos/samplesCore/Interactive/resources/tabs.css
Original file line number Diff line number Diff line change
Expand Up @@ -64,6 +64,7 @@

.tabsView th.header_true
{
cursor:default;
font-weight: bold;
border: solid 1px #0000A6;
border-right: solid 2px #1E1ED2;
Expand Down
14 changes: 2 additions & 12 deletions demos/samplesCore/Interactive/tabsTmpl.html
Original file line number Diff line number Diff line change
Expand Up @@ -63,24 +63,14 @@ <h3>${title}</h3>
// ******************** Events ********************

$( "#tabsView" )
.delegate( ".tabsView th", "click", function() {
.delegate( ".header_false", "click", function() {
// Get the 'template item' for this tab
var activeHeaderTmplItem = $.tmplItem( this );
activeDataItem = activeHeaderTmplItem.data;

// Update the template item for the whole tabs control
update( activeHeaderTmplItem.parent ); // Alternatively use $.tmplCmd( "update", fldrTmplItem ); from tmplPlus.js
activeHeaderTmplItem.parent.update();
})

// ******************** Helper functions ********************

function update( tmplItem ) {
// This function is equivalent to $.tmplCmd( "update", fldrTmplItem ) available in the from tmplPlus.js
var coll = tmplItem.nodes;
$.tmpl( null, null, null, tmplItem ).insertBefore( coll[0] );
$( coll ).remove();
}

</script>

</body>
Expand Down
14 changes: 6 additions & 8 deletions demos/samplesCore/Interactive/tabsWrap.html
Original file line number Diff line number Diff line change
Expand Up @@ -60,18 +60,16 @@ <h3>Remote</h3>

// ******************** Load UI ********************

function refresh() {
$( "#tabsView" ).empty();
$( "#tabsTmpl" ).tmpl().appendTo( "#tabsView" );
}
refresh();
$( "#tabsView" ).empty();
$( "#tabsTmpl" ).tmpl().appendTo( "#tabsView" );

// ******************** Events ********************

$( "#tabsView" )
.delegate( ".tabsView th", "click", function() {
$.tmplItem( this ).state.activeIndex = $(this).index();
refresh();
.delegate( ".header_false", "click", function() {
var ti = $.tmplItem( this );
ti.state.activeIndex = $(this).index();
ti.update();
});

// ******************** Helper functions ********************
Expand Down
14 changes: 6 additions & 8 deletions demos/samplesCore/Interactive/tabsWrapImperative.html
Original file line number Diff line number Diff line change
Expand Up @@ -56,18 +56,16 @@ <h3>Remote</h3>

// ******************** Load UI ********************

function refresh() {
$( "#tabsView" ).empty();
$( "#tabsWrap" ).tmpl( null, {state: state, wrapped: "#tabsContent"} ).appendTo( "#tabsView" );
}
refresh();
$( "#tabsView" ).empty();
$( "#tabsWrap" ).tmpl( null, {state: state, wrapped: "#tabsContent"} ).appendTo( "#tabsView" );

// ******************** Events ********************

$( "#tabsView" )
.delegate( ".tabsView th", "click", function() {
$.tmplItem( this ).state.activeIndex = $(this).index();
refresh();
.delegate( ".header_false", "click", function() {
var ti = $.tmplItem( this );
ti.state.activeIndex = $(this).index();
ti.update();
});

</script>
Expand Down
6 changes: 4 additions & 2 deletions demos/samplesCore/Interactive/tabsWrapNested.html
Original file line number Diff line number Diff line change
Expand Up @@ -82,11 +82,13 @@ <h3>POST</h3>
}
refresh();


// ******************** Events ********************

$( "#tabsView" )
.delegate( ".tabsView th", "click", function() {
$.tmplItem( this ).state.activeIndex = $(this).index();
.delegate( ".header_false", "click", function() {
var ti = $.tmplItem( this );
ti.state.activeIndex = $(this).index();
refresh();
});

Expand Down
9 changes: 1 addition & 8 deletions demos/samplesCore/Interactive/treeView.html
Original file line number Diff line number Diff line change
Expand Up @@ -86,7 +86,7 @@ <h1>Tree View</h1>
fldrTmplItem.data.expanded = !fldrTmplItem.data.expanded;

// Update the template item
update( fldrTmplItem ); // Alternatively use $.tmplCmd( "update", fldrTmplItem ); from tmplPlus.js
fldrTmplItem.update();
})
.delegate( ".folderItem", "click", function() {
// Get the 'template item' for this folder item
Expand All @@ -95,13 +95,6 @@ <h1>Tree View</h1>
});

// ******************** Helper functions ********************

function update( tmplItem ) {
// This function is equivalent to $.tmplCmd( "update", fldrTmplItem ) available in the from tmplPlus.js
var coll = tmplItem.nodes;
$.tmpl( null, null, null, tmplItem ).insertBefore( coll[0] );
$( coll ).remove();
}

function getSamples( folderTmplItem ) {
return $.map( samples, function( sample ) {
Expand Down
13 changes: 10 additions & 3 deletions jquery.tmpl.js
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,8 @@
calls: tiCalls,
nest: tiNest,
wrap: tiWrap,
html: tiHtml
html: tiHtml,
update: tiUpdate
};
if ( options ) {
jQuery.extend( newItem, options, { nodes: [], parent: parentItem } );
Expand Down Expand Up @@ -386,8 +387,8 @@
}
processItemKey( elem );
}
// Remove temporary wrappedItem objects
wrappedItems = {};
// Cannot remove temporary wrappedItem objects, since needed during updating of nested items. //wrappedItems = {};
// TODO - ensure no memory leaks

function processItemKey( el ) {
var pntKey, pntNode = el, pntItem, tmplItem, key;
Expand Down Expand Up @@ -476,4 +477,10 @@
e.outerHTML || outerHtml(e);
});
}

function tiUpdate() {
var coll = this.nodes;
jQuery.tmpl( null, null, null, this).insertBefore( coll[0] );
jQuery( coll ).remove();
}
})(jQuery);
3 changes: 1 addition & 2 deletions jquery.tmplPlus.js
Original file line number Diff line number Diff line change
Expand Up @@ -38,8 +38,7 @@
coll = tmplItem.nodes;
switch ( command ) {
case "update":
jQuery.tmpl( null, null, null, tmplItem ).insertBefore( coll[0] );
jQuery( coll ).remove();
tmplItem.update();
break;
case "remove":
jQuery( coll ).remove();
Expand Down

0 comments on commit 88e7520

Please sign in to comment.