Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Support
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
T
todomvc
Project overview
Project overview
Details
Activity
Releases
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
0
Merge Requests
0
Analytics
Analytics
Repository
Value Stream
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Create a new issue
Commits
Issue Boards
Open sidebar
Eugene Shen
todomvc
Commits
6f25047d
Commit
6f25047d
authored
Mar 09, 2013
by
Sindre Sorhus
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
Backbone.Marionette app - use Bower components
#475
parent
705154dc
Changes
11
Expand all
Show whitespace changes
Inline
Side-by-side
Showing
11 changed files
with
15410 additions
and
215 deletions
+15410
-215
labs/architecture-examples/backbone_marionette/component.json
.../architecture-examples/backbone_marionette/component.json
+10
-0
labs/architecture-examples/backbone_marionette/components/backbone.localStorage/backbone.localStorage.js
...components/backbone.localStorage/backbone.localStorage.js
+192
-0
labs/architecture-examples/backbone_marionette/components/backbone.marionette/lib/backbone.marionette.js
...components/backbone.marionette/lib/backbone.marionette.js
+20
-11
labs/architecture-examples/backbone_marionette/components/backbone/backbone.js
...mples/backbone_marionette/components/backbone/backbone.js
+0
-0
labs/architecture-examples/backbone_marionette/components/jquery/jquery.js
...-examples/backbone_marionette/components/jquery/jquery.js
+9597
-0
labs/architecture-examples/backbone_marionette/components/lodash/lodash.js
...-examples/backbone_marionette/components/lodash/lodash.js
+5163
-0
labs/architecture-examples/backbone_marionette/components/todomvc-common/base.css
...es/backbone_marionette/components/todomvc-common/base.css
+414
-0
labs/architecture-examples/backbone_marionette/components/todomvc-common/base.js
...les/backbone_marionette/components/todomvc-common/base.js
+7
-0
labs/architecture-examples/backbone_marionette/components/todomvc-common/bg.png
...ples/backbone_marionette/components/todomvc-common/bg.png
+0
-0
labs/architecture-examples/backbone_marionette/index.html
labs/architecture-examples/backbone_marionette/index.html
+7
-10
labs/architecture-examples/backbone_marionette/js/lib/backbone.localStorage.js
...mples/backbone_marionette/js/lib/backbone.localStorage.js
+0
-194
No files found.
labs/architecture-examples/backbone_marionette/component.json
0 → 100644
View file @
6f25047d
{
"name"
:
"todomvc-backbone-marionette"
,
"version"
:
"0.0.0"
,
"dependencies"
:
{
"todomvc-common"
:
"~0.1.0"
,
"lodash"
:
"~1.0.1"
,
"backbone.localStorage"
:
"~1.1.0"
,
"backbone.marionette"
:
"~1.0.0-rc6"
}
}
labs/architecture-examples/backbone_marionette/components/backbone.localStorage/backbone.localStorage.js
0 → 100644
View file @
6f25047d
/**
* Backbone localStorage Adapter
* Version 1.1.0
*
* https://github.com/jeromegn/Backbone.localStorage
*/
(
function
(
root
,
factory
)
{
if
(
typeof
define
===
"
function
"
&&
define
.
amd
)
{
// AMD. Register as an anonymous module.
define
([
"
underscore
"
,
"
backbone
"
],
function
(
_
,
Backbone
)
{
// Use global variables if the locals is undefined.
return
factory
(
_
||
root
.
_
,
Backbone
||
root
.
Backbone
);
});
}
else
{
// RequireJS isn't being used. Assume underscore and backbone is loaded in <script> tags
factory
(
_
,
Backbone
);
}
}(
this
,
function
(
_
,
Backbone
)
{
// A simple module to replace `Backbone.sync` with *localStorage*-based
// persistence. Models are given GUIDS, and saved into a JSON object. Simple
// as that.
// Hold reference to Underscore.js and Backbone.js in the closure in order
// to make things work even if they are removed from the global namespace
// Generate four random hex digits.
function
S4
()
{
return
(((
1
+
Math
.
random
())
*
0x10000
)
|
0
).
toString
(
16
).
substring
(
1
);
};
// Generate a pseudo-GUID by concatenating random hexadecimal.
function
guid
()
{
return
(
S4
()
+
S4
()
+
"
-
"
+
S4
()
+
"
-
"
+
S4
()
+
"
-
"
+
S4
()
+
"
-
"
+
S4
()
+
S4
()
+
S4
());
};
// Our Store is represented by a single JS object in *localStorage*. Create it
// with a meaningful name, like the name you'd give a table.
// window.Store is deprectated, use Backbone.LocalStorage instead
Backbone
.
LocalStorage
=
window
.
Store
=
function
(
name
)
{
this
.
name
=
name
;
var
store
=
this
.
localStorage
().
getItem
(
this
.
name
);
this
.
records
=
(
store
&&
store
.
split
(
"
,
"
))
||
[];
};
_
.
extend
(
Backbone
.
LocalStorage
.
prototype
,
{
// Save the current state of the **Store** to *localStorage*.
save
:
function
()
{
this
.
localStorage
().
setItem
(
this
.
name
,
this
.
records
.
join
(
"
,
"
));
},
// Add a model, giving it a (hopefully)-unique GUID, if it doesn't already
// have an id of it's own.
create
:
function
(
model
)
{
if
(
!
model
.
id
)
{
model
.
id
=
guid
();
model
.
set
(
model
.
idAttribute
,
model
.
id
);
}
this
.
localStorage
().
setItem
(
this
.
name
+
"
-
"
+
model
.
id
,
JSON
.
stringify
(
model
));
this
.
records
.
push
(
model
.
id
.
toString
());
this
.
save
();
return
this
.
find
(
model
);
},
// Update a model by replacing its copy in `this.data`.
update
:
function
(
model
)
{
this
.
localStorage
().
setItem
(
this
.
name
+
"
-
"
+
model
.
id
,
JSON
.
stringify
(
model
));
if
(
!
_
.
include
(
this
.
records
,
model
.
id
.
toString
()))
this
.
records
.
push
(
model
.
id
.
toString
());
this
.
save
();
return
this
.
find
(
model
);
},
// Retrieve a model from `this.data` by id.
find
:
function
(
model
)
{
return
this
.
jsonData
(
this
.
localStorage
().
getItem
(
this
.
name
+
"
-
"
+
model
.
id
));
},
// Return the array of all models currently in storage.
findAll
:
function
()
{
return
_
(
this
.
records
).
chain
()
.
map
(
function
(
id
){
return
this
.
jsonData
(
this
.
localStorage
().
getItem
(
this
.
name
+
"
-
"
+
id
));
},
this
)
.
compact
()
.
value
();
},
// Delete a model from `this.data`, returning it.
destroy
:
function
(
model
)
{
if
(
model
.
isNew
())
return
false
this
.
localStorage
().
removeItem
(
this
.
name
+
"
-
"
+
model
.
id
);
this
.
records
=
_
.
reject
(
this
.
records
,
function
(
id
){
return
id
===
model
.
id
.
toString
();
});
this
.
save
();
return
model
;
},
localStorage
:
function
()
{
return
localStorage
;
},
// fix for "illegal access" error on Android when JSON.parse is passed null
jsonData
:
function
(
data
)
{
return
data
&&
JSON
.
parse
(
data
);
}
});
// localSync delegate to the model or collection's
// *localStorage* property, which should be an instance of `Store`.
// window.Store.sync and Backbone.localSync is deprectated, use Backbone.LocalStorage.sync instead
Backbone
.
LocalStorage
.
sync
=
window
.
Store
.
sync
=
Backbone
.
localSync
=
function
(
method
,
model
,
options
)
{
var
store
=
model
.
localStorage
||
model
.
collection
.
localStorage
;
var
resp
,
errorMessage
,
syncDfd
=
$
.
Deferred
&&
$
.
Deferred
();
//If $ is having Deferred - use it.
try
{
switch
(
method
)
{
case
"
read
"
:
resp
=
model
.
id
!=
undefined
?
store
.
find
(
model
)
:
store
.
findAll
();
break
;
case
"
create
"
:
resp
=
store
.
create
(
model
);
break
;
case
"
update
"
:
resp
=
store
.
update
(
model
);
break
;
case
"
delete
"
:
resp
=
store
.
destroy
(
model
);
break
;
}
}
catch
(
error
)
{
if
(
error
.
code
===
DOMException
.
QUOTA_EXCEEDED_ERR
&&
window
.
localStorage
.
length
===
0
)
errorMessage
=
"
Private browsing is unsupported
"
;
else
errorMessage
=
error
.
message
;
}
if
(
resp
)
{
if
(
options
&&
options
.
success
)
if
(
Backbone
.
VERSION
===
"
0.9.10
"
)
{
options
.
success
(
model
,
resp
,
options
);
}
else
{
options
.
success
(
resp
);
}
if
(
syncDfd
)
syncDfd
.
resolve
(
resp
);
}
else
{
errorMessage
=
errorMessage
?
errorMessage
:
"
Record Not Found
"
;
if
(
options
&&
options
.
error
)
if
(
Backbone
.
VERSION
===
"
0.9.10
"
)
{
options
.
error
(
model
,
errorMessage
,
options
);
}
else
{
options
.
error
(
errorMessage
);
}
if
(
syncDfd
)
syncDfd
.
reject
(
errorMessage
);
}
// add compatibility with $.ajax
// always execute callback for success and error
if
(
options
&&
options
.
complete
)
options
.
complete
(
resp
);
return
syncDfd
&&
syncDfd
.
promise
();
};
Backbone
.
ajaxSync
=
Backbone
.
sync
;
Backbone
.
getSyncMethod
=
function
(
model
)
{
if
(
model
.
localStorage
||
(
model
.
collection
&&
model
.
collection
.
localStorage
))
{
return
Backbone
.
localSync
;
}
return
Backbone
.
ajaxSync
;
};
// Override 'Backbone.sync' to default to localSync,
// the original 'Backbone.sync' is still available in 'Backbone.ajaxSync'
Backbone
.
sync
=
function
(
method
,
model
,
options
)
{
return
Backbone
.
getSyncMethod
(
model
).
apply
(
this
,
[
method
,
model
,
options
]);
};
return
Backbone
.
LocalStorage
;
}));
\ No newline at end of file
labs/architecture-examples/backbone_marionette/
js
/lib/backbone.marionette.js
→
labs/architecture-examples/backbone_marionette/
components/backbone.marionette
/lib/backbone.marionette.js
View file @
6f25047d
// Backbone.Marionette, v1.0.0-rc
5
// Backbone.Marionette, v1.0.0-rc
6
// Copyright (c)2013 Derick Bailey, Muted Solutions, LLC.
// Distributed under MIT license
// http://github.com/marionettejs/backbone.marionette
...
...
@@ -1240,8 +1240,16 @@ Marionette.CollectionView = Marionette.View.extend({
// the collection view.
render
:
function
(){
this
.
isClosed
=
false
;
this
.
triggerBeforeRender
();
this
.
_renderChildren
();
this
.
triggerRendered
();
return
this
;
},
// Internal method. Separated so that CompositeView can have
// more control over events being triggered, around the rendering
// process
_renderChildren
:
function
(){
this
.
closeEmptyView
();
this
.
closeChildren
();
...
...
@@ -1250,9 +1258,6 @@ Marionette.CollectionView = Marionette.View.extend({
}
else
{
this
.
showEmptyView
();
}
this
.
triggerRendered
();
return
this
;
},
// Internal method to loop through each item in the
...
...
@@ -1462,7 +1467,7 @@ Marionette.CompositeView = Marionette.CollectionView.extend({
if
(
this
.
collection
){
this
.
listenTo
(
this
.
collection
,
"
add
"
,
this
.
addChildView
,
this
);
this
.
listenTo
(
this
.
collection
,
"
remove
"
,
this
.
removeItemView
,
this
);
this
.
listenTo
(
this
.
collection
,
"
reset
"
,
this
.
renderCollectio
n
,
this
);
this
.
listenTo
(
this
.
collection
,
"
reset
"
,
this
.
_renderChildre
n
,
this
);
}
},
...
...
@@ -1500,30 +1505,34 @@ Marionette.CompositeView = Marionette.CollectionView.extend({
// but the collection will not re-render.
render
:
function
(){
this
.
isClosed
=
false
;
this
.
resetItemViewContainer
();
this
.
triggerBeforeRender
();
var
html
=
this
.
renderModel
();
this
.
$el
.
html
(
html
);
// the ui bindings is done here and not at the end of render since they
// will not be available until after the model is rendered, but should be
// available before the collection is rendered.
this
.
bindUIElements
();
this
.
triggerMethod
(
"
composite:model:rendered
"
);
this
.
renderCollection
();
this
.
_renderChildren
();
this
.
triggerMethod
(
"
composite:rendered
"
);
this
.
triggerRendered
();
return
this
;
},
_renderChildren
:
function
(){
Marionette
.
CollectionView
.
prototype
.
_renderChildren
.
call
(
this
);
this
.
triggerMethod
(
"
composite:collection:rendered
"
);
},
// Render the collection for the composite view
renderCollection
:
function
(){
var
args
=
Array
.
prototype
.
slice
.
apply
(
arguments
);
Marionette
.
CollectionView
.
prototype
.
render
.
apply
(
this
,
args
);
this
.
triggerMethod
(
"
composite:collection:rendered
"
);
},
// Render an individual model, if we have one, as
...
...
labs/architecture-examples/backbone_marionette/
js/lib
/backbone.js
→
labs/architecture-examples/backbone_marionette/
components/backbone
/backbone.js
View file @
6f25047d
File moved
labs/architecture-examples/backbone_marionette/components/jquery/jquery.js
0 → 100644
View file @
6f25047d
This diff is collapsed.
Click to expand it.
labs/architecture-examples/backbone_marionette/components/lodash/lodash.js
0 → 100644
View file @
6f25047d
This diff is collapsed.
Click to expand it.
labs/architecture-examples/backbone_marionette/components/todomvc-common/base.css
0 → 100644
View file @
6f25047d
html
,
body
{
margin
:
0
;
padding
:
0
;
}
button
{
margin
:
0
;
padding
:
0
;
border
:
0
;
background
:
none
;
font-size
:
100%
;
vertical-align
:
baseline
;
font-family
:
inherit
;
color
:
inherit
;
-webkit-appearance
:
none
;
/*-moz-appearance: none;*/
-ms-appearance
:
none
;
-o-appearance
:
none
;
appearance
:
none
;
}
body
{
font
:
14px
'Helvetica Neue'
,
Helvetica
,
Arial
,
sans-serif
;
line-height
:
1.4em
;
background
:
#eaeaea
url('bg.png')
;
color
:
#4d4d4d
;
width
:
550px
;
margin
:
0
auto
;
-webkit-font-smoothing
:
antialiased
;
-moz-font-smoothing
:
antialiased
;
-ms-font-smoothing
:
antialiased
;
-o-font-smoothing
:
antialiased
;
font-smoothing
:
antialiased
;
}
#todoapp
{
background
:
#fff
;
background
:
rgba
(
255
,
255
,
255
,
0.9
);
margin
:
130px
0
40px
0
;
border
:
1px
solid
#ccc
;
position
:
relative
;
border-top-left-radius
:
2px
;
border-top-right-radius
:
2px
;
box-shadow
:
0
2px
6px
0
rgba
(
0
,
0
,
0
,
0.2
),
0
25px
50px
0
rgba
(
0
,
0
,
0
,
0.15
);
}
#todoapp
:before
{
content
:
''
;
border-left
:
1px
solid
#f5d6d6
;
border-right
:
1px
solid
#f5d6d6
;
width
:
2px
;
position
:
absolute
;
top
:
0
;
left
:
40px
;
height
:
100%
;
}
#todoapp
input
::-webkit-input-placeholder
{
font-style
:
italic
;
}
#todoapp
input
:-moz-placeholder
{
font-style
:
italic
;
color
:
#a9a9a9
;
}
#todoapp
h1
{
position
:
absolute
;
top
:
-120px
;
width
:
100%
;
font-size
:
70px
;
font-weight
:
bold
;
text-align
:
center
;
color
:
#b3b3b3
;
color
:
rgba
(
255
,
255
,
255
,
0.3
);
text-shadow
:
-1px
-1px
rgba
(
0
,
0
,
0
,
0.2
);
-webkit-text-rendering
:
optimizeLegibility
;
-moz-text-rendering
:
optimizeLegibility
;
-ms-text-rendering
:
optimizeLegibility
;
-o-text-rendering
:
optimizeLegibility
;
text-rendering
:
optimizeLegibility
;
}
#header
{
padding-top
:
15px
;
border-radius
:
inherit
;
}
#header
:before
{
content
:
''
;
position
:
absolute
;
top
:
0
;
right
:
0
;
left
:
0
;
height
:
15px
;
z-index
:
2
;
border-bottom
:
1px
solid
#6c615c
;
background
:
#8d7d77
;
background
:
-webkit-gradient
(
linear
,
left
top
,
left
bottom
,
from
(
rgba
(
132
,
110
,
100
,
0.8
)),
to
(
rgba
(
101
,
84
,
76
,
0.8
)));
background
:
-webkit-linear-gradient
(
top
,
rgba
(
132
,
110
,
100
,
0.8
),
rgba
(
101
,
84
,
76
,
0.8
));
background
:
-moz-linear-gradient
(
top
,
rgba
(
132
,
110
,
100
,
0.8
),
rgba
(
101
,
84
,
76
,
0.8
));
background
:
-o-linear-gradient
(
top
,
rgba
(
132
,
110
,
100
,
0.8
),
rgba
(
101
,
84
,
76
,
0.8
));
background
:
-ms-linear-gradient
(
top
,
rgba
(
132
,
110
,
100
,
0.8
),
rgba
(
101
,
84
,
76
,
0.8
));
background
:
linear-gradient
(
top
,
rgba
(
132
,
110
,
100
,
0.8
),
rgba
(
101
,
84
,
76
,
0.8
));
filter
:
progid
:
DXImageTransform
.
Microsoft
.
gradient
(
GradientType
=
0
,
StartColorStr
=
'#9d8b83'
,
EndColorStr
=
'#847670'
);
border-top-left-radius
:
1px
;
border-top-right-radius
:
1px
;
}
#new-todo
,
.edit
{
position
:
relative
;
margin
:
0
;
width
:
100%
;
font-size
:
24px
;
font-family
:
inherit
;
line-height
:
1.4em
;
border
:
0
;
outline
:
none
;
color
:
inherit
;
padding
:
6px
;
border
:
1px
solid
#999
;
box-shadow
:
inset
0
-1px
5px
0
rgba
(
0
,
0
,
0
,
0.2
);
-webkit-box-sizing
:
border-box
;
-moz-box-sizing
:
border-box
;
-ms-box-sizing
:
border-box
;
-o-box-sizing
:
border-box
;
box-sizing
:
border-box
;
-webkit-font-smoothing
:
antialiased
;
-moz-font-smoothing
:
antialiased
;
-ms-font-smoothing
:
antialiased
;
-o-font-smoothing
:
antialiased
;
font-smoothing
:
antialiased
;
}
#new-todo
{
padding
:
16px
16px
16px
60px
;
border
:
none
;
background
:
rgba
(
0
,
0
,
0
,
0.02
);
z-index
:
2
;
box-shadow
:
none
;
}
#main
{
position
:
relative
;
z-index
:
2
;
border-top
:
1px
dotted
#adadad
;
}
label
[
for
=
'toggle-all'
]
{
display
:
none
;
}
#toggle-all
{
position
:
absolute
;
top
:
-42px
;
left
:
-4px
;
width
:
40px
;
text-align
:
center
;
border
:
none
;
/* Mobile Safari */
}
#toggle-all
:before
{
content
:
'»'
;
font-size
:
28px
;
color
:
#d9d9d9
;
padding
:
0
25px
7px
;
}
#toggle-all
:checked:before
{
color
:
#737373
;
}
#todo-list
{
margin
:
0
;
padding
:
0
;
list-style
:
none
;
}
#todo-list
li
{
position
:
relative
;
font-size
:
24px
;
border-bottom
:
1px
dotted
#ccc
;
}
#todo-list
li
:last-child
{
border-bottom
:
none
;
}
#todo-list
li
.editing
{
border-bottom
:
none
;
padding
:
0
;
}
#todo-list
li
.editing
.edit
{
display
:
block
;
width
:
506px
;
padding
:
13px
17px
12px
17px
;
margin
:
0
0
0
43px
;
}
#todo-list
li
.editing
.view
{
display
:
none
;
}
#todo-list
li
.toggle
{
text-align
:
center
;
width
:
40px
;
/* auto, since non-WebKit browsers doesn't support input styling */
height
:
auto
;
position
:
absolute
;
top
:
0
;
bottom
:
0
;
margin
:
auto
0
;
border
:
none
;
/* Mobile Safari */
-webkit-appearance
:
none
;
/*-moz-appearance: none;*/
-ms-appearance
:
none
;
-o-appearance
:
none
;
appearance
:
none
;
}
#todo-list
li
.toggle
:after
{
content
:
'✔'
;
line-height
:
43px
;
/* 40 + a couple of pixels visual adjustment */
font-size
:
20px
;
color
:
#d9d9d9
;
text-shadow
:
0
-1px
0
#bfbfbf
;
}
#todo-list
li
.toggle
:checked:after
{
color
:
#85ada7
;
text-shadow
:
0
1px
0
#669991
;
bottom
:
1px
;
position
:
relative
;
}
#todo-list
li
label
{
word-break
:
break-word
;
padding
:
15px
;
margin-left
:
45px
;
display
:
block
;
line-height
:
1.2
;
-webkit-transition
:
color
0.4s
;
-moz-transition
:
color
0.4s
;
-ms-transition
:
color
0.4s
;
-o-transition
:
color
0.4s
;
transition
:
color
0.4s
;
}
#todo-list
li
.completed
label
{
color
:
#a9a9a9
;
text-decoration
:
line-through
;
}
#todo-list
li
.destroy
{
display
:
none
;
position
:
absolute
;
top
:
0
;
right
:
10px
;
bottom
:
0
;
width
:
40px
;
height
:
40px
;
margin
:
auto
0
;
font-size
:
22px
;
color
:
#a88a8a
;
-webkit-transition
:
all
0.2s
;
-moz-transition
:
all
0.2s
;
-ms-transition
:
all
0.2s
;
-o-transition
:
all
0.2s
;
transition
:
all
0.2s
;
}
#todo-list
li
.destroy
:hover
{
text-shadow
:
0
0
1px
#000
,
0
0
10px
rgba
(
199
,
107
,
107
,
0.8
);
-webkit-transform
:
scale
(
1.3
);
-moz-transform
:
scale
(
1.3
);
-ms-transform
:
scale
(
1.3
);
-o-transform
:
scale
(
1.3
);
transform
:
scale
(
1.3
);
}
#todo-list
li
.destroy
:after
{
content
:
'✖'
;
}
#todo-list
li
:hover
.destroy
{
display
:
block
;
}
#todo-list
li
.edit
{
display
:
none
;
}
#todo-list
li
.editing
:last-child
{
margin-bottom
:
-1px
;
}
#footer
{
color
:
#777
;
padding
:
0
15px
;
position
:
absolute
;
right
:
0
;
bottom
:
-31px
;
left
:
0
;
height
:
20px
;
z-index
:
1
;
text-align
:
center
;
}
#footer
:before
{
content
:
''
;
position
:
absolute
;
right
:
0
;
bottom
:
31px
;
left
:
0
;
height
:
50px
;
z-index
:
-1
;
box-shadow
:
0
1px
1px
rgba
(
0
,
0
,
0
,
0.3
),
0
6px
0
-3px
rgba
(
255
,
255
,
255
,
0.8
),
0
7px
1px
-3px
rgba
(
0
,
0
,
0
,
0.3
),
0
43px
0
-6px
rgba
(
255
,
255
,
255
,
0.8
),
0
44px
2px
-6px
rgba
(
0
,
0
,
0
,
0.2
);
}
#todo-count
{
float
:
left
;
text-align
:
left
;
}
#filters
{
margin
:
0
;
padding
:
0
;
list-style
:
none
;
position
:
absolute
;
right
:
0
;
left
:
0
;
}
#filters
li
{
display
:
inline
;
}
#filters
li
a
{
color
:
#83756f
;
margin
:
2px
;
text-decoration
:
none
;
}
#filters
li
a
.selected
{
font-weight
:
bold
;
}
#clear-completed
{
float
:
right
;
position
:
relative
;
line-height
:
20px
;
text-decoration
:
none
;
background
:
rgba
(
0
,
0
,
0
,
0.1
);
font-size
:
11px
;
padding
:
0
10px
;
border-radius
:
3px
;
box-shadow
:
0
-1px
0
0
rgba
(
0
,
0
,
0
,
0.2
);
}
#clear-completed
:hover
{
background
:
rgba
(
0
,
0
,
0
,
0.15
);
box-shadow
:
0
-1px
0
0
rgba
(
0
,
0
,
0
,
0.3
);
}
#info
{
margin
:
65px
auto
0
;
color
:
#a6a6a6
;
font-size
:
12px
;
text-shadow
:
0
1px
0
rgba
(
255
,
255
,
255
,
0.7
);
text-align
:
center
;
}
#info
a
{
color
:
inherit
;
}
/*
Hack to remove background from Mobile Safari.
Can't use it globally since it destroys checkboxes in Firefox and Opera
*/
@media
screen
and
(
-webkit-min-device-pixel-ratio
:
0
)
{
#toggle-all
,
#todo-list
li
.toggle
{
background
:
none
;
}
#todo-list
li
.toggle
{
height
:
40px
;
}
#toggle-all
{
top
:
-56px
;
left
:
-15px
;
width
:
65px
;
height
:
41px
;
-webkit-transform
:
rotate
(
90deg
);
transform
:
rotate
(
90deg
);
-webkit-appearance
:
none
;
appearance
:
none
;
}
}
.hidden
{
display
:
none
;
}
labs/architecture-examples/backbone_marionette/components/todomvc-common/base.js
0 → 100644
View file @
6f25047d
(
function
()
{
'
use strict
'
;
if
(
location
.
hostname
===
'
todomvc.com
'
)
{
var
_gaq
=
[[
'
_setAccount
'
,
'
UA-31081062-1
'
],[
'
_trackPageview
'
]];(
function
(
d
,
t
){
var
g
=
d
.
createElement
(
t
),
s
=
d
.
getElementsByTagName
(
t
)[
0
];
g
.
src
=
'
//www.google-analytics.com/ga.js
'
;
s
.
parentNode
.
insertBefore
(
g
,
s
)}(
document
,
'
script
'
));
}
})();
labs/architecture-examples/backbone_marionette/components/todomvc-common/bg.png
0 → 100644
View file @
6f25047d
2.08 KB
labs/architecture-examples/backbone_marionette/index.html
View file @
6f25047d
...
...
@@ -4,11 +4,8 @@
<meta
charset=
"utf-8"
>
<meta
http-equiv=
"X-UA-Compatible"
content=
"IE=edge,chrome=1"
>
<title>
Marionette • TodoMVC
</title>
<link
rel=
"stylesheet"
href=
"
../../../assets
/base.css"
>
<link
rel=
"stylesheet"
href=
"
components/todomvc-common
/base.css"
>
<link
rel=
"stylesheet"
href=
"css/app.css"
>
<!--[if IE]>
<script src="../../../assets/ie.js"></script>
<![endif]-->
<script
type=
"text/html"
id=
"template-footer"
>
<
span
id
=
"
todo-count
"
><
strong
><
/strong><span></
span
><
/span
>
<
ul
id
=
"
filters
"
>
...
...
@@ -58,12 +55,12 @@
<p>
Further variations on the Backbone.Marionette app are also
<a
href=
"https://github.com/marionettejs/backbone.marionette/wiki/Projects-and-websites-using-marionette"
>
available
</a>
.
</p>
</footer>
<!-- vendor libraries -->
<script
src=
"
../../../assets
/base.js"
></script>
<script
src=
"
../../../assets/jquery.min
.js"
></script>
<script
src=
"
../../../assets/lodash.min
.js"
></script>
<script
src=
"
js/lib
/backbone.js"
></script>
<script
src=
"
js/lib
/backbone.localStorage.js"
></script>
<script
src=
"
js
/lib/backbone.marionette.js"
></script>
<script
src=
"
components/todomvc-common
/base.js"
></script>
<script
src=
"
components/jquery/jquery
.js"
></script>
<script
src=
"
components/lodash/lodash
.js"
></script>
<script
src=
"
components/backbone
/backbone.js"
></script>
<script
src=
"
components/backbone.localStorage
/backbone.localStorage.js"
></script>
<script
src=
"
components/backbone.marionette
/lib/backbone.marionette.js"
></script>
<!-- application -->
<script
src=
"js/TodoMVC.js"
></script>
<script
src=
"js/TodoMVC.Todos.js"
></script>
...
...
labs/architecture-examples/backbone_marionette/js/lib/backbone.localStorage.js
deleted
100644 → 0
View file @
705154dc
/**
* Backbone localStorage Adapter
* Version 1.1.0
*
* https://github.com/jeromegn/Backbone.localStorage
*/
(
function
(
root
,
factory
)
{
if
(
typeof
define
===
"
function
"
&&
define
.
amd
)
{
// AMD. Register as an anonymous module.
define
([
"
underscore
"
,
"
backbone
"
],
function
(
_
,
Backbone
)
{
// Use global variables if the locals are undefined.
return
factory
(
_
||
root
.
_
,
Backbone
||
root
.
Backbone
);
});
}
else
{
// RequireJS isn't being used. Assume underscore and backbone are loaded in <script> tags
factory
(
_
,
Backbone
);
}
}(
this
,
function
(
_
,
Backbone
)
{
// A simple module to replace `Backbone.sync` with *localStorage*-based
// persistence. Models are given GUIDS, and saved into a JSON object. Simple
// as that.
// Hold reference to Underscore.js and Backbone.js in the closure in order
// to make things work even if they are removed from the global namespace
// Generate four random hex digits.
function
S4
()
{
return
(((
1
+
Math
.
random
())
*
0x10000
)
|
0
).
toString
(
16
).
substring
(
1
);
};
// Generate a pseudo-GUID by concatenating random hexadecimal.
function
guid
()
{
return
(
S4
()
+
S4
()
+
"
-
"
+
S4
()
+
"
-
"
+
S4
()
+
"
-
"
+
S4
()
+
"
-
"
+
S4
()
+
S4
()
+
S4
());
};
// Our Store is represented by a single JS object in *localStorage*. Create it
// with a meaningful name, like the name you'd give a table.
// window.Store is deprectated, use Backbone.LocalStorage instead
Backbone
.
LocalStorage
=
window
.
Store
=
function
(
name
)
{
this
.
name
=
name
;
var
store
=
this
.
localStorage
().
getItem
(
this
.
name
);
this
.
records
=
(
store
&&
store
.
split
(
"
,
"
))
||
[];
};
_
.
extend
(
Backbone
.
LocalStorage
.
prototype
,
{
// Save the current state of the **Store** to *localStorage*.
save
:
function
()
{
this
.
localStorage
().
setItem
(
this
.
name
,
this
.
records
.
join
(
"
,
"
));
},
// Add a model, giving it a (hopefully)-unique GUID, if it doesn't already
// have an id of it's own.
create
:
function
(
model
)
{
if
(
!
model
.
id
)
{
model
.
id
=
guid
();
model
.
set
(
model
.
idAttribute
,
model
.
id
);
}
this
.
localStorage
().
setItem
(
this
.
name
+
"
-
"
+
model
.
id
,
JSON
.
stringify
(
model
));
this
.
records
.
push
(
model
.
id
.
toString
());
this
.
save
();
return
this
.
find
(
model
);
},
// Update a model by replacing its copy in `this.data`.
update
:
function
(
model
)
{
this
.
localStorage
().
setItem
(
this
.
name
+
"
-
"
+
model
.
id
,
JSON
.
stringify
(
model
));
if
(
!
_
.
include
(
this
.
records
,
model
.
id
.
toString
()))
this
.
records
.
push
(
model
.
id
.
toString
());
this
.
save
();
return
this
.
find
(
model
);
},
// Retrieve a model from `this.data` by id.
find
:
function
(
model
)
{
return
this
.
jsonData
(
this
.
localStorage
().
getItem
(
this
.
name
+
"
-
"
+
model
.
id
));
},
// Return the array of all models currently in storage.
findAll
:
function
()
{
return
_
(
this
.
records
).
chain
()
.
map
(
function
(
id
)
{
return
this
.
jsonData
(
this
.
localStorage
().
getItem
(
this
.
name
+
"
-
"
+
id
));
},
this
)
.
compact
()
.
value
();
},
// Delete a model from `this.data`, returning it.
destroy
:
function
(
model
)
{
if
(
model
.
isNew
())
return
false
this
.
localStorage
().
removeItem
(
this
.
name
+
"
-
"
+
model
.
id
);
this
.
records
=
_
.
reject
(
this
.
records
,
function
(
id
)
{
return
id
===
model
.
id
.
toString
();
});
this
.
save
();
return
model
;
},
localStorage
:
function
()
{
return
localStorage
;
},
// fix for "illegal access" error on Android when JSON.parse is passed null
jsonData
:
function
(
data
)
{
return
data
&&
JSON
.
parse
(
data
);
}
});
// localSync delegate to the model or collection's
// *localStorage* property, which should be an instance of `Store`.
// window.Store.sync and Backbone.localSync is deprectated, use Backbone.LocalStorage.sync instead
Backbone
.
LocalStorage
.
sync
=
window
.
Store
.
sync
=
Backbone
.
localSync
=
function
(
method
,
model
,
options
)
{
var
store
=
model
.
localStorage
||
model
.
collection
.
localStorage
;
var
resp
,
errorMessage
,
syncDfd
=
$
.
Deferred
&&
$
.
Deferred
();
//If $ is having Deferred - use it.
try
{
switch
(
method
)
{
case
"
read
"
:
resp
=
model
.
id
!=
undefined
?
store
.
find
(
model
)
:
store
.
findAll
();
break
;
case
"
create
"
:
resp
=
store
.
create
(
model
);
break
;
case
"
update
"
:
resp
=
store
.
update
(
model
);
break
;
case
"
delete
"
:
resp
=
store
.
destroy
(
model
);
break
;
}
}
catch
(
error
)
{
if
(
error
.
code
===
DOMException
.
QUOTA_EXCEEDED_ERR
&&
window
.
localStorage
.
length
===
0
)
errorMessage
=
"
Private browsing is unsupported
"
;
else
errorMessage
=
error
.
message
;
}
if
(
resp
)
{
model
.
trigger
(
"
sync
"
,
model
,
resp
,
options
);
if
(
options
&&
options
.
success
)
if
(
Backbone
.
VERSION
===
"
0.9.10
"
)
{
options
.
success
(
model
,
resp
,
options
);
}
else
{
options
.
success
(
resp
);
}
if
(
syncDfd
)
syncDfd
.
resolve
(
resp
);
}
else
{
errorMessage
=
errorMessage
?
errorMessage
:
"
Record Not Found
"
;
model
.
trigger
(
"
error
"
,
model
,
errorMessage
,
options
);
if
(
options
&&
options
.
error
)
if
(
Backbone
.
VERSION
===
"
0.9.10
"
)
{
options
.
error
(
model
,
errorMessage
,
options
);
}
else
{
options
.
error
(
errorMessage
);
}
if
(
syncDfd
)
syncDfd
.
reject
(
errorMessage
);
}
// add compatibility with $.ajax
// always execute callback for success and error
if
(
options
&&
options
.
complete
)
options
.
complete
(
resp
);
return
syncDfd
&&
syncDfd
.
promise
();
};
Backbone
.
ajaxSync
=
Backbone
.
sync
;
Backbone
.
getSyncMethod
=
function
(
model
)
{
if
(
model
.
localStorage
||
(
model
.
collection
&&
model
.
collection
.
localStorage
))
{
return
Backbone
.
localSync
;
}
return
Backbone
.
ajaxSync
;
};
// Override 'Backbone.sync' to default to localSync,
// the original 'Backbone.sync' is still available in 'Backbone.ajaxSync'
Backbone
.
sync
=
function
(
method
,
model
,
options
)
{
return
Backbone
.
getSyncMethod
(
model
).
apply
(
this
,
[
method
,
model
,
options
]);
};
return
Backbone
.
LocalStorage
;
}));
\ No newline at end of file
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment