aboutsummaryrefslogtreecommitdiffstats
path: root/view
diff options
context:
space:
mode:
authormarijus <mario@mariovavti.com>2014-04-11 16:06:39 +0200
committermarijus <mario@mariovavti.com>2014-04-11 16:06:39 +0200
commit3197ccbf5edf51eab49623c7c21e63af7de7f127 (patch)
treea5b12e724e84e4329d42273dca3ab69f971ece16 /view
parent93a56db3913b8023582fe4824b266988aa5a96d8 (diff)
downloadvolse-hubzilla-3197ccbf5edf51eab49623c7c21e63af7de7f127.tar.gz
volse-hubzilla-3197ccbf5edf51eab49623c7c21e63af7de7f127.tar.bz2
volse-hubzilla-3197ccbf5edf51eab49623c7c21e63af7de7f127.zip
bootstrapify aclselector
Diffstat (limited to 'view')
-rw-r--r--view/js/acl.js30
-rw-r--r--view/theme/redbasic/css/style.css122
-rwxr-xr-xview/tpl/acl_selector.tpl46
-rw-r--r--view/tpl/chatroom_new.tpl5
-rwxr-xr-xview/tpl/jot-header.tpl6
-rwxr-xr-xview/tpl/jot.tpl12
-rw-r--r--view/tpl/mitemedit.tpl13
-rwxr-xr-xview/tpl/photo_view.tpl10
-rwxr-xr-xview/tpl/photos_upload.tpl9
-rwxr-xr-xview/tpl/settings.tpl15
10 files changed, 112 insertions, 156 deletions
diff --git a/view/js/acl.js b/view/js/acl.js
index 308e65131..28e47011f 100644
--- a/view/js/acl.js
+++ b/view/js/acl.js
@@ -17,7 +17,7 @@ function ACL(backend_url, preset){
that.item_tpl = unescape($(".acl-list-item[rel=acl-template]").html());
that.showall = $("#acl-showall");
- if (preset.length==0) that.showall.addClass("selected");
+ if (preset.length==0) that.showall.removeClass("btn-default").addClass("btn-warning");
/*events*/
@@ -70,10 +70,10 @@ ACL.prototype.on_showall = function(event){
event.preventDefault()
event.stopPropagation();
- if (that.showall.hasClass("selected")){
+ if (that.showall.hasClass("btn-warning")){
return false;
}
- that.showall.addClass("selected");
+ that.showall.removeClass("btn-default").addClass("btn-warning");
that.allow_cid = [];
that.allow_gid = [];
@@ -164,7 +164,7 @@ ACL.prototype.set_deny = function(itemid){
ACL.prototype.update_view = function(){
if (that.allow_gid.length==0 && that.allow_cid.length==0 &&
that.deny_gid.length==0 && that.deny_cid.length==0){
- that.showall.addClass("selected");
+ that.showall.removeClass("btn-default").addClass("btn-warning");
/* jot acl */
$('#jot-perms-icon').removeClass('icon-lock').addClass('icon-unlock');
$('#jot-public').show();
@@ -174,7 +174,7 @@ ACL.prototype.update_view = function(){
}
} else {
- that.showall.removeClass("selected");
+ that.showall.removeClass("btn-warning").addClass("btn-default");
/* jot acl */
$('#jot-perms-icon').removeClass('icon-unlock').addClass('icon-lock');
$('#jot-public').hide();
@@ -190,20 +190,20 @@ ACL.prototype.update_view = function(){
type = itemid[0];
id = itemid.substr(1);
- btshow = $(this).children(".acl-button-show").removeClass("selected");
- bthide = $(this).children(".acl-button-hide").removeClass("selected");
+ btshow = $(this).children(".acl-button-show").removeClass("btn-success").addClass("btn-default");
+ bthide = $(this).children(".acl-button-hide").removeClass("btn-danger").addClass("btn-default");
switch(type){
case "g":
var uclass = "";
if (that.allow_gid.indexOf(id)>=0){
- btshow.addClass("selected");
- bthide.removeClass("selected");
+ btshow.removeClass("btn-default").addClass("btn-success");
+ bthide.removeClass("btn-danger").addClass("btn-default");
uclass="groupshow";
}
if (that.deny_gid.indexOf(id)>=0){
- btshow.removeClass("selected");
- bthide.addClass("selected");
+ btshow.removeClass("btn-success").addClass("btn-default");
+ bthide.removeClass("btn-default").addClass("btn-danger");
uclass="grouphide";
}
@@ -223,12 +223,12 @@ ACL.prototype.update_view = function(){
break;
case "c":
if (that.allow_cid.indexOf(id)>=0){
- btshow.addClass("selected");
- bthide.removeClass("selected");
+ btshow.removeClass("btn-default").addClass("btn-success");
+ bthide.removeClass("btn-danger").addClass("btn-default");
}
if (that.deny_cid.indexOf(id)>=0){
- btshow.removeClass("selected");
- bthide.addClass("selected");
+ btshow.removeClass("btn-success").addClass("btn-default");
+ bthide.removeClass("btn-default").addClass("btn-danger");
}
}
diff --git a/view/theme/redbasic/css/style.css b/view/theme/redbasic/css/style.css
index 2b4314fdb..2138f05ca 100644
--- a/view/theme/redbasic/css/style.css
+++ b/view/theme/redbasic/css/style.css
@@ -1521,7 +1521,7 @@ header {
right: 43%;
margin: 0px;
padding: 0px;
- z-index: 1400;
+ z-index: 1040;
color: #fff;
}
@@ -1552,101 +1552,73 @@ header {
clear: both;
}
-#acl-wrapper {
- width: 690px;
- float:left;
-}
-
#acl-search {
- float:right;
- background: #ffffff url("../../../../images/search_18.png") no-repeat right center;
- padding-right:20px;
+ margin-top: 20px;
+ padding: 8px;
+ border: 1px solid #ccc;
+ width: 100%;
}
-#acl-showall {
- float: left;
- display: block;
- width: auto;
- height: 26px;
- background-color: #cccccc;
- background-image: url("../../../../images/show_all_off.png");
- background-position: 7px 7px;
- background-repeat: no-repeat;
- padding: 7px 5px 0px 30px;
- -webkit-border-radius: $radiuspx;
- -moz-border-radius: $radiuspx;
- border-radius: $radiuspx;
- color: #999999;
+
+#acl-search::-webkit-input-placeholder {
+ font-family: FontAwesome;
}
-#acl-showall.selected {
- color: #000000;
- background-color: #ff9900;
- background-image: url("../../../../images/show_all_on.png");
+
+#acl-search::-moz-placeholder {
+ font-family: FontAwesome;
}
#acl-list {
- height: 210px;
+ display: block;
border: 1px solid #cccccc;
- clear: both;
- margin-top: 30px;
overflow: auto;
+ clear: both;
+ min-height: 62px;
+ margin-top: 20px;
+ padding: 10px 10px 0px 0px;
+ -webkit-border-radius: $radiuspx ;
+ -moz-border-radius: $radiuspx;
+ border-radius: $radiuspx;
}
-#acl-list-content {
-
-}
+
.acl-list-item {
- display: block;
- width: 150px;
- height: 30px;
+ width: calc(50% - 10px);
border: 1px solid #cccccc;
- margin: 5px;
+ margin: 0px 0px 10px 10px;
+ padding: 5px;
float: left;
+ -webkit-border-radius: $radiuspx ;
+ -moz-border-radius: $radiuspx;
+ border-radius: $radiuspx;
}
+
.acl-list-item img{
- width:22px;
- height: 22px;
+ width: 40px;
+ height: 40px;
float: left;
- margin: 4px;
+ margin-right: 5px;
+ -webkit-border-radius: $radiuspx ;
+ -moz-border-radius: $radiuspx;
+ border-radius: $radiuspx;
}
+
.acl-list-item.taggable {
background-color: #ddddff;
}
-.acl-list-item p { height: 12px; font-size: 10px; margin: 0px; overflow: hidden;}
-.acl-list-item a {
- font-size: 8px;
- display: block;
- width: 40px;
- height: 10px;
- float: left;
- color: #999999;
- background-color: #cccccc;
- background-position: 3px 3px;
- background-repeat: no-repeat;
- margin-right: 5px;
- -webkit-border-radius: 2px ;
- -moz-border-radius: 2px;
- border-radius: 2px;
- padding-left: 15px;
-}
-#acl-wrapper a:hover {
- text-decoration: none;
- color:#000000;
+.acl-list-item p {
+ font-size: $font_size;
+ margin: 0px;
+ overflow: ellipsis;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
}
-.acl-button-show { background-image: url("../../../../images/show_off.png"); }
-.acl-button-hide { background-image: url("../../../../images/hide_off.png"); }
-.acl-button-show.selected {
- color: #000000;
- background-color: #9ade00;
- background-image: url("../../../../images/show_on.png");
-}
-.acl-button-hide.selected {
- color: #000000;
- background-color: #ff4141;
- background-image: url("../../../../images/hide_on.png");
+.acl-button-show,
+.acl-button-hide {
+ float: right;
+ margin-left: 5px;
}
-.acl-list-item.groupshow { border-color: #9ade00; }
-.acl-list-item.grouphide { border-color: #ff4141; }
.contact-block-content {
margin-top: 8px;
@@ -2284,4 +2256,8 @@ blockquote {
width: 32px !important;
height: 32px !important;
}
+
+ .acl-list-item {
+ width: calc(100% - 10px);
+ }
}
diff --git a/view/tpl/acl_selector.tpl b/view/tpl/acl_selector.tpl
index d869562e2..c98350843 100755
--- a/view/tpl/acl_selector.tpl
+++ b/view/tpl/acl_selector.tpl
@@ -1,18 +1,34 @@
-<div id="acl-wrapper">
- <input id="acl-search">
- <a href="#" id="acl-showall">{{$showall}}</a>
- <div id="acl-list">
- <div id="acl-list-content">
- </div>
- </div>
- <span id="acl-fields"></span>
-</div>
-
-<div class="acl-list-item" rel="acl-template" style="display:none">
- <img src="{0}"><p>{1}</p>
- <a href="#" class='acl-button-show'></a>
- <a href="#" class='acl-button-hide'></a>
-</div>
+<div class="modal" id="aclModal">
+ <div class="modal-dialog">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+ <h4 class="modal-title">{{$aclModalTitle}}</h4>
+ </div>
+ <div class="modal-body">
+ <div id="acl-wrapper">
+ <button id="acl-showall" class="btn btn-block btn-default"><i class="icon-globe"></i> {{$showall}}</button>
+ <input type="text" id="acl-search" placeholder="&#xf002;">
+ <div id="acl-list">
+ <div id="acl-list-content"></div>
+ </div>
+ <span id="acl-fields"></span>
+ </div>
+ <div class="acl-list-item" rel="acl-template" style="display:none">
+ <img src="{0}"><p>{1}</p>
+ <button class="acl-button-hide btn btn-xs btn-default"><i class="icon-remove"></i> {{$hide}}</button>
+ <button class="acl-button-show btn btn-xs btn-default"><i class="icon-ok"></i> {{$show}}</button>
+ </div>
+ {{if $jotnets}}
+ {{$jotnets}}
+ {{/if}}
+ </div>
+ <div class="modal-footer">
+ <button type="button" class="btn btn-default" data-dismiss="modal">{{$aclModalDismiss}}</button>
+ </div>
+ </div><!-- /.modal-content -->
+ </div><!-- /.modal-dialog -->
+</div><!-- /.modal -->
<script>
$(document).ready(function() {
diff --git a/view/tpl/chatroom_new.tpl b/view/tpl/chatroom_new.tpl
index 86eadb132..287f95cc0 100644
--- a/view/tpl/chatroom_new.tpl
+++ b/view/tpl/chatroom_new.tpl
@@ -2,10 +2,11 @@
<form action="chat" method="post" >
{{include file="field_input.tpl" field=$name}}
-<br />
-<br />
+<button class="btn btn-default btn-xs" data-toggle="modal" data-target="#aclModal" onclick="return false;">{{$permissions}}</button>
{{$acl}}
<div class="clear"></div>
+<br />
+<br />
<input type="submit" name="submit" value="{{$submit}}" />
</form>
diff --git a/view/tpl/jot-header.tpl b/view/tpl/jot-header.tpl
index 25a7912ad..27b081b57 100755
--- a/view/tpl/jot-header.tpl
+++ b/view/tpl/jot-header.tpl
@@ -86,11 +86,7 @@ function initEditor(cb){
});
editor = true;
- // setup acl popup
- $("a#jot-perms-icon").colorbox({
- 'inline' : true,
- 'transition' : 'elastic'
- });
+
} else {
if (typeof cb!="undefined") cb();
}
diff --git a/view/tpl/jot.tpl b/view/tpl/jot.tpl
index e1b8dc906..c4fdba0f5 100755
--- a/view/tpl/jot.tpl
+++ b/view/tpl/jot.tpl
@@ -11,6 +11,7 @@
<input type="hidden" name="post_id" value="{{$post_id}}" />
<input type="hidden" name="webpage" value="{{$webpage}}" />
<input type="hidden" name="preview" id="jot-preview" value="0" />
+ {{if $showacl}}{{$acl}}{{/if}}
{{$mimeselect}}
{{$layoutselect}}
{{if $id_select}}
@@ -75,7 +76,9 @@
</div>
<div id="profile-jot-submit-right" class="btn-group pull-right">
{{if $showacl}}
- <a href="#profile-jot-acl-wrapper" class="btn btn-default btn-sm jot-icons icon-{{$lockstate}}" id="jot-perms-icon" title="{{$permset}}"></a>{{$bang}}
+ <button class="btn btn-default btn-sm" data-toggle="modal" data-target="#aclModal" title="{{$permset}}" onclick="return false;">
+ <i id="jot-perms-icon" class="icon-{{$lockstate}} jot-icons">{{$bang}}</i>
+ </button>
{{/if}}
{{if $preview}}
<button class="btn btn-default btn-sm" onclick="preview_post();return false;" title="{{$preview}}">
@@ -88,13 +91,6 @@
<div id="profile-jot-plugin-wrapper">
{{$jotplugins}}
</div>
- <div style="display: none;">
- <div id="profile-jot-acl-wrapper" style="width:auto;height:auto;overflow:auto;">
- {{$acl}}
- <hr style="clear:both"/>
- {{$jotnets}}
- </div>
- </div>
</div>
<div id="profile-jot-text-loading"></div>
<div id="profile-jot-end" class="clear"></div>
diff --git a/view/tpl/mitemedit.tpl b/view/tpl/mitemedit.tpl
index 8f13f80c9..482005e44 100644
--- a/view/tpl/mitemedit.tpl
+++ b/view/tpl/mitemedit.tpl
@@ -16,18 +16,9 @@
{{include file="field_checkbox.tpl" field=$newwin}}
<div id="settings-default-perms" class="settings-default-perms" >
- <a href="#profile-jot-acl-wrapper" id="settings-default-perms-menu" >{{$permissions}} {{$permdesc}}</a>
+ <button class="btn btn-default btn-xs" data-toggle="modal" data-target="#aclModal" onclick="return false;">{{$permissions}}</button>
+ {{$aclselect}}
<div id="settings-default-perms-menu-end"></div>
-
- <div id="settings-default-perms-select" style="display: none; margin-bottom: 20px" >
-
- <div style="display: none;">
- <div id="profile-jot-acl-wrapper" style="width:auto;height:auto;overflow:auto;">
- {{$aclselect}}
- </div>
- </div>
-
- </div>
</div>
<br/>
<div id="settings-default-perms-end"></div>
diff --git a/view/tpl/photo_view.tpl b/view/tpl/photo_view.tpl
index 067073b23..01f135522 100755
--- a/view/tpl/photo_view.tpl
+++ b/view/tpl/photo_view.tpl
@@ -54,15 +54,9 @@
<div id="settings-default-perms" class="settings-default-perms" >
<span id="jot-perms-icon" class="{{$edit.lockstate}}" ></span>
- <a href="#profile-jot-acl-wrapper" id="settings-default-perms-menu" >{{$edit.permissions}}</a>
+ <button class="btn btn-default btn-xs" data-toggle="modal" data-target="#aclModal" onclick="return false;">{{$edit.permissions}}</button>
+ {{$edit.aclselect}}
<div id="settings-default-perms-menu-end"></div>
- <div id="settings-default-perms-select" style="display: none; margin-bottom: 20px" >
- <div style="display: none;">
- <div id="profile-jot-acl-wrapper" style="width:auto;height:auto;overflow:auto;">
- {{$edit.aclselect}}
- </div>
- </div>
- </div>
</div>
<br/>
<div id="settings-default-perms-end"></div>
diff --git a/view/tpl/photos_upload.tpl b/view/tpl/photos_upload.tpl
index 1ab80d346..62591c648 100755
--- a/view/tpl/photos_upload.tpl
+++ b/view/tpl/photos_upload.tpl
@@ -25,16 +25,11 @@
<div id="photos-upload-perms" class="photos-upload-perms" >
<span id="jot-perms-icon" class="icon-{{$lockstate}}" ></span>
- <a href="#photos-upload-permissions-wrapper" id="photos-upload-perms-menu" class="button" />{{$permissions}}</a>
+ <button class="btn btn-default btn-xs" data-toggle="modal" data-target="#aclModal" onclick="return false;">{{$permissions}}</button>
</div>
+ {{$aclselect}}
<div id="photos-upload-perms-end"></div>
- <div style="display: none;">
- <div id="photos-upload-permissions-wrapper">
- {{$aclselect}}
- </div>
- </div>
-
<div id="photos-upload-spacer"></div>
{{$uploader}}
diff --git a/view/tpl/settings.tpl b/view/tpl/settings.tpl
index acea86015..accd8f106 100755
--- a/view/tpl/settings.tpl
+++ b/view/tpl/settings.tpl
@@ -34,7 +34,7 @@
</ul>
-<button type="button" class="btn btn-xs btn-warning" data-toggle="collapse" data-target="#settings-permissions-wrapper">{{$lbl_p2macro}}</button>
+<button type="button" class="btn btn-xs btn-default" data-toggle="collapse" data-target="#settings-permissions-wrapper">{{$lbl_p2macro}}</button>
@@ -73,18 +73,9 @@
</div>
<div id="settings-default-perms" class="settings-default-perms" >
- <a href="#profile-jot-acl-wrapper" id="settings-default-perms-menu" >{{$permissions}} {{$permdesc}}</a>
+ <button class="btn btn-default btn-xs" data-toggle="modal" data-target="#aclModal" onclick="return false;">{{$permissions}}</button>
+ {{$aclselect}}
<div id="settings-default-perms-menu-end"></div>
-
- <div id="settings-default-perms-select" style="display: none; margin-bottom: 20px" >
-
- <div style="display: none;">
- <div id="profile-jot-acl-wrapper" style="width:auto;height:auto;overflow:auto;">
- {{$aclselect}}
- </div>
- </div>
-
- </div>
</div>
<br/>
<div id="settings-default-perms-end"></div>