Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
E
edx-platform
Overview
Overview
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
edx
edx-platform
Commits
a26a7c86
Commit
a26a7c86
authored
Mar 25, 2013
by
Brian Talbot
Browse files
Options
Browse Files
Download
Plain Diff
Merge pull request #1728 from MITx/bug/christina/cursor-move
Don't save subsection and unit names until the change event.
parents
a2518ff6
dfdc2cb7
Hide whitespace changes
Inline
Side-by-side
Showing
4 changed files
with
7 additions
and
210 deletions
+7
-210
cms/static/coffee/src/views/unit.coffee
+3
-22
cms/static/js/base.js
+4
-98
cms/static/sass/views/_subsection.scss
+0
-78
cms/templates/edit_subsection.html
+0
-12
No files found.
cms/static/coffee/src/views/unit.coffee
View file @
a26a7c86
...
@@ -167,7 +167,7 @@ class CMS.Views.UnitEdit extends Backbone.View
...
@@ -167,7 +167,7 @@ class CMS.Views.UnitEdit extends Backbone.View
class
CMS
.
Views
.
UnitEdit
.
NameEdit
extends
Backbone
.
View
class
CMS
.
Views
.
UnitEdit
.
NameEdit
extends
Backbone
.
View
events
:
events
:
"keyup .unit-display-name-input"
:
"saveName"
'change .unit-display-name-input'
:
'saveName'
initialize
:
=>
initialize
:
=>
@
model
.
on
(
'change:metadata'
,
@
render
)
@
model
.
on
(
'change:metadata'
,
@
render
)
...
@@ -190,29 +190,10 @@ class CMS.Views.UnitEdit.NameEdit extends Backbone.View
...
@@ -190,29 +190,10 @@ class CMS.Views.UnitEdit.NameEdit extends Backbone.View
# Treat the metadata dictionary as immutable
# Treat the metadata dictionary as immutable
metadata
=
$
.
extend
({},
@
model
.
get
(
'metadata'
))
metadata
=
$
.
extend
({},
@
model
.
get
(
'metadata'
))
metadata
.
display_name
=
@
$
(
'.unit-display-name-input'
).
val
()
metadata
.
display_name
=
@
$
(
'.unit-display-name-input'
).
val
()
@
model
.
save
(
metadata
:
metadata
)
# Update name shown in the right-hand side location summary.
$
(
'.unit-location .editing .unit-name'
).
html
(
metadata
.
display_name
)
$
(
'.unit-location .editing .unit-name'
).
html
(
metadata
.
display_name
)
inputField
=
this
.
$el
.
find
(
'input'
)
# add a spinner
@
$spinner
.
css
({
'position'
:
'absolute'
,
'top'
:
Math
.
floor
(
inputField
.
position
().
top
+
(
inputField
.
outerHeight
()
/
2
)
+
3
),
'left'
:
inputField
.
position
().
left
+
inputField
.
outerWidth
()
-
24
,
'margin-top'
:
'-10px'
});
inputField
.
after
(
@
$spinner
);
@
$spinner
.
fadeIn
(
10
)
# save the name after a slight delay
if
@
timer
clearTimeout
@
timer
@
timer
=
setTimeout
(
=>
@
model
.
save
(
metadata
:
metadata
)
@
timer
=
null
@
$spinner
.
delay
(
500
).
fadeOut
(
150
)
,
500
)
class
CMS
.
Views
.
UnitEdit
.
LocationState
extends
Backbone
.
View
class
CMS
.
Views
.
UnitEdit
.
LocationState
extends
Backbone
.
View
initialize
:
=>
initialize
:
=>
@
model
.
on
(
'change:state'
,
@
render
)
@
model
.
on
(
'change:state'
,
@
render
)
...
...
cms/static/js/base.js
View file @
a26a7c86
...
@@ -92,9 +92,9 @@ $(document).ready(function () {
...
@@ -92,9 +92,9 @@ $(document).ready(function () {
});
});
$
(
'.toggle-button-sections'
).
bind
(
'click'
,
toggleSections
);
$
(
'.toggle-button-sections'
).
bind
(
'click'
,
toggleSections
);
// autosave when
a field is updated on the subsection page
// autosave when
leaving input field
$body
.
on
(
'
keyup'
,
'.subsection-display-name-input, .unit-subtitle, .policy-list-value'
,
checkForNewValue
);
$body
.
on
(
'
change'
,
'.subsection-display-name-input'
,
saveSubsection
);
$
(
'.subsection-display-name-input
, .unit-subtitle, .policy-list-name, .policy-list-value'
).
each
(
function
(
i
)
{
$
(
'.subsection-display-name-input
'
).
each
(
function
(
)
{
this
.
val
=
$
(
this
).
val
();
this
.
val
=
$
(
this
).
val
();
});
});
$
(
"#start_date, #start_time, #due_date, #due_time"
).
bind
(
'change'
,
autosaveInput
);
$
(
"#start_date, #start_time, #due_date, #due_time"
).
bind
(
'change'
,
autosaveInput
);
...
@@ -110,11 +110,6 @@ $(document).ready(function () {
...
@@ -110,11 +110,6 @@ $(document).ready(function () {
// add new/delete subsection
// add new/delete subsection
$
(
'.new-subsection-item'
).
bind
(
'click'
,
addNewSubsection
);
$
(
'.new-subsection-item'
).
bind
(
'click'
,
addNewSubsection
);
$
(
'.delete-subsection-button'
).
bind
(
'click'
,
deleteSubsection
);
$
(
'.delete-subsection-button'
).
bind
(
'click'
,
deleteSubsection
);
// add/remove policy metadata button click handlers
$
(
'.add-policy-data'
).
bind
(
'click'
,
addPolicyMetadata
);
$
(
'.remove-policy-data'
).
bind
(
'click'
,
removePolicyMetadata
);
$body
.
on
(
'click'
,
'.policy-list-element .save-button'
,
savePolicyMetadata
);
$body
.
on
(
'click'
,
'.policy-list-element .cancel-button'
,
cancelPolicyMetadata
);
$
(
'.sync-date'
).
bind
(
'click'
,
syncReleaseDate
);
$
(
'.sync-date'
).
bind
(
'click'
,
syncReleaseDate
);
...
@@ -163,7 +158,6 @@ function linkSmoothScroll(e) {
...
@@ -163,7 +158,6 @@ function linkSmoothScroll(e) {
scrollElement
:
null
,
scrollElement
:
null
,
scrollTarget
:
$
(
this
).
attr
(
'href'
)
scrollTarget
:
$
(
this
).
attr
(
'href'
)
});
});
console
.
log
(
'clicked!'
);
}
}
function
linkNewWindow
(
e
)
{
function
linkNewWindow
(
e
)
{
...
@@ -234,56 +228,6 @@ function syncReleaseDate(e) {
...
@@ -234,56 +228,6 @@ function syncReleaseDate(e) {
$
(
"#start_time"
).
val
(
""
);
$
(
"#start_time"
).
val
(
""
);
}
}
function
addPolicyMetadata
(
e
)
{
e
.
preventDefault
();
var
template
=
$
(
'#add-new-policy-element-template > li'
);
var
newNode
=
template
.
clone
();
var
_parent_el
=
$
(
this
).
parent
(
'ol:.policy-list'
);
newNode
.
insertBefore
(
'.add-policy-data'
);
$
(
'.remove-policy-data'
).
bind
(
'click'
,
removePolicyMetadata
);
newNode
.
find
(
'.policy-list-name'
).
focus
();
}
function
savePolicyMetadata
(
e
)
{
e
.
preventDefault
();
var
$policyElement
=
$
(
this
).
parents
(
'.policy-list-element'
);
saveSubsection
()
$policyElement
.
removeClass
(
'new-policy-list-element'
);
$policyElement
.
find
(
'.policy-list-name'
).
attr
(
'disabled'
,
'disabled'
);
$policyElement
.
removeClass
(
'editing'
);
}
function
cancelPolicyMetadata
(
e
)
{
e
.
preventDefault
();
var
$policyElement
=
$
(
this
).
parents
(
'.policy-list-element'
);
if
(
!
$policyElement
.
hasClass
(
'editing'
))
{
$policyElement
.
remove
();
}
else
{
$policyElement
.
removeClass
(
'new-policy-list-element'
);
$policyElement
.
find
(
'.policy-list-name'
).
val
(
$policyElement
.
data
(
'currentValues'
)[
0
]);
$policyElement
.
find
(
'.policy-list-value'
).
val
(
$policyElement
.
data
(
'currentValues'
)[
1
]);
}
$policyElement
.
removeClass
(
'editing'
);
}
function
removePolicyMetadata
(
e
)
{
e
.
preventDefault
();
if
(
!
confirm
(
'Are you sure you wish to delete this item. It cannot be reversed!'
))
return
;
policy_name
=
$
(
this
).
data
(
'policy-name'
);
var
_parent_el
=
$
(
this
).
parent
(
'li:.policy-list-element'
);
if
(
$
(
_parent_el
).
hasClass
(
"new-policy-list-element"
))
{
_parent_el
.
remove
();
}
else
{
_parent_el
.
appendTo
(
"#policy-to-delete"
);
}
saveSubsection
()
}
function
getEdxTimeFromDateTimeVals
(
date_val
,
time_val
,
format
)
{
function
getEdxTimeFromDateTimeVals
(
date_val
,
time_val
,
format
)
{
var
edxTimeStr
=
null
;
var
edxTimeStr
=
null
;
...
@@ -309,31 +253,6 @@ function getEdxTimeFromDateTimeInputs(date_id, time_id, format) {
...
@@ -309,31 +253,6 @@ function getEdxTimeFromDateTimeInputs(date_id, time_id, format) {
return
getEdxTimeFromDateTimeVals
(
input_date
,
input_time
,
format
);
return
getEdxTimeFromDateTimeVals
(
input_date
,
input_time
,
format
);
}
}
function
checkForNewValue
(
e
)
{
if
(
$
(
this
).
parents
(
'.new-policy-list-element'
)[
0
])
{
return
;
}
if
(
this
.
val
)
{
this
.
hasChanged
=
this
.
val
!=
$
(
this
).
val
();
}
else
{
this
.
hasChanged
=
false
;
}
this
.
val
=
$
(
this
).
val
();
if
(
this
.
hasChanged
)
{
if
(
this
.
saveTimer
)
{
clearTimeout
(
this
.
saveTimer
);
}
this
.
saveTimer
=
setTimeout
(
function
()
{
$changedInput
=
$
(
e
.
target
);
saveSubsection
();
this
.
saveTimer
=
null
;
},
500
);
}
}
function
autosaveInput
(
e
)
{
function
autosaveInput
(
e
)
{
if
(
this
.
saveTimer
)
{
if
(
this
.
saveTimer
)
{
clearTimeout
(
this
.
saveTimer
);
clearTimeout
(
this
.
saveTimer
);
...
@@ -347,6 +266,7 @@ function autosaveInput(e) {
...
@@ -347,6 +266,7 @@ function autosaveInput(e) {
}
}
function
saveSubsection
()
{
function
saveSubsection
()
{
// Spinner is no longer used by subsection name, but is still used by date and time pickers on the right.
if
(
$changedInput
&&
!
$changedInput
.
hasClass
(
'no-spinner'
))
{
if
(
$changedInput
&&
!
$changedInput
.
hasClass
(
'no-spinner'
))
{
$spinner
.
css
({
$spinner
.
css
({
'position'
:
'absolute'
,
'position'
:
'absolute'
,
...
@@ -369,20 +289,6 @@ function saveSubsection() {
...
@@ -369,20 +289,6 @@ function saveSubsection() {
metadata
[
$
(
el
).
data
(
"metadata-name"
)]
=
el
.
value
;
metadata
[
$
(
el
).
data
(
"metadata-name"
)]
=
el
.
value
;
}
}
// now add 'free-formed' metadata which are presented to the user as dual input fields (name/value)
$
(
'ol.policy-list > li.policy-list-element'
).
each
(
function
(
i
,
element
)
{
var
name
=
$
(
element
).
children
(
'.policy-list-name'
).
val
();
metadata
[
name
]
=
$
(
element
).
children
(
'.policy-list-value'
).
val
();
});
// now add any 'removed' policy metadata which is stored in a separate hidden div
// 'null' presented to the server means 'remove'
$
(
"#policy-to-delete > li.policy-list-element"
).
each
(
function
(
i
,
element
)
{
var
name
=
$
(
element
).
children
(
'.policy-list-name'
).
val
();
if
(
name
!=
""
)
metadata
[
name
]
=
null
;
});
// Piece back together the date/time UI elements into one date/time string
// Piece back together the date/time UI elements into one date/time string
// NOTE: our various "date/time" metadata elements don't always utilize the same formatting string
// NOTE: our various "date/time" metadata elements don't always utilize the same formatting string
// so make sure we're passing back the correct format
// so make sure we're passing back the correct format
...
...
cms/static/sass/views/_subsection.scss
View file @
a26a7c86
...
@@ -172,89 +172,11 @@ body.course.subsection {
...
@@ -172,89 +172,11 @@ body.course.subsection {
font-size
:
14px
;
font-size
:
14px
;
}
}
.unit-subtitle
{
display
:
block
;
width
:
100%
;
}
.sortable-unit-list
{
.sortable-unit-list
{
ol
{
ol
{
@include
tree-view
;
@include
tree-view
;
}
}
}
}
.policy-list
{
input
[
disabled
]
{
border
:
none
;
@include
box-shadow
(
none
);
}
.policy-list-name
{
margin-right
:
5px
;
margin-bottom
:
10px
;
}
.policy-list-value
{
width
:
320px
;
margin-right
:
10px
;
}
}
.policy-list-element
{
.save-button
,
.cancel-button
{
display
:
none
;
}
.edit-icon
{
margin-right
:
8px
;
}
&
.editing
,
&
.new-policy-list-element
{
.policy-list-name
,
.policy-list-value
{
border
:
1px
solid
#b0b6c2
;
@include
linear-gradient
(
top
,
rgba
(
255
,
255
,
255
,
0
)
,
rgba
(
255
,
255
,
255
,
.3
));
background-color
:
#edf1f5
;
@include
box-shadow
(
0
1px
2px
rgba
(
0
,
0
,
0
,
.1
)
inset
);
}
}
}
.new-policy-list-element
{
padding
:
10px
10px
0
;
margin
:
0
-10px
10px
;
border-radius
:
3px
;
background
:
$mediumGrey
;
.save-button
{
@include
blue-button
;
margin-bottom
:
10px
;
}
.cancel-button
{
@include
white-button
;
}
.edit-icon
{
display
:
none
;
}
.delete-icon
{
display
:
none
;
}
}
.new-policy-item
{
margin
:
10px
0
;
.plus-icon-small
{
position
:
relative
;
top
:
-1px
;
vertical-align
:
middle
;
}
}
}
}
.subsection-name-input
{
.subsection-name-input
{
...
...
cms/templates/edit_subsection.html
View file @
a26a7c86
...
@@ -31,18 +31,6 @@
...
@@ -31,18 +31,6 @@
</article>
</article>
</div>
</div>
<div
id=
"policy-to-delete"
style=
"display:none"
>
</div>
<div
id=
"add-new-policy-element-template"
style=
"display:none"
>
<li
class=
"policy-list-element new-policy-list-element"
>
<input
type=
"text"
class=
"policy-list-name"
autocomplete=
"off"
size=
"15"
/>
:
<input
type=
"text"
class=
"policy-list-value"
size=
40
autocomplete=
"off"
/>
<a
href=
"#"
class=
"save-button"
>
Save
</a>
<a
href=
"#"
class=
"cancel-button"
>
Cancel
</a>
<a
href=
"#"
class=
"delete-icon remove-policy-data"
></a>
</li>
</div>
<div
class=
"sidebar"
>
<div
class=
"sidebar"
>
<div
class=
"unit-settings window id-holder"
data-id=
"${subsection.location}"
>
<div
class=
"unit-settings window id-holder"
data-id=
"${subsection.location}"
>
<h4
class=
"header"
>
Subsection Settings
</h4>
<h4
class=
"header"
>
Subsection Settings
</h4>
...
...
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