diff --git a/css/style.css b/css/style.css
index dd99ddc..8b9f17a 100644
--- a/css/style.css
+++ b/css/style.css
@@ -1139,6 +1139,80 @@ input.userMenu-search-field:focus::-ms-input-placeholder {
color: #5e8da4;
text-decoration: none;
}
+/* Inpost previw */
+.preview-container
+{
+ height: 100px;
+ width: 95%;
+ margin: 0 auto;
+ overflow: hidden;
+ display: none;
+ -webkit-border-radius: 10px;
+ -moz-border-radius: 10px;
+ border-radius: 10px;
+ /*line-height: 0;*/
+ margin-bottom: 3px;
+ position: relative;
+}
+.image-preview
+{
+ max-height: 500px;
+ max-width: 100%;
+ margin: 0 auto;
+ display: block;
+}
+/* video preview */
+
+.vimeo #imgOverlay {
+ border-left: 10px solid #0f5fb6;
+}
+.youtube #imgOverlay {
+ border-left: 10px solid #d8121e;
+}
+
+#ytPreviewTmpl {
+ position: relative;
+ height: 100%;
+ width: 100%;
+}
+
+#vidPreviewTmpl img {
+ max-height: 500px;
+ width: 100%;
+ margin: 0 auto;
+ display: block;
+}
+#imgOverlay {
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ background: #000;
+ opacity: .6;
+}
+#descWrap {
+ position: absolute;
+ top: 5px;
+ left: 50%;
+ width: 450px;
+ margin-left: -225px;
+
+}
+#descWrap a, #descWrap p {
+ position: relative;
+}
+#descWrap a {
+ color: #fff;
+ font: 22px "Open Sans Condensed", sans-serif;
+}
+#descWrap p {
+ color: #d3d3d3;
+ font: 14px "Open Sans Condensed", sans-serif;
+ margin-top: 5px;
+}
+
+
.mini-screen-name
{
font-size: 13px;
@@ -1256,26 +1330,6 @@ input.userMenu-search-field:focus::-ms-input-placeholder {
display: none;
padding: 5px 5px 0 5px;
}
-.image-preview
-{
- max-height: 500px;
- max-width: 100%;
- margin: 0 auto;
- display: block;
-}
-.preview-container
-{
- height: 100px;
- width: 95%;
- margin: 0 auto;
- overflow: hidden;
- display: none;
- -webkit-border-radius: 10px;
- -moz-border-radius: 10px;
- border-radius: 10px;
- line-height: 0;
- margin-bottom: 3px;
-}
.post-stats
{
margin: 0 10px 0 55px;
diff --git a/home.html b/home.html
index c26b8a0..3393060 100644
--- a/home.html
+++ b/home.html
@@ -292,6 +292,17 @@
diff --git a/js/calm.js b/js/calm.js
index bff4c6e..6d87ac6 100644
--- a/js/calm.js
+++ b/js/calm.js
@@ -1,7 +1,5 @@
$(function(){
- $('.post-text').on('click', 'a', function(e){
- e.stopPropagation();
- });
+ $('.post-text, #descWrap').on('click', 'a', function(e){e.stopPropagation();});
$('#showqr').on('click', function(){
if($('#qrcode img')[0]) return;
var skey = document.getElementById('skey').innerText;
@@ -16,7 +14,6 @@ $(function(){
})
-
function dhtIndicatorBg(){
var bgcolor = '';
if(twisterDhtNodes <= 20){bgcolor = '#770900'
@@ -76,8 +73,53 @@ function changeStyle() {
$('#profilecss').attr('href', profile);
setTimeout(function(){$(menu).removeAttr('style')}, 0);
}
+function getJSONToLocalStorage (t) {
+ var ytRegExp = /(?:https?:\/\/)?(?:www\.)?(?:youtu\.be\/|youtube\.com\/(?:embed\/|v\/|watch\?v=|watch\?.+&v=))((\w|-){11})(?:\S+)?/i;
+ var vimeoRegExp = /http:\/\/(www\.)?vimeo.com\/(\d+)(\/)?/i;
+
+ if (ytRegExp.test(t.value)){
+ var ytid = t.value.match(ytRegExp) ? RegExp.$1 : false;
+ var ytDataStorage = localStorage['ytData'] ? JSON.parse(localStorage['ytData']) : {};
+ $.ajax({
+ url: "http://gdata.youtube.com/feeds/api/videos/"+ytid+"?v=2&alt=jsonc",
+ dataType: 'jsonp',
+ success: function(data) {
+ ytDataStorage[ytid] = {
+ title: data.data.title,
+ description: data.data.description.substring(0, 400),
+ thumbnail: data.data.thumbnail.hqDefault,
+ link: 'http://youtu.be/'+ytid
+ };
+ localStorage['ytData'] = JSON.stringify(ytDataStorage);
+ }
+ });
+ }else if(vimeoRegExp.test(t.value)) {
+ var vimid = t.value.match(vimeoRegExp) ? RegExp.$2 : false;
+ var vimDataStorage = localStorage['vimData'] ? JSON.parse(localStorage['vimData']) : {};
+
+ $.ajax({
+ url: "http://vimeo.com/api/v2/video/"+vimid+".json",
+ dataType: 'json',
+ success: function(data) {
+ console.log(data);
+ vimDataStorage[vimid] = {
+ title: data[0].title,
+ description: data[0].description.substring(0, 400),
+ thumbnail: data[0].thumbnail_large,
+ link: data[0].url,
+ time: Date.now()
+ };
+ localStorage['vimData'] = JSON.stringify(vimDataStorage);
+ }
+ });
+ }
+
+}
function homeIntInit () {
modalDMIntr ();
$('textarea').on('click', function() {mensAutocomplete(this)});
+ $('textarea').on('keyup', function() {
+ getJSONToLocalStorage(this)
+ })
}
\ No newline at end of file
diff --git a/js/options.js b/js/options.js
index 9e4763a..37778f0 100644
--- a/js/options.js
+++ b/js/options.js
@@ -104,20 +104,25 @@ function setTheme() {
}
function setShowPreviewOpt(){
- $('#displayPreview').val(localStorage['showPreviewOpt'] || "enable");
- $('input[type="checkbox"]').prop('checked', localStorage['showPreviewOptGif'] == 'true')
+ $('.previewOpt').each(function() {
+ this.value = localStorage[this.id] || 'enable';
+ })
+
+ $('input[type="checkbox"]').prop('checked', localStorage['imagesPreviewGif'] == 'true')
- if(localStorage['showPreviewOpt'] == 'disable'){
+ if(localStorage['imagesPreview'] == 'disable'){
$('input[type="checkbox"]').prop('disabled', true)
}
- if(!localStorage['showPreviewOpt']) localStorage['showPreviewOpt'] = "enable";
+ if(!localStorage['imagesPreview']) localStorage['imagesPreview'] = "enable";
- $('#displayPreview').on('change', function(){
- localStorage['showPreviewOpt'] = $(this).val();
- switch($(this).val()){
- case 'enable': $('.gifCheckBox').prop('disabled', false); break;
- case 'disable': $('.gifCheckBox').prop('disabled', true); break;
+ $('.previewOpt').on('change', function(){
+ localStorage[this.id] = $(this).val();
+ if (this.id === 'imagesPreview'){
+ switch($(this).val()){
+ case 'enable': $('.gifCheckBox').prop('disabled', false); break;
+ case 'disable': $('.gifCheckBox').prop('disabled', true); break;
+ }
}
})
diff --git a/js/twister_formatpost.js b/js/twister_formatpost.js
index f85f630..b343e71 100644
--- a/js/twister_formatpost.js
+++ b/js/twister_formatpost.js
@@ -100,14 +100,25 @@ function postToElem( post, kind ) {
retweetedByElem.attr("href", $.MAL.userUrl(retweeted_by));
retweetedByElem.text('@'+retweeted_by);
}
- //hed//image in post
- var previewContainer = elem.find('.preview-container'), postText = elem.find(".post-text");
-
- if(imagePreview(postText)){
+
+ //hed//media preview
+ var previewContainer = elem.find('.preview-container'), postText = elem.find(".post-text");
+ var postLink = postText.find("a[rel='nofollow']")[0] ? postText.find("a[rel='nofollow']")[0].href : '';
+ var ytRegExp = /(?:https?:\/\/)?(?:www\.)?(?:youtu\.be\/|youtube\.com\/(?:embed\/|v\/|watch\?v=|watch\?.+&v=))((\w|-){11})(?:\S+)?/i;
+ var vimeoRegExp = /http:\/\/(www\.)?vimeo.com\/(\d+)($|\/)/i;
+
+ if (postLink && localStorage['imagesPreview'] == 'enable' && (/(\.jpg)|(\.gif)|(\.png)|(\.jpeg)|(\.jpe)/i.test(postLink) || /https:\/\/img.bi/gi.test(postLink))){
previewContainer.show();
- previewContainer.append(imagePreview(postText))
- };
-
+ previewContainer.append(imagePreview(postLink, t));
+ }else if(postLink && ytRegExp.test(postLink) && localStorage['youtubePreview'] === 'enable'){
+ var ytid = postLink.match(ytRegExp) ? RegExp.$1 : false;
+ previewContainer.show();
+ previewContainer.append(getYoutubePreview(postLink, ytid));
+ }else if(postLink && vimeoRegExp.test(postLink) && localStorage['vimeoPreview'] === 'enable'){
+ var vimid = postLink.match(vimeoRegExp) ? RegExp.$2 : false;
+ previewContainer.show();
+ previewContainer.append(getVimeoPreview(postLink, vimid));
+ }
return elem;
}
@@ -293,19 +304,72 @@ function _extractHashtag(s) {
function escapeHtmlEntities(str) {
return str.replace('&', '&').replace('<', '<').replace('>', '>').replace('"', '"').replace("'", ''');
}
-function imagePreview(post) {
- if (localStorage['showPreviewOpt'] == 'enable') {
- var link = post.find("a[rel='nofollow']");
- var linkAnon = 'https://ssl-proxy.my-addr.org/myaddrproxy.php/http/';
- if (link.html() && /(\.jpg)|(\.gif)|(\.png)|(\.jpeg)|(\.jpe)/.test(link.html().toLowerCase()))
- {
- var cleanLink = link.html().replace(/^http[s]?:\/\//i, '');
- if(/\.gif\b/i.test(cleanLink) && localStorage['showPreviewOptGif'] == 'false') return;
- return "
![]("+linkAnon+cleanLink+")
";
- } else if (link.html() && /https:\/\/img.bi/.test(link.html().toLowerCase()))
- {
- return "
![]()
";
- // imgBiJS();
- }
+
+function imagePreview(link) {
+ var linkAnon = 'https://ssl-proxy.my-addr.org/myaddrproxy.php/http/';
+
+ if (link && /https:\/\/img.bi/gi.test(link)){
+ return "
![]()
";
+ imgBiJS();
+ }else{
+ var cleanLink = link.replace(/^http[s]?:\/\//i, '');
+ if(/\.gif\b/i.test(cleanLink) && localStorage['imagesPreviewGif'] == 'false') return;
+ return "
![]("+linkAnon+cleanLink+")
";
+ }
+}
+
+function getYoutubePreview(link, ytid) {
+
+ var vidPreviewTmpl = $('#vidPreviewTmpl').clone(true).removeAttr('style').removeAttr('class').addClass("youtube");
+ var ytDataStorage = localStorage['ytData'] ? JSON.parse(localStorage['ytData']) : {};
+
+ if (ytDataStorage[ytid]) {
+ vidPreviewTmpl.find('img').attr('src', ytDataStorage[ytid].thumbnail);
+ vidPreviewTmpl.find('a').text(ytDataStorage[ytid].title).attr('href', link).attr('target', '_blank');
+ if (ytDataStorage[ytid].description) vidPreviewTmpl.find('p').html(ytDataStorage[ytid].description+'…');
+ return vidPreviewTmpl;
+ }else{
+ $.ajax({
+ url: "http://gdata.youtube.com/feeds/api/videos/"+ytid+"?v=2&alt=jsonc",
+ dataType: 'jsonp',
+ success: function(data) {
+ ytDataStorage[ytid] = {
+ title: data.data.title,
+ description: data.data.description.substring(0, 400),
+ thumbnail: data.data.thumbnail.hqDefault,
+ link: 'http://youtu.be/'+ytid,
+ time: Date.now()
+ };
+ localStorage['ytData'] = JSON.stringify(ytDataStorage);
+
+ }
+ });
+ }
+}
+
+function getVimeoPreview (link, vimid) {
+ var vidPreviewTmpl = $('#vidPreviewTmpl').clone(true).removeAttr('style').removeAttr('class').addClass("vimeo");
+ var vimDataStorage = localStorage['vimData'] ? JSON.parse(localStorage['vimData']) : {};
+
+ if (vimDataStorage[vimid]) {
+ vidPreviewTmpl.find('img').attr('src', vimDataStorage[vimid].thumbnail);
+ vidPreviewTmpl.find('a').text(vimDataStorage[vimid].title).attr('href', link).attr('target', '_blank');
+ if (vimDataStorage[vimid].description) vidPreviewTmpl.find('p').html(vimDataStorage[vimid].description+'…');
+ return vidPreviewTmpl;
+ }else{
+ $.ajax({
+ url: "http://vimeo.com/api/v2/video/"+vimid+".json",
+ dataType: 'json',
+ success: function(data) {
+ vimDataStorage[vimid] = {
+ title: data[0].title,
+ description: data[0].description.substring(0, 400),
+ thumbnail: data[0].thumbnail_large,
+ link: data[0].url,
+ time: Date.now()
+ };
+ localStorage['vimData'] = JSON.stringify(vimDataStorage);
+ }
+ });
}
}
\ No newline at end of file
diff --git a/options.html b/options.html
index 45906e0..e36e7f2 100644
--- a/options.html
+++ b/options.html
@@ -138,12 +138,23 @@