NIHVIVO-3213: Worked on markup/styles for adding proxies through account pages
This commit is contained in:
parent
c93cecb63c
commit
af9d8c7424
5 changed files with 82 additions and 38 deletions
|
@ -275,4 +275,44 @@ a.disable-delete {
|
|||
}
|
||||
.disabledSubmit {
|
||||
cursor: default ! important;
|
||||
}
|
||||
|
||||
/* PROXY MY ACCOUNT'S PROFILE ------> */
|
||||
#edit-myProxy {
|
||||
float: right;
|
||||
padding: 2em;
|
||||
padding-top: 1em;
|
||||
background-color: #f7f7f4;
|
||||
border-radius: 10px;
|
||||
-moz-border-radius: 10px;
|
||||
-webkit-border-radius: 10px;
|
||||
}
|
||||
#edit-myProxy h4 {
|
||||
padding-top: 0;
|
||||
}
|
||||
.photo-profile {
|
||||
border: 2px solid #DDE4E3;
|
||||
}
|
||||
.proxyInfoElement {
|
||||
padding-top: .8em;
|
||||
border-bottom: 1px dotted #E0DFDF;
|
||||
padding-bottom: 1em;
|
||||
}
|
||||
|
||||
#edit-myProxy p.search-status {
|
||||
margin-top: -10px;
|
||||
font-size: .8em;
|
||||
color: #7F8993;
|
||||
padding-left: 10px;
|
||||
}
|
||||
#edit-myProxy p.selected-editors {
|
||||
padding-top: 1.2em;
|
||||
border-top: 1px solid #E0DFDF;
|
||||
}
|
||||
#edit-myProxy a.remove-proxy {
|
||||
font-size: .9em;
|
||||
}
|
||||
#edit-myProxy .proxy-info {
|
||||
padding-left: 1em;
|
||||
vertical-align: middle;
|
||||
}
|
|
@ -41,7 +41,7 @@ function proxyInfoElement(template, uri, label, classLabel, imageUrl, removeInfo
|
|||
this.uri = uri;
|
||||
this.label = label;
|
||||
this.classLabel = classLabel;
|
||||
this.imageUrl = imageUrl;
|
||||
this.imageUrl = (imageUrl) ? imageUrl : imageUrl="../images/placeholders/person.thumbnail.jpg";
|
||||
|
||||
this.toString = function() {
|
||||
return "proxyInfoElement: " + content;
|
||||
|
@ -52,8 +52,10 @@ function proxyInfoElement(template, uri, label, classLabel, imageUrl, removeInfo
|
|||
.replace(/%label%/g, this.label)
|
||||
.replace(/%classLabel%/g, this.classLabel)
|
||||
.replace(/%imageUrl%/g, this.imageUrl);
|
||||
|
||||
|
||||
var element = $("<div name='proxyInfoElement'>" + content + "</div>");
|
||||
|
||||
var element = $("<div class='proxyInfoElement' name='proxyInfoElement'>" + content + "</div>");
|
||||
|
||||
var removeLink = $("[templatePart='remove']", element).first();
|
||||
removeLink.click(function(event) {
|
||||
|
|
7
webapp/web/js/account/proxyUtils.js
Normal file
7
webapp/web/js/account/proxyUtils.js
Normal file
|
@ -0,0 +1,7 @@
|
|||
/* $This file is distributed under the terms of the license in /doc/license.txt$ */
|
||||
|
||||
$(document).ready(function(){
|
||||
$('input[name="proxySelectorAC"]').click(function(){
|
||||
$(this).val('');
|
||||
})
|
||||
});
|
|
@ -93,6 +93,5 @@
|
|||
${stylesheets.add('<link rel="stylesheet" href="${urls.base}/css/account/account.css" />')}
|
||||
${stylesheets.add('<link rel="stylesheet" href="${urls.base}/edit/forms/css/customForm.css" />')}
|
||||
|
||||
${scripts.add('<script type="text/javascript" src="${urls.base}/js/jquery.js"></script>',
|
||||
'<script type="text/javascript" src="${urls.base}/js/jquery-ui/js/jquery-ui-1.8.9.custom.min.js"></script>',
|
||||
${scripts.add('<script type="text/javascript" src="${urls.base}/js/jquery-ui/js/jquery-ui-1.8.9.custom.min.js"></script>',
|
||||
'<script type="text/javascript" src="${urls.base}/js/account/accountListenerSetup.js"></script>')}
|
|
@ -5,46 +5,42 @@
|
|||
${stylesheets.add('<link rel="stylesheet" href="${urls.base}/edit/forms/css/autocomplete.css" />',
|
||||
'<link rel="stylesheet" href="${urls.base}/js/jquery-ui/css/smoothness/jquery-ui-1.8.9.custom.css" />')}
|
||||
|
||||
<div name="proxyProxiesPanel" style="border: solid; padding: 5px; float: right;">
|
||||
Proxy self editors
|
||||
<br><br>
|
||||
<p>Add proxy:</p>
|
||||
<p><input type="text" name="proxySelectorAC" class="acSelector" size="35"></p>
|
||||
<p><span name='proxySelectorSearchStatus' moreCharsText='type more characters' noMatchText='no match'>type here</span></p>
|
||||
<br><br>
|
||||
<p>Selected proxies:</p>
|
||||
<div id="edit-myProxy" name="proxyProxiesPanel">
|
||||
<h4>Who can edit my profile</h4>
|
||||
|
||||
<p>Add profile editor</p>
|
||||
|
||||
<p><input type="text" name="proxySelectorAC" class="acSelector" size="35" value="Select an existing last name"></p>
|
||||
<p class="search-status"><span name='proxySelectorSearchStatus' moreCharsText='type more characters' noMatchText='no match'> </span></p>
|
||||
|
||||
<#-- Magic div thst holds all of the proxy data and the template that shows how to display it. -->
|
||||
<p class="selected-editors">Selected editors:</p>
|
||||
<#-- Magic div thst holds all of the proxy data and the template that shows how to display it. -->
|
||||
<div name="proxyData">
|
||||
<#list proxies as proxy>
|
||||
<div name="data"" style="display: none">
|
||||
<p name="uri">${proxy.uri}</p>
|
||||
<p name="label">${proxy.label}</p>
|
||||
<p name="classLabel">${proxy.classLabel}</p>
|
||||
<p name="imageUrl">${proxy.imageUrl}</p>
|
||||
<#list proxies as proxy>
|
||||
<div name="data" style="display: none">
|
||||
<p name="uri">${proxy.uri}</p>
|
||||
<p name="label">${proxy.label}</p>
|
||||
<p name="classLabel">${proxy.classLabel}</p>
|
||||
<p name="imageUrl">${proxy.imageUrl}</p>
|
||||
</div>
|
||||
</#list>
|
||||
|
||||
<#--
|
||||
Each proxy will be shown using the HTML inside this div.
|
||||
It must contain at least:
|
||||
-- a link with templatePart="remove"
|
||||
-- a hidden input field with templatePart="uriField"
|
||||
-->
|
||||
<#--
|
||||
Each proxy will be shown using the HTML inside this div.
|
||||
It must contain at least:
|
||||
-- a link with templatePart="remove"
|
||||
-- a hidden input field with templatePart="uriField"
|
||||
-->
|
||||
<div name="template" style="display: none">
|
||||
<table>
|
||||
<tr>
|
||||
<td>
|
||||
<img width="90" alt="%label%" src="%imageUrl%">
|
||||
<img class="photo-profile" width="90" alt="%label%" src="%imageUrl%">
|
||||
</td>
|
||||
<td>
|
||||
<div>
|
||||
<td class="proxy-info">
|
||||
%label% | %classLabel%
|
||||
</div>
|
||||
<div>
|
||||
<a href="." templatePart="remove">remove</a>
|
||||
<input type="hidden" name="proxyUri" value="%uri%" >
|
||||
</div>
|
||||
<br /><a class='remove-proxy' href="." templatePart="remove">Remove selection</a>
|
||||
<input type="hidden" name="proxyUri" value="%uri%" >
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
@ -54,14 +50,14 @@ ${stylesheets.add('<link rel="stylesheet" href="${urls.base}/edit/forms/css/auto
|
|||
|
||||
<script type="text/javascript">
|
||||
var proxyMechanism = {
|
||||
baseUrl: '${urls.base}',
|
||||
sparqlQueryUrl: '${formUrls.sparqlQueryAjax}',
|
||||
matchingProperty: '${matchingProperty}',
|
||||
myAccountUri: '${myAccountUri}'
|
||||
baseUrl: '${urls.base}',
|
||||
sparqlQueryUrl: '${formUrls.sparqlQueryAjax}',
|
||||
matchingProperty: '${matchingProperty}',
|
||||
myAccountUri: '${myAccountUri}'
|
||||
};
|
||||
</script>
|
||||
|
||||
${scripts.add('<script type="text/javascript" src="${urls.base}/js/jquery.js"></script>',
|
||||
${scripts.add('<script type="text/javascript" src="${urls.base}/js/account/proxyUtils.js"></script>',
|
||||
'<script type="text/javascript" src="${urls.base}/js/sparqlUtils.js"></script>',
|
||||
'<script type="text/javascript" src="${urls.base}/js/account/accountProxyCommon.js"></script>',
|
||||
'<script type="text/javascript" src="${urls.base}/js/account/accountProxyProxiesPanel.js"></script>')}
|
||||
|
|
Loading…
Add table
Reference in a new issue