server/src/main/webapp/WEB-INF/templates/projectIndex.html
author ymh <ymh.work@gmail.com>
Tue, 02 Apr 2013 01:56:11 +0200
changeset 127 906fed13c1e1
parent 123 daa99448319d
child 134 f9716d086744
permissions -rw-r--r--
space admin edit.

<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org" >
    <head>
        <title>Renkan</title>

        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <meta charset="utf-8"/>
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0"/>

        <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 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="../../js/main.js" th:src="@{/static/js/main.js}" ></script>

        <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}"/> 
    </head>
    <body>
      <div id="container">
        <div id="wrapper">
        	<h1><a href="renkanIndex.html" th:href="@{'/'}" id="home-link" th:text="#{renkanIndex.renkan_space}">Renkan Space</a>: <span th:text="${space.title}">Titre</span></h1>
            <div id="inner">
                <div id="label" class="translate" th:text="#{renkanIndex.renkan_exp}">Create a Renkan</div> 
                <form action="#" onsubmit="go2Title();return false;"> 
                    <input type="text" id="renkantitle" autofocus="autofocus" x-webkit-speech="x-webkit-speech"/> 
                    <button type="submit">OK</button>
                </form>
            </div>
            <h2 th:text="#{renkanIndex.project_list}">Project list</h2>
            <div th:include="fragment/paginationFragment :: paginationFragment" class="pagination-container">
                <div>               
                    <a href="#?p.page=1">&lt;&lt;</a>                    
                    <a href="#?p.page=3">&lt;</a>
                    <span>...</span>
                    <a href="#?p.page=2">2</a>
                    <a href="#?p.page=3">3</a>
                    <span>4</span>
                    <a href="#?p.page=5">5</a>
                    <a href="#?p.page=6">6</a>
                    <span>...</span>
                    <a href="#?p.page=5">&gt;</a>
                    <a href="#?p.page=7">&gt;&gt;</a> 
                </div>
            </div>
            <table>
              <thead>
                <tr>
                    <th th:text="#{renkanIndex.project_name}">Name</th>
                    <th th:text="#{renkanIndex.project_creation}">Creation</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>
                </tr>
              </thead>
              <tbody>
                <tr th:each="project: ${page}">
                  <th th:text="${project.title}">title</th>
                  <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>
                </tr>
              </tbody>
            </table>            
        </div>
        <footer id="footer" th:include="fragment/pageFragment :: footerFragment">
            <div id="version">© <span class="version-date">2013</span> <a href="http://www.iri.centrepompidou.fr" target="_blanck">IRI</a> - Version <span class="version-version">0.0</span></div>
        </footer>        
      </div>
      <script th:inline="javascript" >
      /*<![CDATA[*/
    
          function go2Title()
          {
              var renkantitle = $("#renkantitle").val();
              if(renkantitle.length == 0) {
              	var alert_message = /*[[#{renkanIndex.js.empty_name_error}]]*/"Please enter a title"; 
              	alert(alert_message);
              	return false;
              }
              
              new_renkan = {
              	title: renkantitle,
              	description: "(empty description)",                	
              	uri: null,
              	space_id: /*[[${space.id}]]*/"_",
              };
              
              var post_url = /*[[@{/rest/projects/}]]*/"/rest/projects/"; 
              $.ajax(post_url, {
                  data:JSON.stringify(new_renkan),
                  type: "POST",
                  dataType: "json",
                  contentType: "application/json; charset=UTF-8"                    
              }).done(function(project){
              	window.location.reload();
              });
              
          }
      
      function copyProject(project_id)
      {
      	var post_url = /*[[@{/p/copy}]]*/"#";
          $.post(post_url, {"project_id": project_id})
              .done(function(p){
                  window.location.reload();
          });
      }
      
      function deleteProject(project_id, project_title)
      {
      	var message = /*[[#{renkanIndex.project_delete_confirm}]]*/"Delete project \"<%= title %>\"";
      	if(confirm(_.template(message, {title: project_title}))) {
              var delete_url = /*[[@{/rest/projects}]]*/"#";
              $.ajax(delete_url+"/"+project_id, {
                  type: "DELETE"	
              }).done(function(){
              	window.location.reload();
              });
      	}
      }
      
      $(function(){
      	$(".copy_project").click(function(event) {
      		copyProject($(event.target).data("project_id"));
      	});
          $(".delete_project").click(function(event) {
              deleteProject($(event.target).data("project_id"), $(event.target).data("project_title"));
          });
      });

      /*]]>*/
      </script>
    </body>
</html>