moparisthebest
/
wallabag
mirror of https://github.com/moparisthebest/wallabag
1
0
Fork 0
Code Issues Releases Wiki Activity

feature #505 - it is now possible to add link from bagged article (TODO: redev it to ajax action). Some enhancements to "save a link" popup div

This commit is contained in:
Maryana Rozhankivska 2014-03-12 17:36:04 +02:00
parent f7382cd8c3
commit 6775da70a8
5 changed files with 109 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
themes/baggy/_head.twig
View File

@ -8,6 +8,7 @@
<link rel="stylesheet" href="{{ poche_url }}/themes/{{theme}}/css/messages.css" media="all">
<link rel="stylesheet" href="{{ poche_url }}/themes/{{theme}}/css/print.css" media="print">
<script src="{{ poche_url }}/themes/{{theme}}/js/jquery-2.0.3.min.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/init.js"></script>
<script src="{{ poche_url }}/themes/{{ constant('DEFAULT_THEME') }}/js/closeMessage.js"></script>

5
themes/baggy/_menu.twig
View File

@ -4,9 +4,10 @@
<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=tags" {% if view == 'tags' %}class="current"{% endif %}>{% trans "tags" %}</a></li>
<li><a href="javascript: void(null);" id="bagit">{% trans "save a link" %}</a></li>
<li style="position: relative;"><a href="javascript: void(null);" id="bagit">{% trans "save a link" %}</a>
{% include '_pocheit-form.twig' %}
</li>
<li><a href="./?view=config" {% if view == 'config' %}class="current"{% endif %}>{% trans "config" %}</a></li>
<li><a class="icon icon-power" href="./?logout" title="{% trans "logout" %}">{% trans "logout" %}</a></li>
</ul>
{% include '_pocheit-form.twig' %}

7
themes/baggy/_pocheit-form.twig
View File

@ -1,7 +1,8 @@
<div id="bagit-form" class="messages info">
<form method="get" action="index.php">
<h2>{% trans "Save a link" %}</h2>
<form method="get" action="index.php" target="_blank">
<h2><a href="javascript: void(null);" id="bagit-form-close">X</a>
{% trans "Save a link" %}</h2>
<input type="hidden" name="autoclose" value="1" />
<input required placeholder="example.com/article" class="addurl" id="plainurl" name="plainurl" type="url" />
<input type="submit" value="{% trans "save link!" %}" />
</form>

64
themes/baggy/css/main.css
View File

@ -534,32 +534,78 @@ footer a {
display: none;
}
/* ==========================================================================
2.1 = "save a link" popup div related styles
========================================================================== */
#bagit-form {
background: rgba(0,0,0,0.8);
position: fixed;
background: rgba(0,0,0,0.5);
position: absolute;
top: 0;
left: 10em;
z-index: 20;
height: 100%;
width: 100%;
margin: 0;
margin-top: -30%;
padding: 2em;
display: none;
border-left: 1px #EEE solid;
}
#bagit-form form {
background: #FFF;
position: absolute;
top: 50%;
left: 50%;
top: 0;
left: 0;
z-index: 20;
border: 10px solid #000;
width: 600px;
height: 300px;
margin: -150px 0 0 -300px;
width: 400px;
height: 200px;
/* margin: -150px 0 0 -300px; */
padding: 2em;
}
a#bagit-form-close {
background: #000;
color: #FFF;
padding: 0.2em 0.5em;
text-decoration: none;
display: inline-block;
float: right;
font-size: 0.6em;
}
a#bagit-form-close:hover {
background: #999;
color: #000;
}
.active-current {
background-color: #999;
}
.active-current:after {
content: "";
width: 0;
height: 0;
position: absolute;
border-style: solid;
border-width: 10px;
border-color: transparent #EEE transparent transparent;
right: 0;
top: 50%;
margin-top: -10px;
}
.opacity03 {
opacity: 0.3;
}
.add-to-wallabag-link-after {
background-color: #000;
color: #fff;
padding: 0 3px 2px 3px;
}
/* ==========================================================================
3 = Pictos
@ -920,4 +966,8 @@ blockquote {
#display-mode {
display: none;
}
#bagit-form {
left: 0;
}
}

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

@ -48,31 +48,58 @@ $.fn.ready(function() {
}
/* ==========================================================================
bag it link
========================================================================== */
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(){
$bagitForm.toggle();
toggleSaveLinkForm();
});
$("#bagit-form-close").click(function(){
toggleSaveLinkForm();
});
$('#bagit-form form').submit(function(){
toggleSaveLinkForm();
return true;
});
/* ==========================================================================
Keyboard gestion
========================================================================== */
Keyboard gestion
========================================================================== */
$(window).keydown(function(e){
if ( e.target.tagName.toLowerCase() !== 'input' ) {
switch (e.keyCode) {
// s letter
case 83:
$bagitForm.toggle();
return false;
break;
case 27:
$bagitForm.hide();
break;
}
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){
event.preventDefault();
toggleSaveLinkForm($(this).attr('href'));
return false;
});
});