Βήμα 16: Διαχείριση πόρων

Αυτό το βήμα περιγράφει και εξηγεί πώς γίνεται η διαχείριση των πόρων που χρησιμοποιούνται από ένα συστατικό στοιχείο.

Οι πόροι περιλαμβάνουν συστατικά στοιχεία και προσαρμοσμένα συστατικά στοιχεία που το Oracle Content Management πρέπει να γνωρίζει για να διαχειριστεί τον κύκλο ζωής των πόρων.

Oracle Content Management φάκελος περιεχομένου

Κάθε τοποθεσία που δημιουργείτε στο Oracle Content Management συνοδεύεται από τον δικό της φάκελο περιεχομένου content. Αυτός είναι ένας κρυφός φάκελος που συνήθως δεν σας εμφανίζεται. Όταν η τοποθεσία δημοσιευτεί, όλα τα αρχεία στον φάκελο content δημοσιεύονται επίσης στο σύστημα αρχείων.

Για παράδειγμα, όταν επιλέγετε μια εικόνα χρησιμοποιώντας το συστατικό στοιχείο "Εικόνα", το Oracle Content Management δημιουργεί ένα αντίγραφο της εικόνας που επιλέξατε και το τοποθετεί στον φάκελο περιεχομένου. Η διεύθυνση τοποθεσίας σας παραπέμπει πάντα σε αυτήν την έκδοση-αντίγραφο της εικόνας, ώστε εάν διαγράψετε την αρχική εικόνα, η τοποθεσία σας να μην διακοπεί. Αυτό εφαρμόζεται επίσης στα άλλα συστατικά στοιχεία που παρέχονται από το Oracle Content Management: Συλλογή, Πλέγμα συλλογής, Έγγραφο, Γραμμή κοινωνικών μέσων, Λήψη αρχείου, καθώς και εικόνες φόντου για υποδοχές και ομάδες συστατικών στοιχείων.

Για να μπορεί ένα προσαρμοσμένο συστατικό στοιχείο να λάβει μέρος σε αυτόν τον κύκλο ζωής πόρων, πρέπει να ενημερώσει το Oracle Content Management εάν υπάρχουν πόροι που θέλει να διαχειρίζεται η υπηρεσία για λογαριασμό του. Επειδή αυτό προϋποθέτει τη δημιουργία ενός αντιγράφου του πόρου, το προσαρμοσμένο συστατικό στοιχείο πρέπει επίσης να χρησιμοποιεί τα Oracle Content Management API για την επιλογή του πόρου, ώστε να γνωρίζουμε πώς να το διαχειριστούμε.

Διαχείριση διευθύνσεων τοποθεσίας

Η διεύθυνση τοποθεσίας που παραπέμπει σε έναν πόρο αλλάζει βάσει διαφόρων κριτηρίων.

  • Η διεύθυνση τοποθεσίας χρόνου εκτέλεσης που παραπέμπει σε ένα συστατικό στοιχείο είναι διαφορετική από τη διεύθυνση τοποθεσίας του Εργαλείου δημιουργίας τοποθεσιών που παραπέμπει στο συστατικό στοιχείο

  • Εάν αντιγράψετε μια σελίδα, το Oracle Content Management δημιουργεί επίσης ένα αντίγραφο όλων των αναφερόμενων πόρων στον φάκελο περιεχομένου, ώστε να μην υπάρξουν ποτέ δύο συστατικά στοιχεία που παραπέμπουν στον ίδιο πόρο στον φάκελο περιεχομένου

  • Η απόθεση ενός componentGroup στη σελίδα δημιουργεί νέα αντίγραφα για όποιους πόρους αναφέρονται από ένα συστατικό στοιχείο στο componentGroup

Επιπλέον, παρότι μια σχετική διεύθυνση τοποθεσίας μπορεί να λειτουργεί για ένα τοπικό συστατικό στοιχείο, τα απομακρυσμένα συστατικά στοιχεία απαιτούν την πλήρως προσδιορισμένη διεύθυνση τοποθεσίας που παραπέμπει προς οποιονδήποτε πόρο θέλετε να διαχειρίζεται το Oracle Content Management για λογαριασμό σας, ώστε να μπορούν να αποδώσουν το περιεχόμενο του ενσωματωμένου πλαισίου με την πλήρη διεύθυνση τοποθεσίας.

Επειδή δεν μπορείτε να βασιστείτε στη διεύθυνση τοποθεσίας που παραμένει στατική, πρέπει να διατηρείτε αναφορές μόνο προς το αναγνωριστικό στον πόρο του κώδικά σας και να ανακτήσετε τη διεύθυνση τοποθεσίας του πόρου, όταν θέλετε να αποδώσετε τον πόρο.

Διαχείριση πόρων

Αυτά τα SDK API Τοποθεσιών είναι διαθέσιμα για τη διαχείριση πόρων.

SitesSDK.getProperty('componentAssets', callback);

  • Αυτό λαμβάνει τον πίνακα των τρεχόντων πόρων

  • Κάθε καταχώριση πόρου αποτελείται από τα εξής:

    • id: Μοναδικό αναγνωριστικό για τον πόρο.

    • title: Oracle Content Management μεταδεδομένα τίτλου.

    • description: Oracle Content Management μεταδεδομένα περιγραφής.

    • fileName: Αρχικό όνομα του επιλεγμένου αρχείου. Χρήσιμο για εμφάνιση στον πίνακα "Ρυθμίσεις" για το προσαρμοσμένο συστατικό στοιχείο, ώστε οι χρήστες να γνωρίζουν ποιο αρχείο επέλεξαν. Αυτό δεν είναι το όνομα του αρχείου που αντιγράφηκε στον φάκελο περιεχομένου.

    • source: Διεύθυνση τοποθεσίας με ενεργοποιημένες μακροεντολές στον πόρο. Αυτή η τιμή θα αλλάξει με την πάροδο του χρόνου και δεν πρέπει να αναφέρεται από το συστατικό στοιχείο σας, αλλά θα πρέπει να αποθηκεύεται ως μέρος του πόρου.

    • url: Πλήρως προσδιορισμένη διεύθυνση τοποθεσίας για τον πόρο, βάσει του περιβάλλοντος μέσα στο οποίο κλήθηκε το getPropert().

SitesSDK.setProperty('componentAssets', [assets]);

  • Καλέστε το για να αποθηκευτούν όλοι οι πόροι που θέλετε να διαχειρίζεται το Oracle Content Management για λογαριασμό σας.

  • Εάν δεν το καλέσετε, τότε δεν θα αποθηκευτεί κανένας πόρος.

  • Όσοι πόροι δεν συμπεριλαμβάνονται σε αυτόν τον πίνακα θα διαγραφούν όταν η τοποθεσία δημοσιευτεί.

  • Η παράμετρος assets είναι ένας πίνακας με πόρους που έχουν την ίδια μορφή που επιστρέφει το getProperty και που επίσης επιστρέφει το filePicker.

    Σημείωση:

    Δεν αποθηκεύεται καμία τιμή url. Αυτή η τιμή δημιουργείται δυναμικά όταν ζητάτε τους πόρους.

SitesSDK.filePicker(options, callback);

  • Ένα API για να ανοίξει ο επιλογέας αρχείων, ώστε να επιλεγεί η λίστα των πόρων.

  • Καλεί την επανάκληση όταν επιλέγονται με επιτυχία οι πόροι που μεταβιβάζονται στον πίνακα των επιλεγμένων πόρων.

  • Σε αυτό το στάδιο δεν γίνεται κάποια αποθήκευση και το συστατικό στοιχείο είναι εκείνο που πρέπει να καλέσει το setProperty('componentAssets', [assets]); για να αποθηκευτούν στοιχεία από αυτήν την επιλογή σε συνδυασμό με άλλους πόρους προς αποθήκευση.

Παράδειγμα επιλογής πόρου

Αυτή η ενότητα σάς δείχνει πώς να επιλέξετε έναν πόρο, να αποθηκεύσετε το αναγνωριστικό του και να ανακτήσετε ξανά τις πραγματικές τιμές από τους αποθηκευμένους πόρους.

  1. Επεξεργαστείτε το αρχείο settings.html .

  2. Αλλάξτε το αντικείμενο προτύπου για να συμπεριλάβετε μια Επιλογή εικόνας.

    <div>
        <!-- Image selection -->
        <label id="imageLabel" for="imageAsset" class="settings-heading" data-bind="text: 'Image'"></label>
        <input id="imageAsset" data-bind="value: imageName" readonly class="settings-text-box">
        <button id="imageSelect" type="button" class="selectbutton" data-bind="click: showFilePicker">Select Image</button>
    </div>
  3. Αλλάξτε το viewModel για να προσθέσετε ένα observable αντικείμενο, ώστε να αποθηκευτεί το αναγνωριστικό του επιλεγμένου πόρου.

    self.imageID = ko.observable();
  4. Αλλάξτε το viewModel για να διαχειριστείτε την επιλογή του πόρου ανοίγοντας τον επιλογέα αρχείων και εμφανίζοντας το όνομα του επιλεγμένου πόρου.

    //
    // handle component assets
    //
    self.assets = []
     
    // bring up a file picker to select the assets
    self.showFilePicker = function () {
        // select an image
        SitesSDK.filePicker({
            'multiSelect': false,
            'supportedFileExtensions': ['jpg', 'png']
        }, function (result) {
            if (result.length === 1) {
                // update the array of assets
                self.assets = result;
     
                // update the image in customSettingsData
                self.imageID(result[0].id);
            }
        });
    };
     
    // update the display name based on the assets
    self.imageName = ko.computed(function () {
        var imageName = '',
            imageID = self.imageID();
        for (var i = 0; i < self.assets.length; i++) {
            if (self.assets[i].id === imageID) {
                imageName = self.assets[i].fileName;
                break;
            }
        }
     
        return imageName
    }, self); 
  5. Ενημερώστε το viewModel για να ανακτήσετε αρχικά τους πόρους πριν από τη λήψη του customSettingsData. Με αυτόν τον κώδικα θα κληθεί επίσης το self.imageName όταν το observable αντικείμενο self.ImageID() αλλάξει.

    SitesSDK.getProperty('componentAssets', function (assets) {
        self.assets = assets;
        SitesSDK.getProperty('customSettingsData', function (data) {
            //update observable
            self.imageWidth(data.imageWidth);
            self.imageID(data.imageID);
            self.titleText(data.titleText);
            self.userText(data.userText);
     
            // note that viewModel is initialized and can start saving data
            self.initialized(true);
            self.saveData = true;
        });
    });
  6. Τέλος, ενημερώστε τη συνάρτηση save για να αποθηκευτεί το imageID και φροντίστε να ενημερώσετε το componentAssets με τη λίστα των αναφερόμενων πόρων σας.

    self.save = ko.computed(function () {
        var saveconfig = {
            'imageWidth': isNaN(self.imageWidth()) ? self.imageWidth() : self.imageWidth() + 'px',
            'imageID': self.imageID(),
            'titleText': self.titleText(),
            'userText': self.userText()
        };
     
        // store the selected asset and update custom settings
        if (self.saveData) {
            SitesSDK.setProperty('componentAssets', self.assets);
            SitesSDK.setProperty('customSettingsData', saveconfig);
        }
    }, self);

Έλεγχος αποτελεσμάτων για την επιλογή πόρων

  1. Ανανεώστε τη σελίδα σας στην τοποθεσία σας, ώστε το Εργαλείο δημιουργίας τοποθεσιών να μπορεί να επιλέξει τις αλλαγές στο συστατικό στοιχείο.

  2. Αλλάξτε τη σελίδα στην κατάσταση επεξεργασίας.

  3. Μεταφέρετε και αποθέστε το συστατικό στοιχείο σας στη σελίδα.

  4. Ανοίξτε τον πίνακα "Ρυθμίσεις".

  5. Κάντε κλικ στο κουμπί Επιλογή εικόνας.

  6. Κάντε περιήγηση (ή αποστολή) και επιλέξτε μια εικόνα.

    Λάβετε υπόψη ότι το όνομα της εικόνας αποθηκεύεται εμφανίζοντας την επιλεγμένη εικόνα.

  7. Κλείστε τον πίνακα "Ρυθμίσεις".

  8. Ανοίξτε ξανά τον πίνακα "Ρυθμίσεις".

    Λάβετε υπόψη ότι το όνομα της εικόνας αποτυπώνεται ξανά.

Παράδειγμα απόδοσης πόρου

Αυτή η ενότητα σάς δείχνει πώς να ανακτήσετε τους πόρους και να τους αποδώσετε στο συστατικό στοιχείο σας, και επίσης πώς να κάνετε το συστατικό στοιχείο να ενημερώνεται δυναμικά όποτε αλλάζουν οι τιμές στον πίνακα ρυθμίσεων.

Σημείωση:

Αν και αυτό δείχνει ένα παράδειγμα για ένα τοπικό συστατικό στοιχείο που βρίσκεται σε ενσωματωμένο πλαίσιο στη σελίδα, ένας παρόμοιος κώδικας μπορεί να χρησιμοποιηθεί για τα συστατικά στοιχεία που αποδίδονται ενσωματωμένα στη σελίδα.
  1. Επεξεργαστείτε το αρχείο render.html .

  2. Ενημερώστε το πρότυπο για να συμπεριλάβετε τον πόρο σας:.

    <!-- ko if: imageURL -->
    <div style="flex-shrink:0;">
        <img data-bind="attr: {style: imageStyle, id: 'imageId', src: imageURL, alt: '', title: ''}, click: imageClicked" />
    </div>
    <!-- /ko -->
  3. Στο viewModel, δημιουργήστε δύο observable αντικείμενα για να λάβετε το imageID από το customSetttingsData και να αποθηκεύσετε το imageURL που ανακτάται από την αποθηκευμένη λίστα πόρων.

    self.imageID = ko.observable();
    self.imageURL = ko.observable();
  4. Ενημερώστε το viewModel ώστε όποτε αλλάζει το imageID, να λαμβάνει την αντίστοιχη διεύθυνση τοποθεσίας του πόρου εικόνας.

    self.imageID.subscribe(function (imageID) {
        // whenever the image changes get the updated referenced asset
        SitesSDK.getProperty('componentAssets', function (assets) {
            for (var i = 0; i < assets.length; i++) {
                if (assets[i].id === imageID) {
                    self.imageURL(assets[i].url);
                    break;
                }
            }
        });
    });
  5. Ενημερώστε το viewModel για να ανακτήσετε το αναγνωριστικό από το customSettingsData.

Έλεγχος αποτελεσμάτων για την απόδοση πόρων

  1. Ανανεώστε τη σελίδα σας στην τοποθεσία σας, ώστε το Εργαλείο δημιουργίας τοποθεσιών να μπορεί να επιλέξει τις αλλαγές στο συστατικό στοιχείο.

  2. Αλλάξτε τη σελίδα στην κατάσταση επεξεργασίας.

  3. Μεταφέρετε και αποθέστε το συστατικό στοιχείο σας στη σελίδα.

  4. Ανοίξτε τον πίνακα "Ρυθμίσεις".

  5. Κάντε κλικ στο κουμπί Επιλογή εικόνας.

  6. Κάντε περιήγηση (ή αποστολή) και επιλέξτε μια εικόνα.

    Λάβετε υπόψη ότι το όνομα της εικόνας αποθηκεύεται εμφανίζοντας την επιλεγμένη εικόνα.

  7. Κλείστε τον πίνακα "Ρυθμίσεις".

    Σε αυτό το στάδιο θα πρέπει να βλέπετε την επιλεγμένη εικόνα σας που αποδίδεται στο συστατικό στοιχείο.

Συνεχίστε στην ενότητα Ανασκόπηση εκπαιδευτικού προγράμματος.