thomas/designbyloven
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Publicerad - Version 1.0

Browse Source
This commit is contained in:
Thomas Lovén
2017-03-14 23:48:14 +01:00
parent 778d00dcf6
commit ed7c8f1bda
24 changed files with 423 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
templates/base.html Normal file
View File

@@ -0,0 +1,30 @@
{% extends "bootstrap/base.html" %}
{% block title %} -- Design by Lovén -- {% endblock %}
{% block styles %}
{{super()}}
<style>
body {
font-family: sans-serif;
}
</style>
{% endblock %}
{% block navbar %}
<nav class="navbar navbar-default">
<div class="container">
<div class="navbar-header col-xs-11">
<a class="navbar-brand" href="/">
<div>
<img src="{{url_for('static', filename='favicon.ico')}}">
Design by Lovén
</div>
</a>
</div>
<div class="navbar-header col-xs-1">
<ul class="nav navbar-nav">
<li><a href="mailto:kontakt@designbyloven.se"><span class="glyphicon glyphicon-envelope"></span></a></li>
</ul>
</div>
</div>
</nav>
{% endblock %}

108
templates/category.html Normal file
View File

@@ -0,0 +1,108 @@
{% extends "base.html" %}
{% block styles %}
{{super()}}
<style>
.selected img {
opacity: 0.5;
}
</style>
{% endblock %}
{% block content %}
<div class="container">
<div class="row">
<div class="col-md-6 hidden-xs hidden-sm">
<div class="panel panel-default">
<div class="panel-body">
<div id="myCarousel" class="carousel slide" data-ride="carousel">
<div class="carousel-inner" role="listbox">
{% for i in range(images) %}
<div class="item {% if i==0 %}active{% endif %}" data-slide-number="{{i}}">
<a href="{{url_for('cat_photo', category=category, num=i) }}">
<img src=" {{ url_for('slides', category=category, num=i) }}" class="img-responsive">
</a>
</div>
{% endfor %}
</div>
</div>
</div>
<div class="panel-footer" id="slider-thumbs">
<ul class="list-inline">
{% for i in range(images) %}
<li>
<a id="carousel-selector-{{i}}" class="thumbnail {% if i==0 %}selected{% endif %}" style="width: 100px; height=100px;">
<img src="{{ url_for('thumbnails', category=category, num=i) }}" width=100 height=100>
</a>
</li>
{% endfor %}
</ul>
</div>
</div>
</div>
<div class="col-md-6">
<div class="panel panel-default">
<!-- <div class="panel-heading"> -->
<!-- <div class="panel-title"> <h2>{{ category }}</h2> </div> -->
<!-- </div> -->
<div class="panel-body">
{{ presentation | markdown }}
</div>
<div class="panel-footer">
<a href="mailto:order@designbyloven.se" class="btn btn-default"><span class="glyphicon glyphicon-envelope"></span>&nbsp;Beställ</a>
</div>
</div>
</div>
<div class="col-md-6 visible-xs visible-sm">
<div class="well">
<ul class="list-inline">
{% for i in range(images) %}
<li>
<a class="thumbnail" style="width:100px; height=100px;" href="{{ url_for('cat_photo', category=category, num=i) }}">
<img src="{{ url_for('thumbnails', category=category, num=i) }}" width=100 height=100>
</a>
</li>
{% endfor %}
</ul>
</div>
</div>
</div>
</div>
{% endblock %}
{% block scripts %}
{{super()}}
<script>
$('#myCarousel').carousel({
interval: 5000
});
$('[id^=carousel-selector-]').click(function() {
var id_selector = $(this).attr("id");
var id = id_selector.substr(id_selector.length -1);
id = parseInt(id);
$('#myCarousel').carousel(id);
$('[id^=carousel-selector-]').removeClass('selected');
$(this).addClass('selected');
});
$('#myCarousel').on('slid.bs.carousel', function (e) {
var id = $('.item.active').data('slide-number');
id = parseInt(id);
$('[id^=carousel-selector-]').removeClass('selected');
$('[id=carousel-selector-'+id+']').addClass('selected');
});
</script>
{% endblock %}

60
templates/index.html Normal file
View File

@@ -0,0 +1,60 @@
{% extends "base.html" %}
{% block content %}
<div class="container">
<div class="row">
<div class="col-md-6">
<img class="pull-left" style="margin: 20px;" src="{{url_for('static', filename='symbol.png')}}">
{{presentation|markdown}}
</div>
<div class="col-md-6 hidden-xs hidden-sm">
<div id="myCarousel" class="carousel slide" data-ride="carousel">
<div class="carousel-inner thumbnail" role="listbox" style="width:100%; height:430px !important;">
<div class="item active" data-slide-number="0">
<a id="link-0" href="{{ url_for('category', category=img1['category']) }}"><img id="image-0" src="{{ url_for('slides', **img1) }}">
</div>
<div class="item" data-slide-number="1">
<a id="link-1" href="{{ url_for('category', category=img2['category']) }}"><img id="image-1" src="{{ url_for('slides', **img2) }}">
</div>
</div>
</div>
</div>
</div>
<div class="row">
{% for cat in categories %}
<div class="col-xs-6 col-md-3">
<div class="thumbnail">
<div class="caption">
<a href="{{ url_for('category', category=cat) }}"><h3>{{cat}}</h3></a>
</div>
<a href="{{ url_for('category', category=cat) }}"><img src="{{ url_for('thumbnails', category=cat) }}" class="img-responsive"></a>
</div>
</div>
{% endfor %}
</div>
</div>
{% endblock %}
{% block scripts %}
{{super()}}
<script>
$('#myCarousel').on('slid.bs.carousel', function (e) {
var id = $('.item.active').data('slide-number');
id = 1-parseInt(id);
$.get("/randimg", function(data) {
$('[id=link-'+id+']').attr('href', '/'+data.category+'/');
$('[id=image-'+id+']').attr('src', '/slides/'+data.category+'/'+data.num);
});
});
</script>
{% endblock %}