Merging subcomponents, versions and op_sys to 1 step.

6 files changed, 141 insertions, 171 deletions

diff --git a/bug/bug.xhtml b/bug/bug.xhtml
index 565668e..f50b2da 100644
--- a/bug/bug.xhtml
+++ b/bug/bug.xhtml
@@ -49,7 +49,7 @@
     <div class="javascript">
       <div class="skin">
         <div class="version"></div>
-        <a href="?skin=login">login</a> <a href="?skin=component">component</a> <a href="?skin=subcomponent">subcomponent</a> <a href="?skin=version">version</a> <a href="?skin=description">description</a> <a href="?skin=submit">submit</a> <a href="?skin=complete">complete</a>
+        <a href="?skin=login">login</a> <a href="?skin=component">component</a> <a href="?skin=details">details</a> <a href="?skin=description">description</a> <a href="?skin=submit">submit</a> <a href="?skin=complete">complete</a>
       </div>
       <div class="header">
         <div class="title">
@@ -66,11 +66,9 @@
           <div>
             <div class="step step_signin"><div class="count">1</div><div class="label">Sign in</div></div>
             <div class="step step_component"><div class="count">2</div><div class="label">Component</div></div>
-            <div class="step step_subcomponent"><div class="count">3</div><div class="label">Subcomponent</div></div>
-            <div class="step step_version"><div class="count">4</div><div class="label">Version</div></div>
-            <div class="step step_op_sys"><div class="count">5</div><div class="label">Operating System</div></div>
-            <div class="step step_description"><div class="count">6</div><div class="label">Description</div></div>
-            <div class="step step_submit"><div class="count">7</div><div class="label">Submit</div></div>
+            <div class="step step_details"><div class="count">3</div><div class="label">Details</div></div>
+            <div class="step step_description"><div class="count">4</div><div class="label">Description</div></div>
+            <div class="step step_submit"><div class="count">5</div><div class="label">Submit</div></div>
           </div>
           <div class="legal">
             All your contributions will be public in WWW! By clicking the 'Submit' button you irrevocably agree to release your contribution under the CC-BY-SA 3.0 License and the GFDL. If you can't agree to these terms for documents you planned to attach you can state in this report that such a document exists. QA team will discuss with you further proceeding in the bug.
@@ -144,26 +142,25 @@
               </div>
             </div>
 
-            <div class="version_and_subcomponent">
-              <div>
-                <div class="state state_subcomponent">
+            <div class="state state_details">
+              <div class="inlineblock">
+                <div class="state state_details subcomponents">
                   <div class="input-label">Sub component</div>
                   <div class="active_subcomponent"></div>
                 </div>
               </div>
-              <div>
-                <div class="state state_version">
+              <div class="inlineblock">
+                <div class="state state_details versions">
                   <div class="input-label">Version</div>
                   &versions;
                 </div>
               </div>
             </div>
-
-            <div class="operating_system">
-            <div>
-            <div class="state state_op_sys">
-		<div class="input-label">Operating System</div>
-                &op_sys;
+            <div class="state_details">
+              <div class="inlineblock">
+                <div class="state state_details op_sys">
+		  <div class="input-label">Operating System</div>
+                  &op_sys;
                 </div>
               </div>
             </div>
@@ -238,12 +235,12 @@ Expected behavior:
 
           <div class="submission">
 
-	    <div class="state state_subcomponent state_duplicates">
+	    <div class="state state_details state_duplicates">
 	      Related bug reports
 	      <div class="related_bugs"></div>
             </div>
 
-            <div class="state_subcomponent">
+            <div class="state_details">
               <div class="subcomponents">&subcomponents;</div>
             </div>
 
diff --git a/bug/bug/bug.css b/bug/bug/bug.css
index 7fee712..915e37c 100644
--- a/bug/bug/bug.css
+++ b/bug/bug/bug.css
@@ -29,6 +29,10 @@
     background: url('images/noscript.png') no-repeat top left;
 }
 
+.inlineblock {
+    display: inline-block;
+}
+
 body {
     margin: 0;
     background-color: #fff;
@@ -311,7 +315,6 @@ body {
 }
 
 /* state_component */
-
 .state_component {
     display: none;
 }
@@ -377,31 +380,16 @@ body {
     background: url('icons/icon-selected.png') no-repeat;
 }
 
-/* state_subcomponent */
-.version_and_subcomponent > div {
-    display: inline-block;
-}
-
-.state_subcomponent {
+/* state_details */
+.state_details {
     display: none;
 }
 
-.state_subcomponent .subcomponents {
-    display: none;
+.state_details .active_subcomponent {
+    display: block;
 }
 
-/* state_version */
-.state_version {
-    display: none;
-}
-
-/* state_subcomponent */
-.operating_system > div {
-    display: inline-block;
-}
-
-/* state_op_sys */
-.state_op_sys {
+.state_details .subcomponents {
     display: none;
 }
 
@@ -454,6 +442,7 @@ body {
 
 .state_duplicates {
     padding-left: 10px;
+    display: none;
 }
 
 .state_duplicates .related_bugs {
diff --git a/bug/bug/bug.js b/bug/bug/bug.js
index 40114a9..07658bd 100644
--- a/bug/bug/bug.js
+++ b/bug/bug/bug.js
@@ -95,6 +95,9 @@
 
         url: '',
 	token: '',
+        sub_component: 'EMPTY',
+        version: '',
+        op_sys: '',
 
         state_signin_error_regexps: [/CLASS="THROW_ERROR">([^<]*)/i],
         state_signin_success_regexp: /LOG&NBSP;OUT<\/A>([^<]*)/i,
@@ -140,7 +143,7 @@
                 var component = $(this).attr('data');
                 $('img', element).removeClass('selected');
                 $('img[data="' + component + '"]').addClass('selected');
-                $.bug.state_subcomponent();
+                $.bug.state_details();
             });
             $('img', element).click(function() {
                 var component = $(this).attr('data');
@@ -151,47 +154,38 @@
             });
         },
 
-        state_subcomponent: function() {
-            var element = $('.state_subcomponent');
+        state_details: function() {
+            var element = $('.state_details');
             var component = $('.state_component .chosen').attr('data');
             var subcomponent = $('.subcomponents .' + component, element).html();
             $('.active_subcomponent', element).html(subcomponent);
             if(!element.hasClass('initialized')) {
                 element.addClass('initialized');
-                $.bug.current_step('subcomponent');
+                $.bug.current_step('details');
             }
             element.show();
             $('.active_subcomponent .select', element).select();
             $('.active_subcomponent .select .choice', element).click(function() {
                 $.bug.refresh_related_bugs();
-                $.bug.state_version();
+                $.bug.subcomponent = $('.state_details .active_subcomponent .chosen').attr('data');
+                if ($.bug.version != '' && $.bug.op_sys != '') {
+                    $.bug.state_description();
+                }
             });
-        },
-
-        state_version: function() {
-            var element = $('.state_version');
-            if(!element.hasClass('initialized')) {
-                element.addClass('initialized');
-                $.bug.current_step('version');
-                element.show();
-                $('.select', element).select();
-                $(".select .choice", element).click(function() {
-                    $.bug.state_op_sys();
-                });
-            }
-        },
-
-        state_op_sys: function() {
-            var element = $('.state_op_sys');
-            if(!element.hasClass('initialized')) {
-                element.addClass('initialized');
-                $.bug.current_step('op_sys');
-                element.show();
-                $('.select', element).select();
-                $(".select .choice", element).click(function() {
+            $('.select', element).select();
+            $(".versions .select .choice", element).click(function() {
+                $.bug.version = $('.state_details .version .chosen').attr('data');
+                if ($.bug.subcomponent != 'EMPTY' && $.bug.op_sys != '') {
                     $.bug.state_description();
-                });
-             }
+                }
+            });
+            $('.select', element).select();
+            $(".op_sys .select .choice", element).click(function() {
+                $.bug.op_sys = $('.state_details .op_sys .chosen').attr('data');
+                if ($.bug.subcomponent != 'EMPTY' && $.bug.version != '') {
+                    $.bug.state_description();
+                }
+             });
         },
 
         state_description: function() {
@@ -262,18 +256,17 @@
                     } else {
                         $(element).addClass('inprogress');
                     }
-                    var version = $('.state_version .chosen').attr('data');
-                    var op_sys = $('.state_op_sys .chosen').attr('data');
                     var component = $('.state_component .chosen').attr('data').replace('_',' ');
-                    var short_desc = $('.state_subcomponent .active_subcomponent .chosen').attr('data') + ': ' + $('.state_description .short').val();
+                    var short_desc = $.bug.subcomponent + ': ' + $('.state_description .short').val();
                     //Add Operating System
+                    var op_sys = $('.state_op_sys .chosen').attr('data');
                     var comment = $('.state_description .long').val();
                     comment = comment + "\nOperating System: " + $(".op_sys .chosen").text();
                     $("body").css("cursor", "progress");
                     $('input[name="token"]', form).val($.bug.token);
                     $('input[name="component"]', form).val(component);
-                    $('input[name="version"]', form).val(version);
-                    $('input[name="op_sys"]', form).val(op_sys);
+                    $('input[name="version"]', form).val($.bug.version);
+                    $('input[name="op_sys"]', form).val($.bug.op_sys);
                     $('input[name="short_desc"]', form).val(short_desc);
                     $('input[name="comment"]', form).val(comment);
                     $.bug.token = '';
diff --git a/bug/bug/skin.js b/bug/bug/skin.js
index 01766ff..164ac22 100644
--- a/bug/bug/skin.js
+++ b/bug/bug/skin.js
@@ -24,30 +24,25 @@
       function component() {
           $.bug.state_component();
       }
-      function subcomponent() {
+      function details() {
           component();
           $('.state_component .choice:nth(0)').click();
-      }
-      function version() {
-          subcomponent();
           $.bug.ajax = function(settings) {
               return $.Deferred().resolve('NUM,DESC\n100,"BUG 1"\n200,"BUG 2"\n');
           };
-          $('.state_subcomponent .active_subcomponent .choice:nth(0)').click();
-      }
-      function op_sys(){
-          version();
-          $('.state_version .choice:nth(0)').click();
       }
       function description() {
-          op_sys();
-          $('.state_op_sys .choice:nth(0)').click();
+          details();
+          $('.state_details .active_subcomponent .choice:nth(0)').click();
+          $('.state_details .versions .choice:nth(0)').click();
+          $('.state_details .op_sys .choice:nth(0)').click();
           $('.state_description .short').val('12');
       }
       function submit() {
           description();
           $('.state_description .short').val('1234567890');
-          $('.state_description .long').val('12345678901');
+          $('.state_description .long').val('0123456789');
+          $.bug.token = "AA";
           $('.state_description .short').change();
       }
 
@@ -56,12 +51,8 @@
           $.bug.error_set("THIS IS AN ERROR MESSAGE");
       } else if(location.search.indexOf('skin=component') >= 0) {
           component();
-      } else if(location.search.indexOf('skin=subcomponent') >= 0) {
-          subcomponent();
-      } else if(location.search.indexOf('skin=version') >= 0) {
-          version();
-      } else if(location.search.indexOf('skin=op_sys') >= 0) {
-          op_sys();
+      } else if(location.search.indexOf('skin=details') >= 0) {
+          details();
       } else if(location.search.indexOf('skin=description') >= 0) {
           description();
       } else if(location.search.indexOf('skin=submit') >= 0) {
diff --git a/bug/bug/test.html b/bug/bug/test.html
index 72a84fb..c8ffca1 100644
--- a/bug/bug/test.html
+++ b/bug/bug/test.html
@@ -73,48 +73,8 @@
       </div>
     </div>
 
-    <div class="state_subcomponent">
+    <div class="state_details">
       <div class="active_subcomponent"></div>
-    </div>
-
-    <div class="state_subcomponent">
-      <div class="subcomponents">
-        <div xmlns="" class="Formula_editor">
-          <div class="subcomponent select">
-            <div class="select-header">
-              <div class="chosen">(chose one)</div>
-            </div>
-            <div class="choices">
-              <ul>
-                <li class="choice" data="">(all other problems)</li>
-                <li data="Macros" class="choice">Macros</li>
-                <li data="Formula_editor" class="choice">Formula editor</li>
-                <li data="IDE" class="choice">IDE</li>
-              </ul>
-            </div>
-          </div>
-        </div>
-        <div xmlns="" class="Chart">
-          <div class="subcomponent select">
-            <div class="select-header">
-              <div class="chosen">(chose one)</div>
-            </div>
-            <div class="choices">
-              <ul>
-                <li class="choice" data="">(all other problems)</li>
-                <li data="FILEOPEN" class="choice">FILEOPEN</li>
-                <li data="FILESAFE" class="choice">FILESAFE</li>
-                <li data="FORMATTING" class="choice">FORMATTING</li>
-                <li data="PRINTING" class="choice">PRINTING</li>
-                <li data="UI" class="choice">UI</li>
-                <li data="VIEWING" class="choice">VIEWING</li>
-              </ul>
-            </div>
-        </div>
-      </div>
-    </div>
-
-    <div class="state_version">
       <div xmlns="" class="versions select">
         <div class="select-header">
           <div class="chosen">(chose one)</div>
@@ -126,9 +86,17 @@
           </ul>
         </div>
       </div>
+      <div class="inlineblock">
+        <div class="state state_details op_sys">
+          <div class="input-label">Operating System</div>
+            <li class="choice" data="LINUX">Linux</li>
+            <li class="choice" data="BSD">BSD</li>
+          </div>
+        </div>
+      </div>
     </div>
 
-    <div class="state_description">
+    <div class="state state_description">
       <input type="text" class="short"></input>
       <textarea class="long"></textarea>
     </div>
@@ -150,7 +118,7 @@
         <input type="hidden" name="version" value=""></input>
         <input type="hidden" name="short_desc" value=""></input>
         <input type="hidden" name="comment" value=""></input>
-        <div class="state_attach">
+        <div class="state state_attach">
           <input type="hidden" name="contenttypemethod" value="autodetect"></input>
           <div class="attach-file">
 	    <input type="file" name="data" />
@@ -170,6 +138,43 @@
     </div>
 
     <div class="submission">
+<div class="state_details">
+      <div class="subcomponents">
+        <div xmlns="" class="Formula_editor">
+          <div class="subcomponent select">
+            <div class="select-header">
+              <div class="chosen">(chose one)</div>
+            </div>
+            <div class="choices">
+              <ul>
+                <li class="choice" data="">(all other problems)</li>
+                <li data="Macros" class="choice">Macros</li>
+                <li data="Formula_editor" class="choice">Formula editor</li>
+                <li data="IDE" class="choice">IDE</li>
+              </ul>
+            </div>
+          </div>
+        </div>
+        <div xmlns="" class="Chart">
+          <div class="subcomponent select">
+            <div class="select-header">
+              <div class="chosen">(chose one)</div>
+            </div>
+            <div class="choices">
+              <ul>
+                <li class="choice" data="">(all other problems)</li>
+                <li data="FILEOPEN" class="choice">FILEOPEN</li>
+                <li data="FILESAFE" class="choice">FILESAFE</li>
+                <li data="FORMATTING" class="choice">FORMATTING</li>
+                <li data="PRINTING" class="choice">PRINTING</li>
+                <li data="UI" class="choice">UI</li>
+                <li data="VIEWING" class="choice">VIEWING</li>
+              </ul>
+            </div>
+        </div>
+      </div>
+    </div>
+
     </div>
 
     <div class="state state_success">
diff --git a/bug/bug/test.js b/bug/bug/test.js
index 4b33c6b..79ef369 100644
--- a/bug/bug/test.js
+++ b/bug/bug/test.js
@@ -140,8 +140,8 @@ test("state_signin", function() {
 test("state_component", function() {
     expect(15);
 
-    var state_subcomponent = $.bug.state_subcomponent;
-    $.bug.state_subcomponent = function() { ok(true, 'state_subcomponent'); };
+    var state_details = $.bug.state_details;
+    $.bug.state_details = function() { ok(true, 'state_details'); };
 
     var element = $('.state_component');
     equal(element.css('display'), 'none');
@@ -166,52 +166,42 @@ test("state_component", function() {
     equal($('.comment.Formula_editor', element).css('display'), 'block', 'Formula_editor is visible');
     equal($('.comment.OTHER', element).css('display'), 'none', 'OTHER hidden');
 
-    $.bug.state_subcomponent = state_subcomponent;
+    $.bug.state_details = state_details;
 });
 
-test("state_subcomponent", function() {
-    expect(6);
+test("state_details", function() {
+    expect(8);
 
     var state_version = $.bug.state_version;
     $.bug.state_version = function() { ok(true, 'state_version'); };
     var refresh_related_bugs = $.bug.refresh_related_bugs;
     $.bug.refresh_related_bugs = function() { ok(true, 'refresh_related_bugs'); };
 
-    var element = $('.state_subcomponent');
+    var element = $('.state_details');
+    var element_sub = $('.subcomponents');
+    var element_ver = $('.versions');
+    var element_sys = $('.op_sys');
     equal(element.css('display'), 'none');
+    ok(!element.hasClass('initialized'), 'is not initialized');
     equal($('.active_subcomponent .select', element).length, 0, 'no .select element');
-    $(".component .chosen").attr('data', 'Formula_editor');
-    $.bug.state_subcomponent();
+    equal($('.versions .select', element).length, 0, 'no .select element');
+    $(".state_component .chosen").attr('data', 'Formula_editor');
+    /*var version = 'VERSION1';
+    $(".versions .choice[data='" + version + "']", element).click();
+    var op_sys = "LINUX"; 
+    $(".op_sys .choice[data='" + op_sys + "']", element).click();*/
+    $.bug.state_details();
     equal($('.active_subcomponent .select', element).length, 1, 'one .select element');
+    equal($('.versions .chosen', element_ver).attr('data'), undefined, 'initialy nothing selected');
     equal(element.css('display'), 'block');
-    $(".active_subcomponent .subcomponent .choice[data='Formula_editor']", element).click();
+    $(".active_subcomponent .subcomponent .choice[data='Formula_editor']", element_sub).click();
+    ok(true, 'state_details');
+    $('.state_details .versions .choice:nth(0)').click();
 
     $.bug.state_version = state_version;
     $.bug.refresh_related_bugs = refresh_related_bugs;
 });
 
-test("state_version", function() {
-    expect(7);
-
-    var state_description = $.bug.state_description;
-    $.bug.state_description = function() { ok(true, 'state_description'); };
-
-    var element = $('.state_version');
-    equal(element.css('display'), 'none');
-    ok(!element.hasClass('initialized'), 'is not initialized');
-    $.bug.state_version();
-    equal(element.css('display'), 'block');
-    ok(element.hasClass('initialized'), 'is initialized');
-    equal($('.versions .chosen', element).attr('data'), undefined, 'initialy nothing selected');
-    var version = 'VERSION1';
-    $(".versions .choice[data='" + version + "']", element).click();
-    // the second time, the selected index is not reset
-    $.bug.state_version();
-    equal($('.versions .chosen', element).attr('data'), version, 'same version selected');
-
-    $.bug.state_description = state_description;
-});
-
 test("state_description", function() {
     expect(5);
 
@@ -248,11 +238,13 @@ test("state_submit", function() {
     var component = 'Formula_editor';
     $(".state_component .choice[data='" + component + "']").click();
     var component_text = $(".state_component .chosen").text();
+    $.bug.state_details();
     var subcomponent = 'SUBCOMPONENT';
-    $('.state_subcomponent .active_subcomponent .chosen').attr('data', subcomponent);
-    $.bug.state_version();
+    $.bug.subcomponent = subcomponent;
     var version = 'VERSION';
-    $('.state_version .chosen').attr('data', version);
+    $.bug.version = version;
+    var op_sys = "LINUX";
+    $.bug.op_sys = op_sys;
     var short_desc = 'SHORT_DESC';
     $('.state_description .short').val(short_desc);
     var comment = 'LONG';
@@ -267,7 +259,7 @@ test("state_submit", function() {
         equal($('input[name="component"]', form).val(), component_text);
         equal($('input[name="version"]', form).val(), version);
         equal($('input[name="short_desc"]', form).val(), subcomponent + ': ' + short_desc);
-        equal($('input[name="comment"]', form).val(), comment);
+        equal($('input[name="comment"]', form).val(), comment + "\nOperating System: ");
         return false; // prevent actual submission
     });
     form.submit();
@@ -302,6 +294,9 @@ test("state_submit", function() {
     });
     equal($('.error').text(), error, 'error is set');
 
+    $('.state_description').hide();
+    $('.state_attach').hide();
+    $('.state_submit').hide();
     $.bug.state_success = state_success;
     $.bug.ajax = $.ajax;
 });