Streamline commands. Add popup menus. new version
--- a/client/package.json Thu Jun 12 16:27:35 2014 +0200
+++ b/client/package.json Sat Jun 14 00:15:18 2014 +0200
@@ -1,6 +1,6 @@
{
"name": "renkan",
- "version": "0.7.9",
+ "version": "0.7.10",
"description": "Renkan client application",
"repository": {
"type": "hg",
--- a/server/README.md Thu Jun 12 16:27:35 2014 +0200
+++ b/server/README.md Sat Jun 14 00:15:18 2014 +0200
@@ -2,6 +2,7 @@
- Icon user from echo-icon-theme (echo) (Open Icon Library - http://openiconlibrary.sourceforge.net/)
licence CC BY-SA - Creative Commons
+- eye icon by : Danilo De Marco : http://www.danilodemarco.com/
- cf pom.xml for dependencies
--- a/server/pom.xml Thu Jun 12 16:27:35 2014 +0200
+++ b/server/pom.xml Sat Jun 14 00:15:18 2014 +0200
@@ -4,7 +4,7 @@
<modelVersion>4.0.0</modelVersion>
<groupId>org.iri_research.renkan</groupId>
<artifactId>renkan</artifactId>
- <version>0.7.9</version>
+ <version>0.7.10</version>
<packaging>war</packaging>
<properties>
--- a/server/src/main/webapp/WEB-INF/i18n/messages.properties Thu Jun 12 16:27:35 2014 +0200
+++ b/server/src/main/webapp/WEB-INF/i18n/messages.properties Sat Jun 14 00:15:18 2014 +0200
@@ -16,6 +16,7 @@
renkanIndex.project_delete = Delete
renkanIndex.project_render = View
renkanIndex.project_export = Export
+renkanIndex.project_commands = Comm.
renkanIndex.project_edit_link = Edit renkan
renkanIndex.project_copy_link = Copy renkan
renkanIndex.project_delete_link = Delete renkan
--- a/server/src/main/webapp/WEB-INF/i18n/messages_en.properties Thu Jun 12 16:27:35 2014 +0200
+++ b/server/src/main/webapp/WEB-INF/i18n/messages_en.properties Sat Jun 14 00:15:18 2014 +0200
@@ -15,6 +15,7 @@
renkanIndex.project_delete = Delete
renkanIndex.project_render = View
renkanIndex.project_export = Export
+renkanIndex.project_commands = Comm.
renkanIndex.project_edit_link = Edit renkan
renkanIndex.project_copy_link = Copy renkan
renkanIndex.project_delete_link = Delete renkan
--- a/server/src/main/webapp/WEB-INF/i18n/messages_fr.properties Thu Jun 12 16:27:35 2014 +0200
+++ b/server/src/main/webapp/WEB-INF/i18n/messages_fr.properties Sat Jun 14 00:15:18 2014 +0200
@@ -16,6 +16,7 @@
renkanIndex.project_delete = Eff.
renkanIndex.project_render = Consult.
renkanIndex.project_export = Export.
+renkanIndex.project_commands = Comm.
renkanIndex.project_edit_link = Editer renkan
renkanIndex.project_copy_link = Copier renkan
renkanIndex.project_delete_link = Eff. renkan
--- a/server/src/main/webapp/WEB-INF/templates/projectIndex.html Thu Jun 12 16:27:35 2014 +0200
+++ b/server/src/main/webapp/WEB-INF/templates/projectIndex.html Sat Jun 14 00:15:18 2014 +0200
@@ -10,14 +10,17 @@
<link rel="shortcut icon" href="../../static/img/favicon.ico" th:href="@{/static/img/favicon.ico}"/>
<script th:remove="all" type="text/javascript" src="../../static/lib/jquery.min.js"></script>
- <script th:remove="all" type="text/javascript" src="../../static/js/thymol.js"></script>
+ <script th:remove="all" type="text/javascript" src="../../static/js/thymol.js"></script>
- <script src="../../lib/jquery.min.js" th:src="@{/static/lib/jquery.min.js}" ></script>
- <script src="../../lib/underscore-min.js" th:src="@{/static/lib/underscore-min.js}" ></script>
- <script src="../../lib/URI.js" th:src="@{/static/lib/URI.js}" ></script>
+ <script src="../../static/lib/jquery.min.js" th:src="@{/static/lib/jquery.min.js}" ></script>
+ <script src="../../static/lib/jquery-ui/jquery-ui.min.js" th:src="@{/static/lib/jquery-ui/jquery-ui.min.js}" ></script>
+ <script src="../../static/lib/underscore-min.js" th:src="@{/static/lib/underscore-min.js}" ></script>
+ <script src="../../static/lib/URI.js" th:src="@{/static/lib/URI.js}" ></script>
+ <link href="../../static/lib/jquery-ui/css/ui-lightness/jquery-ui.min.css" rel="stylesheet" th:href="@{/static/lib/jquery-ui/css/ui-lightness/jquery-ui.min.css}"/>
<link href="../../static/css/style.css" rel="stylesheet" th:href="@{/static/css/style.css}"/>
- <link href="../../static/css/index.css" rel="stylesheet" th:href="@{/static/css/index.css}"/>
+ <link href="../../static/css/index.css" rel="stylesheet" th:href="@{/static/css/index.css}"/>
+
</head>
<body>
<div id="container">
@@ -65,11 +68,7 @@
<th th:with="sorted=(${columnSort}=='title')"><span th:text="#{renkanIndex.project_name}">Name</span><form method="get" class="proj-sort-form"><input type="hidden" name="p.sort" value="title"/><input type="hidden" name="p.sort.dir" th:value="${sorted}?${sortDirInv}:'desc'"/><input th:if="${param['filter']}" name="filter" type="hidden" th:value="${param['filter'][0]}"/><input type="submit" class="proj-sortable-col" th:class="${sorted}?'proj-sort-'+${sortDir}+'-col':'proj-sortable-col'" value=""/></form></th>
<th th:with="sorted=(${columnSort}=='updated')"><span th:text="#{renkanIndex.project_updated}">Updated</span><form method="get" class="proj-sort-form"><input type="hidden" name="p.sort" value="updated"/><input type="hidden" name="p.sort.dir" th:value="(${sorted})?${sortDirInv}:'desc'"/><input th:if="${param['filter']}" name="filter" type="hidden" th:value="${param['filter'][0]}"/><input type="submit" class="proj-sort-desc-col" th:class="${sorted}?'proj-sort-'+${sortDir}+'-col':'proj-sortable-col'" value=""/></form></th>
<th th:with="sorted=(${columnSort}=='created')"><span th:text="#{renkanIndex.project_creation}" >Creation</span><form method="get" class="proj-sort-form"><input type="hidden" name="p.sort" value="created"/><input type="hidden" name="p.sort.dir" th:value="${sorted}?${sortDirInv}:'desc'"/><input th:if="${param['filter']}" name="filter" type="hidden" th:value="${param['filter'][0]}"/><input type="submit" class="proj-sort-asc-col" th:class="${sorted}?'proj-sort-'+${sortDir}+'-col':'proj-sortable-col'" value=""/></form></th>
- <th th:text="#{renkanIndex.project_edit}">Edit</th>
- <th th:text="#{renkanIndex.project_copy}">Copy</th>
- <th th:text="#{renkanIndex.project_delete}">Del.</th>
- <th th:text="#{renkanIndex.project_render}">View</th>
- <th th:text="#{renkanIndex.project_export}">Export</th>
+ <th th:text="#{renkanIndex.project_commands}">Comm.</th>
</tr>
</thead>
<tbody>
@@ -77,14 +76,22 @@
<th th:text="${project.title}">title</th>
<td th:text="${project.updated}?${#dates.format(project.updated, #messages.msg('date.format'))}:''">update</td>
<td th:text="${#dates.format(project.created, #messages.msg('date.format'))}">date</td>
- <td><a href="#" th:href="@{'/p/'+${project.id}(cowebkey=${project.getKey(2)})}" th:text="#{renkanIndex.project_edit_link}">Edit project</a></td>
- <td><a href="#" th:text="#{renkanIndex.project_copy_link}" th:attr="data-project_id=${project.id}" class="copy-project">Copy project</a></td>
- <td><a href="#" th:text="#{renkanIndex.project_delete_link}" th:attr="data-project_id=${project.id},data-project_title=${project.title}" class="delete-project">Delete project</a></td>
- <td><a href="#" th:href="@{'/p/pub/'+${project.id}(cowebkey=${project.getKey(1)})}" th:text="#{renkanIndex.project_render_link}">View project</a></td>
- <td><a href="#" th:href="@{'/p/exp/'+${project.id}}" th:text="#{renkanIndex.project_export_link}">Export project</a></td>
+ <td>
+ <a href="#" th:href="@{'/p/'+${project.id}(cowebkey=${project.getKey(2)})}" th:title="#{renkanIndex.project_edit_link}"><span class="ui-icon ui-icon-pencil renkan-basic-action"></span></a>
+ <a href="#" th:href="@{'/p/pub/'+${project.id}(cowebkey=${project.getKey(1)})}" th:title="#{renkanIndex.project_render_link}"><span class="ui-icon renkan-icon-eye renkan-basic-action"></span></a>
+ <span class="ui-icon ui-icon-triangle-1-e renkan-basic-action renkan-action-button" th:id="'renkan-action-button-'+${project.id}" th:attr="data-project_id=${project.id}"></span>
+ </td>
</tr>
</tbody>
</table>
+ <ul th:each="project: ${page}" class="action-menu" id="action-menu-" th:id="'action-menu-'+${project.id}">
+ <li><a href="#" th:href="@{'/p/'+${project.id}(cowebkey=${project.getKey(2)})}"><span class="ui-icon ui-icon-pencil"></span><span th:text="#{renkanIndex.project_edit_link}">Edit project</span></a></li>
+ <li><a href="#" th:attr="data-project_id=${project.id}" class="copy-project"><span class="ui-icon ui-icon-copy"></span><span th:text="#{renkanIndex.project_copy_link}">Copy project</span></a></li>
+ <li><a href="#" th:attr="data-project_id=${project.id},data-project_title=${project.title}" class="delete-project"><span class="ui-icon ui-icon-trash"></span><span th:text="#{renkanIndex.project_delete_link}">Delete project</span></a></li>
+ <li><a href="#" th:href="@{'/p/pub/'+${project.id}(cowebkey=${project.getKey(1)})}"><span class=" ui-icon renkan-icon-eye"></span><span th:text="#{renkanIndex.project_render_link}">View project</span></a></li>
+ <li><a href="#" th:href="@{'/p/exp/'+${project.id}}"><span class="ui-icon ui-icon-arrowthickstop-1-s"></span><span th:text="#{renkanIndex.project_export_link}">Export project</span></a></li>
+ </ul>
+
</div>
</div>
<footer id="footer" th:include="fragment/pageFragment :: footerFragment">
@@ -93,13 +100,13 @@
</div>
<script th:inline="javascript" >
/*<![CDATA[*/
-
+ 'use strict';
function go2Title()
{
var renkantitle = $("#renkantitle").val(),
renkanfiles = $("#renkanfile").prop("files");
- if(renkantitle.length == 0 && renkanfiles.length == 0) {
+ if(renkantitle.length === 0 && renkanfiles.length === 0) {
var alert_message = /*[[#{renkanIndex.js.empty_form_error}]]*/"Please enter a title or a file";
alert(alert_message);
return false;
@@ -120,7 +127,7 @@
});
});
- if(renkanfiles.length == 0) {
+ if(renkanfiles.length === 0) {
deferred.resolve({
title: renkantitle,
description: "",
@@ -168,14 +175,36 @@
}
}
+ function createMenuHandler(menu, timeoutCallback) {
+ return function(e) {
+ menu.toggle();
+ $(e.target).toggleClass("ui-icon-triangle-1-e").toggleClass("ui-icon-triangle-1-se");
+ $('.renkan-action-button').each(function() {
+ if($(this).prop('id') !== $(e.target).prop('id')) {
+ $(this).removeClass("ui-icon-triangle-1-se").addClass("ui-icon-triangle-1-e");
+ $("#action-menu-"+$(this).data('project_id')).hide();
+ var timeout = $("#action-menu-"+$(this).data('project_id')).data('blurtimeout');
+ if(typeof timeout !== 'undefined') {
+ clearTimeout(menu.data('blurtimeout'));
+ menu.removeData('blurtimeout');
+ }
+ }
+ });
+ if(menu.is(":visible")) {
+ menu.data('blurtimeout', setTimeout( timeoutCallback,5000));
+ }
+ }
+ }
+
$(function(){
$(".copy-project").click(function(event) {
- copyProject($(event.target).data("project_id"));
+ var project_id = $(event.currentTarget).data("project_id");
+ copyProject(project_id);
});
$(".delete-project").click(function(event) {
- deleteProject($(event.target).data("project_id"), $(event.target).data("project_title"));
+ deleteProject($(event.currentTarget).data("project_id"), $(event.currentTarget).data("project_title"));
});
@@ -189,6 +218,28 @@
e.preventDefault();
console.log("import form event :", e);
});
+
+ $('.renkan-action-button').each(function() {
+ var projectId = $(this).data('project_id');
+ var menu = $('#action-menu-'+projectId).menu().position({ my: "left top", at: "right top", of: this }).hide();
+ var that = this;
+
+ var timeoutCallback = function() {
+ menu.hide();
+ $(that).removeClass("ui-icon-triangle-1-se").addClass("ui-icon-triangle-1-e");
+ menu.removeData('blurtimeout');
+ };
+
+ menu.on('menufocus', function() {
+ clearTimeout(menu.data('blurtimeout'));
+ menu.removeData('blurtimeout');
+ });
+ menu.on('menublur',function(e) {
+ menu.data('blurtimeout', setTimeout( timeoutCallback,200));
+ });
+
+ $(this).click(createMenuHandler(menu, timeoutCallback));
+ });
});
/*]]>*/
--- a/server/src/main/webapp/static/css/index.css Thu Jun 12 16:27:35 2014 +0200
+++ b/server/src/main/webapp/static/css/index.css Sat Jun 14 00:15:18 2014 +0200
@@ -451,4 +451,40 @@
#login-form {
clear: both;
+}
+
+.renkan-icon-eye {
+ background-position: -160px -144px;
+}
+
+.renkan-basic-action {
+ display: inline-block;
+}
+
+.renkan-action-button {
+ cursor: pointer;
+}
+
+.ui-menu {
+ width: 180px;
+}
+
+.action-menu {
+ position: absolute;
+}
+
+.action-menu a {
+ color: #333333;
+}
+
+.action-menu a:ACTIVE {
+ color: #333333;
+}
+
+.action-menu a:LINK {
+ color: #333333;
+}
+
+.action-menu a:VISITED {
+ color: #333333;
}
\ No newline at end of file
Binary file server/src/main/webapp/static/lib/jquery-ui/css/ui-lightness/images/ui-icons_222222_256x240.png has changed
Binary file server/src/main/webapp/static/lib/jquery-ui/css/ui-lightness/images/ui-icons_228ef1_256x240.png has changed
Binary file server/src/main/webapp/static/lib/jquery-ui/css/ui-lightness/images/ui-icons_ef8c08_256x240.png has changed
Binary file server/src/main/webapp/static/lib/jquery-ui/css/ui-lightness/images/ui-icons_ffd27a_256x240.png has changed
Binary file server/src/main/webapp/static/lib/jquery-ui/css/ui-lightness/images/ui-icons_ffffff_256x240.png has changed
