share email +twitter / class messages

This commit is contained in:
Nicolas Lœuillet
2013-08-05 15:54:37 +02:00
parent b161295d0b
commit 55821e04c1
25 changed files with 339 additions and 112 deletions

View File

@ -4,7 +4,7 @@
+'<html>'
+'<head>'
+'<title>poche it !</title>'
+'<link rel="icon" href="{$poche_url}img/favicon.ico" />'
+'<link rel="icon" href="{{poche_url}}tpl/img/favicon.ico" />'
+'</head>'
+'<body>'
+'<script>'

View File

@ -4,7 +4,5 @@
<link rel="apple-touch-icon-precomposed" href="./tpl/img/apple-touch-icon-precomposed.png">
<link rel="stylesheet" href="./tpl/css/knacss.css" media="all">
<link rel="stylesheet" href="./tpl/css/style.css" media="all">
<!-- Light Theme -->
<link rel="stylesheet" href="./tpl/css/style-light.css" media="all" title="light-style">
<!-- Dark Theme -->
<link rel="alternate stylesheet" href="./tpl/css/style-dark.css" media="all" title="dark-style">
<link rel="stylesheet" href="./tpl/css/messages.css" media="all">

7
tpl/_menu.twig Normal file
View File

@ -0,0 +1,7 @@
<ul id="links">
<li><a href="./" {% if view == 'home' %}class="current"{% endif %}>{% trans "home" %}</a></li>
<li><a href="./?view=fav" {% if view == 'fav' %}class="current"{% endif %}>{% trans "favorites" %}</a></li>
<li><a href="./?view=archive" {% if view == 'archive' %}class="current"{% endif %}>{% trans "archive" %}</a></li>
<li><a href="./?view=config" {% if view == 'config' %}class="current"{% endif %}>{% trans "config" %}</a></li>
<li><a href="./?logout" title="{% trans "logout" %}">{% trans "logout" %}</a></li>
</ul>

5
tpl/_messages.twig Normal file
View File

@ -0,0 +1,5 @@
<ul id="messages">
{% for message in messages %}
<li>{{ message|e }}</li>
{% endfor %}
</ul>

13
tpl/css/messages.css Executable file
View File

@ -0,0 +1,13 @@
.messages { width: 100%; -moz-border-radius: 4px; border-radius: 4px; display: block; padding: 10px 0; margin: 10px auto 10px; clear: both; }
.messages a.closeMessage { margin: -14px -8px 0 0; display:none; width: 16px; height: 16px; float: right; background: url(../img/messages/close.png) no-repeat; }
/*.messages:hover a.closeMessage { visibility:visible; }*/
.messages p { margin: 3px 0 3px 10px !important; padding: 0 10px 0 23px !important; font-size: 14px; line-height: 16px; }
.messages.error { border: 1px solid #C42608; color: #c00 !important; background: #FFF0EF; }
.messages.error p { background: url(../img/messages/cross.png ) no-repeat 0px 50%; color:#c00 !important; }
.messages.success {background: #E0FBCC; border: 1px solid #6DC70C; }
.messages.success p { background: url(../img/messages/tick.png) no-repeat 0px 50%; color: #2B6301 !important; }
.messages.warning { background: #FFFCD3; border: 1px solid #EBCD41; color: #000; }
.messages.warning p { background: url(../img/messages/warning.png ) no-repeat 0px 50%; color: #5F4E01; }
.messages.information, .messages.info { background: #DFEBFB; border: 1px solid #82AEE7; }
.messages.information p, .messages.info p { background: url(../img/messages/help.png ) no-repeat 0px 50%; color: #064393; }
.messages.information a { text-decoration: underline; }

View File

@ -65,6 +65,10 @@ a.archive-off span:hover {
background: url('../img/dark/checkmark-on.png') no-repeat;
}
a.twitter span {
background: url('../img/dark/twitter.png') no-repeat;
}
/*** ***/
/*** ARTICLE PAGE ***/

View File

@ -75,6 +75,14 @@ a.archive-off span:hover {
background: url('../img/light/checkmark-on.png') no-repeat;
}
a.twitter span {
background: url('../img/light/twitter.png') no-repeat;
}
a.email span {
background: url('../img/light/envelop.png') no-repeat;
}
/*** ***/
/*** ARTICLE PAGE ***/

View File

@ -47,6 +47,10 @@ header h1 {
cursor: pointer;
}
ul#messages {
}
#main, #article {
margin: 0 auto;
}
@ -99,6 +103,7 @@ input[type=submit].delete {
}
.tools {
float: right;
text-align: right;
}
@ -121,7 +126,6 @@ input[type=submit].delete {
top: 0px;
right: 0px;
width: 100%;
text-align: left;
}
#article .tools ul li{

View File

@ -1,38 +1,35 @@
{% extends "layout.twig" %}
{% block title %}{% trans "home" %}{% endblock %}
{% block menu %}
<ul id="links">
<li><a href="./" {% if view == 'home' %}class="current"{% endif %}>{% trans "home" %}</a></li>
<li><a href="./?view=fav" {% if view == 'fav' %}class="current"{% endif %}>{% trans "favorites" %}</a></li>
<li><a href="./?view=archive" {% if view == 'archive' %}class="current"{% endif %}>{% trans "archive" %}</a></li>
<li><a href="./?view=config" {% if view == 'config' %}class="current"{% endif %}>{% trans "config" %}</a></li>
<li><a href="./?logout" title="{% trans "logout" %}">{% trans "logout" %}</a></li>
</ul>
{% include '_menu.twig' %}
{% endblock %}
{% block precontent %}
<ul id="sort">
<li><img src="./tpl/img/up.png" onclick="sort_links('{{ view }}', 'ia');" title="{% trans "by date asc" %}" /> {% trans "by date" %} <img src="./tpl/img/down.png" onclick="sort_links('{{ view }}', 'id');" title="{% trans "by date desc" %}" /></li>
<li><img src="./tpl/img/up.png" onclick="sort_links('{{ view }}', 'ta');" title="{% trans "by title asc" %}" /> {% trans "by title" %} <img src="./tpl/img/down.png" onclick="sort_links('{{ view }}', 'td');" title="{% trans "by title desc" %}" /></li>
<li><a href="./?sort=ia"><img src="./tpl/img/up.png" title="{% trans "by date asc" %}" /></a> {% trans "by date" %} <a href="./?sort=id"><img src="./tpl/img/down.png" title="{% trans "by date desc" %}" /></a></li>
<li><a href="./?sort=ta"><img src="./tpl/img/up.png" title="{% trans "by title asc" %}" /></a> {% trans "by title" %} <a href="./?sort=td"><img src="./tpl/img/down.png" title="{% trans "by title desc" %}" /></a></li>
</ul>
{% endblock %}
{% block messages %}
{% include '_messages.twig' %}
{% endblock %}
{% block content %}
<div id="content">
{% for entry in entries %}
<div id="entry-{{ entry.id|e }}" class="entrie mb2">
<span class="content">
<h2 class="h6-like">
<a href="index.php?&view=view&id={{ entry.id|e }}">{{ entry.title|e }}</a>
<a href="index.php?view=view&id={{ entry.id|e }}">{{ entry.title|e }}</a>
</h2>
<div class="tools">
<ul>
<li>
<a title="{% trans "toggle mark as read" %}" class="tool archive {% if entry.is_read == 0 %}archive-off{% endif %}" onclick="toggle_archive(this, {{ entry.id|e }})"><span></span></a></li>
<li><a title="{% trans "toggle favorite" %}" class="tool fav {% if entry.is_fav == 0 %}fav-off{% endif %}" onclick="toggle_favorite(this, {{ entry.id|e }})"><span></span></a></li>
<a title="{% trans "toggle mark as read" %}" class="tool archive {% if entry.is_read == 0 %}archive-off{% endif %}" href="./?action=toggle_archive&id={{ entry.id|e }}"><span></span></a></li>
<li><a title="{% trans "toggle favorite" %}" class="tool fav {% if entry.is_fav == 0 %}fav-off{% endif %}" href="./?action=toggle_fav&id={{ entry.id|e }}"><span></span></a></li>
<li><form method="post" style="display: inline;"><input type="hidden" name="token" id="token" value="{{ token }}" /><input type="hidden" id="action" name="action" value="delete" /><input type="hidden" id="view" name="view" value="{{ view }}" /><input type="hidden" id="id" name="id" value="{{ entry.id|e }}" /><input type="submit" class="delete" title="{% trans "toggle delete" %}" /></form>
</li>
</ul>
</div>
<div class="url">{{ entry.url|e }}</div>
<div class="url">{{ entry.url | e | getDomain }}</div>
</span>
</div>
{% endfor %}
@ -41,22 +38,6 @@
{% block js %}
<script type="text/javascript" src="./tpl/js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="./tpl/js/poche.js"></script>
<script type="text/javascript" src="./tpl/js/jquery.masonry.min.js"></script>
<script type="text/javascript">
$( window ).load( function()
{
var columns = 3,
setColumns = function() { columns = $( window ).width() > 640 ? 3 : $( window ).width() > 320 ? 2 : 1; };
setColumns();
$( window ).resize( setColumns );
$( '#content' ).masonry(
{
itemSelector: '.entrie',
columnWidth: function( containerWidth ) { return containerWidth / columns; }
});
});
</script>
<script type="text/javascript">$(window).load(function(){var e=3,t=function(){e=$(window).width()>640?3:$(window).width()>320?2:1};t();$(window).resize(t);$("#content").masonry({itemSelector:".entrie",columnWidth:function(t){return t/e}})})</script>
{% endblock %}

BIN
tpl/img/dark/twitter.png Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 300 B

BIN
tpl/img/light/envelop.png Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 285 B

BIN
tpl/img/light/twitter.png Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 297 B

BIN
tpl/img/messages/close.png Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 662 B

BIN
tpl/img/messages/cross.png Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 655 B

BIN
tpl/img/messages/help.png Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 786 B

BIN
tpl/img/messages/tick.png Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 537 B

BIN
tpl/img/messages/warning.png Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 666 B

View File

@ -1,57 +0,0 @@
function toggle_favorite(element, id) {
$(element).toggleClass('fav-off');
$.ajax ({
url: "index.php?action=toggle_fav",
data:{id:id}
});
}
function toggle_archive(element, id, view_article) {
$(element).toggleClass('archive-off');
$.ajax ({
url: "index.php?action=toggle_archive",
data:{id:id}
});
var obj = $('#entry-'+id);
// on vient de la vue de l'article, donc pas de gestion de grille
if (view_article != 1) {
$('#content').masonry('remove',obj);
$('#content').masonry('reloadItems');
$('#content').masonry('reload');
}
}
function sort_links(view, sort) {
$.get('index.php', { view: view, sort: sort }, function(data) {
$('#content').html(data);
});
}
// ---------- Swith light or dark view
function setActiveStyleSheet(title) {
var i, a, main;
for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title")) {
a.disabled = true;
if(a.getAttribute("title") == title) a.disabled = false;
}
}
}
$('#themeswitch').click(function() {
// we want the dark
if ($('body').hasClass('light-style')) {
setActiveStyleSheet('dark-style');
$('body').addClass('dark-style');
$('body').removeClass('light-style');
$('#themeswitch').text('light');
// we want the light
} else if ($('body').hasClass('dark-style')) {
setActiveStyleSheet('light-style');
$('body').addClass('light-style');
$('body').removeClass('dark-style');
$('#themeswitch').text('dark');
}
return false;
});

View File

@ -17,6 +17,7 @@
<div id="main">
{% block menu %}{% endblock %}
{% block precontent %}{% endblock %}
{% block messages %}{% endblock %}
{% block content %}{% endblock %}
{% block js %}{% endblock %}
</div>

View File

@ -1,42 +1,40 @@
{% extends "layout.twig" %}
{% block title %}{% trans "home" %}{% endblock %}
{% block messages %}
{% include '_messages.twig' %}
{% endblock %}
{% block content %}
<div id="article" class="w600p">
<div class="backhome">
<a href="./" title="{% trans "back to home" %}">&larr;</a>
</div>
<div class="tools">
<ul>
{% if constant('SHARE_TWITTER') == 1 %}<li><a href="https://twitter.com/home?status={{entry.title}}%20{{ entry.url|e }}%20via%20@getpoche" target="_blank" class="tool twitter"><span></span></a></li>{% endif %}
<li><a title="{% trans "toggle mark as read" %}" class="tool archive {% if entry.is_read == 0 %}archive-off{% endif %}" onclick="toggle_archive(this, {{ entry.id|e }})"><span></span></a></li>
<li><a href="#" id="themeswitch">{% trans "dark" %}</a></li>
<li><a title="{% trans "toggle favorite" %}" class="tool fav {% if entry.is_fav == 0 %}fav-off{% endif %}" onclick="toggle_favorite(this, {{ entry.id|e }})"><span></span></a></li>
<li><a href="./" title="{% trans "back to home" %}" class="tool">&larr;</a></li>
<li><a title="{% trans "toggle mark as read" %}" class="tool archive {% if entry.is_read == 0 %}archive-off{% endif %}" href="./?action=toggle_archive&id={{ entry.id|e }}"><span></span></a></li>
<li><a title="{% trans "toggle favorite" %}" class="tool fav {% if entry.is_fav == 0 %}fav-off{% endif %}" href="./?action=toggle_fav&id={{ entry.id|e }}"><span></span></a></li>
<li><form method="post" style="display: inline;" action="index.php"><input type="hidden" name="token" id="token" value="{{ token }}" /><input type="hidden" id="view" name="view" value="index" /><input type="hidden" id="action" name="action" value="delete" /><input type="hidden" id="id" name="id" value="{{ entry.id|e }}" /><input type="submit" class="delete" title="{% trans "toggle delete" %}" /></form></li>
<li><a href="./?logout" title="{% trans "logout" %}">{% trans "logout" %}</a></li>
{% if constant('SHARE_TWITTER') == 1 %}<li><a href="https://twitter.com/home?status={{entry.title}}%20{{ entry.url|e }}%20via%20@getpoche" target="_blank" class="tool twitter"><span></span></a></li>{% endif %}
{% if constant('SHARE_MAIL') == 1 %}<li><a href="mailto:?subject={{ entry.title|e }}&body={{ entry.url|e }} via @getpoche" class="tool email"><span></span></a></li>{% endif %}
</ul>
</div>
<header class="mbm">
<h1><a href="{{ entry.url|e }}">{{ entry.title|e }}</a></h1>
<div class="vieworiginal txtright small"><a href="{{ entry.url|e }}" target="_blank" title="{% trans "original" %} : {{ entry.title|e }}">{% trans "view original" %}</a></div>
<h1>{{ entry.title|e }}</h1>
<div class="vieworiginal txtright small"><a href="{{ entry.url|e }}" target="_blank" title="{% trans "original" %} : {{ entry.title|e }}">{{ entry.url | e | getDomain }}</a></div>
</header>
<article>
<div id="readityourselfcontent">
{{ content | raw }}
</div>
</article>
<div class="vieworiginal txtright small"><a href="{$url}" target="_blank" title="{% trans "original" %} : {{ entry.title|e }}">{% trans "view original" %}</a></div>
<div class="vieworiginal txtright small"><a href="{{ entry.url|e }}" target="_blank" title="{% trans "original" %} : {{ entry.title|e }}">{{ entry.url | e | getDomain }}</a></div>
<div class="backhome">
<a href="./" title="{% trans "back to home" %}">&larr;</a>
<a href="#" title="{% trans "back to top" %}">&uarr;</a>
</div>
<div class="support">
{% trans "this article appears wrong?" %} <a href="https://github.com/inthepoche/poche/issues/new">{% trans "create an issue" %}</a> {% trans "or" %} <a href="mailto:support@inthepoche.com">{% trans "contact us by mail" %}</a>
{% trans "this article appears wrong?" %} <a href="https://github.com/inthepoche/poche/issues/new">{% trans "create an issue" %}</a> {% trans "or" %} <a href="mailto:support@inthepoche.com?subject=Wrong display in poche&body={{ entry.url|e }}">{% trans "contact us by mail" %}</a>
</div>
</div>
{% endblock %}
{% block js %}
<script type="text/javascript" src="./tpl/js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="./tpl/js/poche.js"></script>
{% endblock %}