Skip to content

E
edx-platform
Commit c2337400 by Tom Giannattasio
Options

cleaning up of asset widget; html tab is broken

parent 8abf93cc
Showing with 179 additions and 21 deletions
cms/static/js/html-editor.js
...@@ -33,6 +33,7 @@ function initHTMLEditor($editor, $prev) { ...@@ -33,6 +33,7 @@ function initHTMLEditor($editor, $prev) {
image : '/static/img/visual-editor-image-icon.png', image : '/static/img/visual-editor-image-icon.png',
onclick : function() { onclick : function() {
$assetWidget = $($('#asset-library-widget').html()); $assetWidget = $($('#asset-library-widget').html());
$modalCover.css('z-index', '99999');
$('.insert-asset-button', $assetWidget).bind('click', { editor: ed }, insertAsset); $('.insert-asset-button', $assetWidget).bind('click', { editor: ed }, insertAsset);
$body.append($assetWidget); $body.append($assetWidget);
} }
...@@ -47,11 +48,17 @@ function initHTMLEditor($editor, $prev) { ...@@ -47,11 +48,17 @@ function initHTMLEditor($editor, $prev) {
lineNumbers: true lineNumbers: true
}); });
$(htmlEditor.getWrapperElement()).hide();
$(htmlEditor.getWrapperElement()).bind('click', function() {
$(htmlEditor).focus();
});
$editor.find('.save-button, .cancel-button').bind('click', updatePreview); $editor.find('.save-button, .cancel-button').bind('click', updatePreview);
} }
function insertAsset(e) { function insertAsset(e) {
$assetWidget.remove(); $assetWidget.remove();
$modalCover.css('z-index', '1000');
var editor = e.data.editor; var editor = e.data.editor;
editor.focus(); editor.focus();
editor.selection.setContent($(this).attr('data-markup')); editor.selection.setContent($(this).attr('data-markup'));
...@@ -67,5 +74,4 @@ function convertHTMLToVisual() { ...@@ -67,5 +74,4 @@ function convertHTMLToVisual() {
function updatePreview() { function updatePreview() {
$htmlPreview.html($visualEditor.html()); $htmlPreview.html($visualEditor.html());
} }
\ No newline at end of file
cms/static/js/speed-editor.js
...@@ -17,14 +17,13 @@ var commandDown; ...@@ -17,14 +17,13 @@ var commandDown;
$(document).bind('keyup', onKeyboard); $(document).bind('keyup', onKeyboard);
})(); })();
function initProblemEditors($editor, $prev) { function initProblemEditors($editor, $prev) {
$currentEditor = $editor; $currentEditor = $editor;
simpleEditor = CodeMirror.fromTextArea($editor.find('.edit-box')[0], { simpleEditor = CodeMirror.fromTextArea($editor.find('.edit-box')[0], {
lineWrapping: true, lineWrapping: true,
extraKeys: { extraKeys: {
'Ctrl-N': newUnit, 'Ctrl-N': newUnit,
'Ctrl-H': makeHeader, 'Ctrl-H': makeHeader,
'Ctrl-V': makeVideo, 'Ctrl-V': makeVideo,
'Ctrl-M': makeMultipleChoice, 'Ctrl-M': makeMultipleChoice,
'Ctrl-C': makeCheckboxes, 'Ctrl-C': makeCheckboxes,
......
cms/static/sass/_assets.scss
...@@ -115,18 +115,20 @@ ...@@ -115,18 +115,20 @@
left: 50%; left: 50%;
z-index: 99999; z-index: 99999;
width: 900px; width: 900px;
padding: 20px;
margin-left: -450px; margin-left: -450px;
border-radius: 3px; border-radius: 3px;
background: $lightGrey; background: $lightGrey;
header { header {
height: 40px; @include clearfix;
margin-bottom: 20px; padding: 25px 25px 30px;
} }
.close-button { .close-button {
@include white-button; @include white-button;
position: absolute;
top: 15px;
right: 15px;
width: 29px; width: 29px;
height: 29px; height: 29px;
padding: 0; padding: 0;
...@@ -139,11 +141,13 @@ ...@@ -139,11 +141,13 @@
} }
.search { .search {
width: 400px; float: left;
height: 38px; width: 350px;
height: 34px;
padding-left: 36px; padding-left: 36px;
margin-top: 2px;
background-color: #fff; background-color: #fff;
background-position: 12px 10px; background-position: 12px 8px;
font-size: 14px; font-size: 14px;
} }
...@@ -158,16 +162,39 @@ ...@@ -158,16 +162,39 @@
.upload-button { .upload-button {
@include blue-button; @include blue-button;
float: right; float: left;
padding: 8px 30px 10px; padding: 6px 20px 8px;
margin-right: 20px;
font-size: 12px; font-size: 12px;
} }
table {
border: none;
}
tbody {
display: block;
width: 900px;
height: 550px;
background: #fff;
overflow-y: auto;
overflow-x: hidden;
}
tr {
display: table;
width: 900px;
}
td,
th {
padding: 5px 20px;
}
} }
table { table {
width: 100%; width: 100%;
border-radius: 3px 3px 0 0; border: 1px solid $mediumGrey;
border: 1px solid #c5cad4;
td, td,
th { th {
...@@ -178,16 +205,18 @@ ...@@ -178,16 +205,18 @@
thead th { thead th {
@include linear-gradient(top, transparent, rgba(0, 0, 0, .1)); @include linear-gradient(top, transparent, rgba(0, 0, 0, .1));
padding: 6px 20px 7px;
background-color: #ced2db; background-color: #ced2db;
font-size: 12px; font-size: 12px;
font-weight: 700; font-weight: 700;
text-shadow: 0 1px 0 rgba(255, 255, 255, .5); text-shadow: 0 1px 0 rgba(255, 255, 255, .5);
} }
tbody { tbody {
background: #fff; background: #fff;
tr { tr {
width: 890px;
border-top: 1px solid #c5cad4; border-top: 1px solid #c5cad4;
&:first-child { &:first-child {
...@@ -222,6 +251,7 @@ ...@@ -222,6 +251,7 @@
.insert-asset-button { .insert-asset-button {
@include blue-button; @include blue-button;
font-size: 12px;
} }
.embeddable-xml-input { .embeddable-xml-input {
......
cms/static/sass/_unit.scss
...@@ -389,7 +389,6 @@ ...@@ -389,7 +389,6 @@
} }
.CodeMirror { .CodeMirror {
display: none;
position: absolute; position: absolute;
top: 47px; top: 47px;
width: 100%; width: 100%;
......
cms/templates/unit.html
...@@ -20,12 +20,14 @@ ...@@ -20,12 +20,14 @@
e.preventDefault(); e.preventDefault();
$('.editor-tabs .current').removeClass('current'); $('.editor-tabs .current').removeClass('current');
$(this).addClass('current'); $(this).addClass('current');
console.log($(this).attr('data-tab'));
switch($(this).attr('data-tab')) { switch($(this).attr('data-tab')) {
case 'simple': case 'simple':
currentEditor = simpleEditor; currentEditor = simpleEditor;
$(simpleEditor.getWrapperElement()).show(); $(simpleEditor.getWrapperElement()).show();
$(xmlEditor.getWrapperElement()).hide(); $(xmlEditor.getWrapperElement()).hide();
$(simpleEditor).focus(); $(simpleEditor).focus();
onSimpleEditorUpdate();
break; break;
case 'xml': case 'xml':
currentEditor = xmlEditor; currentEditor = xmlEditor;
...@@ -34,17 +36,19 @@ ...@@ -34,17 +36,19 @@
$(xmlEditor).focus(); $(xmlEditor).focus();
break; break;
case 'visual': case 'visual':
currentEditor = visualEditor;
convertHTMLToVisual();
$('table.mceToolbar').show(); $('table.mceToolbar').show();
$(htmlEditor.getWrapperElement()).hide(); $(htmlEditor.getWrapperElement()).hide();
convertHTMLToVisual();
break; break;
case 'html': case 'html':
currentEditor = htmlEditor;
convertVisualToHTML();
$('table.mceToolbar').hide(); $('table.mceToolbar').hide();
$(htmlEditor.getWrapperElement()).show(); $(htmlEditor.getWrapperElement()).show();
convertVisualToHTML(); $(htmlEditor).focus();
break; break;
} }
onSimpleEditorUpdate();
} }
</script> </script>
...@@ -59,8 +63,8 @@ ...@@ -59,8 +63,8 @@
<span class="close-icon"></span> <span class="close-icon"></span>
</a> </a>
<header> <header>
<input type="text" class="search">
<a href="#" class="upload-button">Upload New File</a> <a href="#" class="upload-button">Upload New File</a>
<input type="text" class="search">
</header> </header>
<table> <table>
<thead> <thead>
...@@ -123,6 +127,125 @@ ...@@ -123,6 +127,125 @@
<a href="#" class="insert-asset-button" data-markup="<img src='/c4x/Giannattasio/313/asset/ut-logo-350-150.png'/>">Insert</a> <a href="#" class="insert-asset-button" data-markup="<img src='/c4x/Giannattasio/313/asset/ut-logo-350-150.png'/>">Insert</a>
</td> </td>
</tr> </tr>
<tr data-id="id">
<td class="thumb-col">
<div class="thumb">
<img src="/">
</div>
</td>
<td class="name-col">
<a href="#" class="filename">ut-logo-350-150.png</a>
<div class="embeddable-xml"></div>
</td>
<td class="date-col">
30 October, 2012 at 07:17 PM
</td>
<td class="insert-col">
<a href="#" class="insert-asset-button" data-markup="<img src='/c4x/Giannattasio/313/asset/ut-logo-350-150.png'/>">Insert</a>
</td>
</tr>
<tr data-id="id">
<td class="thumb-col">
<div class="thumb">
<img src="/">
</div>
</td>
<td class="name-col">
<a href="#" class="filename">ut-logo-350-150.png</a>
<div class="embeddable-xml"></div>
</td>
<td class="date-col">
30 October, 2012 at 07:17 PM
</td>
<td class="insert-col">
<a href="#" class="insert-asset-button" data-markup="<img src='/c4x/Giannattasio/313/asset/ut-logo-350-150.png'/>">Insert</a>
</td>
</tr>
<tr data-id="id">
<td class="thumb-col">
<div class="thumb">
<img src="/">
</div>
</td>
<td class="name-col">
<a href="#" class="filename">ut-logo-350-150.png</a>
<div class="embeddable-xml"></div>
</td>
<td class="date-col">
30 October, 2012 at 07:17 PM
</td>
<td class="insert-col">
<a href="#" class="insert-asset-button" data-markup="<img src='/c4x/Giannattasio/313/asset/ut-logo-350-150.png'/>">Insert</a>
</td>
</tr>
<tr data-id="id">
<td class="thumb-col">
<div class="thumb">
<img src="/">
</div>
</td>
<td class="name-col">
<a href="#" class="filename">ut-logo-350-150.png</a>
<div class="embeddable-xml"></div>
</td>
<td class="date-col">
30 October, 2012 at 07:17 PM
</td>
<td class="insert-col">
<a href="#" class="insert-asset-button" data-markup="<img src='/c4x/Giannattasio/313/asset/ut-logo-350-150.png'/>">Insert</a>
</td>
</tr>
<tr data-id="id">
<td class="thumb-col">
<div class="thumb">
<img src="/">
</div>
</td>
<td class="name-col">
<a href="#" class="filename">ut-logo-350-150.png</a>
<div class="embeddable-xml"></div>
</td>
<td class="date-col">
30 October, 2012 at 07:17 PM
</td>
<td class="insert-col">
<a href="#" class="insert-asset-button" data-markup="<img src='/c4x/Giannattasio/313/asset/ut-logo-350-150.png'/>">Insert</a>
</td>
</tr>
<tr data-id="id">
<td class="thumb-col">
<div class="thumb">
<img src="/">
</div>
</td>
<td class="name-col">
<a href="#" class="filename">ut-logo-350-150.png</a>
<div class="embeddable-xml"></div>
</td>
<td class="date-col">
30 October, 2012 at 07:17 PM
</td>
<td class="insert-col">
<a href="#" class="insert-asset-button" data-markup="<img src='/c4x/Giannattasio/313/asset/ut-logo-350-150.png'/>">Insert</a>
</td>
</tr>
<tr data-id="id">
<td class="thumb-col">
<div class="thumb">
<img src="/">
</div>
</td>
<td class="name-col">
<a href="#" class="filename">ut-logo-350-150.png</a>
<div class="embeddable-xml"></div>
</td>
<td class="date-col">
30 October, 2012 at 07:17 PM
</td>
<td class="insert-col">
<a href="#" class="insert-asset-button" data-markup="<img src='/c4x/Giannattasio/313/asset/ut-logo-350-150.png'/>">Insert</a>
</td>
</tr>
</tbody> </tbody>
</table> </table>
<nav class="pagination wip-box"> <nav class="pagination wip-box">
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment