Major fix for Bug 5027, "Three-col layout breaks when window is narrow" (also, Bug...

diff --git a/course/format/weekscss/format.php b/course/format/weekscss/format.php
index 838d9cbe2c09309699681207cb0a202a3a770ef2..f3aa27f4622a89eb8da41e92f733f3e7bad6ac53 100644 (file)
--- a/course/format/weekscss/format.php
+++ b/course/format/weekscss/format.php
@@ -28,7 +28,7 @@
     require_once("$CFG->dirroot/mod/forum/lib.php");
 
     $week = optional_param('week', -1, PARAM_INT);
-
+/*
     // Bounds for block widths; in PIXELS.
     define('BLOCK_L_MIN_WIDTH', 100);
     define('BLOCK_L_MAX_WIDTH', 210);
@@ -48,7 +48,7 @@
     $width_center = '60%; ';
     $min_max_block= 'min-width:100px; max-width:210px; ';
     $min_max_main = 'min-width:25em; max-width:37em; '; //33em
-
+*/
     if ($week != -1) {
         $displaysection = course_set_display($course->id, $week);
     } else {
@@ -81,20 +81,40 @@
     }
 
 
+/* Internet Explorer min-width fix. (See theme/standard/styles_layout.css: min-width for Firefox.)
+   Window width: 800px, Firefox 763px, IE 752px. (Window width: 640px, Firefox 602px, IE 588px.)    
+*/
+?>
+
+<!--[if IE]>
+  <style type="text/css">
+  .weekscss-format { width: expression(document.body.clientWidth < 800 ? "752px" : "auto"); }
+  </style>
+<![endif]-->
+<?php
 /// Layout the whole page as three big columns (was, id="layout-table")
     echo '<div class="weekscss-format">';
 
 /// The left column ...
 
     if (blocks_have_content($pageblocks, BLOCK_POS_LEFT) || $editing) {
-        echo '<div style="width:'.$preferred_width_left.$min_max_block.'float:left;" id="left-column">';
+        //echo '<div style="width:'.$preferred_width_left.$min_max_block.'float:left;" id="left-column">';
+        echo '<div id="left-column">';
         blocks_print_group($PAGE, $pageblocks, BLOCK_POS_LEFT);
         echo '</div>';
     }
+    
+/// The right column, BEFORE the middle-column.
+    if (blocks_have_content($pageblocks, BLOCK_POS_RIGHT) || $editing) {
+        //echo '<div style="width:'.$preferred_width_right.$min_max_block.' float:right;" id="right-column">';
+        echo '<div id="right-column">';
+        blocks_print_group($PAGE, $pageblocks, BLOCK_POS_RIGHT);
+        echo '</div>';
+    }
 
 /// Start main column
-    echo '<div id="middle-column" style="width:'.$width_center.$min_max_main.'float:left;">';
-
+    //echo '<div id="middle-column" style="width:'.$width_center.$min_max_main.'float:left;">';
+    echo '<div id="middle-column">';
 
     print_heading_block(get_string('weeklyoutline'), 'outline');
 
@@ -118,7 +138,9 @@
     if ($thissection->summary or $thissection->sequence or isediting($course->id)) {
 
         // Note, no need for a 'left side' cell or DIV.
+        // Note, 'right side' is BEFORE content.
         echo '<li id="section-0" class="section main" >';
+        echo '<div class="right side" >&nbsp;</div>';        
         echo '<div class="content">';
         
         echo '<div class="summary">';
@@ -138,7 +160,7 @@
             print_section_add_menus($course, $section, $modnames);
         }
 
-        echo '</div><div class="right side" >&nbsp;</div><div class="clearer"></div>';
+        echo '</div>'; //'<div class="right side" >&nbsp;</div><div class="clearer"></div>';
         echo "</li>\n";
     }
 
@@ -201,6 +223,38 @@
 
             echo '<li id="section-'.$section.'" class="section main'.$sectionstyle.'" >'; //'<div class="left side">&nbsp;</div>';
 
+            // Note, 'right side' is BEFORE content.
+            echo '<div class="right side">';
+            
+            if ($displaysection == $section) {
+                echo '<a href="view.php?id='.$course->id.'&amp;week=0#section-'.$section.'" title="'.$strshowallweeks.'">'.
+                     '<img src="'.$CFG->pixpath.'/i/all.gif" class="icon wkall" alt="'.$strshowallweeks.'" /></a><br />';
+            } else {
+                $strshowonlyweek = get_string("showonlyweek", "", $section);
+                echo '<a href="view.php?id='.$course->id.'&amp;week='.$section.'" title="'.$strshowonlyweek.'">'.
+                     '<img src="'.$CFG->pixpath.'/i/one.gif" class="icon wkone" alt="'.$strshowonlyweek.'" /></a><br />';
+            }
+
+            if (isediting($course->id)) {
+                if ($thissection->visible) {        // Show the hide/show eye
+                    echo '<a href="view.php?id='.$course->id.'&amp;hide='.$section.'&amp;sesskey='.$USER->sesskey.'#section-'.$section.'" title="'.$strweekhide.'">'.
+                         '<img src="'.$CFG->pixpath.'/i/hide.gif" class="icon hide" alt="'.$strweekhide.'" /></a><br />';
+                } else {
+                    echo '<a href="view.php?id='.$course->id.'&amp;show='.$section.'&amp;sesskey='.$USER->sesskey.'#section-'.$section.'" title="'.$strweekhide.'">'.
+                         '<img src="'.$CFG->pixpath.'/i/show.gif" class="icon hide" alt="'.$strweekhide.'" /></a><br />';
+                }
+                if ($section > 1) {                       // Add a arrow to move section up
+                    echo '<a href="view.php?id='.$course->id.'&amp;section='.$section.'&amp;move=-1&amp;sesskey='.$USER->sesskey.'#section-'.($section-1).'" title="'.$strmoveup.'">'.
+                         '<img src="'.$CFG->pixpath.'/t/up.gif" class="icon up" alt="'.$strmoveup.'" /></a><br />';
+                }
+
+                if ($section < $course->numsections) {    // Add a arrow to move section down
+                    echo '<a href="view.php?id='.$course->id.'&amp;section='.$section.'&amp;move=1&amp;sesskey='.$USER->sesskey.'#section-'.($section+1).'" title="'.$strmovedown.'">'.
+                         '<img src="'.$CFG->pixpath.'/t/down.gif" class="icon down" alt="'.$strmovedown.'" /></a><br />';
+                }
+            }
+            echo '</div>';
+
             echo '<div class="content">';
             if (!isteacher($course->id) and !$thissection->visible) {   // Hidden for students
                 echo '<div class="weekdates">'.$weekday.' - '.$endweekday.' ('.get_string('notavailable').')</div>';
@@ -225,7 +279,7 @@
                 }
             }
 
-            echo '</div><div class="right side">';
+            echo '</div>'; /*'<div class="right side">';
             
             if ($displaysection == $section) {
                 echo '<a href="view.php?id='.$course->id.'&amp;week=0#section-'.$section.'" title="'.$strshowallweeks.'">'.
@@ -255,7 +309,8 @@
                 }
             }
 
-            echo '</div><div class="clearer"></div>';
+            ///echo '</div><div class="clearer"></div>';
+            */
             echo "</li>\n";
         }
 
@@ -273,7 +328,7 @@
 
     echo '</div>';
 
-    // The right column
+/*    // The right column
     if (blocks_have_content($pageblocks, BLOCK_POS_RIGHT) || $editing) {
         echo '<div style="width:'.$preferred_width_right.$min_max_block.' float:right;" id="right-column">';
         blocks_print_group($PAGE, $pageblocks, BLOCK_POS_RIGHT);
@@ -281,6 +336,17 @@
     }
 
     echo '<div class="clearer"></div>';
+*/
     echo '</div>';
+    echo '<div class="clearer"></div>';
 
+if ($CFG->debug > 7) {
 ?>
+<p class="debugwarn">Debug, document.body.clientWidth:
+  <script type="text/javascript">
+  document.writeln(document.body.clientWidth +" pixels [Refresh after resize.]");
+  </script><noscript>[Unknown] Javascript disabled.</noscript>
+</p>
+<?php
+}
+?>
\ No newline at end of file

diff --git a/theme/standard/styles_layout.css b/theme/standard/styles_layout.css
index d19407bf2fe00a8c0c14e4463c21084380f777d2..17c46f1c6d77b1f44f18d2c5bd8aea083581bc34 100644 (file)
--- a/theme/standard/styles_layout.css
+++ b/theme/standard/styles_layout.css
@@ -868,10 +868,6 @@ span.current {
   border-right:0px;
 }
 
-* html #course-view .section .content .commands {
-  clear: both;
-}
-
 #course-view .section td.side {
   padding:5px;
   border-style:solid;
@@ -922,19 +918,27 @@ span.current {
   text-indent: 0;
   list-style: none;
 }
+/* Window-width: 800 pixels.
+   IE doesn't support, see inline IE conditional comment. */
 .weekscss-format {
-  min-width:763px; /* Doesn't work for IE. */
+  min-width: 763px;
 }
 .weekscss-format .block_adminblock select {
   width:100%;
 }
 .weekscss-format #middle-column {
-  padding-left:12px;
-  padding-right:12px;
+  margin: 0 12.5em 0 12.5em;
+}
+.weekscss-format #left-column {
+  float: left;
+  width: 11.5em;
+}
+.weekscss-format #right-column {
+  float: right;
+  width: 11.5em;
 }
 .weekscss li.section {
   margin-bottom: 0.5em;
-  width: 100%;
   border-style:solid;
   border-width:1px;
 }
@@ -943,16 +947,12 @@ span.current {
   padding: 5px;
 }
 .weekscss .content {
-  margin-left: 4%;  /* Why? Firefox 8%; IE 4% */
-  width: 80%;
-  float: left;
-}
-.weekscss .side {
-  width: 8%;
-  float: left;
+  margin: 0 1.7em 0 1.7em;
 }
-.weekscss .clearer {
-  height: 0;
+.weekscss .right {
+  width: 1.6em;
+  float: right;
+  text-align:center;
 }
 
 .section .activity img.activityicon {