1
0
Fork 0

Adds preview for avatar image prior to submit

This commit is contained in:
Carly Ho 2019-01-08 22:47:22 -06:00
parent 2eba39d317
commit c88071de26
10 changed files with 97791 additions and 13 deletions

17248
public/css/app.css vendored

File diff suppressed because one or more lines are too long

93
public/js/activity.js vendored
View File

@ -1 +1,92 @@
!function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="/",n(n.s=1)}({1:function(e,t,n){e.exports=n("hUgz")},hUgz:function(e,t){$(document).ready(function(){$(".pagination").hide();var e=document.querySelector(".notification-page .list-group");new InfiniteScroll(e,{path:".pagination__next",append:".notification-page .list-group",status:".page-load-status",history:!0})})}});
/******/ (function(modules) { // webpackBootstrap
/******/ // The module cache
/******/ var installedModules = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/
/******/ // Check if module is in cache
/******/ if(installedModules[moduleId]) {
/******/ return installedModules[moduleId].exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = installedModules[moduleId] = {
/******/ i: moduleId,
/******/ l: false,
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/
/******/ // Flag the module as loaded
/******/ module.l = true;
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/******/
/******/ // expose the modules object (__webpack_modules__)
/******/ __webpack_require__.m = modules;
/******/
/******/ // expose the module cache
/******/ __webpack_require__.c = installedModules;
/******/
/******/ // define getter function for harmony exports
/******/ __webpack_require__.d = function(exports, name, getter) {
/******/ if(!__webpack_require__.o(exports, name)) {
/******/ Object.defineProperty(exports, name, {
/******/ configurable: false,
/******/ enumerable: true,
/******/ get: getter
/******/ });
/******/ }
/******/ };
/******/
/******/ // getDefaultExport function for compatibility with non-harmony modules
/******/ __webpack_require__.n = function(module) {
/******/ var getter = module && module.__esModule ?
/******/ function getDefault() { return module['default']; } :
/******/ function getModuleExports() { return module; };
/******/ __webpack_require__.d(getter, 'a', getter);
/******/ return getter;
/******/ };
/******/
/******/ // Object.prototype.hasOwnProperty.call
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
/******/
/******/ // __webpack_public_path__
/******/ __webpack_require__.p = "/";
/******/
/******/ // Load entry module and return exports
/******/ return __webpack_require__(__webpack_require__.s = 1);
/******/ })
/************************************************************************/
/******/ ({
/***/ "./resources/assets/js/activity.js":
/***/ (function(module, exports) {
$(document).ready(function () {
$('.pagination').hide();
var elem = document.querySelector('.notification-page .list-group');
var infScroll = new InfiniteScroll(elem, {
path: '.pagination__next',
append: '.notification-page .list-group',
status: '.page-load-status',
history: true
});
});
/***/ }),
/***/ 1:
/***/ (function(module, exports, __webpack_require__) {
module.exports = __webpack_require__("./resources/assets/js/activity.js");
/***/ })
/******/ });

39619
public/js/app.js vendored

File diff suppressed because one or more lines are too long

40662
public/js/components.js vendored

File diff suppressed because one or more lines are too long

149
public/js/timeline.js vendored
View File

@ -1 +1,148 @@
!function(e){var t={};function n(i){if(t[i])return t[i].exports;var o=t[i]={i:i,l:!1,exports:{}};return e[i].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=e,n.c=t,n.d=function(e,t,i){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:i})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var i=Object.create(null);if(n.r(i),Object.defineProperty(i,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(i,o,function(t){return e[t]}.bind(null,o));return i},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="/",n(n.s=3)}({3:function(e,t,n){e.exports=n("KqaD")},KqaD:function(e,t){$(document).ready(function(){$(".pagination").hide(),$(".container.timeline-container").removeClass("d-none");var e=document.querySelector(".timeline-feed"),t=e.getAttribute("data-timeline");$('.timeline-sidenav .nav-link[data-type="'+t+'"]').addClass("active"),pixelfed.readmore(),pixelfed.fetchLikes(),$("video").on("play",function(){activated=this,$("video").each(function(){this!=activated&&this.pause()})}),new InfiniteScroll(e,{path:".pagination__next",append:".timeline-feed",status:".page-load-status",history:!1}).on("append",function(e,t,n){pixelfed.hydrateLikes(),$(".status-card > .card-footer").each(function(){var e=$(this);e.hasClass("d-none")||e.find('input[name="comment"]').val()||$(this).addClass("d-none")}),$("video").on("play",function(){activated=this,$("video").each(function(){this!=activated&&this.pause()})})})}),$(document).on("DOMContentLoaded",function(){var e=!1,t=function(){if(pixelfed.readmore(),!1===e){e=!0;var t=[].slice.call(document.querySelectorAll("img.lazy"));t.forEach(function(e){e.getBoundingClientRect().top<=window.innerHeight&&e.getBoundingClientRect().bottom>=0&&"none"!==getComputedStyle(e).display&&(e.src=e.dataset.src,e.srcset=e.dataset.srcset,e.classList.remove("lazy"),t=t.filter(function(t){return t!==e}))}),e=!1}};document.addEventListener("scroll",t),window.addEventListener("resize",t),window.addEventListener("orientationchange",t)})}});
/******/ (function(modules) { // webpackBootstrap
/******/ // The module cache
/******/ var installedModules = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/
/******/ // Check if module is in cache
/******/ if(installedModules[moduleId]) {
/******/ return installedModules[moduleId].exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = installedModules[moduleId] = {
/******/ i: moduleId,
/******/ l: false,
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/
/******/ // Flag the module as loaded
/******/ module.l = true;
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/******/
/******/ // expose the modules object (__webpack_modules__)
/******/ __webpack_require__.m = modules;
/******/
/******/ // expose the module cache
/******/ __webpack_require__.c = installedModules;
/******/
/******/ // define getter function for harmony exports
/******/ __webpack_require__.d = function(exports, name, getter) {
/******/ if(!__webpack_require__.o(exports, name)) {
/******/ Object.defineProperty(exports, name, {
/******/ configurable: false,
/******/ enumerable: true,
/******/ get: getter
/******/ });
/******/ }
/******/ };
/******/
/******/ // getDefaultExport function for compatibility with non-harmony modules
/******/ __webpack_require__.n = function(module) {
/******/ var getter = module && module.__esModule ?
/******/ function getDefault() { return module['default']; } :
/******/ function getModuleExports() { return module; };
/******/ __webpack_require__.d(getter, 'a', getter);
/******/ return getter;
/******/ };
/******/
/******/ // Object.prototype.hasOwnProperty.call
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
/******/
/******/ // __webpack_public_path__
/******/ __webpack_require__.p = "/";
/******/
/******/ // Load entry module and return exports
/******/ return __webpack_require__(__webpack_require__.s = 3);
/******/ })
/************************************************************************/
/******/ ({
/***/ "./resources/assets/js/timeline.js":
/***/ (function(module, exports) {
$(document).ready(function () {
$('.pagination').hide();
$('.container.timeline-container').removeClass('d-none');
var elem = document.querySelector('.timeline-feed');
var type = elem.getAttribute('data-timeline');
$('.timeline-sidenav .nav-link[data-type="' + type + '"]').addClass('active');
pixelfed.readmore();
pixelfed.fetchLikes();
$('video').on('play', function () {
activated = this;
$('video').each(function () {
if (this != activated) this.pause();
});
});
var infScroll = new InfiniteScroll(elem, {
path: '.pagination__next',
append: '.timeline-feed',
status: '.page-load-status',
history: false
});
infScroll.on('append', function (response, path, items) {
pixelfed.hydrateLikes();
$('.status-card > .card-footer').each(function () {
var el = $(this);
if (!el.hasClass('d-none') && !el.find('input[name="comment"]').val()) {
$(this).addClass('d-none');
}
});
$('video').on('play', function () {
activated = this;
$('video').each(function () {
if (this != activated) this.pause();
});
});
});
});
$(document).on("DOMContentLoaded", function () {
var active = false;
var lazyLoad = function lazyLoad() {
pixelfed.readmore();
if (active === false) {
active = true;
var lazyImages = [].slice.call(document.querySelectorAll("img.lazy"));
lazyImages.forEach(function (lazyImage) {
if (lazyImage.getBoundingClientRect().top <= window.innerHeight && lazyImage.getBoundingClientRect().bottom >= 0 && getComputedStyle(lazyImage).display !== "none") {
lazyImage.src = lazyImage.dataset.src;
lazyImage.srcset = lazyImage.dataset.srcset;
lazyImage.classList.remove("lazy");
lazyImages = lazyImages.filter(function (image) {
return image !== lazyImage;
});
}
});
active = false;
};
};
document.addEventListener("scroll", lazyLoad);
window.addEventListener("resize", lazyLoad);
window.addEventListener("orientationchange", lazyLoad);
});
/***/ }),
/***/ 3:
/***/ (function(module, exports, __webpack_require__) {
module.exports = __webpack_require__("./resources/assets/js/timeline.js");
/***/ })
/******/ });

View File

@ -1,7 +1,7 @@
{
"/js/activity.js": "/js/activity.js?id=7915246c3bc2b7e9770e",
"/js/app.js": "/js/app.js?id=ea57709b5a7ef8657ff4",
"/css/app.css": "/css/app.css?id=0d2d3f52adde32658692",
"/js/components.js": "/js/components.js?id=f6de7bd1e3ec76ab599a",
"/js/timeline.js": "/js/timeline.js?id=83c85c7144756ee9a72e"
"/js/components.js": "/js/components.js?id=e2f19ce19c3be557c4d8",
"/js/app.js": "/js/app.js?id=64e1dbb38f4fbf6202e4",
"/css/app.css": "/css/app.css?id=f222eb0627d08ba55261",
"/js/timeline.js": "/js/timeline.js?id=21dfbf9e0a261c9a77b7",
"/js/activity.js": "/js/activity.js?id=2b27ba75791b911c6691"
}

View File

@ -43,6 +43,7 @@ require('./components/commentform');
require('./components/searchform');
require('./components/bookmarkform');
require('./components/statusform');
require('./components/settingspage');
//require('./components/embed');
//require('./components/notifications');

View File

@ -0,0 +1,14 @@
$(document).ready(function () {
$('#avatarInput').on('change', function(e) {
var file = document.getElementById('avatarInput').files[0];
var reader = new FileReader();
reader.addEventListener("load", function() {
$('#previewAvatar').html('<img src="' + reader.result + '" class="rounded-circle box-shadow" />');
}, false);
if (file) {
reader.readAsDataURL(file);
}
});
});

View File

@ -455,3 +455,10 @@ details summary::-webkit-details-marker {
.notification-tooltip .arrow::before {
border-bottom-color:#dc3545 !important;
}
#previewAvatar {
img {
max-width: 100%;
height: auto;
}
}

View File

@ -22,6 +22,7 @@
<label class="custom-file-label" for="avatarInput">Select a profile photo</label>
</div>
<p><span class="small font-weight-bold">Must be a jpeg or png. Max avatar size: <span id="maxAvatarSize"></span></span></p>
<div id="previewAvatar"></div>
<p class="mb-0"><button type="submit" class="btn btn-primary px-4 py-0 font-weight-bold">Upload</button></p>
</div>
</form>