Wgrywanie zdjęć na empikfoto - w jakiej technologii zostało wykonane?

0

Witajcie, tak się zastanawiam w jakiej technologii zostało zrobione wgrywanie zdjęc na stronie empikfoto.
[ http://www.empikfoto.pl/panelodbitek/odbitki-zwykle?startAk=Nctk5nLs9U8DGp91Viia2x7i](http://www.empikfoto.pl/panelodbitek/odbitki-zwykle?startAk=Nctk5nLs9U8DGp91Viia2x7i)

Wiem, że to jest js ale czy np w reactjs da rade coś takiego zrobić? Chodzi mi o uploader funkcjonalnie działający do tego z empika.

0

Wydaje mi się, czy po prostu zachwycasz się modalami?
ps.
angular


var app = angular.module('printPanelApp');
app.controller('SummaryCtrl', ['$scope', '$timeout', '$q', '$http', 'InitService', 'dialogService', 'dataShare', 'editorEmpty', 'uploaderOpen', 'StorageService', 'PathSettingsService', 'PathService', '$window', 'SVGService', 'ToolsService', 'storageChange', 'cacheService', 'globalSettingsService', 'frameService', 'addToCart',
    function ($scope, $timeout, $q, $http, InitService, dialogService, dataShare, editorEmpty, uploaderOpen, StorageService, PathSettingsService, PathService, $window, SVGService, ToolsService, storageChange, cacheService, globalSettingsService, frameService, addToCart) {

        // uruchomienie raz skryptu
        var cacheKey = "uploader-data-point",
                cacheValue = true;
        if (!cacheService.get(cacheKey)) {
            Array.prototype.filter.call(document.getElementsByClassName('js-send-photos'), function (element)
            {
                element.setAttribute('data-point', 'prints');
            }
            );
            cacheService.put(cacheKey, cacheValue);
        }
        
        
        $scope.$on('storage_change', function () {
            $scope.storage = storageChange.getData();
        });

        $scope.$on('add_to_cart', function () {
            $scope.addToCartPath();
        });

        //<editor-fold defaultstate="collapsed" desc="storage_change">  
        $scope.$on('storage_change', function () {
            // $scope.storage = PathSettingsService.getStorage();
            $scope.storage = storageChange.getData();
            // $scope.$apply();
        });
        //</editor-fold>

        //<editor-fold defaultstate="collapsed" desc="openUploader()">  
        $scope.openUploader = function (type) {
            var $el = $('body'),
                    previewMaxWidth = 500,
                    previewMaxHeight = 375,
                    smallMaxWidth = 130,
                    smallMaxHeight = 130,
                    emptyFrame = ToolsService.getEmptyFrame(),
                    emptyEffect = ToolsService.getEmptyEffect(),
                    formatsDetials = InitService.setPhotoDetails(),
                    pathId = PathSettingsService.getPathId();

            if (!type) {
                // otwieram okno z opcją admore w przypadku braku zdjeć
                $el.trigger('uploader.addMore');
                $el.off("uploader.begin");
            } else {
                // wczytuje zdjecia zaznaczone przez użytkownika
                tools.showMyPhotosPreloader();
            }

            $el.on("uploader.begin", function (e, obj) {
                var numPhotosToUpload = obj.images.length;

                // jesli upload przynajmniej 1 zdjecia
                if (numPhotosToUpload) {
                    $scope.openGlobalSetting();
                }

                var isPhotoIdNotExists = '',
                        numPhotos = 0,
                        photoTmpId = '',
                        tmp = {},
                        tmp2 = {},
                        photo = '',
                        i = 0,
                        formatId = '',
                        photoQuantity = 0,
                        uniqId = tools.uniqueId(),
                        photoDefinition = {},
                        key = '';
                $scope.storage.uploading = true;
                $scope.storage.isButtonAddToCartAvailable = InitService.checkCartAvailable(false);
                angular.forEach(obj.images, function (data) {
                    photoDefinition = angular.copy(StorageService.getPhotoDefinition());
                    photoQuantity = 0;
                    tmp.tmpId = angular.copy(data.getData().tmpId);
                    tmp.id = angular.copy(data.getData().id);
                    tmp.albumId = angular.copy(data.getData().albumId);
                    tmp.ak = $scope.uploaderAk;
                    tmp.type = angular.copy(data.getData().type);
                    tmp.name = angular.copy(data.getData().name);
                    tmp.small = angular.copy(data.getData().small);
                    tmp.large = angular.copy(data.getData().large);
                    tmp.preview = angular.copy(data.getData().preview);
                    tmp.smallWidth = angular.copy(data.getData().smallWidth);
                    tmp.smallHeight = angular.copy(data.getData().smallHeight);
                    tmp.width = angular.copy(data.getData().width);
                    tmp.height = angular.copy(data.getData().height);
                    // preview i small
                    if (tmp.width < tmp.height) {
                        // tmp.previewWidth = parseFloat(tmp.smallWidth * previewMaxHeight / tmp.smallHeight);
                        tmp.previewWidth = parseFloat(tmp.width * previewMaxHeight / tmp.height);
                        tmp.previewHeight = previewMaxHeight;
                        tmp.smallWidth = parseFloat(tmp.width * smallMaxHeight / tmp.height);
                        tmp.smallHeight = smallMaxHeight;
                    } else if (tmp.width > tmp.height) {
                        tmp.previewWidth = previewMaxWidth;
                        tmp.previewHeight = parseFloat(previewMaxWidth * tmp.height / tmp.width);
                        tmp.smallWidth = smallMaxWidth;
                        tmp.smallHeight = parseFloat(smallMaxWidth * tmp.height / tmp.width);
                    } else {
                        tmp.previewWidth = previewMaxHeight;
                        tmp.previewHeight = previewMaxHeight;
                        tmp.smallWidth = smallMaxHeight;
                        tmp.smallHeight = smallMaxHeight;
                    }

                    // wyznaczam crop automatyczny dla całego zdjęcia zgodnie z ustawieniami ścieżki
                    tmp.crop = {};
                    tmp.cropForSmall = {};
                    // dla sciezki dokumenty 

                    if (pathId === 7) {
                        //  ustawiam dane do crop
                        tmp.crop.type = 'vertical';
                        tmp.cropForSmall.type = tmp.crop.type;
                    } else {
                        tmp.crop.type = 'auto';
                        tmp.cropForSmall.type = tmp.crop.type;
                    }

                    cacheKey = 'setCropForPathFormats-' + tmp.width + '-' + tmp.height + '-preview-' + tmp.crop.type + '-false';
                    if (cacheService.get(cacheKey)) {
                        cacheValue = cacheService.get(cacheKey);
                    } else {
                        cacheValue = SVGService.setCropForPathFormats(tmp, 'preview', tmp.crop.type, false)
                        cacheService.put(cacheKey, cacheValue);
                    }
//...

Podejrzyj w debugerze
btw, średni ten ich niezminifikowany kod.

0

Nie zachwyca, tylko zastanawiam się jak do tego podejść i od czego zaczac

Dziękuję

1 użytkowników online, w tym zalogowanych: 0, gości: 1