Nachricht für neue Nutzer.
Nachricht für engagierte Nutzer.

Widget:KnowHowComputer: Unterschied zwischen den Versionen

Aus ZUM-Unterrichten
KKeine Bearbeitungszusammenfassung
KKeine Bearbeitungszusammenfassung
Zeile 1: Zeile 1:
<includeonly>
<includeonly>   <script type="text/JavaScript">
<script type="text/JavaScript">


         (function () {
         (function () {
Zeile 27: Zeile 26:
         gap: 1rem;
         gap: 1rem;
         grid-template-areas:
         grid-template-areas:
            "title title"
             "nav  nav  "
             "nav  nav  "
             "main side  ";
             "main side  ";
         grid-template-rows: min-content min-content;
         grid-template-rows: min-content min-content;
        > h1:first-child {
            grid-area: title;
        }
     }
     }


Zeile 90: Zeile 84:


<div>
<div>
    <h1 class="khc-title">Know-How-Computer </h1>
     <nav class="steueritem">
     <nav class="steueritem">
         <input type="button"
         <input type="button"
Zeile 227: Zeile 220:
                         this.shadowRoot.querySelector(':host > div')
                         this.shadowRoot.querySelector(':host > div')
                             .classList
                             .classList
                                .toggle('no-help', this.hasAttribute('no-help'));
                            .toggle('no-help', this.hasAttribute('no-help'));
                     }
                     }


                     attributeChangedCallback (name, oldValue, newValue) {
                     attributeChangedCallback(name, oldValue, newValue) {
                         this.refreshHelp()
                         this.refreshHelp()
                     }
                     }
Zeile 274: Zeile 267:
                         // Use Array.from to convert HTMLCollection to Array
                         // Use Array.from to convert HTMLCollection to Array
                         return Array.from(this.querySelectorAll('khc-memory'))
                         return Array.from(this.querySelectorAll('khc-memory'))
                             .map(element => {
                             .map((element, idx) => {
                                const name = element.getAttribute('name') || `Program ${this.memoryConfigurations.length + 1}`;
                                 const programText = element.textContent.trim();
                                 const programText = element.textContent.trim();
                                 const program = this.parseProgram(programText);
                                 const [name, program] = this.parseProgram(programText);


                                 return {
                                 return {
                                     name: name,
                                     name: name ?? `Program ${idx + 1}`,
                                     program: program
                                     program: program
                                 };
                                 };
Zeile 288: Zeile 280:
                     // Parse program text into a program object
                     // Parse program text into a program object
                     parseProgram(programText) {
                     parseProgram(programText) {
                         return Object.fromEntries(
                         const lines = programText.split('\n')
                             programText.split('\n') // lines
                            .map(line => line.trim())
                                .filter(l => !l.startsWith('#')) // filter out comments
                             .filter(line => line !== '');
                                .map(l => l.split(':', 2).map(s => s.trim())) // split and trim parts
 
                                .filter(([address, instruction]) => (address && instruction))) // filter incomplete lines;
                        let name =
                            lines.slice(0, 1)
                                .filter(l => l.startsWith('#'))
                                .map(l => l.replace(/^#*/, ''))
                                .map(l => l.trim())
                                .find(l => l !== '') ?? null;
 
                        return [
                            name,
                            Object.fromEntries(
                                lines
                                    .filter(l => !l.startsWith('#')) // filter out comments
                                    .map(l => l.split(':', 2).map(s => s.trim())) // split and trim parts
                                    .filter(([address, instruction]) => (address && instruction))) // filter incomplete lines;
                        ];
                     }
                     }


Zeile 735: Zeile 741:
         })();
         })();
     </script>
     </script>
<know-how-computer  
<know-how-computer  
   <!--{if $noHelp|validate:'boolean'|default:'false' == 'true'}-->
   <!--{if $noHelp|validate:'boolean'|default:'false' == 'true'}-->

Version vom 8. Juni 2025, 14:12 Uhr