andis/fetsite
1
0
Fork 0
forked from bofh/fetsite
Code Issues Pull Requests Releases Wiki Activity

Fix: Bildergallerie

Browse Source 
Bildergallerie läuft jetzt auf Blueimp-gallery.
Viel spaß
This commit is contained in:
Thomas Blazek
2015-01-15 15:36:20 +01:00
parent 9873c4f1c1
commit 3dff2d2bbe
9 changed files with 90 additions and 102 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
Gemfile
View File

@@ -73,7 +73,6 @@ gem "cancan"
# Fileupload
gem 'paperclip' ,'~>3.4.0'
gem 'blueimp-gallery'
gem 'git'
gem 'haml'
@@ -117,3 +116,6 @@ gem 'sitemap_generator'
gem 'whenever'
gem 'yaml_db'
gem 'etherpad-lite'
# Image gallery
gem 'blueimp-gallery'

3
app/assets/javascripts/application.js
View File

@@ -23,11 +23,10 @@
//= require bootstrap
//= require bootstrap/colorpicker
//= require bootstrap/datepicker
//= require bootstrap/load-image.min
//= require bootstrap/image-gallery.min
//= require jquery-fileupload
// require jquery.remotipart
//= require jquery.datetimepicker
//= require blueimp-gallery-all
function insertAttachment(url,name) {
var ext = url.split('.').pop().toLowerCase();

97
app/assets/stylesheets/application.css.scss
View File

@@ -1,22 +1,21 @@
/*
* This is a manifest file that'll be compiled into application.css, which will include all the files
* listed below.
*
* Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
* or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
*
* You're free to add application-wide styles to this file and they'll appear at the top of the
* compiled file, but it's generally better to create a new file per style scope.
*
*= require_self
* require_tree .
*= require 'calendars'
*= require jquery.fileupload-ui
* require 'bootstrap'
*= require 'tinymce'
* This is a manifest file that'll be compiled into application.css, which will include all the files
* listed below.
*
* Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
* or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
*
* You're free to add application-wide styles to this file and they'll appear at the top of the
* compiled file, but it's generally better to create a new file per style scope.
*= require_self
* require_tree .
*= require 'calendars'
*= require jquery.fileupload-ui
* require 'bootstrap'
*= require 'tinymce'
*/
*/
// Colorshema #0A64A4
$color_prim: #0A64A4;
$color_prim_light: #0B65A5;
@@ -45,34 +44,34 @@ $sansFontFamily: Helvetica, Arial;
@import 'font-awesome';
h1 {
font-size: 23px
font-size: 23px
}
h2 {
font-size: 19px
font-size: 19px
}
body,html {
padding:0;
margin:0;
padding:0;
margin:0;
}
a:hover {
text-decoration:none;
text-decoration:none;
}
div.header {
display: block;
// background: url('/header1.png') no-repeat;
background-color: #FFF;
background-position: right;
border-bottom:1px solid black;
height:41px;
color:#000;
padding-left:87px;
padding-top:0px;
overflow:hidden;
margin-bottom: 20px
display: block;
// background: url('/header1.png') no-repeat;
background-color: #FFF;
background-position: right;
border-bottom:1px solid black;
height:41px;
color:#000;
padding-left:87px;
padding-top:0px;
overflow:hidden;
margin-bottom: 20px
}
div.header h1 {
padding:0;
@@ -81,40 +80,40 @@ font-size:20px;
line-height:32px;
}
#menudiv {
width:100%;
width:100%;
}
.navbar .nav li {
min-width:100%;
min-width:100%;
}
.navbar .nav .divider {
border-style: solid;
border-width: 1px 0px 0px 0px;
border-color: grey;
min-width: 100%;
border-style: solid;
border-width: 1px 0px 0px 0px;
border-color: grey;
min-width: 100%;
}
.navbar .navbar-inner
{
border:none;
box-shadow:none;
border:none;
box-shadow:none;
}
#contentdiv
{
background: #FFFFFF
background: #FFFFFF
}
#contentdiv .container-fluid
{
padding:0;
padding:0;
}
a.linkbox, div.contentbox
{
display:block;
padding:5px;
border-radius: 10px;
border: lightgray solid 1px;
display:block;
padding:5px;
border-radius: 10px;
border: lightgray solid 1px;
}
@@ -132,12 +131,12 @@ margin-bottom:10px;
}
ul.linkbox-list
{
max-width:70em;
max-width:70em;
}
div.contentbox
{
margin: 5px;
margin: 5px;
}
@@ -145,3 +144,5 @@ div.contentbox
min-width:100%;
background:44F;
}
@import 'galleries';

33
app/assets/stylesheets/galleries.css.scss
View File

@@ -2,39 +2,6 @@
// They will automatically be included in application.css.
// You can use Sass (SCSS) here: http://sass-lang.com/
//.modal.fade {
// top: -25%;
// transition: opacity 0.3s linear 0s, top 0.3s ease-out 0s;
//}
//.modal-gallery {
// max-height: none;
// outline: medium none;
// width: auto;
//}
//.modal {
// color: #333333;
//}
//.hide {
// display: none;
//}
//.modal {
//background-clip: padding-box;
// background-color: #FFFFFF;
// border: 1px solid rgba(0, 0, 0, 0.3);
//border-radius: 6px 6px 6px 6px;
// box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
// left: 50%;
// margin-left: -280px;
// outline: medium none;
// position: fixed;
// top: 10%;;
// z-index: 1050;
//}
//.fade {
// opacity: 0;
// transition: opacity 0.15s linear 0s;
//}
div.gallery-block
{
padding: 10px;

3
app/assets/stylesheets/layout.css.scss
View File

@@ -1,3 +1,6 @@
@import 'blueimp-gallery-all';
h1 {
font-size: 23px
}

1
app/assets/stylesheets/themes/blue1/application.css.scss
View File

@@ -15,7 +15,6 @@
*= require jquery.datetimepicker
*= require jquery.ui.dialog
* require 'bootstrap'
* require 'neuigkeiten'
*/

40
app/views/galleries/show.html.erb
View File

@@ -40,15 +40,40 @@
<div style="clear:both"></div>
<div id="blueimp-gallery" class="blueimp-gallery">
<!-- The Bootstrap Image Gallery lightbox, should be a child element of the document body -->
<div id="blueimp-gallery" class="blueimp-gallery blueimp-gallery-controls">
<!-- The container for the modal slides -->
<div class="slides"></div>
<!-- Controls for the borderless lightbox -->
<h3 class="title"></h3>
<a class="prev">‹</a>
<a class="next">›</a>
<a class="close">×</a>
<a class="play-pause"></a>
<ol class="indicator"></ol>
</div>
<!-- The modal dialog, which will be used to wrap the lightbox content -->
<div class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" aria-hidden="true">&times;</button>
<h4 class="modal-title"></h4>
</div>
<div class="modal-body next"></div>
<div class="modal-footer">
<button type="button" class="btn btn-default pull-left prev">
<i class="glyphicon glyphicon-chevron-left"></i>
Previous
</button>
<button type="button" class="btn btn-primary next">
Next
<i class="glyphicon glyphicon-chevron-right"></i>
</button>
</div>
</div>
</div>
</div>
</div>
<div id="links">
<% @fotos.each_index do |i| %>
<% f= @fotos[i] %>
@@ -61,13 +86,4 @@
<%= render 'layouts/pretty_toolbar' %>
<script>
document.getElementById('links').onclick = function (event) {
event = event || window.event;
var target = event.target || event.srcElement,
link = target.src ? target.parentNode : target,
options = {index: link, event: event},
links = this.getElementsByTagName('a');
blueimp.Gallery(links, options);
};
</script>

1
app/views/layouts/application.html.erb
View File

@@ -4,7 +4,6 @@
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="shortcut icon" href="logo2014_64.png">
<link rel="stylesheet" href="/home/tblazek/prog/fetsite/css/blueimp-gallery.min.css">
<!--<link rel="shortcut icon" href="http://www.fet.at/favicon.ico">-->
<!---->

2
config/locales/de.yml
View File

@@ -44,3 +44,5 @@ de:
adresse_text: "Gußhausstraße 25-27<br>1220 Wien"
service_text: "Für individuelle Beratung und alle sonstigen Angelegenheiten stehen wir mit unserem Servicedienst während der Vorlesungszeit jenen <b>Mo-Fr von 9 bis 15 Uhr</b> zur Verfügung. Außerhalb dieser Zeiten ist oft trotzdem jemand auf der Fachschaft der dir weiterhelfen kann."
telefon_text: "Telefon: +43 2241341 <br> Skype: <br><b>E-Mail: service@fet.at</b>"
search:
no_results_for: "Es wurden keine Einträge gefunden für"