yvan/jira-card-printer
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Merge pull request #2 from qoomon/develop

Browse Source 
Fix Oversize Assignee Character & Add Feedback Buttons
This commit is contained in:
Bengt Brodersen 2015-01-23 13:37:55 +01:00
commit 86d817b94c
2 changed files with 236 additions and 197 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
README.md
View File

@ -1,2 +1,9 @@
# Jira-Issue-Card-Printer # Jira-Issue-Card-Printer
Beautiful Jira Issue Card Printer Beautiful Jira Issue Card Printer
## More Info...
https://qoomon.github.io/Jira-Issue-Card-Printer/index.html
### Card Layout
![My image](http://4.bp.blogspot.com/-BgfPtVWFxVo/VLTjiqpPzjI/AAAAAAAAGLw/PgF3D6eq35c/s1600/Screen%2BShot%2B2015-01-13%2Bat%2B10.19.22.png)

426
bookmarklet.js
View File

@ -298,6 +298,10 @@ function printOverlayHTML(){
<div id="card-print-dialog"> <div id="card-print-dialog">
<div id="card-print-dialog-header"> <div id="card-print-dialog-header">
<div id="card-print-dialog-title">Card Print</div> <div id="card-print-dialog-title">Card Print</div>
<div id="info">
<input id="report-issue" type="button" class="aui-button" value="Report Issues" />
<input id="about" type="button" class="aui-button" value="About" />
</div>
<div id="buttons"> <div id="buttons">
<input id="card-print-dialog-print" type="button" class="aui-button aui-button-primary" value="Print" /> <input id="card-print-dialog-print" type="button" class="aui-button aui-button-primary" value="Print" />
<a id="card-print-dialog-cancel" title="Cancel" class="cancel">Cancel</a> <a id="card-print-dialog-cancel" title="Cancel" class="cancel">Cancel</a>
@ -310,6 +314,19 @@ function printOverlayHTML(){
</div> </div>
*/ */
})); }));
// info
result.find("#report-issue")
.click(function(event){
window.open('https://github.com/qoomon/Jira-Issue-Card-Printer/issues');
return false;
});
result.find("#about")
.click(function(event){
window.open('http://qoomon.blogspot.de/2014/01/jira-issue-card-printer-bookmarklet.html');
return false;
});
// print // print
@ -354,9 +371,6 @@ function printOverlayStyle(){
.attr("type", "text/css") .attr("type", "text/css")
.html(multilineString(function() { .html(multilineString(function() {
/*! /*!
#card-print-dialog-cancel {
padding:5px 10px 5px 10px;
}
#card-print-overlay { #card-print-overlay {
position: fixed; position: fixed;
height: 100%; height: 100%;
@ -364,9 +378,11 @@ function printOverlayStyle(){
top: 0; top: 0;
left: 0; left: 0;
background:rgba(0, 0, 0, 0.5); background:rgba(0, 0, 0, 0.5);
box-sizing: border-box; box-sizing: border-box;
word-wrap:break-word; word-wrap:break-word;
z-index: 99999; z-index: 99999;
} }
#card-print-dialog { #card-print-dialog {
@ -375,18 +391,18 @@ function printOverlayStyle(){
top: 60px; top: 60px;
right:0px; right:0px;
left:0px; left:0px;
height: calc(100% - 120px); height: calc(100% - 120px);
width: 1000px; width: 1000px;
margin: auto; margin: auto;
border-style: solid; border-style: solid;
border-color: #cccccc; border-color: #cccccc;
border-width: 1px; border-width: 1px;
-moz-border-radius: 4px; -moz-border-radius: 4px;
-webkit-border-radius: 4px; -webkit-border-radius: 4px;
border-radius: 4px; border-radius: 4px;
overflow: hidden; overflow: hidden;
} }
@ -394,24 +410,26 @@ function printOverlayStyle(){
position: relative; position: relative;
background: #f0f0f0; background: #f0f0f0;
height: 25px; height: 25px;
border-bottom: 1px solid #cccccc; border-bottom: 1px solid #cccccc;
padding: 15px 20px 15px 20px; padding: 15px 20px 15px 20px;
} }
#card-print-dialog-content { #card-print-dialog-content {
position: relative; position: relative;
background: white; background: white;
height: calc(100% - 106px); height: calc(100% - 106px); + height: 100px;
width: 100%; width: 100%;
overflow-y: scroll;
}
overflow-y: scroll; #card-print-dialog-content-iframe {
} position: relative;
#card-print-dialog-content-iframe { height: 100%;
position: relative;
height: 100%;
width: 100%; width: 100%;
border:none; border:none;
} }
@ -431,6 +449,14 @@ function printOverlayStyle(){
height 30px; height 30px;
} }
#info {
position: absolute;
right: 250px;
float: left;
display: inline-block;
height 30px;
}
#card-print-dialog-title{ #card-print-dialog-title{
position: relative; position: relative;
float: left; float: left;
@ -565,248 +591,254 @@ function printPanelCardCSS(){
.html(multilineString(function() { .html(multilineString(function() {
/*! /*!
* { * {
color: black; color: black;
font-family:"Droid Serif"; font-family:"Droid Serif";
} }
body { body {
margin: 0; margin: 0;
} }
.hidden { .hidden {
visibility: hidden; visibility: hidden;
} }
.card-header:after, .card-header:after,
.card-footer:after { .card-footer:after {
content:" "; content:" ";
display: block; display: block;
clear: both; clear: both;
height:0 height:0
} }
.card-border, .card-border,
.badge, .badge,
.shadow { .shadow {
border-style: solid; border-style: solid;
border-color: #2f2f2f; border-color: #2f2f2f;
border-top-width: 0.14cm; border-top-width: 0.14cm;
border-left-width: 0.14cm; border-left-width: 0.14cm;
border-bottom-width: 0.24cm; border-bottom-width: 0.24cm;
border-right-width: 0.24cm; border-right-width: 0.24cm;
-webkit-border-radius: 0.25cm; -webkit-border-radius: 0.25cm;
border-radius: 0.25cm; border-radius: 0.25cm;
// -webkit-filter: drop-shadow(0px 5px 10px black) // -webkit-filter: drop-shadow(0px 5px 10px black)
} }
.circular { .circular {
-moz-border-radius: 50%; -moz-border-radius: 50%;
-webkit-border-radius: 50%; -webkit-border-radius: 50%;
border-radius: 50%; border-radius: 50%;
} }
.badge { .badge {
width: 3.2cm; width: 3.2cm;
height: 3.2cm; height: 3.2cm;
background: #d0d0d0; background: #d0d0d0;
} }
.card { .card {
position: relative; position: relative;
min-width: 21.0cm; min-width: 21.0cm;
} }
.author { .author {
z-index: 999; z-index: 999;
position: absolute; position: absolute;
top:3.1cm; top:3.1cm;
right:0.7cm; right:0.7cm;
-webkit-transform-origin: 100% 100%; -webkit-transform-origin: 100% 100%;
transform-origin: 100% 100%; transform-origin: 100% 100%;
-webkit-transform: rotate(-90deg); -webkit-transform: rotate(-90deg);
transform: rotate(-90deg); transform: rotate(-90deg);
font-size: 0.4cm; font-size: 0.4cm;
color: DARKGREY; color: DARKGREY;
} }
.card-border { .card-border {
position: absolute; position: absolute;
top:2.0cm; top:2.0cm;
left:0.4cm; left:0.4cm;
right:0.4cm; right:0.4cm;
height: calc(100% - 4.0cm); height: calc(100% - 4.0cm);
background: #ffffff; background: #ffffff;
} }
.card-header { .card-header {
position: relative; position: relative;
} }
.card-content { .card-content {
position: relative; position: relative;
margin-top: 0.3cm; margin-top: 0.3cm;
margin-left: 1.0cm; margin-left: 1.0cm;
margin-right: 1.1cm; margin-right: 1.1cm;
margin-bottom: 0.2cm; margin-bottom: 0.2cm;
min-height: 5.0cm; min-height: 3.0cm;
} }
.content-header { .content-header {
position: relative; position: relative;
font-size: 1.1cm; font-size: 1.1cm;
line-height: 1.1cm; line-height: 1.1cm;
margin-bottom: 0.6cm; margin-bottom: 0.6cm;
} }
.card-footer { .card-footer {
position: relative; position: relative;
page-break-inside: avoid; page-break-inside: avoid;
} }
.summary { .summary {
font-weight: bold; font-weight: bold;
} }
.description { .description {
font-size: 0.6cm; min-height: 3.0cm;
line-height: 0.6cm; font-size: 0.6cm;
line-height: 0.6cm;
} }
.key { .key {
position: absolute; position: absolute;
float: left; float: left;
width: auto; width: auto;
min-width: 4.4cm; min-width: 4.4cm;
height: 1.35cm; height: 1.35cm;
left: 2.8cm; left: 3.0cm;
margin-top: 1.05cm; margin-top: 1.2cm;
padding-top: 0.2cm; padding-left: 0.7cm;
padding-left: 0.9cm; padding-right: 0.4cm;
padding-right: 0.4cm; text-align: center;
text-align: center; font-weight: bold;
font-weight: bold; font-size: 1.0cm;
font-size: 1.0cm; line-height: 1.4cm;
line-height: 1.30cm;
} }
.type-icon { .type-icon {
position: relative; position: relative;
float: left; float: left;
background-color: GREENYELLOW; background-color: GREENYELLOW;
background-image: url({RESOURCE_ORIGIN}icons/Objects.png); background-image: url(https://googledrive.com/host/0Bwgd0mVaLU_KU0N5b3JyRnJaNTA/resources/icons/Objects.png);
background-repeat: no-repeat; background-repeat: no-repeat;
-webkit-background-size: 70%; -webkit-background-size: 70%;
background-size: 70%; background-size: 70%;
background-position: center; background-position: center;
z-index: 1; z-index: 1;
} }
.card[type="story"] .type-icon { .card[type="story"] .type-icon {
background-color: GOLD; background-color: GOLD;
background-image: url({RESOURCE_ORIGIN}icons/Bulb.png); background-image: url(https://googledrive.com/host/0Bwgd0mVaLU_KU0N5b3JyRnJaNTA/resources/icons/Bulb.png);
} }
.card[type="bug"] .type-icon { .card[type="bug"] .type-icon {
background-color: CRIMSON; background-color: CRIMSON;
background-image: url({RESOURCE_ORIGIN}icons/Bug.png); background-image: url(https://googledrive.com/host/0Bwgd0mVaLU_KU0N5b3JyRnJaNTA/resources/icons/Bug.png);
} }
.card[type="epic"] .type-icon { .card[type="epic"] .type-icon {
background-color: ROYALBLUE; background-color: ROYALBLUE;
background-image: url({RESOURCE_ORIGIN}icons/Flash.png); background-image: url(https://googledrive.com/host/0Bwgd0mVaLU_KU0N5b3JyRnJaNTA/resources/icons/Flash.png);
} }
.estimate { .estimate {
position: relative; position: relative;
float: left; float: left;
left: -0.65cm; left: -0.65cm;
top:-1.5cm; top:-1.5cm;
height: 1.1cm; height: 1.1cm;
width: 1.1cm; width: 1.1cm;
text-align: center; text-align: center;
font-weight: bold; font-weight: bold;
font-size: 1cm; font-size: 1cm;
line-height: 1.15cm; line-height: 1.15cm;
margin-top:1.5cm; margin-top:1.5cm;
z-index: 999; z-index: 999;
} }
.due { .due {
position: relative; position: relative;
float: right; float: right;
} }
.due-icon { .due-icon {
position: relative; position: relative;
float:right; float:right;
width: 2.5cm; width: 2.5cm;
height: 2.5cm; height: 2.5cm;
margin-top: 0.35cm; margin-top: 0.4cm;
background-color: MEDIUMPURPLE; background-color: MEDIUMPURPLE;
background-image: url({RESOURCE_ORIGIN}icons/AlarmClock.png); background-image: url(https://googledrive.com/host/0Bwgd0mVaLU_KU0N5b3JyRnJaNTA/resources/icons/AlarmClock.png);
background-repeat: no-repeat; background-repeat: no-repeat;
-webkit-background-size: 65%; -webkit-background-size: 65%;
background-size: 65%; background-size: 65%;
background-position: center; background-position: center;
z-index: 1; z-index: 1;
} }
.due-date { .due-date {
position: relative; position: relative;
float: right; float: right;
right: -0.6cm; right: -0.6cm;
width: auto; width: auto;
min-width: 2.8cm; min-width: 2.8cm;
height: auto; height: auto;
margin-top: 1.3cm; margin-top: 1.3cm;
padding-top: 0.3cm; padding-top: 0.2cm;
padding-bottom: 0.2cm; padding-bottom: 0.2cm;
padding-left: 0.3cm; padding-left: 0.3cm;
padding-right: 0.6cm; padding-right: 0.6cm;
text-align: center; text-align: center;
font-weight: bold; font-weight: bold;
font-size: 0.7cm; font-size: 0.7cm;
line-height: 0.7cm; line-height: 0.7cm;
} }
.attachment { .attachment {
position: relative; position: relative;
float: left; float: left;
margin-left: 0.6cm; margin-left: 0.6cm;
width: 2.1cm; width: 2.1cm;
height: 2.1cm; height: 2.1cm;
background-color: LIGHTSKYBLUE; background-color: LIGHTSKYBLUE;
background-image: url({RESOURCE_ORIGIN}icons/Attachment.png); background-image: url(https://images.weserv.nl/?url=www.iconsdb.com/icons/download/color/2f2f2f/attach-256.png);
background-repeat: no-repeat; background-repeat: no-repeat;
-webkit-background-size: 70%; -webkit-background-size: 70%;
background-size: 70%; background-size: 70%;
background-position: center; background-position: center;
} }
.assignee { .assignee {
position: relative; position: relative;
float: right; float: right;
width: 2.1cm; width: 2.1cm;
height: 2.1cm; height: 2.1cm;
text-align: center; text-align: center;
font-weight: bold; font-weight: bold;
font-size: 2.0cm; font-size: 2.1cm;
line-height: 2.5cm; line-height: 2.1cm;
padding-left: 0.1cm; background-image: url(https://images.weserv.nl/?url=www.iconsdb.com/icons/download/color/aaaaaa/contacts-256.png);
background-image: url({RESOURCE_ORIGIN}icons/Person.png); background-repeat: no-repeat;
background-repeat: no-repeat; -webkit-background-size: cover;
-webkit-background-size: cover; background-size: cover;
background-size: cover; -webkit-background-size: 100%;
-webkit-background-size: 100%; background-size: 100%;
background-size: 100%; -webkit-filter: contrast(150%) grayscale(100%);
-webkit-filter: contrast(150%) grayscale(100%); filter: contrast(150%) grayscale(100%);
filter: contrast(150%) grayscale(100%); background-position: center;
background-position: center;
} }
.qr-code { .qr-code {
position: relative; position: relative;
float: left; float: left;
width: 2.1cm; width: 2.1cm;
height: 2.1cm; height: 2.1cm;
background-image: url(https://chart.googleapis.com/chart?cht=qr&chs=256x256&chld=L|1&chl=blog.qoomon.com); background-image: url(https://chart.googleapis.com/chart?cht=qr&chs=256x256&chld=L|1&chl=blog.qoomon.com);
background-repeat: no-repeat; background-repeat: no-repeat;
-webkit-background-size: cover; -webkit-background-size: cover;
background-size: cover; background-size: cover;
background-position: center; background-position: center;
} }
.epic { .epic {
width: auto; width: auto;
height: auto; height: auto;
position: relative; position: relative;
float:right; float:right;
margin-right:0.6cm; margin-right:0.6cm;
padding-top: 0.2cm; padding-top: 0.2cm;
padding-bottom: 0.2cm; padding-bottom: 0.2cm;
padding-left: 0.3cm; padding-left: 0.3cm;
padding-right: 0.3cm; padding-right: 0.3cm;
text-align: left; text-align: left;
font-size: 0.7cm; font-size: 0.7cm;
line-height: 0.7cm; line-height: 0.7cm;
max-width: calc( 100% - 10.2cm); max-width: calc( 100% - 10.2cm);
} }
.epic-key { .epic-key {
} }
.epic-name { .epic-name {
font-weight: bold; font-weight: bold;
} }
*/ */
}).replace(/{RESOURCE_ORIGIN}/g, resourceOrigin)); }).replace(/{RESOURCE_ORIGIN}/g, resourceOrigin));