summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
Diffstat
-rw-r--r--lib/javascript/base.js7
-rw-r--r--modules/tinybox/images/close.pngbin0 -> 1419 bytes
-rw-r--r--modules/tinybox/images/preload.gifbin0 -> 6712 bytes
-rw-r--r--modules/tinybox/tinybox.css12
-rw-r--r--modules/tinybox/tinybox.js134
-rw-r--r--templates/header.inc.php1
-rw-r--r--templates/show_album.inc.php4
-rw-r--r--templates/show_lyrics_song.inc.php2
-rw-r--r--templates/show_now_playing_row.inc.php2
-rw-r--r--templates/stylesheets.inc.php1
10 files changed, 152 insertions, 11 deletions
diff --git a/lib/javascript/base.js b/lib/javascript/base.js
index 771dcd2e..2552ba9a 100644
--- a/lib/javascript/base.js
+++ b/lib/javascript/base.js
@@ -86,13 +86,6 @@ function reloadRedirect(target) {
window.location = target;
} // reloadRedirect
-// popupWindow
-// Loads the specified URL in a new window. Used for art.
-function popupWindow(url) {
- var newWindow = window.open(url, "ampache_art", "menubar=no,toolbar=no,location=no,directories=no");
- if (window.focus) { newWindow.focus(); }
-} // popupWindow
-
// This is kind of ugly. Let's not mess with it too much.
function check_inline_song_edit(type, song) {
var target = type + '_select_' + song;
diff --git a/modules/tinybox/images/close.png b/modules/tinybox/images/close.png
new file mode 100644
index 00000000..81787731
--- /dev/null
+++ b/modules/tinybox/images/close.png
Binary files differ
diff --git a/modules/tinybox/images/preload.gif b/modules/tinybox/images/preload.gif
new file mode 100644
index 00000000..863cb6c2
--- /dev/null
+++ b/modules/tinybox/images/preload.gif
Binary files differ
diff --git a/modules/tinybox/tinybox.css b/modules/tinybox/tinybox.css
new file mode 100644
index 00000000..23f83b6b
--- /dev/null
+++ b/modules/tinybox/tinybox.css
@@ -0,0 +1,12 @@
+.tbox {position:absolute; display:none; padding:14px 17px; z-index:900}
+.tinner {padding:15px; -moz-border-radius:5px; border-radius:5px; background:#fff url(images/preload.gif) no-repeat 50% 50%; border-right:1px solid #333; border-bottom:1px solid #333}
+.tmask {position:absolute; display:none; top:0px; left:0px; height:100%; width:100%; background:#000; z-index:800}
+.tclose {position:absolute; top:0px; right:0px; width:30px; height:30px; cursor:pointer; background:url(images/close.png) no-repeat}
+.tclose:hover {background-position:0 -30px}
+
+#error {background:#ff6969; color:#fff; text-shadow:1px 1px #cf5454; border-right:1px solid #000; border-bottom:1px solid #000; padding:0}
+#error .tcontent {padding:10px 14px 11px; border:1px solid #ffb8b8; -moz-border-radius:5px; border-radius:5px}
+#success {background:#2ea125; color:#fff; text-shadow:1px 1px #1b6116; border-right:1px solid #000; border-bottom:1px solid #000; padding:10; -moz-border-radius:0; border-radius:0}
+#bluemask {background:#4195aa}
+#frameless {padding:0}
+#frameless .tclose {left:6px} \ No newline at end of file
diff --git a/modules/tinybox/tinybox.js b/modules/tinybox/tinybox.js
new file mode 100644
index 00000000..03058ffe
--- /dev/null
+++ b/modules/tinybox/tinybox.js
@@ -0,0 +1,134 @@
+TINY={};
+
+TINY.box=function(){
+ var j,m,b,g,v,p=0;
+ return{
+ show:function(o){
+ v={opacity:70,close:1,animate:1,fixed:1,mask:1,maskid:'',boxid:'',topsplit:2,url:0,post:0,height:0,width:0,html:0,iframe:0};
+ for(s in o){v[s]=o[s]}
+ if(!p){
+ j=document.createElement('div'); j.className='tbox';
+ p=document.createElement('div'); p.className='tinner';
+ b=document.createElement('div'); b.className='tcontent';
+ m=document.createElement('div'); m.className='tmask';
+ g=document.createElement('div'); g.className='tclose'; g.v=0;
+ document.body.appendChild(m); document.body.appendChild(j); j.appendChild(p); p.appendChild(b);
+ m.onclick=g.onclick=TINY.box.hide; window.onresize=TINY.box.resize
+ }else{
+ j.style.display='none'; clearTimeout(p.ah); if(g.v){p.removeChild(g); g.v=0}
+ }
+ p.id=v.boxid; m.id=v.maskid; j.style.position=v.fixed?'fixed':'absolute';
+ if(v.html&&!v.animate){
+ p.style.backgroundImage='none'; b.innerHTML=v.html; b.style.display='';
+ p.style.width=v.width?v.width+'px':'auto'; p.style.height=v.height?v.height+'px':'auto'
+ }else{
+ b.style.display='none';
+ if(!v.animate&&v.width&&v.height){
+ p.style.width=v.width+'px'; p.style.height=v.height+'px'
+ }else{
+ p.style.width=p.style.height='100px'
+ }
+ }
+ if(v.mask){this.mask(); this.alpha(m,1,v.opacity)}else{this.alpha(j,1,100)}
+ if(v.autohide){p.ah=setTimeout(TINY.box.hide,1000*v.autohide)}else{document.onkeyup=TINY.box.esc}
+ },
+ fill:function(c,u,k,a,w,h){
+ if(u){
+ if(v.image){
+ var i=new Image(); i.onload=function(){w=w||i.width; h=h||i.height; TINY.box.psh(i,a,w,h)}; i.src=v.image
+ }else if(v.iframe){
+ this.psh('<iframe src="'+v.iframe+'" width="'+v.width+'" frameborder="0" height="'+v.height+'"></iframe>',a,w,h)
+ }else{
+ var x=window.XMLHttpRequest?new XMLHttpRequest():new ActiveXObject('Microsoft.XMLHTTP');
+ x.onreadystatechange=function(){
+ if(x.readyState==4&&x.status==200){p.style.backgroundImage=''; TINY.box.psh(x.responseText,a,w,h)}
+ };
+ if(k){
+ x.open('POST',c,true); x.setRequestHeader('Content-type','application/x-www-form-urlencoded'); x.send(k)
+ }else{
+ x.open('GET',c,true); x.send(null)
+ }
+ }
+ }else{
+ this.psh(c,a,w,h)
+ }
+ },
+ psh:function(c,a,w,h){
+ if(typeof c=='object'){b.appendChild(c)}else{b.innerHTML=c}
+ var x=p.style.width, y=p.style.height;
+ if(!w||!h){
+ p.style.width=w?w+'px':''; p.style.height=h?h+'px':''; b.style.display='';
+ if(!h){h=parseInt(b.offsetHeight)}
+ if(!w){w=parseInt(b.offsetWidth)}
+ b.style.display='none'
+ }
+ p.style.width=x; p.style.height=y;
+ this.size(w,h,a)
+ },
+ esc:function(e){e=e||window.event; if(e.keyCode==27){TINY.box.hide()}},
+ hide:function(){TINY.box.alpha(j,-1,0,3); document.onkeypress=null; if(v.closejs){v.closejs()}},
+ resize:function(){TINY.box.pos(); TINY.box.mask()},
+ mask:function(){m.style.height=this.total(1)+'px'; m.style.width=this.total(0)+'px'},
+ pos:function(){
+ var t;
+ if(typeof v.top!='undefined'){t=v.top}else{t=(this.height()/v.topsplit)-(j.offsetHeight/2); t=t<20?20:t}
+ if(!v.fixed&&!v.top){t+=this.top()}
+ j.style.top=t+'px';
+ j.style.left=typeof v.left!='undefined'?v.left+'px':(this.width()/2)-(j.offsetWidth/2)+'px'
+ },
+ alpha:function(e,d,a){
+ clearInterval(e.ai);
+ if(d){e.style.opacity=0; e.style.filter='alpha(opacity=0)'; e.style.display='block'; TINY.box.pos()}
+ e.ai=setInterval(function(){TINY.box.ta(e,a,d)},20)
+ },
+ ta:function(e,a,d){
+ var o=Math.round(e.style.opacity*100);
+ if(o==a){
+ clearInterval(e.ai);
+ if(d==-1){
+ e.style.display='none';
+ e==j?TINY.box.alpha(m,-1,0,2):b.innerHTML=p.style.backgroundImage=''
+ }else{
+ if(e==m){
+ this.alpha(j,1,100)
+ }else{
+ j.style.filter='';
+ TINY.box.fill(v.html||v.url,v.url||v.iframe||v.image,v.post,v.animate,v.width,v.height)
+ }
+ }
+ }else{
+ var n=a-Math.floor(Math.abs(a-o)*.5)*d;
+ e.style.opacity=n/100; e.style.filter='alpha(opacity='+n+')'
+ }
+ },
+ size:function(w,h,a){
+ if(a){
+ clearInterval(p.si); var wd=parseInt(p.style.width)>w?-1:1, hd=parseInt(p.style.height)>h?-1:1;
+ p.si=setInterval(function(){TINY.box.ts(w,wd,h,hd)},20)
+ }else{
+ p.style.backgroundImage='none'; if(v.close){p.appendChild(g); g.v=1}
+ p.style.width=w+'px'; p.style.height=h+'px'; b.style.display=''; this.pos();
+ if(v.openjs){v.openjs()}
+ }
+ },
+ ts:function(w,wd,h,hd){
+ var cw=parseInt(p.style.width), ch=parseInt(p.style.height);
+ if(cw==w&&ch==h){
+ clearInterval(p.si); p.style.backgroundImage='none'; b.style.display='block'; if(v.close){p.appendChild(g); g.v=1}
+ if(v.openjs){v.openjs()}
+ }else{
+ if(cw!=w){p.style.width=(w-Math.floor(Math.abs(w-cw)*.6)*wd)+'px'}
+ if(ch!=h){p.style.height=(h-Math.floor(Math.abs(h-ch)*.6)*hd)+'px'}
+ this.pos()
+ }
+ },
+ top:function(){return document.documentElement.scrollTop||document.body.scrollTop},
+ width:function(){return self.innerWidth||document.documentElement.clientWidth||document.body.clientWidth},
+ height:function(){return self.innerHeight||document.documentElement.clientHeight||document.body.clientHeight},
+ total:function(d){
+ var b=document.body, e=document.documentElement;
+ return d?Math.max(Math.max(b.scrollHeight,e.scrollHeight),Math.max(b.clientHeight,e.clientHeight)):
+ Math.max(Math.max(b.scrollWidth,e.scrollWidth),Math.max(b.clientWidth,e.clientWidth))
+ }
+ }
+}(); \ No newline at end of file
diff --git a/templates/header.inc.php b/templates/header.inc.php
index ee19ae6b..6036bfbe 100644
--- a/templates/header.inc.php
+++ b/templates/header.inc.php
@@ -43,6 +43,7 @@ if (Config::get('use_rss')) { ?>
</head>
<body>
<script src="<?php echo $web_path; ?>/modules/prototype/prototype.js" language="javascript" type="text/javascript"></script>
+<script src="<?php echo $web_path; ?>/modules/tinybox/tinybox.js" language="javascript" type="text/javascript"></script>
<script src="<?php echo $web_path; ?>/lib/javascript/base.js" language="javascript" type="text/javascript"></script>
<script src="<?php echo $web_path; ?>/lib/javascript/ajax.js" language="javascript" type="text/javascript"></script>
<!-- rfc3514 implementation -->
diff --git a/templates/show_album.inc.php b/templates/show_album.inc.php
index b987bf5b..eed35720 100644
--- a/templates/show_album.inc.php
+++ b/templates/show_album.inc.php
@@ -35,8 +35,8 @@ $title .= '&nbsp;-&nbsp;' . $album->f_artist_link;
if ($album->name != T_('Unknown (Orphaned)')) {
$name = '[' . $album->f_artist . '] ' . scrub_out($album->full_name);
- $aa_url = $web_path . "/image.php?id=" . $album->id . "&amp;type=popup&amp;sid=" . session_id();
- echo "<a target=\"_blank\" href=\"$aa_url\" onclick=\"popupWindow('$aa_url'); return false;\">";
+ $aa_url = $web_path . "/image.php?id=" . $album->id . "&amp;sid=" . session_id();
+ echo "<a href=\"$aa_url\" onClick=\"TINY.box.show({image:'$aa_url',boxid:'frameless',animate:true}); return false;\">";
echo "<img src=\"" . $web_path . "/image.php?id=" . $album->id . "&amp;thumb=2\" alt=\"".$name."\" title=\"".$name."\" height=\"128\" width=\"128\" />";
echo "</a>\n";
}
diff --git a/templates/show_lyrics_song.inc.php b/templates/show_lyrics_song.inc.php
index ee038e0c..11390c9a 100644
--- a/templates/show_lyrics_song.inc.php
+++ b/templates/show_lyrics_song.inc.php
@@ -30,7 +30,7 @@ $artist = scrub_out(UI::truncate($song->f_artist_full));
<div class="np_group">
<?php if (Config::get('show_album_art')) { ?>
<div class="np_cell cel_albumart">
- <a target="_blank" href="<?php echo $web_path; ?>/image.php?id=<?php echo $song->album; ?>&amp;type=popup&amp;sid=<?php echo session_id(); ?>" onclick="popupWindow('<?php echo $web_path; ?>/image.php?id=<?php echo $song->album; ?>&amp;type=popup&amp;sid=<?php echo session_id(); ?>'); return false;">
+ <a href="<?php echo $web_path; ?>/image.php?id=<?php echo $song->album; ?>&amp;sid=<?php echo session_id(); ?>" onclick="TINY.box.show({image:'<?php echo $web_path; ?>/image.php?id=<?php echo $song->album; ?>&amp;sid=<?php echo session_id(); ?>',boxid:'frameless',animate:true}); return false;">
<img align="middle" src="<?php echo $web_path; ?>/image.php?id=<?php echo $song->album; ?>&amp;thumb=1&amp;sid=<?php echo session_id(); ?>" alt="<?php echo scrub_out($song->f_album_full); ?>" title="<?php echo scrub_out($song->f_album_full); ?>" height="75" width="75" />
</a>
</div>
diff --git a/templates/show_now_playing_row.inc.php b/templates/show_now_playing_row.inc.php
index adbe0f24..b9ac30ba 100644
--- a/templates/show_now_playing_row.inc.php
+++ b/templates/show_now_playing_row.inc.php
@@ -65,7 +65,7 @@
<?php if (Art::is_enabled()) { ?>
<div class="np_group" id="np_group_3">
<div class="np_cell cel_albumart">
- <a target="_blank" href="<?php echo $web_path; ?>/image.php?id=<?php echo $media->album; ?>&amp;type=popup" onclick="popupWindow('<?php echo $web_path; ?>/image.php?id=<?php echo $media->album; ?>&amp;type=popup'); return false;">
+ <a href="<?php echo $web_path; ?>/image.php?id=<?php echo $media->album; ?>" onclick="TINY.box.show({image:'<?php echo $web_path; ?>/image.php?id=<?php echo $media->album; ?>',boxid:'frameless',animate:true}); return false;">
<img align="middle" src="<?php echo $web_path; ?>/image.php?id=<?php echo $media->album; ?>&amp;thumb=1&amp;sid=<?php echo session_id(); ?>" alt="<?php echo scrub_out($media->f_album_full); ?>" title="<?php echo scrub_out($media->f_album_full); ?>" height="80" width="80" />
</a>
</div>
diff --git a/templates/stylesheets.inc.php b/templates/stylesheets.inc.php
index 27c8aad5..7fc3331d 100644
--- a/templates/stylesheets.inc.php
+++ b/templates/stylesheets.inc.php
@@ -33,4 +33,5 @@ if (is_rtl(Config::get('lang'))
<?php
}
?>
+<link rel="stylesheet" href="<?php echo $web_path; ?>/modules/tinybox/tinybox.css" type="text/css" media="screen" />
<link rel="stylesheet" href="<?php echo $web_path; ?>/templates/print.css" type="text/css" media="print" />
generated by cgit (git 2.34.1) at 2025-08-13 11:51:40 +0000