<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:w="urn:schemas-microsoft-com:office:word" xmlns:m="http://schemas.microsoft.com/office/2004/12/omml" xmlns="http://www.w3.org/TR/REC-html40">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=us-ascii">
<meta name="Generator" content="Microsoft Word 15 (filtered medium)">
<!--[if !mso]><style>v\:* {behavior:url(#default#VML);}
o\:* {behavior:url(#default#VML);}
w\:* {behavior:url(#default#VML);}
.shape {behavior:url(#default#VML);}
</style><![endif]--><style><!--
/* Font Definitions */
@font-face
        {font-family:"Cambria Math";
        panose-1:2 4 5 3 5 4 6 3 2 4;}
@font-face
        {font-family:Calibri;
        panose-1:2 15 5 2 2 2 4 3 2 4;}
/* Style Definitions */
p.MsoNormal, li.MsoNormal, div.MsoNormal
        {margin:0cm;
        margin-bottom:.0001pt;
        font-size:11.0pt;
        font-family:"Calibri",sans-serif;
        mso-fareast-language:EN-US;}
a:link, span.MsoHyperlink
        {mso-style-priority:99;
        color:#0563C1;
        text-decoration:underline;}
a:visited, span.MsoHyperlinkFollowed
        {mso-style-priority:99;
        color:#954F72;
        text-decoration:underline;}
span.EmailStyle17
        {mso-style-type:personal-compose;
        font-family:"Calibri",sans-serif;
        color:windowtext;}
.MsoChpDefault
        {mso-style-type:export-only;
        mso-fareast-language:EN-US;}
@page WordSection1
        {size:612.0pt 792.0pt;
        margin:70.85pt 3.0cm 70.85pt 3.0cm;}
div.WordSection1
        {page:WordSection1;}
--></style><!--[if gte mso 9]><xml>
<o:shapedefaults v:ext="edit" spidmax="1026" />
</xml><![endif]--><!--[if gte mso 9]><xml>
<o:shapelayout v:ext="edit">
<o:idmap v:ext="edit" data="1" />
</o:shapelayout></xml><![endif]-->
</head>
<body lang="PT-BR" link="#0563C1" vlink="#954F72">
<div class="WordSection1">
<p class="MsoNormal">Hi team,<o:p></o:p></p>
<p class="MsoNormal"><o:p>&nbsp;</o:p></p>
<p class="MsoNormal"><span lang="EN-US">As we discussed on the chat today, I need help creating a widget for the new-ui while I&#8217;m still working on the current Grid widget for Hosts, Storage and Network tabs.<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US"><o:p>&nbsp;</o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">According to the new-ui design spec doc, in the Host tab, Debug Reports and Repositories panels shouldn&#8217;t be presented as tables but as lists with each line having a drop-down button on the right instead of one on the
 top below the panel header:<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US"><o:p>&nbsp;</o:p></span></p>
<p class="MsoNormal"><span style="mso-fareast-language:PT-BR"><img width="725" height="303" id="Picture_x0020_1" src="cid:image001.png@01D0E586.91066C40"></span><span lang="EN-US"><o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US"><o:p>&nbsp;</o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">This is the current json response for Repositories:<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US"><o:p>&nbsp;</o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">[<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">&nbsp; {<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">&nbsp;&nbsp;&nbsp; &quot;config&quot;:{<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &quot;gpgcheck&quot;:false,<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &quot;gpgkey&quot;:&quot;file:///etc/pki/rpm-gpg/RPM-GPG-KEY-fedora-$releasever-$basearch&quot;,<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &quot;metalink&quot;:&quot;https://mirrors.fedoraproject.org/metalink?repo=fedora-$releasever&amp;arch=$basearch&quot;,<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &quot;mirrorlist&quot;:&quot;&quot;,<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &quot;repo_name&quot;:&quot;Fedora $releasever - $basearch&quot;<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">&nbsp;&nbsp;&nbsp; },<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">&nbsp;&nbsp;&nbsp; &quot;repo_id&quot;:&quot;fedora&quot;,<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">&nbsp;&nbsp;&nbsp; &quot;enabled&quot;:true,<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">&nbsp;&nbsp;&nbsp; &quot;baseurl&quot;:&quot;&quot;<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">&nbsp; }<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">]<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US"><o:p>&nbsp;</o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">And Debug Reports:<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US"><o:p>&nbsp;</o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">[<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">&nbsp; {<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">&nbsp;&nbsp;&nbsp; &quot;time&quot;:&quot;2015-08-31-15:13:10&quot;,<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">&nbsp;&nbsp;&nbsp; &quot;name&quot;:&quot;test2&quot;,<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">&nbsp;&nbsp;&nbsp; &quot;uri&quot;:&quot;plugins/kimchi/data/debugreports/test2.tar.xz&quot;<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">&nbsp; },<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">&nbsp; {<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">&nbsp;&nbsp;&nbsp; &quot;time&quot;:&quot;2015-08-31-15:12:57&quot;,<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">&nbsp;&nbsp;&nbsp; &quot;name&quot;:&quot;test&quot;,<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">&nbsp;&nbsp;&nbsp; &quot;uri&quot;:&quot;plugins/kimchi/data/debugreports/test.tar.xz&quot;<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">&nbsp; }<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">]<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US"><o:p>&nbsp;</o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">I&#8217;ve planned the following HTML output for this widget:<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US"><o:p>&nbsp;</o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">- A &lt;i class=&quot;fa fa-power-off&quot;&gt;&lt;/i&gt; tag, empty when repository is not enabled;<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">- repo_id: Displays the repository name<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">- repo_name: Repository description<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">- Bootstrap modal button (don&#8217;t worry about styles since I&#8217;m still customizing it)<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US"><o:p>&nbsp;</o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">Reference: <a href="http://plnkr.co/edit/SgQcpfu5b5vVXWD9imND?p=preview">
http://plnkr.co/edit/SgQcpfu5b5vVXWD9imND?p=preview</a><o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US"><o:p>&nbsp;</o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">For debug reports lists:<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US"><o:p>&nbsp;</o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">-name;<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">-time;<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">- Bootstrap modal button (don&#8217;t worry about styles since I&#8217;m still customizing it)<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US"><o:p>&nbsp;</o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">It is very important that we keep the same model from kimchi.hosts.js by replacing only the current widget with the new one (example: repositoriesGrid = new kimchi.widget.Grid({ }); to repositoriesGrid = new kimchi.widget.List({
 }); ).<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">I don&#8217;t think it is necessary to fetch the whole branch and apply the patches to edit kimchi files, this can be done using
<a href="http://www.jsfiddle.net">www.jsfiddle.net</a>, <a href="http://www.jsbin.com">
www.jsbin.com</a> , <a href="http://plnkr.co/">http://plnkr.co/</a> or <a href="http://codepen.io/">
http://codepen.io/</a> (I suggest plnkr or jsfiddle since we can easily include jQuery, FonAwesome and Bootstrap from their CDN servers).<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US"><o:p>&nbsp;</o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">Thanks,<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US">Samuel<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US"><o:p>&nbsp;</o:p></span></p>
<p class="MsoNormal"><span lang="EN-US"><o:p>&nbsp;</o:p></span></p>
</div>
</body>
</html>