diff --git a/CHANGELOG.rst b/CHANGELOG.rst index d6725181ac05..489abfcbd1ad 100644 --- a/CHANGELOG.rst +++ b/CHANGELOG.rst @@ -7,6 +7,8 @@ the top. Include a label indicating the component affected. Blades: Add possibility to use multiple LTI tools per page. +Blades: LTI module can now load external content in a new window. + LMS: Disable data download buttons on the instructor dashboard for large courses LMS: Ported bulk emailing to the beta instructor dashboard. diff --git a/cms/static/sass/_mixins-inherited.scss b/cms/static/sass/_mixins-inherited.scss new file mode 120000 index 000000000000..f64a7205612d --- /dev/null +++ b/cms/static/sass/_mixins-inherited.scss @@ -0,0 +1 @@ +../../../common/static/sass/_mixins-inherited.scss \ No newline at end of file diff --git a/cms/static/sass/_variables.scss b/cms/static/sass/_variables.scss index 3bd13f3e5b7f..093d3a957af5 100644 --- a/cms/static/sass/_variables.scss +++ b/cms/static/sass/_variables.scss @@ -197,6 +197,10 @@ $lightBluishGrey: rgb(197, 207, 223); $lightBluishGrey2: rgb(213, 220, 228); $error-red: rgb(253, 87, 87); + +//carryover from LMS for xmodules +$sidebar-color: rgb(246, 246, 246); + // type $sans-serif: $f-sans-serif; $body-line-height: golden-ratio(.875em, 1); diff --git a/common/lib/xmodule/xmodule/css/lti/lti.scss b/common/lib/xmodule/xmodule/css/lti/lti.scss index 97a8f62d5450..152963516c1d 100644 --- a/common/lib/xmodule/xmodule/css/lti/lti.scss +++ b/common/lib/xmodule/xmodule/css/lti/lti.scss @@ -2,8 +2,23 @@ div.lti { // align center margin: 0 auto; - h3.error_message { - display: block; + .wrapper-lti-link { + @include font-size(14); + position: relative; + background-color: $sidebar-color; + padding: ($baseline*1.8) ($baseline*1.5) ($baseline*1.1) $baseline; + + .lti-link { + position: absolute; + top: ($baseline*1.8); + right: $baseline; + + .link_lti_new_window { + @extend .gray-button; + @include font-size(13); + @include line-height(14); + } + } } form.ltiLaunchForm { @@ -13,18 +28,8 @@ div.lti { iframe.ltiLaunchFrame { width: 100%; height: 800px; - display: none; + display: block; border: 0px; overflow-x: hidden; } - - &.rendered { - iframe.ltiLaunchFrame { - display: block; - } - - h3.error_message { - display: none; - } - } } diff --git a/common/lib/xmodule/xmodule/js/fixtures/lti.html b/common/lib/xmodule/xmodule/js/fixtures/lti.html index ae545970ce80..14bea7d7714d 100644 --- a/common/lib/xmodule/xmodule/js/fixtures/lti.html +++ b/common/lib/xmodule/xmodule/js/fixtures/lti.html @@ -1,36 +1,31 @@ -
+
+
-
- - - - - - - - - - - - - - + + + + + + + + + + + + + + + - -
- -

- Please provide launch_url. Click "Edit", and fill in the - required fields. -

- - + + +
diff --git a/common/lib/xmodule/xmodule/js/spec/lti/constructor.js b/common/lib/xmodule/xmodule/js/spec/lti/constructor.js index f016d42d9d70..cda1d7988d7f 100644 --- a/common/lib/xmodule/xmodule/js/spec/lti/constructor.js +++ b/common/lib/xmodule/xmodule/js/spec/lti/constructor.js @@ -5,77 +5,158 @@ * * * The front-end part of the LTI module is really simple. If an action - * is set for the hidden LTI form, then it is submited, and the results are - * redirected to an iframe. + * is set for the hidden LTI form, then it is submitted, and the results are + * redirected to an iframe or to a new window (based on the + * "open_in_a_new_page" attribute). * - * We will test that the form is only submited when the action is set (i.e. - * not empty). + * We will test that the form is only submitted when the action is set (i.e. + * not empty, and not the default one). * * Other aspects of LTI module will be covered by Python unit tests and * acceptance tests. - * */ /* - * "Hence that general is skilful in attack whose opponent does not know what - * to defend; and he is skilful in defense whose opponent does not know what + * "Hence that general is skillful in attack whose opponent does not know what + * to defend; and he is skillful in defense whose opponent does not know what * to attack." * * ~ Sun Tzu */ (function () { + var element, container, form, link, + IN_NEW_WINDOW = 'true', + IN_IFRAME = 'false', + EMPTY_URL = '', + DEFAULT_URL = 'http://www.example.com', + NEW_URL = 'http://www.example.com/some_book'; + + function initialize(target, action) { + var tempEl; + + loadFixtures('lti.html'); + + element = $('.lti-wrapper'); + container = element.find('.lti'); + form = container.find('.ltiLaunchForm'); + + if (target === IN_IFRAME) { + container.data('open_in_a_new_page', 'false'); + form.attr('target', 'ltiLaunchFrame'); + } + + form.attr('action', action); + + // If we have a new proper action (non-default), we create either + // a link that will submit the form, or an iframe that will contain + // the answer of auto submitted form. + if (action !== EMPTY_URL && action !== DEFAULT_URL) { + if (target === IN_NEW_WINDOW) { + $('', { + href: '#', + class: 'link_lti_new_window' + }).appendTo(container); + + link = container.find('.link_lti_new_window'); + } else { + $(' + % endif +% else:

- Please provide launch_url. Click "Edit", and fill in the - required fields. + ${_('Please provide launch_url. Click "Edit", and fill in the required fields.')}

- - ## The result of the form submit will be rendered here. - - +%endif