Skip to content

Instantly share code, notes, and snippets.

@phantom42

phantom42/basic photoswipe

Created January 3, 2013 20:59
Show Gist options
  • Save phantom42/4447194 to your computer and use it in GitHub Desktop.
Save phantom42/4447194 to your computer and use it in GitHub Desktop.
Download ZIP
basic implementation of gallery displaying all jpgs in a folder
Raw
basic photoswipe
<cfscript>
currentDir = getDirectoryFromPath(getTemplatePath()) ;
currentfile = lcase(getFileFromPath(getTemplatePath()));
fileList = directoryList(currentDir,false,'query','*.jpg','asc') ;
</cfscript>
<!DOCTYPE html>
<html>
<head>
<title>PhotoSwipe</title>
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<link href="styles.css" type="text/css" rel="stylesheet" />
<link href="../../photoswipe/photoswipe.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="../../photoswipe/lib/klass.min.js"></script>
<script type="text/javascript" src="../../photoswipe/code.photoswipe-3.0.5.min.js"></script>
<script type="text/javascript">
(function(window, PhotoSwipe){
document.addEventListener('DOMContentLoaded', function(){
var
options = {},
instance = PhotoSwipe.attach( window.document.querySelectorAll('#Gallery a'), options );
}, false);
}(window, window.Code.PhotoSwipe));
</script>
</head>
<body>
<div id="MainContent">
<div class="page-content">
<h1>gallery</h1>
</div>
<ul id="Gallery" class="gallery">
<cfscript>
for(i=1;i<=fileList.recordCount;i=i+1){
if (lcase(fileList.name[i]) NEQ currentFile ){
writeoutput('<li><a href="#fileList.name[i]#"><img src="#fileList.name[i]#" alt="#fileList.name[i]#"></a></li>') ;
}
}
</cfscript>
</ul>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment