Open-ILS/web/js/ui/default/staff/cat/services/marcedit.js

   1 /**
   2  *  A MARC editor...
   3  */
   4
   5 angular.module('egMarcMod', ['egCoreMod', 'ui.bootstrap'])
   6
   7 .directive("egContextMenuItem", function () {
   8     return {
   9         restrict: 'E',
  10         replace: false,
  11         template: '<li ng-click="setContent(item.value,item.action)">{{label}}</li>',
  12         scope: { item: '=' },
  13         controller: ['$scope','$element',
  14             function ($scope , $element) {
  15                 if (!$scope.item.label) $scope.item.label = $scope.item.value;
  16                 if ($scope.item.divider) {
  17                     $element.style.borderTop = 'solid 1px';
  18                 }
  19
  20                 $scope.setContent = function (v, a) {
  21                     if (a) { v = a($scope,v); }
  22                     $scope.$apply("item.value=v");
  23                     $( $($scope.element).parent() ).parent().empty().remove();
  24                     $scope.$parent.$destroy();
  25                 }
  26             }
  27         ]
  28     }
  29 })
  30
  31 .directive("egMarcEditEditable", ['$document', function ($document) {
  32     function showContext(event) {
  33         event.preventDefault();
  34         var con = event.data.scope.contextitems;
  35
  36         if (angular.isArray(con)) { // we have a list of values or transforms
  37             var tmpl =
  38             '<div class="dropdown" dropdown is-open="true">'+
  39                 '<ul class="dropdown-menu" role="menu">'+
  40                     '<eg-context-menu-item ng-repeat="item in contextitems" item="item"/>'+
  41                 '</ul>'+
  42             '</div>';
  43
  44             var el = $compile(tmpl)(event.data);
  45             el.css({
  46                 postion: 'absolute',
  47                 top: event.pageY,
  48                 left: event.pageX
  49             });
  50
  51             $document.append(el);
  52         }
  53     }
  54
  55     return {
  56         restrict: 'E',
  57         replace: false,
  58         template: '<input style="font-family: \'Lucida Console\', Monaco, monospace;" ng-model="content" size="{{content.length * 1.1}}" maxlength="{{max}}" class="" type="text"/>',
  59         transclude: true,
  60         scope: {
  61             content: '=',
  62             //contextitems: '=',
  63             max: '@',
  64             type: '@'
  65         },
  66 //        controller : ['$scope',
  67 //            function ( $scope ) {
  68 //                $scope.minsize = $scope.max || $scope.content.length;
  69 //                if (!$scope.contextitems) $scope.contextitems = {};
  70 //            }
  71 //        ],
  72         link: function (scope, element, attrs) {
  73
  74             element.bind('change', {}, function (e) { element.size = scope.max || scope.content.length * 1.1});
  75
  76             if (scope.contextitems && angular.isArray(scope.contextitems)) {
  77                 element.bind('context', { scope : scope, element : element }, showContext);
  78             }
  79         }
  80     }
  81 }])
  82
  83 .directive("egMarcEditSubfield", function () {
  84     return {
  85         restrict: 'E',
  86         template: '<span>'+
  87                     '<span><eg-marc-edit-editable type="sfc" class="marcsfcode" content="subfield[0]" max="1"/></span>'+
  88                     '<span><eg-marc-edit-editable type="sfv" class="marcsfvalue" content="subfield[1]"/></span>'+
  89                   '</span>',
  90         scope: { field: "=", subfield: "=" },
  91         replace: false
  92     }
  93 })
  94
  95 .directive("egMarcEditInd", function () {
  96     return {
  97         restrict: 'E',
  98         template: '<span><eg-marc-edit-editable type="ind" content="ind" max="1"/></span>',
  99         scope: { ind : '=' },
 100         replace: false,
 101     }
 102 })
 103
 104 .directive("egMarcEditTag", function () {
 105     return {
 106         restrict: 'E',
 107         template: '<span><eg-marc-edit-editable type="tag" content="tag" max="3"/></span>',
 108         scope: { tag : '=' },
 109         replace: false
 110     }
 111 })
 112
 113 .directive("egMarcEditDatafield", function () {
 114     return {
 115         restrict: 'E',
 116         template: '<div>'+
 117                     '<span><eg-marc-edit-tag class="marctag" tag="field.tag"/></span>'+
 118                     '<span><eg-marc-edit-ind class="marcind" ind="field.ind1"/></span>'+
 119                     '<span><eg-marc-edit-ind class="marcind" ind="field.ind2"/></span>'+
 120                     '<span><eg-marc-edit-subfield ng-repeat="subfield in field.subfields" subfield="subfield" field="field"/></span>'+
 121                   '</div>',
 122         scope: { field: "=" }
 123     }
 124 })
 125
 126 .directive("egMarcEditControlfield", function () {
 127     return {
 128         restrict: 'E',
 129         template: '<div>'+
 130                     '<span><eg-marc-edit-tag class="marctag" tag="field.tag"/></span>'+
 131                     '<span><eg-marc-edit-editable type="cfld" class="marcdata" content="field.data"/></span>'+
 132                   '</div>',
 133         scope: { field: "=" }
 134     }
 135 })
 136
 137 .directive("egMarcEditLeader", function () {
 138     return {
 139         restrict: 'E',
 140         template: '<div>'+
 141                     '<span><eg-marc-edit-editable class="marctag" content="tag"/></span>'+
 142                     '<span><eg-marc-edit-editable class="marcdata" max="{{record.leader.length}}" content="record.leader"/></span>'+
 143                   '</div>',
 144         controller : ['$scope',
 145             function ( $scope ) {
 146                 $scope.tag = 'LDR';
 147             }
 148         ],
 149         scope: { record: "=" }
 150     }
 151 })
 152
 153 /// TODO: fixed field editor and such
 154 .directive("egMarcEditRecord", function () {
 155     return {
 156         template: '<form ng-submit="saveRecord()">'+
 157                   '<div class="marcrecord">'+
 158                     '<div><eg-marc-edit-leader record="record"/></div>'+
 159                     '<div><eg-marc-edit-controlfield ng-repeat="field in controlfields" field="field"/></div>'+
 160                     '<div><eg-marc-edit-datafield ng-repeat="field in datafields" field="field"/></div>'+
 161                   '</div>'+
 162                   '<button class="btn btn-default" type="submit">Save</button>'+
 163                   '</form>'+
 164                   '<button class="btn btn-default" ng-click="seeBreaker()">Breaker</button>',
 165         restrict: 'E',
 166         replace: false,
 167         scope: { recordId : '=' },
 168         controller : ['$scope','egCore',
 169             function ( $scope , egCore ) {
 170
 171                 function loadRecord() {
 172                     return egCore.pcrud.retrieve(
 173                         'bre', $scope.recordId
 174                     ).then(function(rec) {
 175                         $scope.bre = rec;
 176                         $scope.record = new MARC.Record();
 177                         $scope.record.fromXmlString( $scope.bre.marc() );
 178                         $scope.controlfields = $scope.record.fields.filter(function(f){ return f.isControlfield() });
 179                         $scope.datafields = $scope.record.fields.filter(function(f){ return !f.isControlfield() });
 180                     });
 181                 }
 182
 183                 $scope.saveRecord = function () {
 184                     $scope.bre.marc($scope.record.toXmlString());
 185                     return egCore.pcrud.update(
 186                         $scope.bre
 187                     ).then(loadRecord);
 188                 };
 189
 190                 $scope.seeBreaker = function () {
 191                     alert($scope.record.toBreaker());
 192                 };
 193
 194                 $scope.$watch('recordId',
 195                     function(newVal, oldVal) {
 196                         if (newVal && newVal !== oldVal) {
 197                             loadRecord();
 198                         }
 199                     }
 200                 );
 201
 202
 203                 $scope.controlfields = [];
 204                 $scope.datafields = [];
 205
 206                 if ($scope.recordId)
 207                     loadRecord();
 208
 209             }
 210         ]
 211     }
 212 })
 213
 214 ;