archive/piwigo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feature:940 first step reordering with jquery

Browse source 
git-svn-id: http://piwigo.org/svn/trunk@3201 68402e56-0260-453c-a942-63ccdbb3a9ee
This commit is contained in:
nikrou 2009-03-16 09:31:37 +00:00
parent 87a7b60bed
commit c53c9523a8
2 changed files with 60 additions and 27 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

59
admin/template/goto/element_set_ranks.tpl
View file

@ -1,41 +1,50 @@
{known_script id="jquery" src=$ROOT_URL|@cat:"template-common/lib/jquery.packed.js"}
{known_script id="jquery.ui" src=$ROOT_URL|@cat:"template-common/lib/ui/packed/ui.core.packed.js" }
{known_script id="jquery.ui.sortable" src=$ROOT_URL|@cat:"template-common/lib/ui/packed/ui.sortable.packed.js" }
{literal}
<script type="text/javascript">
$(function() {
$('ul.thumbnails')
.sortable(
{ revert: true,
opacity: 0.7,
handle: $('.rank-of-image').add('.rank-of-image img'),
update: function() {
$(this).find('li').each(function(i) {
$(this).find("input[@name~='rank_of_image']")
.each(function() { $(this).attr('value', (i+1)*10)});
});
}
});
});
</script>
{/literal}
<h2>{'Manage image ranks'|@translate}</h2>
<h3>{$CATEGORIES_NAV}</h3>
{if !empty($thumbnails)}
<form action="{$F_ACTION}" method="post">
<form action="{$F_ACTION}" method="post">
<p><input class="submit" type="submit" value="{'Submit'|@translate}" name="submit" {$TAG_INPUT_ENABLED}></p>
<fieldset>
<legend>{'Edit ranks'|@translate}</legend>
{if !empty($thumbnails)}
{if !empty($thumbnails)}
<ul class="thumbnails">
{foreach from=$thumbnails item=thumbnail}
<li><span class="wrap1">
<label>
<span class="wrap2">
{if $thumbnail.LEVEL > 0}
<em class="levelIndicatorB">{$thumbnail.LEVEL}</em>
<em class="levelIndicatorF" title="{$pwg->l10n($pwg->sprintf('Level %d',$thumbnail.LEVEL))}">{$thumbnail.LEVEL}</em>
{/if}
<span>
<img src="{$thumbnail.TN_SRC}" class="thumbnail">
</span></span>
<input style="height:12px; width:50px;" type="text" name="rank_of_image[{$thumbnail.ID}]" value="{$thumbnail.RANK}">
</label>
</span>
<li class="rank-of-image">
<img src="{$thumbnail.TN_SRC}" class="thumbnail" alt="">
<input type="text" name="rank_of_image[{$thumbnail.ID}]" value="{$thumbnail.RANK}">
</li>
{/foreach}
</ul>
{/if}
<p><input class="submit" type="submit" value="{'Submit'|@translate}" name="submit" {$TAG_INPUT_ENABLED}></p>
{/if}
</fieldset>
</form>
<p><input class="submit" type="submit" value="{'Submit'|@translate}" name="submit" {$TAG_INPUT_ENABLED}></p>
</form>
{else}
<div class="infos"><p>{'No element in this category'|@translate}</p></div>
<div class="infos"><p>{'No element in this category'|@translate}</p></div>
{/if}

28
admin/template/goto/thumbnails.css
View file

@ -1,9 +1,33 @@
/* $Id$ */
/* $Id: thumbnails.css 2526 2008-09-14 00:33:53Z vdigital $ */
.content UL.thumbnails {
margin: 0; padding: 0; list-style: none;
text-align: center; /* to center the whole collection in .content */
}
.content UL.thumbnails LI { display: inline }
.content ul.thumbnails li.rank-of-image {
float: left;
background-color: #111;
border: 1px solid #666;
color: #666;
-moz-border-radius: 4px;
display: block;
width: 104px;
height: 128px;
cursor: move;
margin: 10px;
}
.content ul.thumbnails li.rank-of-image img {
width: 96px;
height: 96px;
margin: 4px;
float: left;
}
.content ul.thumbnails li.rank-of-image input {
height: 12px;
width: 50px;
position: relative;
top: 0;
}
.content UL.thumbnails SPAN.wrap1 {
margin: 0 5px 5px 5px;
display: table-cell; display: inline-table;
@ -34,4 +58,4 @@ display:block; position:absolute; z-index:100;padding:0px 0 0 14px; color:black;
}
UL.thumbnails .levelIndicatorF {
display:block; position:absolute; z-index:101;padding:1px 0 0 15px; color:white; font-weight:bold; font-size:120%;
}
}