Minerals: switched structure from spots to tags

www/app/spot/minerals/add-mineral-tag-modal.html

@@ -0,0 +1,19 @@
+<ion-modal-view>
+  <ion-header-bar class='bar-stable nav-title-slide-ios7' align-title='center'>
+    <button class='button button-positive' ng-click='vmChild.addMineralTagModal.hide();'>Done
+    </button>
+    <h1 class='title'>Add Mineral Tags</h1>
+    <button class='button button-icon' ng-click='vmChild.addMineralTagModal.hide(); vm.createTag()'>
+      <span class='icon ion-plus'></span>
+    </button>
+  </ion-header-bar>
+  <ion-content class='has-header'>
+    <ion-checkbox class='item-text-wrap item-button-right'
+                  ng-repeat='tag in vm.allMineralTags | orderBy:"name" track by tag.id'
+                  ng-checked='vm.isTagChecked(tag)'
+                  ng-click='vm.toggleTagChecked(tag)'>
+      <b>{{ tag.name }}</b>
+      <strabo-tags-list-properties-directive></strabo-tags-list-properties-directive>
+    </ion-checkbox>
+  </ion-content>
+</ion-modal-view>

www/app/spot/minerals/minerals-modal.html

@@ -1,6 +1,6 @@
 <ion-modal-view class="minerals-modals">
     <ion-header-bar class='bar-stable nav-title-slide-ios7' align-title='center'>
-      <button class='button button-positive' ng-show="vmChild.isShowMineralList" ng-click='vmChild.submit()'>Save
+      <button class='button button-positive' ng-show="vmChild.isShowMineralList" ng-click='vmChild.submitMineral()'>Save
       </button>
       <button class='button button-icon icon ion-arrow-left-c' ng-hide="vmChild.isShowInfoOnly || vmChild.isShowMineralList" 
        ng-click='vmChild.hideMineralInfo();'>

www/app/spot/minerals/minerals-tab.controller.js

@@ -5,29 +5,33 @@
     .module('app')
     .controller('MineralsTabController', MineralsTabController);
 
-  MineralsTabController.$inject = ['$ionicModal', '$ionicPopup', '$ionicScrollDelegate', '$log', '$scope', '$state', 'DataModelsFactory', 'FormFactory', 'HelpersFactory', 'MineralsFactory', 'ProjectFactory'];
+  MineralsTabController.$inject = ['$ionicModal', '$ionicPopup', '$ionicScrollDelegate', '$log', '$scope', '$state',
+   'DataModelsFactory', 'FormFactory', 'HelpersFactory', 'MineralsFactory', 'ProjectFactory'];
 
-  function MineralsTabController($ionicModal, $ionicPopup, $ionicScrollDelegate, $log, $scope, $state, DataModelsFactory, FormFactory, HelpersFactory, MineralsFactory, ProjectFactory) {
+  function MineralsTabController($ionicModal, $ionicPopup, $ionicScrollDelegate, $log, $scope, $state, DataModelsFactory,
+    FormFactory, HelpersFactory, MineralsFactory, ProjectFactory) {
     var vm = this;
     var vmParent = $scope.vm;
 
     var thisTabName = 'minerals';
     var selectedFromList = [];
 
     vm.activeState = "most_common";
+    vm.addMineralTagModal = {};
     vm.collectionsModal = {};
     vm.createCollectionSelectBoxDisplay = {};
-    vm.mineralCollections = [];
-    vm.mineralInfo = [];
     vm.isShowMineralList = true;
     vm.isShowInfoOnly = true;
+    vm.mineralCollections = [];
+    vm.mineralInfo = [];
     vm.mineralsModal = {};
     vm.modalTitle = '';
     vm.newCollectionName = undefined;
     vm.selectedCollectionToCreate = {};
     vm.showNameField = false;
 
     vm.addMineral = addMineral;
+    vm.addMineralTag = addMineralTag;
     vm.changedCollectionToCreate = changedCollectionToCreate;
     vm.getLabel = getLabel;
     vm.hideMineralInfo = hideMineralInfo;
@@ -36,7 +40,7 @@
     vm.saveCollection = saveCollection;
     vm.selectFromCollection = selectFromCollection;
     vm.showMineralInfo = showMineralInfo;
-    vm.submit = submit;
+    vm.submitMineral = submitMineral;
     vm.switchMineralsForm = switchMineralsForm;
     vm.toggleCollectionChecked = toggleCollectionChecked;
 
@@ -75,6 +79,14 @@
         vm.collectionsModal = modal;
       });
 
+      $ionicModal.fromTemplateUrl('app/spot/minerals/add-mineral-tag-modal.html', {
+        'scope': $scope,
+        'animation': 'slide-in-up',
+        'backdropClickToClose': false
+      }).then(function (modal) {
+        vm.addMineralTagModal = modal;
+      });
+
       $ionicModal.fromTemplateUrl('app/spot/minerals/minerals-modal.html', {
         'scope': $scope,
         'animation': 'slide-in-up',
@@ -87,6 +99,7 @@
       $scope.$on('$destroy', function () {
         vm.collectionsModal.remove();
         vm.mineralsModal.remove();
+        vm.addMineralTagModal.remove();
       });
     }
 
@@ -134,6 +147,10 @@
       vm.mineralsModal.show();
     }
 
+    function addMineralTag() {
+      vm.addMineralTagModal.show();
+    }
+
     function changedCollectionToCreate() {
       if (vm.selectedCollectionToCreate.name === '-- Create a New Collection --') vm.showNameField = true;
       else vm.showNameField = false;
@@ -190,7 +207,8 @@
         });
         $ionicPopup.alert({
           'title': 'Collection Saved',
-          'template': 'Saved following minerals to favorites collection <b>' + vm.selectedCollectionToCreate.name + '</b>:<br><br>' + mineralLabels.join(", ")
+          'template': 'Saved following minerals to favorites collection <b>' + vm.selectedCollectionToCreate.name + 
+          '</b>:<br><br>' + mineralLabels.join(", ")
         });
 
         setupCreateCollectionSelectBox();
@@ -218,7 +236,7 @@
       vm.mineralsModal.show();
     }
 
-    function submit() {
+    function submitMineral() {
       vmParent.data = HelpersFactory.cleanObj(vmParent.data);
       $log.log(vmParent.data);
       if (FormFactory.validate(vmParent.data)) {

www/app/spot/minerals/minerals-tab.directive.html

@@ -1,5 +1,5 @@
 <div>
-  <button ng-click='vmChild.addMineral("metamorphic_most_common")' class='button button-clear button-positive'>
+  <!-- <button ng-click='vmChild.addMineral("metamorphic_most_common")' class='button button-clear button-positive'>
     <i class='icon ion-plus-circled'></i>
     <span class='button-text-big'>Add/Remove Metamorphic Minerals</span>
   </button>
@@ -47,5 +47,15 @@
       <i class='icon ion-plus-circled'></i>
       <span class='button-text-big'>Create/Update Favorites Collection</span>
     </button>
-  </div>
+  </div> -->
+  <button ng-click='vmChild.addMineralTag()' class='button button-clear button-positive'>
+    <i class='icon ion-plus-circled'></i>
+    <span class='button-text-big'>Add/Remove Minerals (Tag)</span>
+  </button>
+  <ion-list>
+    <ion-item class='item-text-wrap item-button-right'
+              ng-repeat='mineral in vm.mineralDisplay | orderBy:"mineral" track by $index'>
+      <b>{{ vmChild.getLabel(mineral) }}</b>
+    </ion-item>
+  </ion-list>
 </div>

www/app/spot/spot/spot.controller.js

@@ -22,11 +22,13 @@
     vm.addGeologicUnitTagModal = {};
     vm.addTagModal = {};
     vm.addTagModalTitle = undefined;
+    vm.allMineralTags = [];
     vm.allTags = [];
     vm.allTagsToDisplay = [];
     vm.featureId = undefined;
     vm.featureLevelTags = [];
     vm.featureLevelTagsToDisplay = [];
+    vm.mineralTags = [];
     vm.selectedType = 'all';
     vm.spotLevelTags = [];
     vm.spotLevelTagsToDisplay = [];
@@ -415,7 +417,8 @@
 
     function isTagChecked(tag) {
       if (vm.spot) {
-        if (vm.stateName === 'app.spotTab.tags' || vm.stateName === 'app.spotTab.spot') {
+        if (vm.stateName === 'app.spotTab.tags' || vm.stateName === 'app.spotTab.spot' ||
+         vm.stateName === 'app.spotTab.minerals') {
           if (tag.spots) return tag.spots.indexOf(vm.spot.properties.id) !== -1;
         }
         else {
@@ -448,6 +451,14 @@
       vm.featureLevelTags = _.filter(tags, function (tag) {
         return tag.features && tag.features[vm.spot.properties.id];
       });
+      vm.allMineralTags = _.filter(vm.allTags, function(tag){
+        return tag.type === "mineral";
+      });
+      vm.mineralTags = _.filter(tags, function(tag){
+         return tag.type === "mineral";
+      });
+      //combines arrays in mineralTags and takes out duplicates
+      vm.mineralDisplay = _.chain(vm.mineralTags).pluck('minerals').flatten().uniq().compact().value();
       filterTagType();
     }
 
@@ -537,7 +548,8 @@
 
     function toggleTagChecked(tag) {
       // Tags and Spot tabs use the Spot level tags, all other tabs have feature level tags
-      if (vm.stateName === 'app.spotTab.tags' || vm.stateName === 'app.spotTab.spot') {
+      if (vm.stateName === 'app.spotTab.tags' || vm.stateName === 'app.spotTab.spot' || 
+      vm.stateName === 'app.spotTab.minerals') {
         if (!tag.spots) tag.spots = [];
         var i = tag.spots.indexOf(vm.spot.properties.id);
         if (i === -1) tag.spots.push(vm.spot.properties.id);

www/app/spot/tags/tags-tab.directive.html

@@ -15,6 +15,7 @@
       <select ng-model='vm.selectedType' ng-change='vm.filterTagType()'>
         <option value='all'>All</option>
         <option value='geologic_unit'>Geologic Unit</option>
+        <option value='mineral'>Mineral</option>
         <option value='concept'>Concept</option>
         <option value='documentation'>Documentation</option>
         <option value='rosetta'>Rosetta</option>

www/app/tag/mineral.directive.html

@@ -0,0 +1,24 @@
+<div>
+	<button ng-click='vm.addMineral("metamorphic_most_common")' class='button button-clear button-positive'>
+    <i class='icon ion-plus-circled'></i>
+    <span class='button-text-big'>Add/Remove Metamorphic Minerals</span>
+  </button><br>
+  <button ng-click='vm.addMineral("igneous_most_common")' class='button button-clear button-positive'>
+    <i class='icon ion-plus-circled'></i>
+    <span class='button-text-big'>Add/Remove Igneous Minerals</span>
+  </button><br>
+  <button ng-click='vm.addMineral("sedimentary_most_common")' class='button button-clear button-positive'>
+    <i class='icon ion-plus-circled'></i>
+    <span class='button-text-big'>Add/Remove Sedimentary Minerals</span>
+	</button>
+	<ion-list>
+    <ion-item class='item-text-wrap item-button-right' 
+    ng-repeat='mineral in vm.data.minerals | orderBy:mineral track by $index'>
+      {{ vm.getLabel(mineral) }}
+      <button id="minerals-info-button" class=" button-small button-icon button ion-information-circled minerals-field-info-button" ng-click="vm.mineralInfoOnMainPage(mineral)"></button>
+    </ion-item>
+  </ion-list>
+  <div class="padding" ng-hide="vm.data.minerals">
+    <span>No minerals added yet.</span>
+  </div>
+</div>

www/app/tag/mineral.directive.js

@@ -0,0 +1,15 @@
+(function () {
+  'use strict';
+
+  angular
+    .module('app')
+    .directive('straboMineralTagDirective', straboMineralTagDirective);
+
+  function straboMineralTagDirective() {
+    return {
+      'restrict': 'AE',
+      'replace': true,
+      'templateUrl': 'app/tag/mineral.directive.html'
+    };
+  }
+}());

www/app/tag/minerals-modal.html

@@ -0,0 +1,85 @@
+<ion-modal-view class="minerals-modals">
+    <ion-header-bar class='bar-stable nav-title-slide-ios7' align-title='center'>
+      <button class='button button-positive' ng-show="vm.isShowMineralList" ng-click='vm.submitMineral()'>Save
+      </button>
+      <button class='button button-icon icon ion-arrow-left-c' ng-hide="vm.isShowInfoOnly || vm.isShowMineralList" 
+       ng-click='vm.hideMineralInfo();'>
+      </button>
+      <h1 class='title'>{{ vm.modalTitle }}</h1>
+      <div class='buttons'>
+        <button class='icon ion-close-round close-modal-button' ng-click='vm.mineralsModal.hide()'>
+        </button>
+      </div>
+    </ion-header-bar>
+    <ion-content>
+      <div ng-show="vm.isShowMineralList">
+        <div class='button-bar'>
+          <button class='button button-full' ng-click='vm.switchMineralsForm("most_common")'
+           ng-class="{'spot-tab-active': vm.activeState === 'most_common'}">Most Common</button>
+          <button class='button button-full' ng-click='vm.switchMineralsForm("all")' 
+          ng-class="{'spot-tab-active': vm.activeState === 'all'}">All</button>
+        </div>
+        <form name='straboForm' novalidate=''>
+          <div id='straboFormCtrlId' ng-controller='FormController as form'>
+            <div ng-repeat='field in form.survey' class='minerals-form'>
+              <div id='{{ field.name }}' ng-show='form.showField(field, vm.modalData)'>
+                <ion-list class="list item-text-wrap strabo-choices-flex-container strabo-wrap" ng-class='form.setSelMultClass(field, vm.modalData)'>
+                  <ion-item class="item item-checkbox mineral-item minerals-checkbox item-minerals-checkbox item-button-right item-text-wrap minerals-item" ng-repeat='choice in form.choices | filter: { "list_name": field.type.split(" ")[1] }'>
+                    <ion-grid>
+                      <ion-row >
+                        <ion-col>
+                          <label class="checkbox mineral-checkbox">
+                            <input type="checkbox" ng-click="form.toggleChecked(field.name, choice.name, vm.modalData)" ng-required='{{ field.required }}'
+                              ng-checked='form.isOptionChecked(field.name, choice.name, vm.modalData)'>
+                          </label>
+                          {{ choice.label }}
+                        </ion-col>
+                      </ion-row>
+                    </ion-grid>
+                    <button id="minerals-info-button" class=" button-small button-icon button ion-information-circled minerals-field-info-button"
+                      ng-click="vm.showMineralInfo(choice.name, $event)">
+                    </button>
+                  </ion-item>
+                </ion-list>
+              </div>
+            </div>
+          </div>
+        </form>
+      </div>
+      <div ng-hide="vm.isShowMineralList" class="padding">
+        <div ng-show="vm.mineralInfo" class="mineral-info-display">
+          <div class="row">
+            <span class="mineral-title">Mineral:</span>
+            {{ vm.mineralInfo.Mineral }}
+          </div>
+          <div class="row">
+            <span class="mineral-title">Formula:</span>
+            {{ vm.mineralInfo.Formula }}
+          </div>
+          <div class="row">
+            <span class="mineral-title">Crystal System:</span>
+            {{ vm.mineralInfo["Crystal System"] }}
+          </div>
+          <div class="row">
+            <span class="mineral-title">Hardness:</span>
+            {{ vm.mineralInfo.Hardness }}
+          </div>
+          <div class="row">
+            <span class="mineral-title">Distinguishing Features:</span>
+            {{ vm.mineralInfo['Distinguishing Features'] }}
+          </div>
+          <div class="row">
+            <span class="mineral-title"> Occurrence:</span>
+            {{ vm.mineralInfo.Occurrence }}
+          </div>
+          <div class="row">
+            <span class="mineral-title"> Associated Minerals:</span>
+            {{ vm.mineralInfo['Associated Minerals'] }}
+          </div>
+        </div>
+        <div ng-hide="vm.mineralInfo">
+          There is no description given for this mineral
+        </div>
+      </div>
+    </ion-content>
+  </ion-modal-view>