Задать вопрос
Ответы пользователя по тегу JavaScript
  • Какой фреймворк для JavaScript MDI приложения лучше?

    AMar4enko
    @AMar4enko
    ExtJS или Dojo, правда первый бесплатный только для OpenSource
    Ответ написан
  • Как раcколдовать магию ember.js?

    AMar4enko
    @AMar4enko
    stackoverflow.com/questions/16971011/itemcontrolle...
    В цикле each для каждого элемента создается контроллер TodoController. В элементе у инпута checked=isCompleted - это как раз и есть двусторонняя привязка данных.
    Ответ написан
    Комментировать
  • Как создать 2 одинаковых независимых объекта в JavaScript?

    AMar4enko
    @AMar4enko
    Вам надо было начать с того, что за данные у вас. Я посмотрел на github - у вас вложенные массивы.
    В этом случае вариант @ghaiklor не сработает, потому что он только для плоских объектов.
    data.slice(0) тоже не проканает, потому что уникальным будет только первый уровень массива.
    Попробуйте JSON.parse(JSON.stringify(data))
    Ответ написан
    4 комментария
  • Как создать 2 одинаковых независимых объекта в JavaScript?

    AMar4enko
    @AMar4enko
    У вас объекты независимые, но вы в конструкторы передаете один и тот же экземпляр данных, т.е. у вас coordinates один на два объекта.
    В JavaScript нет стандартного метода для осуществления "глубокого клонирования".
    Если используете jQuery, то можете попробовать this.coordinates = $.extend({},coordinates).
    Ответ написан
    5 комментариев
  • Как избавиться от зависимых запросов?

    AMar4enko
    @AMar4enko
    Вам уже правильно сказали, что надо сделать отдельный API-метод для этой ситуации. По-сути это REST-метод получения коллекции с фильтром.
    В качестве фильтра у вас будут выступать город и категория.
    Для города и категории у вас хранится alias и id, с фронта вам прилетает alias.
    Вы проверяете, есть ли у вас в кеше сохраненные id для переданных алиасов города и категории. Если нет, то строите большой запрос с джойнами, который фильтрует по альясам. В результате выполнения вы помимо информации по музеям получите id города и категории, которые вы кладете в кеш. Последующие запросы возьмут id из кеша и запрос будет к одной таблице без джойнов с фильтром по конкретным id.
    Ответ написан
    Комментировать
  • Двухсторонний шаблонизатор?

    AMar4enko
    @AMar4enko
    Дело в том, что вы старательно пытаетесь игнорировать тот факт, что в требованиях пришли к single page application на JS. И пробуете найти какой-то подход, который оставит вас в рамках текущей парадигмы разработки.
    А решения уже придуманы давно и их очень много, можно выбирать на любой вкус. И все он заключаются в том, что на сервере шаблонизации нет вообще - там только данные.
    Все взаимодействие с фронтом через REST API.

    Единственное, что может вызвать проблему в этом случае - индексация такого приложения браузером. Но и тут есть решение, требующее минимального вмешательства в код сервера - вы просто делаете снэпшоты страницы, требующих индексации, например с помощью PhantomJS, после чего отдаете их как статику с сервера при запросе от бота.
    Ответ написан
    1 комментарий
  • Нужен простой фреймворк или шаблонизатор для создания интерфейса к RESTful сервису?

    AMar4enko
    @AMar4enko
    Еще решение AngularJS + ngTable + Restangular.
    Пагинация + сортировка + фильтр таблиц будут из коробки, если с серверным API согласуете.
    Ответ написан
    Комментировать
  • Загрузка файлов с angularjs и blueimp jquery fileupload?

    AMar4enko
    @AMar4enko
    Не смогу вам дать полностью правильное решение, но дам направление.
    Дело в том, что у директивы data-file-upload есть внутренняя очередь файлов, связанная с самим uploader'ом. В первом примере выбор файла добавляет новый элемент в эту очередь. Происходит это потому, что в момент линковки директивы в DOM уже есть input[type="file"].
    Во втором случае инпуты появляются тогда, когда отрабатывает ng-repeat, и data-file-upload некуда привязать событие добавления в очередь при линковке.

    В целом, вы выбрали немного неверную модель работы с этим плагином.
    Вот мой рабочий пример:
    define(['app', 'lodash'], function(app, lodash) {
      return app.directive('fileUploader', function() {
        return {
          require: '?ngModel',
          replace: false,
          templateUrl: '/themes/main/assets/admin/js/views/directives/FileUploader.html',
          link: function($scope, element, attrs, ngModel) {
            $scope._files = [];
            $scope._uploaderOptions = {};
            if (ngModel) {
              ngModel.$render(function() {
                if (!angular.equals($scope._file, ngModel.$viewValue)) {
                  return $scope._files = ngModel.$viewValue;
                }
              });
            }
            attrs.$observe('options', function(value) {
              return $scope._uploaderOptions = $scope[value];
            });
            return $scope.$on('fileuploaddone', function(event, data) {
              return $scope.$apply(function() {
                $scope._files = $scope._files.concat(data.result.files);
                event.targetScope.clear(data.files);
                if (ngModel) {
                  return ngModel.$setViewValue($scope._files);
                }
              });
            });
          }
        };
      });
    });

    А это шаблон, который в директиве используется.
    <div class="file-uploader">
      <ul class="tiles row-fluid">
        <li class="span3 tile" ng-repeat="file in _files">
          <div class="row-fluid information">
            <div class="span12">
              <div class="preview">
                <a ng-if="file.fileMetadata.thumbnailUrl"
                   ng-href="{{file.uri}}"
                   title="{{file.name}}" target="_blank">
                  <img data-ng-src="{{file.fileMetadata.thumbnailUrl}}" width="48" alt="">
                </a>
              </div>
              <div class="info">
                <p class="name">{{file.name}}<br/><small>{{file.size | formatFileSize}}</small></p>
              </div>
            </div>
          </div>
        </li>
      </ul>
      <div file-upload="_uploaderOptions" ng-class="{'fileupload-processing': processing() || loadingFiles}">
        <div class="row-fluid fileupload-buttonbar">
          <div class="span12">
            <!-- The fileinput-button span is used to style the file input field as button -->
            <span class="btn btn-small btn-success fileinput-button" ng-class="{disabled: disabled}">
                <i class="glyphicon glyphicon-plus"></i>
                <span>Добавить...</span>
                <input type="file" name="files[]" multiple ng-disabled="disabled">
            </span>
          </div>
        </div>
        <!-- The table listing the files available for upload/download -->
        <ul class="tiles row-fluid">
          <li class="span3 tile" ng-repeat="file in queue"
              ng-class="{'processing': file.$processing(),'pending': file.$state() == 'pending'}">
            <div class="row-fluid information">
              <div class="span12">
                <div class="preview">
                  <a ng-if="file.fileMetadata.thumbnailUrl"
                     ng-href="{{file.uri}}"
                     title="{{file.name}}" target="_blank">
                    <img data-ng-src="{{file.fileMetadata.thumbnailUrl}}" width="48" alt="">
                  </a>
                </div>
                <div class="info">
                  <p class="name">{{file.name}}<br/><small>{{file.size | formatFileSize}}</small></p>
                  <strong ng-show="file.error" class="error text-danger">{{file.error}}</strong>
                </div>
              </div>
            </div>
            <div class="row-fluid progress-bar" ng-show="file.$state() == 'pending'">
              <div class="progress progress-small progress-success active fade"
                   ng-class="{pending: 'in'}[file.$state()]"
                   file-upload-progress="file.$progress()">
                <div class="bar" ng-style="{width: num + '%'}"></div>
              </div>
            </div>
          </li>
        </ul>
      </div>
    </div>

    Смысл в том, что у нас в шаблоне всегда есть одна кнопка "Добавить", нажатие на нее обрабатывает сам uploader.
    После нажатия на нее он добавит выбранный файл в очередь (в моем случае еще и загрузку начнет, потому что у меня автостарт используется). После того, как файл загрузится, сработает событие 'fileuploaddone', которое я ловлю, добавляю файл, который был загружен, к себе в список, а из очереди загрузчика удаляю.
    Ответ написан
    5 комментариев
  • Как в AngularJS сделать добавление директив "на лету"?

    AMar4enko
    @AMar4enko Автор вопроса
    Разобрался. Если кому интересно:
    Дело было, на самом деле, во внутренностях ангуляра, а точнее в том, что он при компиляции ноды принудительно проверяет наличие некоторых атрибутов, и делает для их содержимого $scope.$watch, внутри которого делает attrs.$set.
    Так как я добавлял ngRequired после компиляции ноды, то мне надо было просто сделать что-то типа:
    $scope.$watch(attrs.formControl + ".required('" + (element.attr('name')) + "')", function(value){
        attrs.$set("required", !!value)
     });

    А ngRequired, как показано выше, отслеживает значение атрибута required и обновляет валидацию.
    Ответ написан
    Комментировать
  • Что такое {}.prototype?

    AMar4enko
    @AMar4enko
    Могу ошибаться, но судя по всему это глобальное определение прототипа для Object.
    Т.е. впоследствии при создании любого объекта для него будут доступны методы, определенные через prototype.
    Вы можете в любой момент добавить объекту метод. А через прототип вы добавляете его всем экземплярам Object сразу.
    Ответ написан
    Комментировать
  • Передать значение в загруженный ajax-ом диалог?

    AMar4enko
    @AMar4enko
    Тут куча вариантов, на самом деле, но я бы после того, как items сформирован, затолкал его в data элемента, к которому применялся модуль. Вначале его сохранить как var $el = $(this), а после формирования items сделать $el.data('selection', items); А в диалоге var selection = $el.data('selection'); Вообще было бы достаточно в контексте модуля определить var selections= {}; после чего сохранять туда items как selections.[fieldname] = items; Но вдруг вам где-нибудь еще эти items понадобятся.
    Ответ написан
  • CSS transitions и JavaScript

    AMar4enko
    @AMar4enko Автор вопроса
    Вот еще нашел JQuery Transit — позволяет анимировать через transitions, делать очереди, с простым fallback до обычной JS-анимации.
    ricostacruz.com/jquery.transit/
    Ответ написан
    Комментировать