client/templates/nodeeditor.html
changeset 434 0d5998b32a7c
parent 420 22393cbf4467
child 441 4732f078d0fe
equal deleted inserted replaced
433:e457ec945e50 434:0d5998b32a7c
     1 <h2>
     1 <h2>
     2 	<span class="Rk-CloseX">&times;</span><%-renkan.translate("Edit Node")%></span>
     2     <span class="Rk-CloseX">&times;</span><%-renkan.translate("Edit Node")%></span>
     3 </h2>
     3 </h2>
     4 <p>
     4 <p>
     5 	<label><%-renkan.translate("Title:")%></label>
     5     <label><%-renkan.translate("Title:")%></label>
     6 	<input class="Rk-Edit-Title" type="text" value="<%-node.title%>" />
     6     <input class="Rk-Edit-Title" type="text" value="<%-node.title%>" />
     7 </p>
     7 </p>
     8 <% if (options.show_node_editor_uri) { %>
     8 <% if (options.show_node_editor_uri) { %>
     9 	<p>
     9     <p>
    10 		<label><%-renkan.translate("URI:")%></label>
    10         <label><%-renkan.translate("URI:")%></label>
    11 		<input class="Rk-Edit-URI" type="text" value="<%-node.uri%>" />
    11         <input class="Rk-Edit-URI" type="text" value="<%-node.uri%>" />
    12 		<a class="Rk-Edit-Goto" href="<%-node.uri%>" target="_blank"></a>
    12         <a class="Rk-Edit-Goto" href="<%-node.uri%>" target="_blank"></a>
    13 	</p>
    13     </p>
    14 <% } %> <% if (options.show_node_editor_description) { %>
    14 <% } %> <% if (options.show_node_editor_description) { %>
    15 	<p>
    15     <p>
    16 		<label><%-renkan.translate("Description:")%></label>
    16         <label><%-renkan.translate("Description:")%></label>
    17 		<textarea class="Rk-Edit-Description"><%-node.description%></textarea>
    17         <textarea class="Rk-Edit-Description"><%-node.description%></textarea>
    18 	</p>
    18     </p>
    19 <% } %> <% if (options.show_node_editor_size) { %>
    19 <% } %> <% if (options.show_node_editor_size) { %>
    20 	<p>
    20     <p>
    21 		<span class="Rk-Editor-Label"><%-renkan.translate("Size:")%></span>
    21         <span class="Rk-Editor-Label"><%-renkan.translate("Size:")%></span>
    22 		<a href="#" class="Rk-Edit-Size-Down">-</a>
    22         <a href="#" class="Rk-Edit-Size-Down">-</a>
    23 		<span class="Rk-Edit-Size-Value"><%-node.size%></span>
    23         <span class="Rk-Edit-Size-Value"><%-node.size%></span>
    24 		<a href="#" class="Rk-Edit-Size-Up">+</a>
    24         <a href="#" class="Rk-Edit-Size-Up">+</a>
    25 	</p>
    25     </p>
    26 <% } %> <% if (options.show_node_editor_color) { %>
    26 <% } %> <% if (options.show_node_editor_color) { %>
    27 	<div class="Rk-Editor-p">
    27     <div class="Rk-Editor-p">
    28 		<span class="Rk-Editor-Label">
    28         <span class="Rk-Editor-Label">
    29 		<%-renkan.translate("Node color:")%></span>
    29         <%-renkan.translate("Node color:")%></span>
    30 		<div class="Rk-Edit-ColorPicker-Wrapper">
    30         <div class="Rk-Edit-ColorPicker-Wrapper">
    31 			<span class="Rk-Edit-Color" style="background: <%-node.color%>;">
    31             <span class="Rk-Edit-Color" style="background: <%-node.color%>;">
    32 				<span class="Rk-Edit-ColorTip"></span>
    32                 <span class="Rk-Edit-ColorTip"></span>
    33 			</span>
    33             </span>
    34 			<%= renkan.colorPicker %>
    34             <%= renkan.colorPicker %>
    35 			<span class="Rk-Edit-ColorPicker-Text"><%- renkan.translate("Choose color") %></span>
    35             <span class="Rk-Edit-ColorPicker-Text"><%- renkan.translate("Choose color") %></span>
    36 		</div>
    36         </div>
    37 	</div>
    37     </div>
    38 <% } %> <% if (options.show_node_editor_image) { %>
    38 <% } %> <% if (options.show_node_editor_image) { %>
    39 	<div class="Rk-Edit-ImgWrap">
    39     <div class="Rk-Edit-ImgWrap">
    40 		<div class="Rk-Edit-ImgPreview">
    40         <div class="Rk-Edit-ImgPreview">
    41 			<img src="<%-node.image || node.image_placeholder%>" />
    41             <img src="<%-node.image || node.image_placeholder%>" />
    42 			<% if (node.clip_path) { %>
    42             <% if (node.clip_path) { %>
    43 				<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewbox="0 0 1 1" preserveAspectRatio="none">
    43                 <svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewbox="0 0 1 1" preserveAspectRatio="none">
    44 					<path style="stroke-width: .02; stroke:red; fill-opacity:.3; fill:red;" d="<%- node.clip_path %>" />
    44                     <path style="stroke-width: .02; stroke:red; fill-opacity:.3; fill:red;" d="<%- node.clip_path %>" />
    45 				</svg>
    45                 </svg>
    46 			<% }%>
    46             <% }%>
    47 		</div>
    47         </div>
    48 	</div>
    48     </div>
    49 	<p>
    49     <p>
    50 		<label><%-renkan.translate("Image URL:")%></label>
    50         <label><%-renkan.translate("Image URL:")%></label>
    51 		<div>
    51         <div>
    52 			<a class="Rk-Edit-Image-Del" href="#"></a>
    52             <a class="Rk-Edit-Image-Del" href="#"></a>
    53 			<input class="Rk-Edit-Image" type="text" value='<%-node.image%>' />
    53             <input class="Rk-Edit-Image" type="text" value='<%-node.image%>' />
    54 		</div>
    54         </div>
    55 	</p>
    55     </p>
    56 <% if (options.allow_image_upload) { %>
    56 <% if (options.allow_image_upload) { %>
    57 	<p>
    57     <p>
    58 		<label><%-renkan.translate("Choose Image File:")%></label>
    58         <label><%-renkan.translate("Choose Image File:")%></label>
    59 		<input class="Rk-Edit-Image-File" type="file" accept="image/*" />
    59         <input class="Rk-Edit-Image-File" type="file" accept="image/*" />
    60 	</p>
    60     </p>
    61 <% }%><% } %> <% if (options.show_node_editor_creator && node.has_creator) { %>
    61 <% }%><% } %> <% if (options.show_node_editor_creator && node.has_creator) { %>
    62 	<p>
    62     <p>
    63 		<span class="Rk-Editor-Label"><%-renkan.translate("Created by:")%></span>
    63         <span class="Rk-Editor-Label"><%-renkan.translate("Created by:")%></span>
    64 		<span class="Rk-UserColor" style="background: <%-node.created_by_color%>;"></span>
    64         <span class="Rk-UserColor" style="background: <%-node.created_by_color%>;"></span>
    65 		<%- shortenText(node.created_by_title, 25) %>
    65         <%- shortenText(node.created_by_title, 25) %>
    66 	</p>
    66     </p>
    67 <% } %> <% if (options.change_shapes) { %>
    67 <% } %> <% if (options.change_shapes) { %>
    68 	<p>
    68     <p>
    69 		<label><%-renkan.translate("Shapes available")%>:</label>
    69         <label><%-renkan.translate("Shapes available")%>:</label>
    70 		<select class="Rk-Edit-Shape">
    70         <select class="Rk-Edit-Shape">
    71 			<option class="Rk-Edit-Vocabulary-Property" value="circle"<% if (node.shape === "circle") { %> selected<% } %>>
    71             <option class="Rk-Edit-Vocabulary-Property" value="circle"<% if (node.shape === "circle") { %> selected<% } %>>
    72 				<%- renkan.translate("Circle") %>
    72                 <%- renkan.translate("Circle") %>
    73 			</option>
    73             </option>
    74 			<option class="Rk-Edit-Vocabulary-Property" value="rectangle"<% if (node.shape === "rectangle") { %> selected<% } %>>
    74             <option class="Rk-Edit-Vocabulary-Property" value="rectangle"<% if (node.shape === "rectangle") { %> selected<% } %>>
    75 				<%- renkan.translate("Square") %>
    75                 <%- renkan.translate("Square") %>
    76 			</option>
    76             </option>
    77 			<option class="Rk-Edit-Vocabulary-Property" value="diamond"<% if (node.shape === "diamond") { %> selected<% } %>>
    77             <option class="Rk-Edit-Vocabulary-Property" value="diamond"<% if (node.shape === "diamond") { %> selected<% } %>>
    78 				<%- renkan.translate("Diamond") %>
    78                 <%- renkan.translate("Diamond") %>
    79 			</option>
    79             </option>
    80 			<option class="Rk-Edit-Vocabulary-Property" value="polygon"<% if (node.shape === "polygon") { %> selected<% } %>>
    80             <option class="Rk-Edit-Vocabulary-Property" value="polygon"<% if (node.shape === "polygon") { %> selected<% } %>>
    81 				<%- renkan.translate("Hexagone") %>
    81                 <%- renkan.translate("Hexagone") %>
    82 			</option>
    82             </option>
    83 			<option class="Rk-Edit-Vocabulary-Property" value="ellipse"<% if (node.shape === "ellipse") { %> selected<% } %>>
    83             <option class="Rk-Edit-Vocabulary-Property" value="ellipse"<% if (node.shape === "ellipse") { %> selected<% } %>>
    84 				<%- renkan.translate("Ellipse") %>
    84                 <%- renkan.translate("Ellipse") %>
    85 			</option>
    85             </option>
    86 			<option class="Rk-Edit-Vocabulary-Property" value="star"<% if (node.shape === "star") { %> selected<% } %>>
    86             <option class="Rk-Edit-Vocabulary-Property" value="star"<% if (node.shape === "star") { %> selected<% } %>>
    87 				<%- renkan.translate("Star") %>
    87                 <%- renkan.translate("Star") %>
    88 			</option>
    88             </option>
    89 		</select>
    89         </select>
    90 	</p>
    90     </p>
    91 <% } %>
    91 <% } %>