diff --git a/lang/de-de.json b/lang/de-de.json index ece38a4..71bc601 100644 --- a/lang/de-de.json +++ b/lang/de-de.json @@ -11,9 +11,10 @@ "resizeuploadedimages": "Große Bilder verkleinen, um Fehler zu vermeiden", "language": "Sprache (Language)", "languageoptions": { - "de-DE": "Deutsch DE", - "en-US": "English US", - "en-GB": "English GB" + "de-de": "Deutsch (German)", + "en-us": "English (American English)", + "en-gb": "English (British English)", + "ru-ru": "Русский (Russian)" }, "error": { "save": "Konnte die Einstellungen nicht im Browser speichern.", @@ -94,23 +95,35 @@ "imagelink": "Online Link zum Bild", "imagelinktitle": "Du kannst diesen Link nehmen um das Bild auf anderen Seiten zu teilen oder hochzuladen", "opennewtabtitle": "Öffne das Bild in einem neuen Browsertab", - "imgur": "Imgur", - "reddit": "Reddit", - "twitter": "Twitter", - "facebook": "Facebook", - "pinterest": "Pinterest", "recentlyshared": "Kürzlich geteilte Bilder", "untitled": "Ohne Titel", "openlink": "Öffne Link", "openlinktitle": "Das Bild in einen neuen Browsertab öffnen", "offline": "Offline nehmen", "offlinetitle": "Dieses Bild von Imgur löschen und vom Netz nehmen", + "target": { + "imgur": "Imgur", + "reddit": "Reddit", + "twitter": "Twitter", + "facebook": "Facebook", + "pinterest": "Pinterest", + "vkontakte": "VKontakte" + }, + "link": { + "title": "Glitch!", + "description": { + "withoutname": "Schau mal was ich mit diesem Glitch Tool gemacht habe:", + "withname": "Schau mal was ich mit @snorpey’s Glitch Tool gemacht habe:", + "edited": "Das Bild habe ich mit snorpey's Glitch Tool bearbeitet:" + } + }, "error": { "base64": "Es gibt keine Base64-Adresse zum hochladen", "upload": "Konnte das Bild nicht auf Imgur hochladen." }, "message": { "upload": "Das Bild wurde zu Imgur hochgeladen. [Bild öffnen.]({$1})", + "delete": "Konnte das Bild nicht von Imgur löschen.", "del": "Das Bild wurde von Imgur gelöscht." } }, diff --git a/lang/en-gb.json b/lang/en-gb.json index 7123a74..563e270 100644 --- a/lang/en-gb.json +++ b/lang/en-gb.json @@ -10,9 +10,10 @@ "canzoomwithpointer": "Enable zooming with mousewheel and touch gestures", "language": "Language", "languageoptions": { - "de-DE": "Deutsch DE", - "en-US": "English US", - "en-GB": "English GB" + "de-de": "Deutsch (German)", + "en-us": "English (American English)", + "en-gb": "English (British English)", + "ru-ru": "Русский (Russian)" }, "resizeuploadedimages": "Resize big images to avoid errors", "error": { @@ -94,17 +95,28 @@ "imagelink": "Online link to image", "imagelinktitle": "You can use this link to share the image or embed it on other sites", "opennewtabtitle": "Open the image in a new browser tab", - "imgur": "Imgur", - "reddit": "Reddit", - "twitter": "Twitter", - "facebook": "Facebook", - "pinterest": "Pinterest", "recentlyshared": "Recently shared images", "untitled": "Untitled", "openlink": "Open Link", "openlinktitle": "Open the online link of this image in a new browser tab", "offline": "Take Offline", "offlinetitle": "Delete this image from Imgur", + "target": { + "imgur": "Imgur", + "reddit": "Reddit", + "twitter": "Twitter", + "facebook": "Facebook", + "pinterest": "Pinterest", + "vkontakte": "VKontakte" + }, + "link": { + "title": "Glitch!", + "description": { + "withoutname": "Check out what I made with this glitch tool:", + "withname": "Check out what I made with @snorpey’s glitch tool:", + "edited": "I made this with snorpey’s glitch tool:" + } + }, "error": { "base64": "No base64 URL to upload.", "upload": "Could not upload file to Imgur.", @@ -121,7 +133,7 @@ "webcamlabel": "Take a Picture", "trigger": "Take Picture", "triggertitle": "Click to take a picture with your webcam", - "picture": "'Webcam Picture {$1}", + "picture": "Webcam Picture {$1}", "error": { "access": "Could not access your webcam." } diff --git a/lang/en-us.json b/lang/en-us.json index 524d026..4f6c3fa 100644 --- a/lang/en-us.json +++ b/lang/en-us.json @@ -15,9 +15,10 @@ "canzoomwithpointer": "Enable zooming with mousewheel and touch gestures", "language": "Language", "languageoptions": { - "de-DE": "Deutsch DE", - "en-US": "English US", - "en-GB": "English GB" + "de-de": "Deutsch (German)", + "en-us": "English (American English)", + "en-gb": "English (British English)", + "ru-ru": "Русский (Russian)" }, "resizeuploadedimages": "Resize big images to avoid errors", "error": { @@ -102,17 +103,28 @@ "imagelink": "Online link to image", "imagelinktitle": "You can use this link to share the image or embed it on other sites", "opennewtabtitle": "Open the image in a new browser tab", - "imgur": "Imgur", - "reddit": "Reddit", - "twitter": "Twitter", - "facebook": "Facebook", - "pinterest": "Pinterest", "recentlyshared": "Recently shared images", "untitled": "Untitled", "openlink": "Open Link", "openlinktitle": "Open the online link of this image in a new browser tab", "offline": "Take Offline", "offlinetitle": "Delete this image from Imgur", + "target": { + "imgur": "Imgur", + "reddit": "Reddit", + "twitter": "Twitter", + "facebook": "Facebook", + "pinterest": "Pinterest", + "vkontakte": "VKontakte" + }, + "link": { + "title": "Glitch!", + "description": { + "withoutname": "Check out what I made with this glitch tool:", + "withname": "Check out what I made with @snorpey’s glitch tool:", + "edited": "I made this with snorpey’s glitch tool:" + } + }, "error": { "base64": "No base64 URL to upload.", "upload": "Could not upload file to Imgur.", @@ -129,7 +141,7 @@ "webcamlabel": "Take a Picture", "trigger": "Take Picture", "triggertitle": "Click to take a picture with your webcam", - "picture": "'Webcam Picture {$1}", + "picture": "Webcam Picture {$1}", "error": { "access": "Could not access your webcam." } diff --git a/lang/ru-ru.json b/lang/ru-ru.json new file mode 100644 index 0000000..19693d9 --- /dev/null +++ b/lang/ru-ru.json @@ -0,0 +1,156 @@ +{ + "lang": "ru-RU", + "index": { + "title": "Программа для обработки изображений", + "description": [ + "С помощью этого приложения, Вы можете обрабатывать Ваши собственные изображения, перетаскивая их в окне браузера. Используйте ползунки в панели управления, чтобы изменить параметры обработок. Изображение обновляется в режиме реального времени.", + "Это приложение несколько изменяет размер картинки [JPEG](https://en.wikipedia.org/wiki/JPEG) ,что нисколько не влияет на качество изображения. Эта программа была результатом вдохновления [soulwire](http://github.com/soulwire) [экспериментом](http://blog.soulwire.co.uk/laboratory/flash/as3-bitmapdata-glitch-generator) в Flash.", + "Этот редактор был создан [Георгом](http://snorpey.com/). Он всегда рад когда его программами пользуются и будет рад Вашему отзыву. Вы можете следить за ним на [Twitter](https://twitter.com/snorpey) или ознакомится с исходным кодом этого приложения на [GitHub](https://github.com/snorpey/jpg-glitch).", + "Если Вам понравилась эта программа по обработке изображений, то Вы можете проверить некоторые из других [JavaScript экспериментов Георга](http://snorpey.github.io/experiments/)." + ] + }, + "settings": { + "settings": "Настройки", + "settingstitle": "Изменить настройки программы", + "canzoomwithpointer": "Изменить масштаб изображения с помощью колеса мышки и прикасания", + "language": "Язык", + "languageoptions": { + "de-de": "Deutsch (German)", + "en-us": "English (American English)", + "en-gb": "English (British English)", + "ru-ru": "Русский (Russian)" + }, + "resizeuploadedimages": "Изменить размер больших изображений во избежание ошибок", + "error": { + "save": "Не удалось сохранить настройки в своем браузере.", + "load": "Не удалось загрузить предыдущие настройки из браузера." + } + }, + "about": { + "info": "Информация", + "infotitle": "Дополнительная Информация" + }, + "controls": { + "controls": "Управления", + "controlstitle": "Показать и скрыть элементы управления", + "randomize": "Случайные настройки", + "randomizetitle": "Выбрать случайные контрольные значения", + "center": "Центр", + "centertitle": "Масштабировать изображение на весь экран", + "original": "100%", + "originaltitle": "Увеличить изображение до его исходного размера (100%)", + "zoom": "Масштабирование", + "amount": "Количество", + "seed": "Начальное значение", + "iterations": "Повторения", + "quality": "Качество", + "fullscreen": "Полноэкранный режим", + "fullscreentitle": "Включение и выключение полноэкранного режима" + }, + "nav": { + "menu": "Меню", + "menutitle": "Включение и выключение главного меню" + }, + "file": { + "open": "Открыть", + "opentitle": "Открыть изображение с Вашего устройства", + "import": "Импортировать файл", + "importtitle": "Откройте изображение с жесткого диска", + "recent": "Изображения с предыдущих сессий", + "norecent": "Нет доступа к недавно отредактированным файлам", + "untitled": "Без имени", + "del": "Удалить", + "deltitle": "Удалить это изображение с браузера", + "openimage": "Открыть", + "openimagetitle": "Загрузить изображение", + "offline": "Взять с форума", + "offlinetitle": "Удалить изображение с Imgur", + "openlink": "Открыть ссылку", + "openlinktitle": "Открыть изображение в новой вкладке", + "save": "Сохранить", + "savetitle": "Сохранить текущее изображение для более поздних сессий", + "download": "Загрузить изображение", + "downloadtitle": "Загрузить обработанное изображение на свое устройство", + "saveinbrowser": "Сохранить", + "saveinbrowsertitle": "Сохранить изображение в своем браузере", + "error": { + "load": "Не удалось получить данные предыдущего сеанса из браузера.", + "save": "Не удалось сохранить данные вашего браузера.", + "openimage": "Не удалось открыть изображение", + "openfile": "Не удалось открыть файл." + }, + "message": { + "before": "Этот файл был сохранен ранее.", + "save": "Файл был сохранен в браузере.", + "del": "Файл был удален из вашего браузера.", + "resize": "Изображение было уменьшено во избежание ошибок." + } + }, + "share": { + "share": "Поделиться", + "sharetitle": "Поделиться изображением в интернете", + "info": [ + "Вы можете загрузить изображение на [Imgur](https://imgur.com) чтобы поделиться им.", + "Пожалуйста, обратите внимание, что после загрузки изображение будет общедоступно в Imgur и Вы соглашаетесь с пользовательским соглашением [Imgur](https://imgur.com/tos)." + ], + "openon": "Открыть изображение на {$1}", + "openontitle": "Открыть изображение, которым Вы поделились на {$1}", + "shareon": "Поделиться на {$1}", + "shareontitle": "Поделиться отредактированным изображением на {$1}", + "upload": "Загрузить изображение на Imgur", + "uploadtitle": "Загрузить изображение на Imgur для того чтобы поделиться им с остальными", + "uploading": "Изображение загружается …", + "imagelink": "Ссылка на изображение", + "imagelinktitle": "Вы можете использовать эту ссылку, чтобы поделиться изображением или загрузить его на другие сайты", + "opennewtabtitle": "Открыть изображение в новом окне", + "recentlyshared": "Недавние фото которыми Вы поделились", + "untitled": "Без имени", + "openlink": "Открыть ссылку", + "openlinktitle": "Открыть изображение в новом окне", + "offline": "Взять с форума", + "offlinetitle": "Удалить изображение с Imgur", + "target": { + "imgur": "Imgur", + "reddit": "Reddit", + "twitter": "Twitter", + "facebook": "Facebook", + "pinterest": "Pinterest", + "vkontakte": "Вконтакте" + }, + "link": { + "title": "Glitch!", + "description": { + "withoutname": "Смотри, что я сделал с помощью этой программы:", + "withname": "Посмотри,что я сделал с фоторедактором @snorpey’s Glitch Tool:", + "edited": "Я обработал это изображение в snorpey’s Glitch Tool:" + } + }, + "error": { + "base64": "Ошибка при загрузке.", + "upload": "Невозможно загрузить файл на Imgur.", + "del": "Невозможно удалить файл с Imgur." + }, + "message": { + "upload": "Изображение было успешно загружено на Imgur [Открыть изображение]({$1}).", + "del": "Изображение было успешно удалено из Imgur." + } + }, + "webcam": { + "webcam": "Веб-камера", + "webcamtitle": "Сделать фото веб-камерой", + "webcamlabel": "Фото", + "trigger": "Сделать фото", + "triggertitle": "Нажмите, чтобы сфотографироваться веб-камерой", + "picture": "Фото с веб-камеры {$1}", + "error": { + "access": "Не удалось получить доступ к Вашей веб-камере." + } + }, + "welcome": { + "firstvisit": [ + "Добро Пожаловать! Кажется, ты здесь впервые.", + "Для начала, перетащите ползунок ниже для обработки изображения.", + "Вы также можете импортировать изображения с устройства. Просто нажмите на кнопку ОТКРЫТЬ в меню." + ] + } +} \ No newline at end of file diff --git a/scripts/config.js b/scripts/config.js index df26036..6fbb1a7 100644 --- a/scripts/config.js +++ b/scripts/config.js @@ -36,13 +36,23 @@ define( settings: { canZoomWithPointer: { value: true }, resizeUploadedImages: { value: true }, - language: { value: 'en-us', options: [ 'en-us', 'en-gb', 'de-de' ] } + language: { value: 'en-us', options: [ 'en-us', 'en-gb', 'de-de', 'ru-ru' ] } }, localForage: { name : 'glitchtool', storeName : 'keyvaluepairs' }, - origin: location.protocol + '//' + location.host + ( location.port !== '' ? ':' + location.port : '' ) + origin: location.protocol + '//' + location.host + ( location.port !== '' ? ':' + location.port : '' ), + share: { + appURL: 'https://snorpey.github.io/jpg-glitch', + sharer: { + facebook: 'https://www.facebook.com/sharer/sharer.php', + twitter: 'https://twitter.com/intent/tweet', + reddit: 'https://www.reddit.com/submit', + pinterest: 'https://pinterest.com/pin/create/button/', + vkontakte: 'http://vk.com/share.php' + } + } }; } ); \ No newline at end of file diff --git a/scripts/models/localisationmodel.js b/scripts/models/localisationmodel.js index 11af594..72140e1 100644 --- a/scripts/models/localisationmodel.js +++ b/scripts/models/localisationmodel.js @@ -77,9 +77,8 @@ define( if ( el && attribute && key ) { textElData.push( { el: el, attribute: attribute, key: key, wasUpdated: false, args: getArgs( arguments ) } ); } else { - if ( typeof el === 'string' ) { - return getTextForKey( el, getArgs( arguments, 1 ) ); - } + var args = getArgs( arguments, 1 ); + return getTextForKey( el, getArgs( arguments, 1 ) ); } updateAllTexts(); @@ -117,7 +116,7 @@ define( currentLanguage = newLanguageName; languageWasLoaded = true; texts = newLanguage; - + saveLanguage( newLanguage ); resetAllTexts(); updateAllTexts(); @@ -191,7 +190,14 @@ define( args.forEach( function ( arg, index ) { regex = new RegExp( '{\\$' + ( index + 1 ) + '}' ); - result = result.replace( regex, arg ); + + if ( typeof arg === 'string' ) { + result = result.replace( regex, arg ); + } else { + if ( typeof arg === 'function' ) { + result = result.replace( regex, arg() ); + } + } } ); } diff --git a/scripts/util/string.js b/scripts/util/string.js index 9dc11b6..2b0eb9d 100644 --- a/scripts/util/string.js +++ b/scripts/util/string.js @@ -69,11 +69,26 @@ define( endTag; } + // http://stackoverflow.com/a/1714899/229189 + function objToQueryStr ( obj, prefix ) { + var str = [ ]; + + for ( var p in obj ) { + if ( obj.hasOwnProperty( p ) ) { + var k = prefix ? prefix + '[' + p + ']' : p, v = obj[p]; + str.push( typeof v === 'object' ? objToQueryStr( v, k ) : encodeURIComponent( k ) + '=' + encodeURIComponent( v ) ); + } + } + + return str.join( '&' ); + } + return { toCamelCase: toCamelCase, autop: autop, markdownToHtml: markdownToHtml, - markdownLinksToHtml: markdownLinksToHtml + markdownLinksToHtml: markdownLinksToHtml, + objToQueryStr: objToQueryStr }; } ) \ No newline at end of file diff --git a/scripts/views/appview.js b/scripts/views/appview.js index 663eadb..1036d6c 100644 --- a/scripts/views/appview.js +++ b/scripts/views/appview.js @@ -1,7 +1,7 @@ /*global define*/ define( - [ 'util/el' ], - function ( elHelper ) { + [ 'util/el', 'util/localizetext' ], + function ( elHelper, loc ) { // the app view, wrapping element of the app // also updates the html element classes function AppView ( parentEl ) { @@ -12,6 +12,9 @@ define( var self = this; var el = elHelper.createEl( 'div', 'app', parentEl ); + loc( document.title, 'textContent', 'index.title' ); + loc( document.documentElement, 'lang', 'lang' ); + function showOnlineOptions () { document.documentElement.classList.add( 'is-online' ); diff --git a/scripts/views/controlsview.js b/scripts/views/controlsview.js index 0e0af01..04188e1 100644 --- a/scripts/views/controlsview.js +++ b/scripts/views/controlsview.js @@ -1,7 +1,7 @@ /*global define*/ define( - [ 'util/addpublishers', 'util/el' ], - function ( addPublishers, elHelper ) { + [ 'util/addpublishers', 'util/el', 'util/localizetext' ], + function ( addPublishers, elHelper, loc ) { // the control elements are used to change the appearance of the image function ControlsView ( parentEl, buttonParentEl, params ) { if ( ! ( this instanceof ControlsView ) ) { @@ -44,7 +44,8 @@ define( function addControl ( key, params ) { var controlEl = elHelper.createEl( 'div', 'control', controlsWrapperEl ); - elHelper.createLabel( 'controls.' + key, 'input-' + key, 'control-label', controlEl ); + var labelEl = elHelper.createLabel( 'controls.' + key, 'input-' + key, 'control-label', controlEl ); + loc( labelEl, 'title', 'controls.' + key ); var inputEl = elHelper.createEl( 'input', 'control-input', controlEl ); inputEl.setAttribute( 'data-key', key ); diff --git a/scripts/views/navview.js b/scripts/views/navview.js index 71340de..f15b115 100644 --- a/scripts/views/navview.js +++ b/scripts/views/navview.js @@ -57,7 +57,7 @@ define( buttonEl.addEventListener( 'click', toggle, false ); var headlineEl = elHelper.createEl( 'h1', 'nav-headline', el ); - headlineEl.textContent = document.title; + loc( headlineEl, 'textContent', 'index.title' ); var navBreakPoint = 600; var navWidth = 300; diff --git a/scripts/views/settingsview.js b/scripts/views/settingsview.js index 174b59c..2ef301c 100644 --- a/scripts/views/settingsview.js +++ b/scripts/views/settingsview.js @@ -40,7 +40,7 @@ define( optionEl.value = option; loc( optionEl, 'textContent', 'settings.' + name + 'options.' + option ); - + if ( option === value ) { optionEl.selected = true } diff --git a/scripts/views/shareview.js b/scripts/views/shareview.js index 6c4d050..5a01825 100644 --- a/scripts/views/shareview.js +++ b/scripts/views/shareview.js @@ -1,7 +1,7 @@ /*global define*/ define( - [ 'util/addpublishers', 'views/dialog', 'util/el', 'util/browser', 'util/time', 'util/localizetext' ], - function ( addPublishers, Dialog, elHelper, browser, timeHelper, loc ) { + [ 'config', 'util/addpublishers', 'views/dialog', 'util/el', 'util/browser', 'util/time', 'util/string', 'util/localizetext' ], + function ( config, addPublishers, Dialog, elHelper, browser, timeHelper, strHelper, loc ) { // shareview lets users upload their glitched image to imgur and // share links on social media function ShareView ( parentEl ) { @@ -39,24 +39,28 @@ define( imgLinkEl.id = 'img-link-input'; var imgurLinkEl = elHelper.createLink( null, null, null, blankTargetStr, 'imgur-link button' ); - loc( imgurLinkEl, 'textContent', 'share.openon', 'Imgur' ); - loc( imgurLinkEl, 'title', 'share.openontitle', 'Imgur' ); + loc( imgurLinkEl, 'textContent', 'share.openon', getLocFn( 'share.target.imgur' ) ); + loc( imgurLinkEl, 'title', 'share.openontitle', getLocFn( 'share.target.imgur' ) ); var redditShareLinkEl = elHelper.createLink( null, null, null, blankTargetStr, 'reddit-link button' ); - loc( redditShareLinkEl, 'textContent', 'share.shareon', 'Reddit' ); - loc( redditShareLinkEl, 'title', 'share.shareontitle', 'Reddit' ); + loc( redditShareLinkEl, 'textContent', 'share.shareon', getLocFn( 'share.target.reddit' ) ); + loc( redditShareLinkEl, 'title', 'share.shareontitle', getLocFn( 'share.target.reddit' ) ); var twitterShareLinkEl = elHelper.createLink( null, null, null, blankTargetStr, 'twitter-link button' ); - loc( twitterShareLinkEl, 'textContent', 'share.shareon', 'Twitter' ); - loc( twitterShareLinkEl, 'title', 'share.shareontitle', 'Twitter' ); + loc( twitterShareLinkEl, 'textContent', 'share.shareon', getLocFn( 'share.target.twitter' ) ); + loc( twitterShareLinkEl, 'title', 'share.shareontitle', getLocFn( 'share.target.twitter' ) ); var facebookShareLinkEl = elHelper.createLink( null, null, null, blankTargetStr, 'facebook-link button' ); - loc( facebookShareLinkEl, 'textContent', 'share.shareon', 'Facebook' ); - loc( facebookShareLinkEl, 'title', 'share.shareontitle', 'Facebook' ); + loc( facebookShareLinkEl, 'textContent', 'share.shareon', getLocFn( 'share.target.facebook' ) ); + loc( facebookShareLinkEl, 'title', 'share.shareontitle', getLocFn( 'share.target.facebook' ) ); var pinterestShareLinkEl = elHelper.createLink( null, null, null, blankTargetStr, 'pinterest-link button' ); - loc( pinterestShareLinkEl, 'textContent', 'share.shareon', 'Pinterest' ); - loc( pinterestShareLinkEl, 'title', 'share.shareontitle', 'Pinterest' ); + loc( pinterestShareLinkEl, 'textContent', 'share.shareon', getLocFn( 'share.target.pinterest' ) ); + loc( pinterestShareLinkEl, 'title', 'share.shareontitle', getLocFn( 'share.target.pinterest' ) ); + + var vkontakteShareLinkEl = elHelper.createLink( null, null, null, blankTargetStr, 'vkontakte-link button' ); + loc( vkontakteShareLinkEl, 'textContent', 'share.shareon', getLocFn( 'share.target.vkontakte' ) ); + loc( vkontakteShareLinkEl, 'title', 'share.shareontitle', getLocFn( 'share.target.vkontakte' ) ); var sharedListEl; @@ -69,7 +73,8 @@ define( .add( isOnlineCssClass, redditShareLinkEl ) .add( isOnlineCssClass, twitterShareLinkEl ) .add( isOnlineCssClass, facebookShareLinkEl ) - .add( isOnlineCssClass, pinterestShareLinkEl ); + .add( isOnlineCssClass, pinterestShareLinkEl ) + .add( isOnlineCssClass, vkontakteShareLinkEl ); if ( browser.test( 'localforage' ) ) { sharedListEl = elHelper.createEl( 'ul', 'shared-list dialog-list' ); @@ -89,16 +94,19 @@ define( function updateShareUrl ( imgUrl, imgId ) { clearTimeout( clearTimeoutId ); + var imgurLink = 'https://imgur.com/' + imgId; + dialog.el.classList.add( 'has-links' ); imgLinkEl.textContent = imgUrl; imgLinkEl.href = imgUrl; imgLinkEl.setAttribute( 'data-imgurid', imgId ); - imgurLinkEl.href = 'https://imgur.com/' + imgId; + imgurLinkEl.href = imgurLink; - redditShareLinkEl.href = getRedditShareUrl( imgUrl ); - twitterShareLinkEl.href = getTwitterShareUrl( imgUrl ); - facebookShareLinkEl.href = getFacebookShareUrl( imgUrl ); - pinterestShareLinkEl.href = getPinterestShareUrl( imgUrl ); + redditShareLinkEl.href = getShareUrl( 'reddit', imgUrl, imgurLink ); + twitterShareLinkEl.href = getShareUrl( 'twitter', imgUrl, imgurLink ); + facebookShareLinkEl.href = getShareUrl( 'facebook', imgUrl, imgurLink ); + pinterestShareLinkEl.href = getShareUrl( 'pinterest', imgUrl, imgurLink ); + vkontakteShareLinkEl.href = getShareUrl( 'vkontakte', imgUrl, imgurLink ); } function clearShareUrl () { @@ -286,39 +294,48 @@ define( } } - function getShareDescription ( imgUrl ) { - return 'Check out what I made with @snorpey’s glitch tool: ' + imgUrl + ' https://snorpey.github.io/jpg-glitch'; + // https://gist.github.com/dr-dimitru/7164862 + function getShareUrl ( service, imgUrl, imgurLink ) { + var description = loc( 'share.link.description.edited' ); + var title = loc( 'share.link.title' ); + var params = { }; + + if ( [ 'reddit', 'vkontakte' ].indexOf( service ) !== -1 ) { + params.title = title; + } + + if ( [ 'pinterest', 'vkontakte' ].indexOf( service ) !== -1 ) { + params.description = description + ' ' + config.share.appURL; + params.url = config.appURL; + } + + if ( service === 'pinterest' ) { + params.media = imgUrl; + } + + if ( service === 'vkontakte' ) { + params.image = imgUrl; + } + + if ( service === 'reddit' ) { + params.url = imgUrl; + } + + if ( service === 'facebook' ) { + params.u = imgurLink; + } + + if ( service === 'twitter' ) { + params.text = loc( 'share.link.description.withname' ) + ' ' + imgUrl + ' ' + config.share.appURL; + } + + return config.share.sharer[service] + '?' + strHelper.objToQueryStr( params ); } - - function getTwitterShareUrl ( imgUrl ) { - return 'https://twitter.com/intent/tweet?text=' + encodeURIComponent( getShareDescription( imgUrl ) ); - } - - function getRedditShareUrl ( imgUrl ) { - return 'https://www.reddit.com/submit?url=' + encodeURIComponent( imgUrl ) + '&title=Glitch!'; - } - - // http://ar.zu.my/how-to-really-customize-the-deprecated-facebook-sharer-dot-php/ - function getFacebookShareUrl ( imgUrl ) { - var text = 'Check out what I made with this glitch tool: https://snorpey.github.io/jpg-glitch'; - var shareUrl = 'https://www.facebook.com/sharer/sharer.php?s=100'; - shareUrl += '&p[url]=' + imgUrl; - shareUrl += '&p[title]=Glitch!'; - shareUrl += '&p[images][0]=' + imgUrl; - shareUrl += '&p[summary]=' + encodeURIComponent( text ); - - return shareUrl; - } - - function getPinterestShareUrl ( imgUrl ) { - var text = 'I made this with snorpey\'s glitch tool: https://snorpey.github.io/jpg-glitch'; - var link = 'https://snorpey.github.io/jpg-glitch'; - var shareUrl = 'https://pinterest.com/pin/create/button/'; - shareUrl += '?url=' + encodeURIComponent( link ); - shareUrl += '&media=' + encodeURIComponent( imgUrl ); - shareUrl += '&description=' + encodeURIComponent( text ); - - return shareUrl; + + function getLocFn ( key ) { + return function () { + return loc( key ); + } } self.showUpload = showUpload; diff --git a/styles/modules/about.css b/styles/modules/about.css index 27d7383..9430b2b 100644 --- a/styles/modules/about.css +++ b/styles/modules/about.css @@ -1,6 +1,6 @@ .about-content { max-width: 300px; - max-height: calc(100vh - 270px); + max-height: calc(100vh - 355px); overflow: auto; padding-bottom: 15px; } diff --git a/styles/modules/controls.css b/styles/modules/controls.css index 24387f3..b437906 100644 --- a/styles/modules/controls.css +++ b/styles/modules/controls.css @@ -52,7 +52,7 @@ display: block; float: left; width: 100%; - max-width: 60px; + max-width: 70px; height: 100%; font-size: 11px; margin-right: 10px; @@ -72,7 +72,7 @@ width: 100%; height: 100%; min-height: 10px; - max-width: calc(100% - 105px); + max-width: calc(100% - 115px); background-color: transparent; margin-top: 0; margin-bottom: 0; @@ -96,6 +96,11 @@ .controls .random-button { display: none; + overflow: hidden; + text-overflow: ellipsis; + width: 100%; + max-width: 90px; + white-space: nowrap; } /*two columns*/ diff --git a/styles/modules/dialog.css b/styles/modules/dialog.css index 579d284..a7d0b07 100644 --- a/styles/modules/dialog.css +++ b/styles/modules/dialog.css @@ -282,7 +282,7 @@ margin-left: 15px; } -.has-touch .share-dialog.is-active { +.share-dialog.is-active { max-height: calc(100vh - 270px); overflow: auto; } diff --git a/styles/modules/nav.css b/styles/modules/nav.css index 41fc533..e101aa7 100644 --- a/styles/modules/nav.css +++ b/styles/modules/nav.css @@ -124,7 +124,7 @@ } .nav-headline { - height: 50px; + /*height: 50px;*/ line-height: 50px; color: #fff; font-weight: normal;