parent
2f4b93db59
commit
50baac2cb7
|
@ -119,10 +119,11 @@ var galleryAPI = function(){
|
|||
this.loadImages = function(id){
|
||||
//<iframe id="upload_panel" width="100%" scrolling="no" height="300" frameborder="0" src="upload_panel.html?id=16">
|
||||
|
||||
var headarea = '<a class="bt-back btn btn-primary pull-right" title="<%= I18n.t("gallery.back_to_albums") %>" href="orbit_gallery"><i class="icon-arrow-left icon-white"></i><%= I18n.t("gallery.back_to_albums") %></a> ';
|
||||
var headarea = '<a class="bt-back btn pull-left" title="<%= I18n.t("gallery.back_to_albums") %>" href="orbit_gallery"><i class="icon-arrow-left icon-black"></i><%= I18n.t("gallery.back_to_albums") %></a> ';
|
||||
headarea+='<a class="bt-add btn btn-primary pull-right" title="<%= I18n.t("gallery.add_images") %>" href="images" onclick="return false;"><i class="icon-plus icon-white"></i><%= I18n.t("gallery.add_images") %></a> ';
|
||||
headarea+='<a class="bt-del btn btn-primary pull-right" title="<%= I18n.t("gallery.del_album") %>" href="delete" onclick="return false;"><i class="icon-trash icon-white"></i><%= I18n.t("gallery.del_album") %></a> ';
|
||||
headarea+='<a class="bt-edit btn btn-primary pull-right" title="<%= I18n.t("gallery.edit") %>" href="orbit_gallery?edit='+id+'" ><i class="icon-pencil icon-white"></i><%= I18n.t("gallery.edit") %></a>';
|
||||
headarea+='<a class="bt-tag btn btn-primary pull-right" title="<%= I18n.t("gallery.album_tag") %>" href="" ><i class="icon-tag icon-white"></i><%= I18n.t("gallery.album_tag") %></a>';
|
||||
headarea = $(headarea);
|
||||
var uploadpanel = $('<div id="upload_panel_holder"><div class="rgfn"><a class="bt-cls btn btn-primary pull-right" title="Close" href="" onclick="return false;"><i class="icon-remove icon-white"></i>Close Panel</a></div></div>');
|
||||
var frame = $('<iframe id="upload_panel" width="100%" scrolling="no" height="200" frameborder="0" src="upload_panel"></iframe>');
|
||||
|
@ -164,6 +165,13 @@ var galleryAPI = function(){
|
|||
})
|
||||
g.albumArea.find("#imgholder").append($addsign);
|
||||
|
||||
|
||||
// tag
|
||||
$('.bt-tag').click(function(){
|
||||
$('#tag_panel').animate({'right':0});
|
||||
return false;
|
||||
});
|
||||
|
||||
}
|
||||
this.loadTheater = function(id){
|
||||
var imageArray;
|
||||
|
@ -311,7 +319,7 @@ var galleryAPI = function(){
|
|||
})
|
||||
}
|
||||
|
||||
var head = $('<a href="" class="bt-back btn btn-primary pull-right" title="<%= I18n.t("gallery.back_to_photos") %>"><i class="icon-arrow-left icon-white"></i><%= I18n.t("gallery.back_to_photos") %></a></div>');
|
||||
var head = $('<a href="" class="bt-back btn pull-left" title="<%= I18n.t("gallery.back_to_photos") %>"><i class="icon-arrow-left icon-black"></i><%= I18n.t("gallery.back_to_photos") %></a></div>');
|
||||
var head1 = $('<a class="bt-edit btn btn-primary pull-right" title="<%= I18n.t("gallery.edit") %>" href="" ><i class="icon-pencil icon-white"></i><%= I18n.t("gallery.edit") %></a>');
|
||||
g.albumArea.find("#imgholder").load("theater?pic="+id,function(theater,response,xhr){
|
||||
if(xhr.status == 404){
|
||||
|
@ -389,7 +397,7 @@ var galleryAPI = function(){
|
|||
}
|
||||
$("#filter").remove();
|
||||
g.albumArea.css("margin-top","");
|
||||
var head ='<a href="orbit_gallery?album='+id+'" class="bt-back btn btn-primary pull-right" title="<%= I18n.t("gallery.back_to_photos") %>"><i class="icon-arrow-left icon-white"></i><%= I18n.t("gallery.back_to_photos") %></a></div>';
|
||||
var head ='<a href="orbit_gallery?album='+id+'" class="bt-back btn pull-left" title="<%= I18n.t("gallery.back_to_photos") %>"><i class="icon-arrow-left icon-black"></i><%= I18n.t("gallery.back_to_photos") %></a></div>';
|
||||
head+='<a class="bt-del bt-delete btn btn-primary pull-right" onclick="return false;" style="display:none;" title="<%= I18n.t("gallery.delete_selected") %>" href=""><i class="icon-trash icon-white"></i><%= I18n.t("gallery.delete_selected") %></a>';
|
||||
head+='<a class="bt-save btn btn-primary pull-right" onclick="return false;" style="display:none;" title="Save" href=""><i class="icon-ok icon-white"></i>Save</a>';
|
||||
g.albumArea.find(".rghead .rgfn").html(head);
|
||||
|
|
|
@ -383,7 +383,7 @@ body.fullscreen, .fullscreen #container, .fullscreen #container2, .fullscreen #m
|
|||
text-indent: -999px;
|
||||
background-position: -358px 0;
|
||||
}
|
||||
|
||||
/*
|
||||
.bt-add { background-position: 0 -106px; }
|
||||
.bt-add:hover { background-position: 0 -296px; }
|
||||
.bt-add:active { background-position: 0 -486px; }
|
||||
|
@ -399,6 +399,7 @@ body.fullscreen, .fullscreen #container, .fullscreen #container2, .fullscreen #m
|
|||
.bt-save, .bt-finish { background-position: 0 -220px; }
|
||||
.bt-save:hover, .bt-finish:hover { background-position: 0 -410px; }
|
||||
.bt-save:active, .bt-finish:active { background-position: 0 -600px; }
|
||||
*/
|
||||
.bt-finish { display: block; float: right; clear: both; }
|
||||
.bt-addnew {
|
||||
margin: 0 auto;
|
||||
|
@ -422,6 +423,7 @@ body.fullscreen, .fullscreen #container, .fullscreen #container2, .fullscreen #m
|
|||
right: 6px;
|
||||
top: 6px;
|
||||
}
|
||||
/*
|
||||
.bt-close:hover { background-position: -436px 0; }
|
||||
.bt-close:active { background-position: -514px 0; }
|
||||
.bt-cls { background-position: 0 -790px; }
|
||||
|
@ -441,6 +443,7 @@ body.fullscreen, .fullscreen #container, .fullscreen #container2, .fullscreen #m
|
|||
.bt-languages { background-position: -398px -72px; width: 32px; position: relative; }
|
||||
.bt-languages:hover { background-position: -438px -72px; }
|
||||
.bt-languages:active { background-position: -477px -72px; }
|
||||
*/
|
||||
|
||||
.inputui {
|
||||
background: transparent 0 0 url(../../../assets/gallery/inputui.png) no-repeat;
|
||||
|
@ -486,6 +489,80 @@ body.fullscreen, .fullscreen #container, .fullscreen #container2, .fullscreen #m
|
|||
background-color: #ddd;
|
||||
}
|
||||
|
||||
/* tag panel */
|
||||
#tag_panel {
|
||||
position: fixed;
|
||||
right: -200px;
|
||||
top: 31px;
|
||||
width: 200px;
|
||||
min-height: 100px;
|
||||
border-left: solid 1px #ccc;
|
||||
background-color: #fff;
|
||||
}
|
||||
#tag_panel .scrollbar {
|
||||
right: 0px;
|
||||
top: 0px;
|
||||
width: 9px;
|
||||
}
|
||||
#tag_panel .viewport {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.tag_list {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.tag_list li {
|
||||
padding: 4px 6px;
|
||||
border-top: solid 1px #f6f6f6;
|
||||
}
|
||||
.tag_list li:first-child {
|
||||
border: 0;
|
||||
}
|
||||
.tag_list li:hover {
|
||||
background-color: #08c;
|
||||
}
|
||||
.tag_list li:hover label {
|
||||
color: #fff;
|
||||
}
|
||||
.tag_list input[type=checkbox], .tag_list label {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
text-transform: capitalize;
|
||||
margin: 0;
|
||||
}
|
||||
.tag_list label {
|
||||
padding: 0 6px;
|
||||
}
|
||||
.tag_search {
|
||||
position: absolute;
|
||||
left: -1px;
|
||||
bottom: -32px;
|
||||
width: 200px;
|
||||
height: 32px;
|
||||
background-color: #f5f5f5;
|
||||
border-left: solid 1px #ccc;
|
||||
border-top: solid 1px #ddd;
|
||||
}
|
||||
.tag_search input[type=text] {
|
||||
box-shadow: none;
|
||||
width: 170px;
|
||||
height: 25px;
|
||||
line-height: 25px;
|
||||
padding: 3px 6px 3px 24px;
|
||||
border-top: solid 1px #fff;
|
||||
}
|
||||
.tag_search input[type=text]:focus {
|
||||
background-color: #fff;
|
||||
}
|
||||
.tag_search .icon-search {
|
||||
position: absolute;
|
||||
left: 6px;
|
||||
top: 50%;
|
||||
margin-top: -7px;
|
||||
}
|
||||
|
||||
|
||||
/* orbit style implementation */
|
||||
#orbit_gallery {
|
||||
margin-bottom: 30px;
|
||||
|
|
|
@ -61,11 +61,68 @@
|
|||
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
<div class="rgbody">
|
||||
<div id="imgholder">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<!-- tag part -->
|
||||
<div id="tag_panel" class="my_scroll">
|
||||
<div class="scrollbar">
|
||||
<div class="track">
|
||||
<div class="thumb">
|
||||
<div class="end"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="viewport">
|
||||
<div class="overview">
|
||||
<ul class="tag_list">
|
||||
<li><input id="tag1" type="checkbox"><label for="tag1">animal</label></li>
|
||||
<li><input id="tag2" type="checkbox"><label for="tag2">animal</label></li>
|
||||
<li><input id="tag3" type="checkbox"><label for="tag3">animal</label></li>
|
||||
<li><input id="tag4" type="checkbox"><label for="tag4">animal</label></li>
|
||||
<li><input id="tag5" type="checkbox"><label for="tag5">animal</label></li>
|
||||
<li><input id="tag6" type="checkbox"><label for="tag6">animal</label></li>
|
||||
<li><input id="tag7" type="checkbox"><label for="tag7">animal</label></li>
|
||||
<li><input id="tag8" type="checkbox"><label for="tag8">animal</label></li>
|
||||
<li><input id="tag9" type="checkbox"><label for="tag9">animal</label></li>
|
||||
<li><input id="tag10" type="checkbox"><label for="tag10">animal</label></li>
|
||||
<li><input id="tag11" type="checkbox"><label for="tag11">animal</label></li>
|
||||
<li><input id="tag12" type="checkbox"><label for="tag12">animal</label></li>
|
||||
<li><input id="tag13" type="checkbox"><label for="tag13">animal</label></li>
|
||||
<li><input id="tag14" type="checkbox"><label for="tag14">animal</label></li>
|
||||
<li><input id="tag15" type="checkbox"><label for="tag15">animal</label></li>
|
||||
<li><input id="tag16" type="checkbox"><label for="tag16">animal</label></li>
|
||||
<li><input id="tag17" type="checkbox"><label for="tag17">animal</label></li>
|
||||
<li><input id="tag18" type="checkbox"><label for="tag18">animal</label></li>
|
||||
<li><input id="tag19" type="checkbox"><label for="tag19">animal</label></li>
|
||||
<li><input id="tag20" type="checkbox"><label for="tag20">animal</label></li>
|
||||
<li><input id="tag21" type="checkbox"><label for="tag21">animal</label></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tag_search"><div class="icon-search"></div><input type="text" value="Search Tags"></div>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
var $tag_panel = $('#tag_panel');
|
||||
orbit_bar_height = $('#orbit-bar').outerHeight();
|
||||
action_panel_height = $('.form-actions').outerHeight();
|
||||
window_height = $(window).height();
|
||||
|
||||
|
||||
$tag_panel.height( window_height - orbit_bar_height - 90 );
|
||||
$tag_panel.tinyscrollbar();
|
||||
|
||||
$(window).resize(function(){
|
||||
$tag_panel.tinyscrollbar_update('relative');
|
||||
$tag_panel.height( $(window).height() - orbit_bar_height - 90 );
|
||||
});
|
||||
|
||||
|
||||
</script>
|
||||
<!-- tag end -->
|
||||
<div class="form-actions form-fixed pagination-right rghead">
|
||||
<div class="rgfn">
|
||||
<!-- <a href="" class="btn btn-primary pull-right"><i class="icon-plus icon-white"></i>新增</a> -->
|
||||
|
|
|
@ -1,6 +1,7 @@
|
|||
en:
|
||||
gallery:
|
||||
album_name: Album Name
|
||||
album_tag: Album Tag
|
||||
all: All
|
||||
select_category: "--Select a category--"
|
||||
manage_categories: Manage Categories
|
||||
|
|
|
@ -1,6 +1,7 @@
|
|||
zh_tw:
|
||||
gallery:
|
||||
album_name: 相簿名稱
|
||||
album_tag: 相簿標籤
|
||||
all: 全部
|
||||
select_category: 選擇類別
|
||||
manage_categories: 類別管理
|
||||
|
|
Loading…
Reference in New Issue