diff --git a/docs/en_us/course_authors/source/Images/image-modal-window.png b/docs/en_us/course_authors/source/Images/image-modal-window.png new file mode 100644 index 000000000000..714aa1b9fb9f Binary files /dev/null and b/docs/en_us/course_authors/source/Images/image-modal-window.png differ diff --git a/docs/en_us/course_authors/source/Images/image-modal.png b/docs/en_us/course_authors/source/Images/image-modal.png new file mode 100644 index 000000000000..c0749d2f6bcc Binary files /dev/null and b/docs/en_us/course_authors/source/Images/image-modal.png differ diff --git a/docs/en_us/course_authors/source/Images/image-modeal-zoomed.png b/docs/en_us/course_authors/source/Images/image-modeal-zoomed.png new file mode 100644 index 000000000000..1746d56e43ec Binary files /dev/null and b/docs/en_us/course_authors/source/Images/image-modeal-zoomed.png differ diff --git a/docs/en_us/course_authors/source/change_log.rst b/docs/en_us/course_authors/source/change_log.rst index 13767a72ab30..12c5ef83b2ed 100644 --- a/docs/en_us/course_authors/source/change_log.rst +++ b/docs/en_us/course_authors/source/change_log.rst @@ -11,8 +11,10 @@ Change Log * - Date - Change + * - 02/07/14 + - Added section on :ref:`Full Screen Image`. * - 02/05/14 - - Added section :ref:`Set the Advertised Start Date` + - Added section :ref:`Set the Advertised Start Date`. * - 02/04/14 - Added the :ref:`Student Data` and :ref:`Grades` chapters. * - diff --git a/docs/en_us/course_authors/source/course_grades.rst b/docs/en_us/course_authors/source/course_grades.rst index 7cc65832d7b4..dca1003d12dd 100644 --- a/docs/en_us/course_authors/source/course_grades.rst +++ b/docs/en_us/course_authors/source/course_grades.rst @@ -43,8 +43,6 @@ You establish a grading policy for your course when you create it in Studio. Whi .. image:: Images/Grading_Configuration_Studio.png :alt: Studio example of homework assignment type and grading weight - :height:283 - :width:613 For more information, see :ref:`configure`. diff --git a/docs/en_us/course_authors/source/course_student.rst b/docs/en_us/course_authors/source/course_student.rst index ae09fb389ab6..42aaa4e1e45e 100644 --- a/docs/en_us/course_authors/source/course_student.rst +++ b/docs/en_us/course_authors/source/course_student.rst @@ -60,6 +60,8 @@ You can access this self-reported information for all of the students who are en The student data that is available to course staff always reflects the set of live, current enrollments. Students can register for your course throughout the defined enrollment period, and they can unregister from a course at any time, which unenrolls them. Students can also change their email addresses and full names at any time. As a result, you may want to download student data periodically to gain insights into how the student population changes over time. +.. _View and download student data: + ========================================== View and download student data ========================================== @@ -81,9 +83,9 @@ To view or download student data: A table of the student data displays, with one row for each enrolled student. Longer values, such as student goals, are truncated. .. image:: Images/StudentData_Table.png - :alt: Table with columns for the collected data points and rows for each student on the Instructor Dashboard + :alt: Table with columns for the collected data points and rows for each student on the Instructor Dashboard - **Note**:: In the future, edX may also request that students select a language and location. This data is not collected at this time. + .. note:: In the future, edX may also request that students select a language and location. This data is not collected at this time. 5. To download student enrollment data in a CSV file, click **Download profile information as a CSV**. @@ -115,7 +117,7 @@ To display demographic data for your students: .. image:: Images/Distribution_Gender.png :alt: Table with columns for different possible values for level of education completed and total count reported for each value - "No Data" is the sum of the students for whom no value exists for the demographic. + "No Data" is the sum of the students for whom no value exists for the demographic. Data for individual students is not shown, and you cannot download data directly from this page. See :ref:`View and download student data`. diff --git a/docs/en_us/course_authors/source/create_html_component.rst b/docs/en_us/course_authors/source/create_html_component.rst index de8b3204ff2c..54523ba5aa2d 100644 --- a/docs/en_us/course_authors/source/create_html_component.rst +++ b/docs/en_us/course_authors/source/create_html_component.rst @@ -81,6 +81,8 @@ To create an HTML component: 2. In the list that appears, click **Text**. + .. note: You can also create a :ref:`Zooming Image` or :ref:`Image Modal`. + An empty component appears at the bottom of the unit. .. image:: Images/HTMLComponent_Edit.png diff --git a/docs/en_us/course_authors/source/external_graders.rst b/docs/en_us/course_authors/source/external_graders.rst index 0633e2bb14d5..a92c0274dad9 100644 --- a/docs/en_us/course_authors/source/external_graders.rst +++ b/docs/en_us/course_authors/source/external_graders.rst @@ -6,6 +6,7 @@ Using External Graders .. _External Grader Overview: + ******************* Overview ******************* diff --git a/docs/en_us/course_authors/source/tools.rst b/docs/en_us/course_authors/source/tools.rst index 795da8b60729..4456025baad7 100644 --- a/docs/en_us/course_authors/source/tools.rst +++ b/docs/en_us/course_authors/source/tools.rst @@ -18,6 +18,7 @@ to add customized learning tools such as word clouds to your course. response to a question - into a colorful graphic that students can see. - :ref:`Zooming image`: Zooming images allow you to enlarge sections of an image so that students can see the section in detail. +- :ref:`Full Screen Image`: The Full Screen Image tool allows a student to enlarge an image in the whole browser window. This is useful when the image contains a large amount of detail and text that is easier to view in context when enlarged. .. _LTI Component: @@ -330,20 +331,64 @@ Create a Zooming Image Tool #. Click **Save** to save the HTML component. +.. _Full Screen Image: +****************** +Full Screen Image +****************** + +Some large images are difficult for students to view in the courseware. The full screen image tool allows students to enlarge the image, so they can see all the detail in context. + +The Student View of an Full Screen Image +----------------------------------------- +The student sees the full screen image in a unit page. When the student hovers the mouse pointer over the image, the **FULL SCREEN** button is shown: +.. image:: Images/image-modal.png + :alt: Image the the full screen image tool with the Full Screen button. +When the student clicks **FULL SCREEN**, the image opens and expands in the full browser window. The buttons **Close**, **Zoom In**, and **Zoom Out** are shown: +.. image:: Images/image-modal-window.png + :alt: Image the the Image Modal tool with the Full Screen button. +The student can then zoom in on the image, and drag the image to view the desired part of it: +.. image:: Images/image-modeal-zoomed.png + :alt: Image the the Image Modal tool with the Full Screen button. +Create a Full Screen Image +--------------------------- +#. Upload your image file to the **Files & Uploads** page. For more information about how to do this, see :ref:`Add Files to a Course`. +#. Under **Add New Component**, click **html**, and then click **Full Screen Image**. +#. In the new component that appears, click **Edit**. +#. In the component editor, replace the default title, remove the instructional paragraph, and add text as needed. +#. Switch to the **HTML** tab. +#. Replace the following placeholders with your own content. + * Replace the value of the element's href attribute with the path to your image. Do not change the value of the class attribute. For example: + **** + * Replace the value of the element's src attribute with the path to your image. For example: + + **Full screen image** + + * Ensure that the value of the href and src attributes are the same, and that you do not change the class attribute. You sample code should look like the following: + + .. code-block:: xml + +

Sample Image Modal

+ + Full screen image + + + .. note:: You can use this same HTML code in any HTML component, not just those components you created as full screen images. + +#. Click **Save** to save the HTML component.