moparisthebest/wallabag
1
0
Fork 0
mirror of https://github.com/moparisthebest/wallabag synced 2024-11-23 17:42:15 -05:00
Code Issues Releases Wiki Activity

Merge pull request #586 from mariroz/wb-link-in-wb

Browse Source 
wallabag a link in wallabag now in default theme, issue #505
This commit is contained in:
Nicolas Lœuillet 2014-03-27 19:44:28 +01:00
commit 04fbe8f5ef
8 changed files with 163 additions and 103 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
themes/baggy/_head.twig
View File

@ -11,4 +11,5 @@
<script src="{{ poche_url }}/themes/{{ constant('DEFAULT_THEME') }}/js/autoClose.js"></script> <script src="{{ poche_url }}/themes/{{ constant('DEFAULT_THEME') }}/js/autoClose.js"></script>
<script src="{{ poche_url }}/themes/{{theme}}/js/jquery.cookie.js"></script> <script src="{{ poche_url }}/themes/{{theme}}/js/jquery.cookie.js"></script>
<script src="{{ poche_url }}/themes/{{theme}}/js/init.js"></script> <script src="{{ poche_url }}/themes/{{theme}}/js/init.js"></script>
<script src="{{ poche_url }}/themes/{{ constant('DEFAULT_THEME') }}/js/saveLink.js"></script>
<script src="{{ poche_url }}/themes/{{ constant('DEFAULT_THEME') }}/js/closeMessage.js"></script> <script src="{{ poche_url }}/themes/{{ constant('DEFAULT_THEME') }}/js/closeMessage.js"></script>

80
themes/baggy/js/init.js
View File

@ -1,10 +1,7 @@
$.fn.ready(function() { $.fn.ready(function() {
var $listmode = $('#listmode'), var $listmode = $('#listmode'),
$listentries = $("#list-entries"), $listentries = $("#list-entries");
$bagit = $('#bagit'),
$bagitForm = $('#bagit-form');
$bagitFormForm = $('#bagit-form-form');
/* ========================================================================== /* ==========================================================================
Menu Menu
@ -48,79 +45,4 @@ $.fn.ready(function() {
$listmode.addClass("tablemode"); $listmode.addClass("tablemode");
} }
/* ==========================================================================
bag it link and close button
========================================================================== */
function toggleSaveLinkForm(url) {
$bagit.toggleClass("active-current");
$bagitForm.toggle();
$('#content').toggleClass("opacity03");
if (url !== 'undefined' && url) {
$('#plainurl').val(url);
}
$('#plainurl').focus();
}
$bagit.click(function(){
toggleSaveLinkForm();
});
$("#bagit-form-close").click(function(){
toggleSaveLinkForm();
});
//send "bag it link" form request via ajax
$bagitFormForm.submit( function(event) {
$bagitFormForm.css("cursor", "wait");
$("#add-link-result").empty();
$.ajax({
type: $bagitFormForm.attr('method'),
url: $bagitFormForm.attr('action'),
data: $bagitFormForm.serialize(),
success: function(data) {
$('#add-link-result').html("Done!");
$('#plainurl').val('');
$('#plainurl').blur('');
$bagitFormForm.css("cursor", "auto");
//setTimeout( function() { toggleSaveLinkForm(); }, 1000); //close form after 1000 delay
},
error: function(data) {
$('#add-link-result').html("Failed!");
$bagitFormForm.css("cursor", "auto");
}
});
event.preventDefault();
});
/* ==========================================================================
Keyboard gestion
========================================================================== */
$(window).keydown(function(e){
if ( ( e.target.tagName.toLowerCase() !== 'input' && e.keyCode == 83 ) || e.keyCode == 27 ) {
toggleSaveLinkForm();
return false;
}
});
/* ==========================================================================
Process all links inside an article
========================================================================== */
$("article a[href^='http']").after(function() {
return " <a href=\"" + $(this).attr('href') + "\" class=\"add-to-wallabag-link-after\" alt=\"add to wallabag\" title=\"add to wallabag\">w</a> ";
});
$(".add-to-wallabag-link-after").click(function(event){
toggleSaveLinkForm($(this).attr('href'));
event.preventDefault();
});
}); });

1
themes/default/_head.twig
View File

@ -10,3 +10,4 @@
<script src="{{ poche_url }}/themes/default/js/jquery-2.0.3.min.js"></script> <script src="{{ poche_url }}/themes/default/js/jquery-2.0.3.min.js"></script>
<script src="{{ poche_url }}/themes/default/js/autoClose.js"></script> <script src="{{ poche_url }}/themes/default/js/autoClose.js"></script>
<script src="{{ poche_url }}/themes/default/js/closeMessage.js"></script> <script src="{{ poche_url }}/themes/default/js/closeMessage.js"></script>
<script src="{{ poche_url }}/themes/default/js/saveLink.js"></script>

6
themes/default/_menu.twig
View File

@ -3,11 +3,11 @@
<li><a href="./?view=fav" {% if view == 'fav' %}class="current"{% endif %}>{% trans "favorites" %}</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=archive" {% if view == 'archive' %}class="current"{% endif %}>{% trans "archive" %}</a></li>
<li><a href="./?view=tags" {% if view == 'tags' %}class="current"{% endif %}>{% trans "tags" %}</a></li> <li><a href="./?view=tags" {% if view == 'tags' %}class="current"{% endif %}>{% trans "tags" %}</a></li>
<li><a href="javascript: void(null);" id="pocheit">{% trans "save a link" %}</a><span id="pocheit-arrow"></span></li> <li><a href="javascript: void(null);" id="bagit">{% trans "save a link" %}</a><span id="bagit-arrow"></span></li>
<li><a href="javascript: void(null);" id="search">{% trans "search" %}</a><span id="search-arrow"></span></li> <li><a href="javascript: void(null);" id="search">{% trans "search" %}</a><span id="search-arrow"></span></li>
<li><a href="./?view=config" {% if view == 'config' %}class="current"{% endif %}>{% trans "config" %}</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> <li><a href="./?logout" title="{% trans "logout" %}">{% trans "logout" %}</a></li>
</ul> </ul>
{% include '_pocheit-form.twig' %} {% include '_pocheit-form.twig' %}
{% include '_search-form.twig' %} {% include '_search-form.twig' %}

26
themes/default/_pocheit-form.twig
View File

@ -1,22 +1,8 @@
<div id="pocheit-form" class="messages info"> <div id="bagit-form" class="messages info">
<center> <a href="javascript: void(null);" id="bagit-form-close">&nbsp;</a>
<form method="get" action="index.php"> <form method="get" action="index.php" id="bagit-form-form">
<input required placeholder="example.com/article" class="addurl" id="plainurl" name="plainurl" type="url" /> <input required placeholder="example.com/article" class="addurl" id="plainurl" name="plainurl" type="url" />
<input type="submit" value="{% trans "save link!" %}" /> <input type="submit" value="{% trans "save link!" %}" />
<div id="add-link-result"></div>
</form> </form>
</center>
</div> </div>
<script type="text/javascript">
$(document).ready(function() {
$("#pocheit-form").hide();
$("#pocheit").click(function(){
$("#pocheit-form").toggle();
$("#pocheit").toggleClass("current");
$("#pocheit-arrow").toggleClass("arrow-down");
});
});
</script>

47
themes/default/css/style.css
View File

@ -355,3 +355,50 @@ a.reading-time span {
vertical-align: top; vertical-align: top;
} }
/* ==========================================================================
"save a link" popup div related styles
========================================================================== */
#bagit-form {
display: none;
padding-left: 30px;
width: 450px;
}
a#bagit-form-close {
color: #FFF;
display: inline-block;
float: right;
background: url("../img/messages/close.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
height: 16px;
margin: -14px -8px 0 0;
width: 16px;
text-decoration: none;
}
.add-to-wallabag-link-after {
background-color: #000;
color: #fff;
padding: 0 4px 1px 3px;
font-weight: bold;
font-size: 0.7em;
border-radius: 4px;
}
.add-to-wallabag-link-after:hover, .add-to-wallabag-link-after:active {
color: #fff;
}
.add-to-wallabag-link-after:visited {
color: #999;
}
#add-link-result {
display: inline;
padding-left: 10px;
}
.opacity03 {
/*opacity: 0.3;*/
}

101
themes/default/js/saveLink.js Executable file
View File

@ -0,0 +1,101 @@
$.fn.ready(function() {
var $bagit = $('#bagit'),
$bagitForm = $('#bagit-form'),
$bagitFormForm = $('#bagit-form-form');
/* ==========================================================================
bag it link and close button
========================================================================== */
function toggleSaveLinkForm(url, event) {
$("#add-link-result").empty();
$bagit.toggleClass("active-current");
//only if bagiti link is not presented on page
if ( $bagit.length === 0 ) {
if ( event !== 'undefined' && event ) {
$bagitForm.css( {position:"absolute", top:event.pageY, left:event.pageX-200});
}
else {
$bagitForm.css( {position:"relative", top:"auto", left:"auto"});
}
}
$bagitForm.toggle();
$('#content').toggleClass("opacity03");
if (url !== 'undefined' && url) {
$('#plainurl').val(url);
}
$('#plainurl').focus();
}
$bagit.click(function(){
$bagit.toggleClass("current");
$("#bagit-arrow").toggleClass("arrow-down");
toggleSaveLinkForm();
});
$("#bagit-form-close").click(function(){
$bagit.removeClass("current");
$("#bagit-arrow").removeClass("arrow-down");
toggleSaveLinkForm();
});
//send "bag it link" form request via ajax
$bagitFormForm.submit( function(event) {
$("body").css("cursor", "wait");
$("#add-link-result").empty();
$.ajax({
type: $bagitFormForm.attr('method'),
url: $bagitFormForm.attr('action'),
data: $bagitFormForm.serialize(),
success: function(data) {
$('#add-link-result').html("Done!");
$('#plainurl').val('');
$('#plainurl').blur('');
$("body").css("cursor", "auto");
//setTimeout( function() { toggleSaveLinkForm(); }, 1000); //close form after 1000 delay
},
error: function(data) {
$('#add-link-result').html("Failed!");
$("body").css("cursor", "auto");
}
});
event.preventDefault();
});
/* ==========================================================================
Keyboard gestion
========================================================================== */
$(window).keydown(function(e){
if ( ( e.target.tagName.toLowerCase() !== 'input' && e.keyCode == 83 ) || e.keyCode == 27 ) {
$bagit.removeClass("current");
$("#bagit-arrow").removeClass("arrow-down");
toggleSaveLinkForm();
return false;
}
});
/* ==========================================================================
Process all links inside an article
========================================================================== */
$("article a[href^='http']").after(function() {
return " <a href=\"" + $(this).attr('href') + "\" class=\"add-to-wallabag-link-after\" alt=\"add to wallabag\" title=\"add to wallabag\">w</a> ";
});
$(".add-to-wallabag-link-after").click(function(event){
toggleSaveLinkForm($(this).attr('href'), event);
event.preventDefault();
});
});

2
themes/default/view.twig
View File

@ -1,6 +1,7 @@
{% extends "layout.twig" %} {% extends "layout.twig" %}
{% block title %}{{ entry.title|raw }} ({{ entry.url | e | getDomain }}){% endblock %} {% block title %}{{ entry.title|raw }} ({{ entry.url | e | getDomain }}){% endblock %}
{% block content %} {% block content %}
{% include '_pocheit-form.twig' %}
<div id="article_toolbar"> <div id="article_toolbar">
<ul> <ul>
<li><a href="./" title="{% trans "Return home" %}" class="tool back"><span>{% trans "Return home" %}</span></a></li> <li><a href="./" title="{% trans "Return home" %}" class="tool back"><span>{% trans "Return home" %}</span></a></li>
@ -55,3 +56,4 @@
}); });
</script> </script>
{% endblock %} {% endblock %}