6 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> |
6 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> |
7 <meta charset="utf-8"/> |
7 <meta charset="utf-8"/> |
8 <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0"/> |
8 <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0"/> |
9 |
9 |
10 <link rel="shortcut icon" href="../../static/img/favicon.ico" th:href="@{/static/img/favicon.ico}"/> |
10 <link rel="shortcut icon" href="../../static/img/favicon.ico" th:href="@{/static/img/favicon.ico}"/> |
11 |
11 |
12 <script th:remove="all" type="text/javascript" src="../../static/lib/jquery/jquery.js"></script> |
12 <script th:remove="all" type="text/javascript" src="../../static/lib/jquery/jquery.js"></script> |
13 <script th:remove="all" type="text/javascript" src="../../static/js/thymol.js"></script> |
13 <script th:remove="all" type="text/javascript" src="../../static/js/thymol.js"></script> |
14 |
14 |
15 <script src="../../static/lib/jquery/jquery.js" th:src="@{/static/lib/jquery/jquery.js}" ></script> |
15 <script src="../../static/lib/jquery/jquery.js" th:src="@{/static/lib/jquery/jquery.js}" ></script> |
16 <script src="../../static/lib/jquery-ui/jquery-ui.min.js" th:src="@{/static/lib/jquery-ui/jquery-ui.min.js}" ></script> |
16 <script src="../../static/lib/jquery-ui/jquery-ui.min.js" th:src="@{/static/lib/jquery-ui/jquery-ui.min.js}" ></script> |
17 <script src="../../static/lib/underscore/underscore.js" th:src="@{/static/lib/underscore/underscore.js}" ></script> |
17 <script src="../../static/lib/underscore/underscore.js" th:src="@{/static/lib/underscore/underscore.js}" ></script> |
18 <script src="../../static/lib/URI.js" th:src="@{/static/lib/URI.js}" ></script> |
18 <script src="../../static/lib/URI.js" th:src="@{/static/lib/URI.js}" ></script> |
19 |
19 |
28 <header id="header"> |
28 <header id="header"> |
29 <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> |
29 <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> |
30 <div id="headerNav" th:include="fragment/pageFragment :: headerNavFragment"></div> |
30 <div id="headerNav" th:include="fragment/pageFragment :: headerNavFragment"></div> |
31 </header> |
31 </header> |
32 <div id="inner"> |
32 <div id="inner"> |
33 <div id="label" class="translate" th:text="#{renkanIndex.renkan_exp}">Create a Renkan</div> |
33 <div id="label" class="translate" th:text="#{renkanIndex.renkan_exp}">Create a Renkan</div> |
34 <form action="#" id="new-renkan-form"> |
34 <form action="#" id="new-renkan-form"> |
35 <fieldset id="form-fields"> |
35 <fieldset id="form-fields"> |
36 <div id="title-field"><label th:text="#{renkanIndex.renkan_title}" for="renkantitle">title</label><input type="text" id="renkantitle" autofocus="autofocus" x-webkit-speech="x-webkit-speech"/></div> |
36 <div id="title-field"><label th:text="#{renkanIndex.renkan_title}" for="renkantitle">title</label><input type="text" id="renkantitle" autofocus="autofocus" x-webkit-speech="x-webkit-speech"/></div> |
37 <div id="file-field"><label th:text="#{renkanIndex.renkan_file}" for="renkanfile">file</label><input type="file" id="renkanfile"/></div> |
37 <div id="file-field"><label th:text="#{renkanIndex.renkan_file}" for="renkanfile">file</label><input type="file" id="renkanfile"/></div> |
38 </fieldset> |
38 </fieldset> |
39 <div id="form-submit"><button type="submit">OK</button></div> |
39 <div id="form-submit"><button type="submit">OK</button></div> |
40 </form> |
40 </form> |
41 </div> |
41 </div> |
42 <div id="project-list-container"> |
42 <div id="project-list-container"> |
43 <h2 th:text="#{renkanIndex.project_list}">Project list</h2> |
43 <h2 th:text="#{renkanIndex.project_list}">Project list</h2> |
44 <div id="project-filter-container"> |
44 <div id="project-filter-container"> |
45 <form method="get"> |
45 <form method="get"> |
46 <input type="text" id="project-filter" name="filter" placeholder="filter title" th:placeholder="#{renkanIndex.project_filter}" th:value="${param['filter']}?${param['filter'][0]}:''" /> |
46 <input type="text" id="project-filter" name="filter" placeholder="filter title" th:placeholder="#{renkanIndex.project_filter}" th:value="${param['filter']}?${param['filter'][0]}:''" /> |
47 <button type="submit">OK</button> |
47 <button type="submit">OK</button> |
48 </form> |
48 </form> |
49 </div> |
49 </div> |
50 <div th:include="fragment/paginationFragment :: paginationFragment" class="pagination-container"> |
50 <div th:include="fragment/paginationFragment :: paginationFragment" class="pagination-container"> |
51 <div> |
51 <div> |
57 <span>4</span> |
57 <span>4</span> |
58 <a href="#?p.page=5">5</a> |
58 <a href="#?p.page=5">5</a> |
59 <a href="#?p.page=6">6</a> |
59 <a href="#?p.page=6">6</a> |
60 <span>...</span> |
60 <span>...</span> |
61 <a href="#?p.page=5">></a> |
61 <a href="#?p.page=5">></a> |
62 <a href="#?p.page=7">>></a> |
62 <a href="#?p.page=7">>></a> |
63 </div> |
63 </div> |
64 </div> |
64 </div> |
65 <table th:with="columnSort=${param['p.sort']}?${param['p.sort'][0]}:'updated',sortDir=${param['p.sort.dir']}?${param['p.sort.dir'][0]}:'desc'"> |
65 <table th:with="columnSort=${param['p.sort']}?${param['p.sort'][0]}:'updated',sortDir=${param['p.sort.dir']}?${param['p.sort.dir'][0]}:'desc'"> |
66 <thead th:with="sortDirInv=${sortDir}=='desc'?'asc':'desc'"> |
66 <thead th:with="sortDirInv=${sortDir}=='desc'?'asc':'desc'"> |
67 <tr> |
67 <tr> |
89 <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> |
89 <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> |
90 <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> |
90 <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> |
91 <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> |
91 <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> |
92 <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> |
92 <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> |
93 </ul> |
93 </ul> |
94 |
94 |
95 </div> |
95 </div> |
96 </div> |
96 </div> |
97 <footer id="footer" th:include="fragment/pageFragment :: footerFragment"> |
97 <footer id="footer" th:include="fragment/pageFragment :: footerFragment"> |
98 <div id="version">© <span class="version-date">2014</span> <a href="http://www.iri.centrepompidou.fr" target="_blanck">IRI</a> - Version <span class="version-version">0.0</span></div> |
98 <div id="version">© <span class="version-date">2014</span> <a href="http://www.iri.centrepompidou.fr" target="_blanck">IRI</a> - Version <span class="version-version">0.0</span></div> |
99 </footer> |
99 </footer> |
100 </div> |
100 </div> |
101 <script th:inline="javascript" > |
101 <script th:inline="javascript" > |
102 /*<![CDATA[*/ |
102 /*<![CDATA[*/ |
103 'use strict'; |
103 'use strict'; |
104 function go2Title() |
104 function go2Title() |
105 { |
105 { |
106 var renkantitle = $("#renkantitle").val(), |
106 var renkantitle = $("#renkantitle").val(), |
107 renkanfiles = $("#renkanfile").prop("files"); |
107 renkanfiles = $("#renkanfile").prop("files"); |
108 |
108 |
109 if(renkantitle.length === 0 && renkanfiles.length === 0) { |
109 if(renkantitle.length === 0 && renkanfiles.length === 0) { |
110 var alert_message = /*[[#{renkanIndex.js.empty_form_error}]]*/"Please enter a title or a file"; |
110 var alert_message = /*[[#{renkanIndex.js.empty_form_error}]]*/"Please enter a title or a file"; |
111 alert(alert_message); |
111 alert(alert_message); |
112 return false; |
112 return false; |
113 } |
113 } |
114 var post_url = /*[[@{/rest/projects/}]]*/"/rest/projects/", |
114 var post_url = /*[[@{/rest/projects/}]]*/"/rest/projects/", |
115 deferred = $.Deferred(); |
115 deferred = $.Deferred(); |
116 |
116 |
117 deferred.done(function(new_renkan) { |
117 deferred.done(function(new_renkan) { |
118 new_renkan.space_id = /*[[${space.id}]]*/"_"; |
118 new_renkan.space_id = /*[[${space.id}]]*/"_"; |
119 $.ajax(post_url, { |
119 $.ajax(post_url, { |
120 data:JSON.stringify(new_renkan), |
120 data:JSON.stringify(new_renkan), |
121 type: "POST", |
121 type: "POST", |
159 $.post(post_url, {"project_id": project_id}) |
159 $.post(post_url, {"project_id": project_id}) |
160 .done(function(p){ |
160 .done(function(p){ |
161 window.location.reload(); |
161 window.location.reload(); |
162 }); |
162 }); |
163 } |
163 } |
164 |
164 |
165 function deleteProject(project_id, project_title) |
165 function deleteProject(project_id, project_title) |
166 { |
166 { |
167 var message = /*[[#{renkanIndex.project_delete_confirm}]]*/"Delete project \"<%= title %>\""; |
167 var message = /*[[#{renkanIndex.project_delete_confirm}]]*/"Delete project \"<%= title %>\""; |
168 if(confirm(_.template(message, {title: project_title}))) { |
168 if(confirm(_.template(message)({title: project_title}))) { |
169 var delete_url = /*[[@{/rest/projects}]]*/"#"; |
169 var delete_url = /*[[@{/rest/projects}]]*/"#"; |
170 $.ajax(delete_url+"/"+project_id, { |
170 $.ajax(delete_url+"/"+project_id, { |
171 type: "DELETE" |
171 type: "DELETE" |
172 }).done(function(){ |
172 }).done(function(){ |
173 window.location.reload(); |
173 window.location.reload(); |
174 }); |
174 }); |
175 } |
175 } |
176 } |
176 } |
177 |
177 |
178 function createMenuHandler(menu, timeoutCallback) { |
178 function createMenuHandler(menu, timeoutCallback) { |
179 return function(e) { |
179 return function(e) { |
180 menu.toggle(); |
180 menu.toggle(); |
181 $(e.target).toggleClass("ui-icon-triangle-1-e").toggleClass("ui-icon-triangle-1-se"); |
181 $(e.target).toggleClass("ui-icon-triangle-1-e").toggleClass("ui-icon-triangle-1-se"); |
182 $('.renkan-action-button').each(function() { |
182 $('.renkan-action-button').each(function() { |
190 } |
190 } |
191 } |
191 } |
192 }); |
192 }); |
193 if(menu.is(":visible")) { |
193 if(menu.is(":visible")) { |
194 menu.data('blurtimeout', setTimeout( timeoutCallback,5000)); |
194 menu.data('blurtimeout', setTimeout( timeoutCallback,5000)); |
195 } |
195 } |
196 } |
196 } |
197 } |
197 } |
198 |
198 |
199 $(function(){ |
199 $(function(){ |
200 |
200 |
201 $(".copy-project").click(function(event) { |
201 $(".copy-project").click(function(event) { |
202 var project_id = $(event.currentTarget).data("project_id"); |
202 var project_id = $(event.currentTarget).data("project_id"); |
203 copyProject(project_id); |
203 copyProject(project_id); |
204 }); |
204 }); |
205 |
205 |
206 $(".delete-project").click(function(event) { |
206 $(".delete-project").click(function(event) { |
207 deleteProject($(event.currentTarget).data("project_id"), $(event.currentTarget).data("project_title")); |
207 deleteProject($(event.currentTarget).data("project_id"), $(event.currentTarget).data("project_title")); |
208 }); |
208 }); |
209 |
209 |
210 |
210 |
211 $("#new-renkan-form").submit(function(e) { |
211 $("#new-renkan-form").submit(function(e) { |
212 e.preventDefault(); |
212 e.preventDefault(); |
213 go2Title(); |
213 go2Title(); |
214 return false; |
214 return false; |
215 }); |
215 }); |
216 |
216 |
217 $("#import-renkan-form").submit(function(e) { |
217 $("#import-renkan-form").submit(function(e) { |
218 e.preventDefault(); |
218 e.preventDefault(); |
219 console.log("import form event :", e); |
219 console.log("import form event :", e); |
220 }); |
220 }); |
221 |
221 |
222 $('.renkan-action-button').each(function() { |
222 $('.renkan-action-button').each(function() { |
223 var projectId = $(this).data('project_id'); |
223 var projectId = $(this).data('project_id'); |
224 var menu = $('#action-menu-'+projectId).menu().position({ my: "left top", at: "right top", of: this }).hide(); |
224 var menu = $('#action-menu-'+projectId).menu().position({ my: "left top", at: "right top", of: this }).hide(); |
225 var that = this; |
225 var that = this; |
226 |
226 |
227 var timeoutCallback = function() { |
227 var timeoutCallback = function() { |
228 menu.hide(); |
228 menu.hide(); |
229 $(that).removeClass("ui-icon-triangle-1-se").addClass("ui-icon-triangle-1-e"); |
229 $(that).removeClass("ui-icon-triangle-1-se").addClass("ui-icon-triangle-1-e"); |
230 menu.removeData('blurtimeout'); |
230 menu.removeData('blurtimeout'); |
231 }; |
231 }; |
232 |
232 |
233 menu.on('menufocus', function() { |
233 menu.on('menufocus', function() { |
234 clearTimeout(menu.data('blurtimeout')); |
234 clearTimeout(menu.data('blurtimeout')); |
235 menu.removeData('blurtimeout'); |
235 menu.removeData('blurtimeout'); |
236 }); |
236 }); |
237 menu.on('menublur',function(e) { |
237 menu.on('menublur',function(e) { |
238 menu.data('blurtimeout', setTimeout( timeoutCallback,200)); |
238 menu.data('blurtimeout', setTimeout( timeoutCallback,200)); |
239 }); |
239 }); |
240 |
240 |
241 $(this).click(createMenuHandler(menu, timeoutCallback)); |
241 $(this).click(createMenuHandler(menu, timeoutCallback)); |
242 }); |
242 }); |
243 }); |
243 }); |
244 |
244 |
245 /*]]>*/ |
245 /*]]>*/ |