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
d019d29f
Commit
d019d29f
authored
Apr 10, 2013
by
Stephen Sawchuk
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
maria updated to use bower.
parent
ce69c3b2
Changes
20
Expand all
Hide whitespace changes
Inline
Side-by-side
Showing
20 changed files
with
2381 additions
and
705 deletions
+2381
-705
architecture-examples/maria/component.json
architecture-examples/maria/component.json
+8
-0
architecture-examples/maria/components/director/build/director.js
...ture-examples/maria/components/director/build/director.js
+712
-0
architecture-examples/maria/components/todomvc-common/base.css
...tecture-examples/maria/components/todomvc-common/base.css
+414
-0
architecture-examples/maria/components/todomvc-common/base.js
...itecture-examples/maria/components/todomvc-common/base.js
+38
-0
architecture-examples/maria/components/todomvc-common/bg.png
architecture-examples/maria/components/todomvc-common/bg.png
+0
-0
architecture-examples/maria/css/app.css
architecture-examples/maria/css/app.css
+0
-0
architecture-examples/maria/index.html
architecture-examples/maria/index.html
+10
-13
architecture-examples/maria/js/bootstrap.js
architecture-examples/maria/js/bootstrap.js
+16
-10
architecture-examples/maria/js/controllers/TodoController.js
architecture-examples/maria/js/controllers/TodoController.js
+15
-9
architecture-examples/maria/js/controllers/TodosController.js
...itecture-examples/maria/js/controllers/TodosController.js
+10
-5
architecture-examples/maria/js/models/TodoModel.js
architecture-examples/maria/js/models/TodoModel.js
+21
-9
architecture-examples/maria/js/models/TodosModel.js
architecture-examples/maria/js/models/TodosModel.js
+82
-0
architecture-examples/maria/js/namespace.js
architecture-examples/maria/js/namespace.js
+0
-0
architecture-examples/maria/js/templates/TodoTemplate.js
architecture-examples/maria/js/templates/TodoTemplate.js
+0
-0
architecture-examples/maria/js/templates/TodosTemplate.js
architecture-examples/maria/js/templates/TodosTemplate.js
+0
-0
architecture-examples/maria/js/util.js
architecture-examples/maria/js/util.js
+4
-4
architecture-examples/maria/js/views/TodoView.js
architecture-examples/maria/js/views/TodoView.js
+23
-13
architecture-examples/maria/js/views/TodosView.js
architecture-examples/maria/js/views/TodosView.js
+17
-10
architecture-examples/maria/lib/aristocrat/aristocrat.js
architecture-examples/maria/lib/aristocrat/aristocrat.js
+1
-1
architecture-examples/maria/lib/maria/maria.js
architecture-examples/maria/lib/maria/maria.js
+1010
-631
No files found.
architecture-examples/maria/component.json
0 → 100644
View file @
d019d29f
{
"name"
:
"todomvc-maria"
,
"version"
:
"0.0.0"
,
"dependencies"
:
{
"todomvc-common"
:
"~0.1.4"
,
"director"
:
"~1.2.0"
}
}
architecture-examples/maria/components/director/build/director.js
0 → 100644
View file @
d019d29f
This diff is collapsed.
Click to expand it.
architecture-examples/maria/components/todomvc-common/base.css
0 → 100644
View file @
d019d29f
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
;
}
architecture-examples/maria/components/todomvc-common/base.js
0 → 100644
View file @
d019d29f
(
function
()
{
'
use strict
'
;
if
(
location
.
hostname
===
'
todomvc.com
'
)
{
window
.
_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
'
));
}
function
getSourcePath
()
{
// If accessed via addyosmani.github.io/todomvc/, strip the project path.
if
(
location
.
hostname
.
indexOf
(
'
github.io
'
)
>
0
)
{
return
location
.
pathname
.
replace
(
/todomvc
\/
/
,
''
);
}
return
location
.
pathname
;
}
function
appendSourceLink
()
{
var
sourceLink
=
document
.
createElement
(
'
a
'
);
var
paragraph
=
document
.
createElement
(
'
p
'
);
var
footer
=
document
.
getElementById
(
'
info
'
);
var
urlBase
=
'
https://github.com/addyosmani/todomvc/tree/gh-pages
'
;
if
(
footer
)
{
sourceLink
.
href
=
urlBase
+
getSourcePath
();
sourceLink
.
appendChild
(
document
.
createTextNode
(
'
Check out the source
'
));
paragraph
.
appendChild
(
sourceLink
);
footer
.
appendChild
(
paragraph
);
}
}
function
redirect
()
{
if
(
location
.
hostname
===
'
addyosmani.github.io
'
)
{
location
.
href
=
location
.
href
.
replace
(
'
addyosmani.github.io/todomvc
'
,
'
todomvc.com
'
);
}
}
appendSourceLink
();
redirect
();
})();
architecture-examples/maria/components/todomvc-common/bg.png
0 → 100644
View file @
d019d29f
2.08 KB
architecture-examples/maria/
src/
css/app.css
→
architecture-examples/maria/css/app.css
View file @
d019d29f
File moved
architecture-examples/maria/
src/
index.html
→
architecture-examples/maria/index.html
View file @
d019d29f
...
...
@@ -3,16 +3,20 @@
<head>
<meta
charset=
"utf-8"
>
<title>
Maria • TodoMVC
</title>
<link
href=
"../../../assets/base.css"
rel=
"stylesheet"
>
<link
href=
"components/todomvc-common/base.css"
rel=
"stylesheet"
>
<link
href=
"css/app.css"
rel=
"stylesheet"
>
</head>
<body>
<footer
id=
"info"
>
<p>
Double-click to edit a todo
</p>
<p>
Created by
<a
href=
"http://github.com/petermichaux"
>
Peter Michaux
</a></p>
<p>
Part of
<a
href=
"http://todomvc.com"
>
TodoMVC
</a></p>
</footer>
<script
src=
"../lib/maria/maria.js"
></script>
<script
src=
"../lib/aristocrat/aristocrat.js"
></script>
<script
src=
"../../../assets/director.min.js"
></script>
<script
src=
"components/todomvc-common/base.js"
></script>
<script
src=
"components/director/build/director.js"
></script>
<script
src=
"lib/maria/maria.js"
></script>
<script
src=
"lib/aristocrat/aristocrat.js"
></script>
<script
src=
"js/namespace.js"
></script>
<script
src=
"js/util.js"
></script>
...
...
@@ -25,12 +29,5 @@
<script
src=
"js/views/TodoView.js"
></script>
<script
src=
"js/controllers/TodoController.js"
></script>
<script
src=
"js/bootstrap.js"
></script>
<footer
id=
"info"
>
<p>
Double-click to edit a todo
</p>
<p>
Created by
<a
href=
"http://github.com/petermichaux"
>
Peter Michaux
</a></p>
<p>
Part of
<a
href=
"http://todomvc.com"
>
TodoMVC
</a></p>
</footer>
</body>
</html>
architecture-examples/maria/
src/
js/bootstrap.js
→
architecture-examples/maria/js/bootstrap.js
View file @
d019d29f
/*jshint strict: false */
/*global maria, Router, checkit */
maria
.
on
(
window
,
'
load
'
,
function
()
{
maria
.
on
(
window
,
'
load
'
,
function
()
{
var
model
;
if
((
typeof
localStorage
===
'
object
'
)
&&
(
typeof
JSON
===
'
object
'
))
{
var
store
=
localStorage
.
getItem
(
'
todos-maria
'
);
model
=
store
?
checkit
.
TodosModel
.
fromJSON
(
JSON
.
parse
(
store
))
:
new
checkit
.
TodosModel
();
maria
.
on
(
model
,
'
change
'
,
function
()
{
if
(
store
)
{
model
=
checkit
.
TodosModel
.
fromJSON
(
JSON
.
parse
(
store
));
}
else
{
model
=
new
checkit
.
TodosModel
();
}
maria
.
on
(
model
,
'
change
'
,
function
()
{
localStorage
.
setItem
(
'
todos-maria
'
,
JSON
.
stringify
(
model
.
toJSON
()));
});
}
else
{
}
else
{
model
=
new
checkit
.
TodosModel
();
}
var
routes
=
{
'
/
'
:
function
()
{
'
/
'
:
function
()
{
model
.
setMode
(
'
all
'
);
},
'
/active
'
:
function
()
{
'
/active
'
:
function
()
{
model
.
setMode
(
'
incompleted
'
);
},
'
/completed
'
:
function
()
{
'
/completed
'
:
function
()
{
model
.
setMode
(
'
completed
'
);
}
};
var
router
=
Router
(
routes
);
var
router
=
new
Router
(
routes
);
router
.
init
();
var
view
=
new
checkit
.
TodosAppView
(
model
);
...
...
architecture-examples/maria/
src/
js/controllers/TodoController.js
→
architecture-examples/maria/js/controllers/TodoController.js
View file @
d019d29f
...
...
@@ -3,35 +3,41 @@
maria
.
Controller
.
subclass
(
checkit
,
'
TodoController
'
,
{
properties
:
{
onClickDestroy
:
function
()
{
onClickDestroy
:
function
()
{
this
.
getModel
().
destroy
();
},
onClickToggle
:
function
()
{
onClickToggle
:
function
()
{
this
.
getModel
().
toggleCompleted
();
},
onDblclickLabel
:
function
()
{
onDblclickLabel
:
function
()
{
this
.
getView
().
showEdit
();
},
onKeyupEdit
:
function
(
evt
)
{
onKeyupEdit
:
function
(
evt
)
{
var
keyCode
=
evt
.
keyCode
;
if
(
checkit
.
isEnterKeyCode
(
keyCode
))
{
this
.
onBlurEdit
();
}
else
if
(
checkit
.
isEscapeKeyCode
(
keyCode
))
{
}
else
if
(
checkit
.
isEscapeKeyCode
(
keyCode
))
{
var
view
=
this
.
getView
();
view
.
resetEdit
();
view
.
showDisplay
();
}
},
onBlurEdit
:
function
()
{
onBlurEdit
:
function
()
{
var
model
=
this
.
getModel
();
var
view
=
this
.
getView
();
var
value
=
view
.
getInputValue
();
view
.
showDisplay
();
if
(
checkit
.
isBlank
(
value
))
{
model
.
destroy
();
}
else
{
}
else
{
model
.
setTitle
(
value
);
}
}
...
...
architecture-examples/maria/
src/
js/controllers/TodosController.js
→
architecture-examples/maria/js/controllers/TodosController.js
View file @
d019d29f
...
...
@@ -3,28 +3,33 @@
maria
.
Controller
.
subclass
(
checkit
,
'
TodosAppController
'
,
{
properties
:
{
onKeyupNewTodo
:
function
(
evt
)
{
onKeyupNewTodo
:
function
(
evt
)
{
if
(
checkit
.
isEnterKeyCode
(
evt
.
keyCode
))
{
var
view
=
this
.
getView
();
var
value
=
view
.
getInputValue
();
if
(
!
checkit
.
isBlank
(
value
))
{
var
todo
=
new
checkit
.
TodoModel
();
todo
.
setTitle
(
value
);
this
.
getModel
().
add
(
todo
);
view
.
clearInput
();
}
}
},
onClickToggleAll
:
function
()
{
onClickToggleAll
:
function
()
{
var
model
=
this
.
getModel
();
if
(
model
.
isAllCompleted
())
{
model
.
markAllIncompleted
();
}
else
{
}
else
{
model
.
markAllCompleted
();
}
},
onClickClearCompleted
:
function
()
{
onClickClearCompleted
:
function
()
{
this
.
getModel
().
deleteCompleted
();
}
}
...
...
architecture-examples/maria/
src/
js/models/TodoModel.js
→
architecture-examples/maria/js/models/TodoModel.js
View file @
d019d29f
...
...
@@ -5,30 +5,40 @@ maria.Model.subclass(checkit, 'TodoModel', {
properties
:
{
_title
:
''
,
_completed
:
false
,
getTitle
:
function
()
{
getTitle
:
function
()
{
return
this
.
_title
;
},
setTitle
:
function
(
title
)
{
setTitle
:
function
(
title
)
{
title
=
(
''
+
title
).
trim
();
if
(
this
.
_title
!==
title
)
{
this
.
_title
=
title
;
this
.
dispatchEvent
({
type
:
'
change
'
});
this
.
dispatchEvent
({
type
:
'
change
'
});
}
},
isCompleted
:
function
()
{
isCompleted
:
function
()
{
return
this
.
_completed
;
},
setCompleted
:
function
(
completed
)
{
setCompleted
:
function
(
completed
)
{
completed
=
!!
completed
;
if
(
this
.
_completed
!==
completed
)
{
this
.
_completed
=
completed
;
this
.
dispatchEvent
({
type
:
'
change
'
});
this
.
dispatchEvent
({
type
:
'
change
'
});
}
},
toggleCompleted
:
function
()
{
toggleCompleted
:
function
()
{
this
.
setCompleted
(
!
this
.
isCompleted
());
},
toJSON
:
function
()
{
toJSON
:
function
()
{
return
{
title
:
this
.
_title
,
completed
:
this
.
_completed
...
...
@@ -37,9 +47,11 @@ maria.Model.subclass(checkit, 'TodoModel', {
}
});
checkit
.
TodoModel
.
fromJSON
=
function
(
todoJSON
)
{
checkit
.
TodoModel
.
fromJSON
=
function
(
todoJSON
)
{
var
model
=
new
checkit
.
TodoModel
();
model
.
_title
=
todoJSON
.
title
;
model
.
_completed
=
todoJSON
.
completed
;
return
model
;
};
architecture-examples/maria/
src/
js/models/TodosModel.js
→
architecture-examples/maria/js/models/TodosModel.js
View file @
d019d29f
...
...
@@ -4,61 +4,79 @@
maria
.
SetModel
.
subclass
(
checkit
,
'
TodosModel
'
,
{
properties
:
{
_mode
:
'
all
'
,
getPossibleModes
:
function
()
{
getPossibleModes
:
function
()
{
return
[
'
all
'
,
'
incompleted
'
,
'
completed
'
];
},
getMode
:
function
()
{
getMode
:
function
()
{
return
this
.
_mode
;
},
setMode
:
function
(
mode
)
{
if
(
this
.
getPossibleModes
().
some
(
function
(
m
)
{
return
m
===
mode
;}))
{
setMode
:
function
(
mode
)
{
var
modePossible
=
this
.
getPossibleModes
().
some
(
function
(
m
)
{
return
m
===
mode
;
});
if
(
modePossible
)
{
if
(
this
.
_mode
!==
mode
)
{
this
.
_mode
=
mode
;
this
.
dispatchEvent
({
type
:
'
change
'
});
this
.
dispatchEvent
({
type
:
'
change
'
});
}
}
else
{
throw
new
Error
(
'
checkit.TodosModel.prototype.setMode: unsupported mode "
'
+
mode
+
'
".
'
);
}
else
{
throw
new
Error
(
'
checkit.TodosModel.prototype.setMode: unsupported mode "
'
+
mode
+
'
".
'
);
}
},
getCompleted
:
function
()
{
return
this
.
filter
(
function
(
todo
)
{
getCompleted
:
function
()
{
return
this
.
filter
(
function
(
todo
)
{
return
todo
.
isCompleted
();
});
},
getIncompleted
:
function
()
{
return
this
.
filter
(
function
(
todo
)
{
getIncompleted
:
function
()
{
return
this
.
filter
(
function
(
todo
)
{
return
!
todo
.
isCompleted
();
});
},
isAllCompleted
:
function
()
{
isAllCompleted
:
function
()
{
return
(
this
.
length
>
0
)
&&
(
this
.
getCompleted
().
length
===
this
.
length
);
},
markAllCompleted
:
function
()
{
this
.
forEach
(
function
(
todo
)
{
markAllCompleted
:
function
()
{
this
.
forEach
(
function
(
todo
)
{
todo
.
setCompleted
(
true
);
});
},
markAllIncompleted
:
function
()
{
this
.
forEach
(
function
(
todo
)
{
markAllIncompleted
:
function
()
{
this
.
forEach
(
function
(
todo
)
{
todo
.
setCompleted
(
false
);
});
},
deleteCompleted
:
function
()
{
deleteCompleted
:
function
()
{
this
[
'
delete
'
].
apply
(
this
,
this
.
getCompleted
());
},
toJSON
:
function
()
{
return
this
.
map
(
function
(
todo
)
{
toJSON
:
function
()
{
return
this
.
map
(
function
(
todo
)
{
return
todo
.
toJSON
();
});
}
}
});
checkit
.
TodosModel
.
fromJSON
=
function
(
todosJSON
)
{
checkit
.
TodosModel
.
fromJSON
=
function
(
todosJSON
)
{
var
model
=
new
checkit
.
TodosModel
();
for
(
var
i
=
0
,
ilen
=
todosJSON
.
length
;
i
<
ilen
;
i
++
)
{
var
i
;
var
ilen
;
for
(
i
=
0
,
ilen
=
todosJSON
.
length
;
i
<
ilen
;
i
++
)
{
model
.
add
(
checkit
.
TodoModel
.
fromJSON
(
todosJSON
[
i
]));
}
return
model
;
};
architecture-examples/maria/
src/
js/namespace.js
→
architecture-examples/maria/js/namespace.js
View file @
d019d29f
File moved
architecture-examples/maria/
src/
js/templates/TodoTemplate.js
→
architecture-examples/maria/js/templates/TodoTemplate.js
View file @
d019d29f
File moved
architecture-examples/maria/
src/
js/templates/TodosTemplate.js
→
architecture-examples/maria/js/templates/TodosTemplate.js
View file @
d019d29f
File moved
architecture-examples/maria/
src/
js/util.js
→
architecture-examples/maria/js/util.js
View file @
d019d29f
/*jshint strict: false */
/*global checkit */
checkit
.
isBlank
=
function
(
str
)
{
checkit
.
isBlank
=
function
(
str
)
{
return
(
/^
\s
*$/
).
test
(
str
);
};
checkit
.
escapeHTML
=
function
(
str
)
{
checkit
.
escapeHTML
=
function
(
str
)
{
return
String
(
str
)
.
replace
(
/&
(?!\w
+;
)
/g
,
'
&
'
)
.
replace
(
/</g
,
'
<
'
)
...
...
@@ -13,10 +13,10 @@ checkit.escapeHTML = function(str) {
.
replace
(
/"/g
,
'
"
'
);
};
checkit
.
isEnterKeyCode
=
function
(
keyCode
)
{
checkit
.
isEnterKeyCode
=
function
(
keyCode
)
{
return
keyCode
===
13
;
};
checkit
.
isEscapeKeyCode
=
function
(
keyCode
)
{
checkit
.
isEscapeKeyCode
=
function
(
keyCode
)
{
return
keyCode
===
27
;
};
architecture-examples/maria/
src/
js/views/TodoView.js
→
architecture-examples/maria/js/views/TodoView.js
View file @
d019d29f
...
...
@@ -3,17 +3,18 @@
maria
.
ElementView
.
subclass
(
checkit
,
'
TodoView
'
,
{
uiActions
:
{
'
click
.destroy
'
:
'
onClickDestroy
'
,
'
click
.toggle
'
:
'
onClickToggle
'
,
'
dblclick label
'
:
'
onDblclickLabel
'
,
'
keyup
.edit
'
:
'
onKeyupEdit
'
,
'
blur
.edit
'
:
'
onBlurEdit
'
'
click
.destroy
'
:
'
onClickDestroy
'
,
'
click
.toggle
'
:
'
onClickToggle
'
,
'
dblclick label
'
:
'
onDblclickLabel
'
,
'
keyup
.edit
'
:
'
onKeyupEdit
'
,
'
blur
.edit
'
:
'
onBlurEdit
'
},
properties
:
{
buildData
:
function
()
{
buildData
:
function
()
{
var
model
=
this
.
getModel
();
var
item
=
this
.
find
(
'
li
'
);
aristocrat
.
removeClass
(
item
,
'
(in|)completed
'
);
aristocrat
.
addClass
(
item
,
(
model
.
isCompleted
()
?
'
completed
'
:
'
incompleted
'
));
...
...
@@ -21,23 +22,32 @@ maria.ElementView.subclass(checkit, 'TodoView', {
this
.
find
(
'
.toggle
'
).
checked
=
model
.
isCompleted
();
},
update
:
function
()
{
update
:
function
()
{
this
.
buildData
();
},
resetEdit
:
function
()
{
resetEdit
:
function
()
{
var
input
=
this
.
find
(
'
.edit
'
);
input
.
value
=
this
.
getModel
().
getTitle
();
},
showEdit
:
function
()
{
this
.
resetEdit
();
showEdit
:
function
()
{
var
input
=
this
.
find
(
'
.edit
'
);
this
.
resetEdit
();
aristocrat
.
addClass
(
this
.
find
(
'
li
'
),
'
editing
'
);
input
.
focus
();
},
showDisplay
:
function
()
{
showDisplay
:
function
()
{
aristocrat
.
removeClass
(
this
.
find
(
'
li
'
),
'
editing
'
);
},
getInputValue
:
function
()
{
getInputValue
:
function
()
{
return
this
.
find
(
'
.edit
'
).
value
;
}
}
...
...
architecture-examples/maria/
src/
js/views/TodosView.js
→
architecture-examples/maria/js/views/TodosView.js
View file @
d019d29f
...
...
@@ -3,12 +3,13 @@
maria
.
SetView
.
subclass
(
checkit
,
'
TodosAppView
'
,
{
uiActions
:
{
'
keyup #new-todo
'
:
'
onKeyupNewTodo
'
,
'
click #toggle-all
'
:
'
onClickToggleAll
'
,
'
keyup #new-todo
'
:
'
onKeyupNewTodo
'
,
'
click #toggle-all
'
:
'
onClickToggleAll
'
,
'
click #clear-completed
'
:
'
onClickClearCompleted
'
},
properties
:
{
buildData
:
function
()
{
buildData
:
function
()
{
var
model
=
this
.
getModel
();
var
length
=
model
.
length
;
...
...
@@ -20,11 +21,11 @@ maria.SetView.subclass(checkit, 'TodosAppView', {
checkbox
.
disabled
=
model
.
isEmpty
();
var
todoList
=
this
.
find
(
'
#todo-list
'
);
model
.
getPossibleModes
().
forEach
(
function
(
mode
)
{
model
.
getPossibleModes
().
forEach
(
function
(
mode
)
{
aristocrat
.
removeClass
(
todoList
,
mode
);
});
aristocrat
.
addClass
(
todoList
,
model
.
getMode
());
var
incompletedLength
=
model
.
getIncompleted
().
length
;
this
.
find
(
'
#todo-count
'
).
innerHTML
=
'
<strong>
'
+
incompletedLength
+
'
</strong>
'
+
...
...
@@ -42,21 +43,27 @@ maria.SetView.subclass(checkit, 'TodosAppView', {
clearButton
.
style
.
display
=
(
completedLength
>
0
)
?
''
:
'
none
'
;
clearButton
.
innerHTML
=
'
Clear completed (
'
+
completedLength
+
'
)
'
;
},
update
:
function
(
evt
)
{
update
:
function
(
evt
)
{
maria
.
SetView
.
prototype
.
update
.
call
(
this
,
evt
);
this
.
buildData
();
},
getContainerEl
:
function
()
{
getContainerEl
:
function
()
{
// child views will be appended to this element
return
this
.
find
(
'
#todo-list
'
);
},
createChildView
:
function
(
todoModel
)
{
createChildView
:
function
(
todoModel
)
{
return
new
checkit
.
TodoView
(
todoModel
);
},
getInputValue
:
function
()
{
getInputValue
:
function
()
{
return
this
.
find
(
'
#new-todo
'
).
value
;
},
clearInput
:
function
()
{
clearInput
:
function
()
{
this
.
find
(
'
#new-todo
'
).
value
=
''
;
}
}
...
...
architecture-examples/maria/lib/aristocrat/aristocrat.js
View file @
d019d29f
...
...
@@ -78,7 +78,7 @@ aristocrat.removeClass(document.body, 'king');
var
re
=
getRegExp
(
className
);
while
(
re
.
test
(
el
.
className
))
{
// in case multiple occurrences
el
.
className
=
el
.
className
.
replace
(
re
,
'
'
);
}
}
};
/**
...
...
architecture-examples/maria/lib/maria/maria.js
View file @
d019d29f
This diff is collapsed.
Click to expand it.
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