[Libreoffice-commits] .: 2 commits - bug/bug bug/bug.xhtml bug/subcomponents.xsl
Loic Dachary
loic at kemper.freedesktop.org
Sun Sep 18 13:59:01 PDT 2011
bug/bug.xhtml | 32 +++---
bug/bug/bug.css | 152 ++++++++++++++++++++++++++++++---
bug/bug/bug.js | 21 +++-
bug/bug/images/select-bottom-left.png |binary
bug/bug/images/select-bottom-right.png |binary
bug/bug/images/select-header.png |binary
bug/bug/images/select-horizontal.png |binary
bug/bug/images/select-top-left.png |binary
bug/bug/images/select-top-right.png |binary
bug/bug/images/select-vertical.png |binary
bug/bug/images/step-first-off.png |binary
bug/bug/images/step-first-on.png |binary
bug/bug/images/step-last-off.png |binary
bug/bug/images/step-last-on.png |binary
bug/bug/images/step-off.png |binary
bug/bug/images/step-on.png |binary
bug/bug/images/top-header.png |binary
bug/bug/select.css | 41 ++++++++
bug/bug/select.js | 48 ++++++++++
bug/bug/skin.js | 13 +-
bug/subcomponents.xsl | 35 ++++++-
dev/null |binary
22 files changed, 298 insertions(+), 44 deletions(-)
New commits:
commit a069a3736b6e73eef8ecdb875ed5094a4ad444f7
Author: Loic Dachary <loic at dachary.org>
Date: Sun Sep 18 22:58:51 2011 +0200
Implement a integrate the left menu
diff --git a/bug/bug.xhtml b/bug/bug.xhtml
index bc4bf88..79dd2b3 100644
--- a/bug/bug.xhtml
+++ b/bug/bug.xhtml
@@ -21,24 +21,29 @@
<link rel="stylesheet" href="bug.css" type="text/css" media="screen"></link>
</head>
<body>
- <div class="skin"><a href="?skin=login">login</a> <a href="?skin=component">component</a> <a href="?skin=subcomponent">subcomponent</a> <a href="?skin=description">description</a> <a href="?skin=submit">submit</a> <a href="?skin=complete">complete</a> </div>
+ <div class="skin"><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> </div>
+ <div class="header">
+ <div class="title">Bug</div>
+ <div class="submission">
+ Thank you for using LibreOffice, we regret that you seem to have found a problem in our software, so that you decided to report a bug. This assistant will lead you step by step through the bug report process.
+ </div>
+ </div>
<div class="content">
<div class="left">
- <div class="submission">Steps</div>
- <div class="submission steps">
- <div class="state_component">1/5 Component</div>
- <div class="state_subcomponent">2/5 Subcomponent</div>
- <div class="state_version">3/5 Version</div>
- <div class="state_description">4/5 Description</div>
- <div class="state_submit">5/5 Submit</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_description"><div class="count">5</div><div class="label">Description</div></div>
+ <div class="step step_submit"><div class="count">6</div><div class="label">Submit</div></div>
+ <div class="step step_attach"><div class="count">7</div><div class="label">Attach</div></div>
+ <div class="copyright">
+ Bug Submission Assistant is copyright (C) 2011 Loic Dachary published under <a href="http://www.gnu.org/licenses/gpl.txt">GNU GPLv3+</a> : download the <a href="bug.js">sources</a>.
</div>
</div>
<div class="right">
<div class="username"></div>
- <div class="submission">
- Thank you for using LibreOffice, we regret that you seem to have found a problem in our software, so that you decided to report a bug. This assistant will lead you step by step through the bug report process.
- </div>
<div class="state signin">
<div>
@@ -137,9 +142,6 @@
<div class="error"></div>
- <div class="copyright">
- Bug Submission Assistant is copyright (C) 2011 Loic Dachary published under <a href="http://www.gnu.org/licenses/gpl.txt">GNU GPLv3+</a> : download the <a href="bug.js">sources</a>.
- </div>
</div>
</div>
<script>
diff --git a/bug/bug/bg-sidebar.png b/bug/bug/bg-sidebar.png
deleted file mode 100644
index cfd37e6..0000000
Binary files a/bug/bug/bg-sidebar.png and /dev/null differ
diff --git a/bug/bug/bug.css b/bug/bug/bug.css
index 78888ef..8bce573 100644
--- a/bug/bug/bug.css
+++ b/bug/bug/bug.css
@@ -3,6 +3,33 @@ body {
height: 650px;
}
+.header {
+ background: url('images/top-header.png') no-repeat top left;
+ height: 109px;
+ width: 904px;
+}
+
+.header .title {
+ vertical-align: top;
+ line-height: 49px;
+ font-weight: bold;
+ font-size: 36px;
+ display: inline-block;
+ color: #FFF;
+ padding-top: 30px;
+ padding-left: 40px;
+}
+
+.header .submission {
+ display: inline-block;
+ color: #FFF;
+ width: 50%;
+ font-size: 15px;
+ padding-top: 20px;
+ padding-left: 80px;
+ font-weight: bold;
+}
+
.content {
width: 800px;
}
@@ -13,26 +40,62 @@ body {
}
.left {
- background: #FFF url('bg-sidebar.png') no-repeat top left;
- padding-top: 75px;
- width: 200px;
+ width: 255px;
height: 100%;
- font-size: 0.75em;
+ background-color: #ebebeb;
+ font-family: helvetica, arial;
+ font-size: 18px;
+ font-weight: bold;
}
-.left > div {
- margin-left: 40px;
+.left .step {
+ line-height: 65px;
+ height: 65px;
+ width: 255px;
+ background: #FFF url('images/step-off.png') no-repeat top left;
}
-.left .steps {
- background: transparent url('portal-break.png') no-repeat top left;
- height: 100%;
- width: 140px;
+.left .step.current {
+ background: #FFF url('images/step-on.png') no-repeat top left;
+}
+
+.left .stop:first-child {
+ background: #FFF url('images/step-first-off.png') no-repeat top left;
+}
+
+.left .step:first-child.current {
+ background: #FFF url('images/step-first-on.png') no-repeat top left;
+}
+
+.left .stop:last-child {
+ background: #FFF url('images/step-last-off.png') no-repeat top left;
+}
+
+.left .step:last-child.current {
+ background: #FFF url('images/step-last-on.png') no-repeat top left;
+}
+
+.left .count {
+ padding-left: 35px;
+ display: inline-block;
+ color: #fff;
+}
+
+.left .label {
+ padding-left: 40px;
+ display: inline-block;
+ color: #9d9d9d;
+}
+
+.copyright {
+ padding-top: 100px;
+ font-size: 8px;
+ color: #9d9d9d;
}
.right {
padding: 20px;
- width: 550px;
+ width: 500px;
}
.right .state {
diff --git a/bug/bug/bug.js b/bug/bug/bug.js
index 0b12a1e..bf4d797 100644
--- a/bug/bug/bug.js
+++ b/bug/bug/bug.js
@@ -56,6 +56,11 @@
}
},
+ current_step: function(name) {
+ $('.step').removeClass('current');
+ $('.step_' + name).addClass('current');
+ },
+
state_signin_error_regexp: 'class="throw_error">([^<]*)',
state_signin_success_regexp: 'Log out</a>([^<]*)',
@@ -76,6 +81,7 @@
$.bug.state_component();
});
});
+ $.bug.current_step('signin');
element.show();
},
@@ -92,6 +98,7 @@
$('.component', element).change(change_component);
$('.component', element).prop("selectedIndex", 0);
+ $.bug.current_step('component');
element.show();
},
@@ -104,6 +111,7 @@
$.bug.refresh_related_bugs();
$.bug.state_version();
});
+ $.bug.current_step('subcomponent');
element.show();
$('.active_subcomponent .select', element).select();
},
@@ -116,6 +124,7 @@
});
$(".versions").prop("selectedIndex", 0);
element.addClass('initialized');
+ $.bug.current_step('version');
element.show();
}
},
@@ -133,6 +142,7 @@
$(".short", element).change(function() { validate(); });
$(".long", element).keyup(function() { validate(); });
element.addClass('initialized');
+ $.bug.current_step('description');
element.show();
}
},
@@ -167,6 +177,7 @@
});
});
element.addClass('initialized');
+ $.bug.current_step('submit');
element.show();
}
},
@@ -184,6 +195,7 @@
$.bug.state_attach_success_regexp);
$('img', element).attr('src', '/attachment.cgi?id=' + attachment);
}});
+ $.bug.current_step('attach');
element.show();
},
diff --git a/bug/bug/images/step-first-off.png b/bug/bug/images/step-first-off.png
new file mode 100644
index 0000000..16fb3ef
Binary files /dev/null and b/bug/bug/images/step-first-off.png differ
diff --git a/bug/bug/images/step-first-on.png b/bug/bug/images/step-first-on.png
new file mode 100644
index 0000000..20d2fd7
Binary files /dev/null and b/bug/bug/images/step-first-on.png differ
diff --git a/bug/bug/images/step-last-off.png b/bug/bug/images/step-last-off.png
new file mode 100644
index 0000000..16fb3ef
Binary files /dev/null and b/bug/bug/images/step-last-off.png differ
diff --git a/bug/bug/images/step-last-on.png b/bug/bug/images/step-last-on.png
new file mode 100644
index 0000000..20d2fd7
Binary files /dev/null and b/bug/bug/images/step-last-on.png differ
diff --git a/bug/bug/images/step-off.png b/bug/bug/images/step-off.png
new file mode 100644
index 0000000..3fc7356
Binary files /dev/null and b/bug/bug/images/step-off.png differ
diff --git a/bug/bug/images/step-on.png b/bug/bug/images/step-on.png
new file mode 100644
index 0000000..20d2fd7
Binary files /dev/null and b/bug/bug/images/step-on.png differ
diff --git a/bug/bug/images/top-header.png b/bug/bug/images/top-header.png
new file mode 100644
index 0000000..65969a7
Binary files /dev/null and b/bug/bug/images/top-header.png differ
diff --git a/bug/bug/portal-break.png b/bug/bug/portal-break.png
deleted file mode 100644
index e81b559..0000000
Binary files a/bug/bug/portal-break.png and /dev/null differ
diff --git a/bug/bug/skin.js b/bug/bug/skin.js
index 1b626e2..0386b7b 100644
--- a/bug/bug/skin.js
+++ b/bug/bug/skin.js
@@ -27,20 +27,22 @@
$.bug.state_component();
$('.state_component .component').prop("selectedIndex", 2);
$('.state_component .component').change();
- $('.state_subcomponent .subcomponent').prop("selectedIndex", 2);
+ } else if(location.search.indexOf('skin=version') >= 0) {
+ $.bug.state_component();
+ $('.state_component .component').prop("selectedIndex", 2);
+ $('.state_component .component').change();
$.bug.ajax = function(settings) {
return $.Deferred().resolve('NUM,DESC\n100,"BUG 1"\n200,"BUG 2"\n');
};
- $('.state_subcomponent .subcomponent').change();
+ $('.state_subcomponent .active_subcomponent .choice:nth(2)').click();
} else if(location.search.indexOf('skin=description') >= 0) {
$.bug.state_component();
$('.state_component .component').prop("selectedIndex", 2);
$('.state_component .component').change();
- $('.state_subcomponent .subcomponent').prop("selectedIndex", 2);
$.bug.ajax = function(settings) {
return $.Deferred().resolve('NUM,DESC\n100,"BUG 1"\n200,"BUG 2"\n');
};
- $('.state_subcomponent .subcomponent').change();
+ $('.state_subcomponent .active_subcomponent .choice:nth(2)').click();
$('.state_version .versions').prop("selectedIndex", 2);
$('.state_version .versions').change();
$('.state_description .short').val('12');
@@ -49,11 +51,10 @@
$.bug.state_component();
$('.state_component .component').prop("selectedIndex", 2);
$('.state_component .component').change();
- $('.state_subcomponent .subcomponent').prop("selectedIndex", 2);
$.bug.ajax = function(settings) {
return $.Deferred().resolve('NUM,DESC\n100,"BUG 1"\n200,"BUG 2"\n');
};
- $('.state_subcomponent .subcomponent').change();
+ $('.state_subcomponent .active_subcomponent .choice:nth(2)').click();
$('.state_version .versions').prop("selectedIndex", 2);
$('.state_version .versions').change();
$('.state_description .short').val('1234567890');
commit 91a3f50a3c0829af48e7d1065cf850de976bc4b6
Author: Loic Dachary <loic at dachary.org>
Date: Sun Sep 18 18:18:41 2011 +0200
Implement a minimal select element replacement based on a list. Surround it with divs so that images can be used to create a frame around it.
diff --git a/bug/bug.xhtml b/bug/bug.xhtml
index 4a25786..bc4bf88 100644
--- a/bug/bug.xhtml
+++ b/bug/bug.xhtml
@@ -15,6 +15,8 @@
<script type="text/javascript" src="jquery-validation-1.8.1/jquery.validate.js"></script>
<script type="text/javascript" src="jquery.iframe-post-form.js"></script>
<script type="text/javascript" src="bug.js"></script>
+ <script type="text/javascript" src="select.js"></script>
+ <link rel="stylesheet" href="select.css" type="text/css" media="screen"></link>
<script type="text/javascript" src="skin.js"></script>
<link rel="stylesheet" href="bug.css" type="text/css" media="screen"></link>
</head>
diff --git a/bug/bug/bug.css b/bug/bug/bug.css
index 43370b3..78888ef 100644
--- a/bug/bug/bug.css
+++ b/bug/bug/bug.css
@@ -117,3 +117,70 @@ body {
.skin {
display: none;
}
+
+/* select */
+.select .header {
+ background: url('images/select-header.png') no-repeat;
+ padding: 5px 40px 5px 10px;
+ height: 33px;
+ line-height: 33px;
+}
+
+.select .header, .select .choice {
+ font-family: helvetica, arial;
+ font-size: 18px;
+ color: #b8af9e;
+}
+
+.select li.choice:hover {
+ background-color: #9ceb90;
+ color: #32b21f;
+}
+
+.select .choices .center {
+ background-color: #FFF;
+}
+
+.select .choices .select-top {
+ padding-top: 10px;
+ background: url('images/select-horizontal.png') repeat-x top left;
+}
+
+.select .choices .select-bottom {
+ padding-bottom: 10px;
+ background: url('images/select-horizontal.png') repeat-x bottom left;
+}
+
+.select .choices .top-left {
+ background: url('images/select-top-left.png') no-repeat;
+ height: 10px;
+ width: 10px;
+}
+
+.select .choices .top-right {
+ background: url('images/select-top-right.png') no-repeat;
+ height: 10px;
+ width: 10px;
+}
+
+.select .choices .bottom-left {
+ background: url('images/select-bottom-left.png') no-repeat;
+ height: 10px;
+ width: 10px;
+}
+
+.select .choices .bottom-right {
+ background: url('images/select-bottom-right.png') no-repeat;
+ height: 10px;
+ width: 10px;
+}
+
+.select .choices .select-left {
+ background: url('images/select-vertical.png') repeat-y top left;
+ padding-left: 10px;
+}
+
+.select .choices .select-right {
+ background: url('images/select-vertical.png') repeat-y top right;
+ padding-right: 10px;
+}
diff --git a/bug/bug/bug.js b/bug/bug/bug.js
index 4d5e31b..0b12a1e 100644
--- a/bug/bug/bug.js
+++ b/bug/bug/bug.js
@@ -100,15 +100,12 @@
var component = $('.state_component .component').val();
var subcomponent = $('.subcomponents .' + component, element).html();
$('.active_subcomponent', element).html(subcomponent);
- var change_subcomponent = function() {
+ $('.active_subcomponent .select li', element).click(function() {
$.bug.refresh_related_bugs();
$.bug.state_version();
- };
-
- $('.subcomponent', element).change(change_subcomponent);
- $('.subcomponent', element).prop("selectedIndex", 0);
-
+ });
element.show();
+ $('.active_subcomponent .select', element).select();
},
state_version: function() {
diff --git a/bug/bug/images/select-bottom-left.png b/bug/bug/images/select-bottom-left.png
new file mode 100644
index 0000000..1298339
Binary files /dev/null and b/bug/bug/images/select-bottom-left.png differ
diff --git a/bug/bug/images/select-bottom-right.png b/bug/bug/images/select-bottom-right.png
new file mode 100644
index 0000000..d739ef7
Binary files /dev/null and b/bug/bug/images/select-bottom-right.png differ
diff --git a/bug/bug/images/select-header.png b/bug/bug/images/select-header.png
new file mode 100644
index 0000000..d6f204b
Binary files /dev/null and b/bug/bug/images/select-header.png differ
diff --git a/bug/bug/images/select-horizontal.png b/bug/bug/images/select-horizontal.png
new file mode 100644
index 0000000..bc8bbe2
Binary files /dev/null and b/bug/bug/images/select-horizontal.png differ
diff --git a/bug/bug/images/select-top-left.png b/bug/bug/images/select-top-left.png
new file mode 100644
index 0000000..1cee77d
Binary files /dev/null and b/bug/bug/images/select-top-left.png differ
diff --git a/bug/bug/images/select-top-right.png b/bug/bug/images/select-top-right.png
new file mode 100644
index 0000000..3ee6019
Binary files /dev/null and b/bug/bug/images/select-top-right.png differ
diff --git a/bug/bug/images/select-vertical.png b/bug/bug/images/select-vertical.png
new file mode 100644
index 0000000..a76a3cb
Binary files /dev/null and b/bug/bug/images/select-vertical.png differ
diff --git a/bug/bug/select.css b/bug/bug/select.css
new file mode 100644
index 0000000..9c73287
--- /dev/null
+++ b/bug/bug/select.css
@@ -0,0 +1,41 @@
+
+/* select */
+.select {
+ position: relative;
+ z-index: 1;
+}
+
+.select ul {
+ list-style: none;
+ margin: 0;
+ padding: 0;
+}
+
+.select .top-left {
+ position: absolute;
+ top: 0;
+ left: 0;
+ z-index: 2;
+}
+
+.select .bottom-left {
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ z-index: 2;
+}
+
+.select .top-right {
+ position: absolute;
+ top: 0;
+ right: 0;
+ z-index: 2;
+}
+
+.select .bottom-right {
+ position: absolute;
+ bottom: 0;
+ right: 0;
+ z-index: 2;
+}
+
diff --git a/bug/bug/select.js b/bug/bug/select.js
new file mode 100644
index 0000000..b1d99f4
--- /dev/null
+++ b/bug/bug/select.js
@@ -0,0 +1,48 @@
+//
+// Copyright (C) 2011 Loic Dachary <loic at dachary.org>
+//
+// This program is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// This program is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU General Public License for more details.
+//
+// You should have received a copy of the GNU General Public License
+// along with this program. If not, see <http://www.gnu.org/licenses/>.
+//
+(function($) {
+ $.fn.select = function(options) {
+ var opts = $.extend({}, $.fn.select.defaults , options);
+
+ return this.each(function(){
+ var element = $(this);
+ var position = $('.choices', element).position();
+ $('.choices', element).hide();
+ $('.choices', element).css({
+ position: 'absolute',
+ top: position.y,
+ left: position.x
+ });
+ $('.chosen', this).mouseenter(function() {
+ $('.choices', element).show();
+ });
+ element.mouseleave(function() {
+ $('.choices', element).hide();
+ });
+ $('li', this).click(function() {
+ $('.chosen', element).
+ attr('data', $(this).attr('data')).
+ text($(this).text());
+ $('.choices', element).hide();
+ });
+ });
+ };
+
+ $.fn.select.defaults = {
+ };
+
+})(jQuery);
diff --git a/bug/subcomponents.xsl b/bug/subcomponents.xsl
index f5bb96d..8e2050c 100644
--- a/bug/subcomponents.xsl
+++ b/bug/subcomponents.xsl
@@ -7,18 +7,39 @@
<xsl:template match="div[contains(@class,'component')]">
<xsl:element name="div">
<xsl:attribute name="class"><xsl:value-of select="translate(translate(*[position()=1],' ','_')," ",'_')" /></xsl:attribute>
- <select class="subcomponent" name="short_desc">
- <option selected='selected' value=''>(chose one)</option>
- <option value=''>(all other problems)</option>
- <xsl:apply-templates select="descendant::*[contains(@class,'search')]"/>
- </select>
+ <div class="subcomponent select">
+ <div class="header">
+ <div class="chosen">(chose one)</div>
+ </div>
+ <div class="choices">
+ <div class="select-top">
+ <div class="select-left">
+ <div class="select-bottom">
+ <div class="select-right">
+ <div class="top-left"></div>
+ <div class="top-right"></div>
+ <div class="bottom-left"></div>
+ <div class="bottom-right"></div>
+ <div class="center">
+ <ul>
+ <li class="choice" data=''><span class="XXX">(all other problems)</span></li>
+ <xsl:apply-templates select="descendant::*[contains(@class,'search')]"/>
+ </ul>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
</xsl:element>
</xsl:template>
<xsl:template match="*[contains(@class,'search')]">
<xsl:if test="not(contains(*,'['))">
- <xsl:element name="option">
- <xsl:attribute name="value"><xsl:value-of select="*"/></xsl:attribute>
+ <xsl:element name="li">
+ <xsl:attribute name="data"><xsl:value-of select="*"/></xsl:attribute>
+ <xsl:attribute name="class">choice</xsl:attribute>
<xsl:value-of select="*"/>
</xsl:element>
</xsl:if>
More information about the Libreoffice-commits
mailing list