Model Examples
No edit summary
Tags: Manual revert Reverted 2017 source edit
No edit summary
Tags: Manual revert 2017 source edit
Line 239: Line 239:
<div style="color: black; font-size: 16px; font-weight: 400; word-wrap: break-word">Use ready-made  "complete system"  (model+data) to apply to an existing turnkey site.</div>
<div style="color: black; font-size: 16px; font-weight: 400; word-wrap: break-word">Use ready-made  "complete system"  (model+data) to apply to an existing turnkey site.</div>
     <div class="card-container">
     <div class="card-container">
<!-- Card 2 -->
</html>
      <div class="cards">
{{#widget:Models|img=/images/model2.svg|title=Gantt Chart Interactive|description=Use this when you need to show and interact with data in a timeline.|downloadLink=https://example.com}}
    <img src="/images/model2.svg" alt="Placeholder" width="301" height="175">
 
    <div class="contentss">
<html>
        <div class="title">Gantt Chart Interactive</div>
        <div class="description">Use this when you need to show and interact with data in a timeline.</div>
        <a href="Complete_model_examples" class="download-link">
            <span class="download-indicator"></span>
            <span>Download .zip</span>
        </a>
    </div>
</div>
<!-- Card 3 -->
        <div class="cards">
    <img src="/images/model3.svg" alt="Placeholder" width="301" height="175">
    <div class="contentss">
        <div class="title">A Trello-like Board With Cards You Can Move Between Lists</div>
        <div class="description">Move cards between lists, click cards, add new cards and more.</div>
        <a href="Complete_model_examples" class="download-link">
            <span class="download-indicator"></span>
            <span>Download .zip</span>
        </a>
    </div>
</div>
<!-- Card 4 -->
        <div class="cards">
    <img src="/images/model4.svg" alt="Placeholder" width="301" height="175">
    <div class="contentss">
        <div class="title">Markup Editor TinyMCE</div>
        <div class="description">Lets your users produce rich HTML text.</div>
        <a href="Complete_model_examples" class="download-link">
            <span class="download-indicator"></span>
            <span>Download .zip</span>
        </a>
    </div>
</div>
<!-- Card 5 -->
      <div class="cards">
    <img src="/images/model5.svg" alt="Placeholder" width="301" height="175">
    <div class="contentss">
        <div class="title">SVG - Move boxes around</div>
        <div class="description">Objects represented by SVG graphics that react to mouse events so that they can be moved around and saved.</div>
        <a href="Complete_model_examples" class="download-link">
            <span class="download-indicator"></span>
            <span>Download .zip</span>
        </a>
    </div>
</div>
<!-- Card 6 -->
      <div class="cards">
    <img src="/images/model6.svg" alt="Placeholder" width="301" height="175">
    <div class="contentss">
        <div class="title">Google Maps to Show and Update Positions</div>
        <div class="description">Place a marker on a Google map, track the setting of the map, and move the marker.</div>
        <a href="Complete_model_examples" class="download-link">
            <span class="download-indicator"></span>
            <span>Download .zip</span>
        </a>
    </div>
</div>
    </div>
  </section>
<hr class="section-divider" />
  <!-- Section for Patterns -->
  <section id="another-model">
        <h2>Patterns</h2>
<div><span style="color: black; font-size: 16px; font-weight: 400; word-wrap: break-word">Packages primarily used by importing into an existing model. </span><a
href="#" style="color: #1A50AD; font-size: 16px;  font-weight: 500; text-decoration: underline; word-wrap: break-word">How to merge .modlr file?</a></div>
    <div class="card-container">
      <!-- Card 1 -->
      <div class="cards">
  <img src="/images/model1.svg" alt="Placeholder" width="301" height="175">
    <div class="contentss">
        <div class="title">SysUserAuthentication - important architectural pattern</div>
        <div class="description">This example adds the SysSingleton and SysUser classes needed to enable login and authentication in Turnkey systems.</div>
        <a href="https://learn.mdriven.net/Special:Redirect/file/SysUserAuthentication.modlr" class="download-link">
            <span class="download-indicator"></span>
            <span>Download .zip</span>
        </a>
    </div>
</div>
      <!-- Card 2 -->
      <div class="cards">
    <img src="/images/model1.svg" alt="Placeholder" width="301" height="175">
    <div class="contentss">
        <div class="title">Password Reset Sample - Architectural Pattern</div>
        <div class="description">Add this functionality to your model and this frees you to integrate and adapt it as needed.</div>
        <a href="https://learn.mdriven.net/Special:Redirect/file/PasswordResetTemplate.modlr" class="download-link">
            <span class="download-indicator"></span>
            <span>Download .zip</span>
        </a>
    </div>
</div>
<!-- Card 3 -->
        <div class="cards">
  <img src="/images/model1.svg" alt="Placeholder" width="301" height="175">
    <div class="contentss">
        <div class="title">SysAsyncTicket - Important Architectural Pattern</div>
        <div class="description">A model pattern recognized by the MDrivenServer that helps you easily do stuff in the background.</div>
        <a href="https://learn.mdriven.net/Special:Redirect/file/SysAsyncMergeModel.modlr" class="download-link">
            <span class="download-indicator"></span>
            <span>Download .zip</span>
        </a>
    </div>
</div>
<!-- Card 4 -->
        <div class="cards">
    <img src="/images/model1.svg" alt="Placeholder" width="301" height="175">
    <div class="contentss">
        <div class="title">Localization and Translation - Architectural Pattern</div>
        <div class="description">MDriven systems can adhere to a model pattern and use that to store translations to all texts in actions and ViewModels.</div>
        <a href="https://learn.mdriven.net/Special:Redirect/file/Translations.modlr" class="download-link">
            <span class="download-indicator"></span>
            <span>Download .zip</span>
        </a>
    </div>
</div>
<!-- Card 5 -->
        <div class="cards">
    <img src="/images/model1.svg" alt="Placeholder" width="301" height="175">
    <div class="contentss">
        <div class="title">SysTurnkeyTraceLog</div>
        <div class="description">Add a class following this pattern if you need to track what users are up to in your Turnkey app.</div>
        <a href="https://github.com/supportMDriven/MDrivenComponents.git" class="download-link">
            <span class="download-indicator"></span>
            <span>Download .zip</span>
        </a>
    </div>
</div>
<!-- Card 6 -->
        <div class="cards">
    <img src="/images/model1.svg" alt="Placeholder" width="301" height="175">
    <div class="contentss">
        <div class="title">BaseApp</div>
        <div class="description">A model extracted from larger models used in various projects with certain functions ready to go.</div>
        <a href="https://learn.mdriven.net/File:BaseApp.zip" class="download-link">
            <span class="download-indicator"></span>
            <span>Download .zip</span>
        </a>
    </div>
</div>
<!-- Card 7 -->
        <div class="cards">
    <img src="/images/model1.svg" alt="Placeholder" width="301" height="175">
    <div class="contentss">
        <div class="title">Asp.Net Identity package</div>
        <div class="description">(Description will be added soon.)</div>
        <a href="https://learn.mdriven.net/File:AspNetIdentity.zip" class="download-link">
            <span class="download-indicator"></span>
            <span>Download .zip</span>
        </a>
    </div>
</div>
    </div>
  </section>
<hr class="section-divider" />
  <!-- Section for Extensions -->
  <section id="final-model">
        <h2>Extensions</h2>
<div><span style="color: black; font-size: 16px; word-wrap: break-word">Ready-made solutions used by importing into an existing model. </span><a href="#" style="color: #1A50AD; font-size: 16px; font-weight: 500; text-decoration: underline; word-wrap: break-word">How to merge .modlr file?</a></div>
    <div class="card-container">
      <!-- Card 1 -->
      <div class="cards">
    <img src="/images/model1.svg" alt="Placeholder" width="301" height="175">
    <div class="contentss">
        <div class="title">Consume and Purchase GetPaid#1</div>
        <div class="description">This model extends your system with the ability to charge the end-user for services you provide.</div>
        <a href="https://learn.mdriven.net/Special:Redirect/file/ChargeEndUserViaMDrivenPortalService.modlr" class="download-link">
            <span class="download-indicator"></span>
            <span>Download .zip</span>
        </a>
    </div>
</div>
      <!-- Card 2 -->
      <div class="cards">
  <img src="/images/model1.svg" alt="Placeholder" width="301" height="175">
    <div class="contentss">
        <div class="title">PayPal - Checkout GetPaid#2</div>
        <div class="description">Integrate PayPal as an alternative method to get paid by users.</div>
        <a href="https://learn.mdriven.net/Special:Redirect/file/PayPalCheckout.modlr" class="download-link">
            <span class="download-indicator"></span>
            <span>Download .zip</span>
        </a>
    </div>
</div>
<!-- Card 3 -->
      <div class="cards">
  <img src="/images/model1.svg" alt="Placeholder" width="301" height="175">
    <div class="contentss">
        <div class="title">Theme Builder - Build Themes in Runtime</div>
        <div class="description">Set CSS variables to influence the colors and sizes of the UI.</div>
        <a href="https://learn.mdriven.net/Special:Redirect/file/ThemeBuilder.modlr" class="download-link">
            <span class="download-indicator"></span>
            <span>Download .zip</span>
        </a>
    </div>
</div>
<!-- Card 4 -->
      <div class="cards">
  <img src="/images/model1.svg" alt="Placeholder" width="301" height="175">
    <div class="contentss">
        <div class="title">Outgoing Email Queue</div>
        <div class="description">This is a model pattern that adds an outgoing email queue to the standard base model.</div>
        <a href="https://learn.mdriven.net/Special:Redirect/file/OutgoingEmailQueue.modlr" class="download-link">
            <span class="download-indicator"></span>
            <span>Download .zip</span>
        </a>
    </div>
</div>
<!-- Card 5 -->
      <div class="cards">
  <img src="/images/model1.svg" alt="Placeholder" width="301" height="175">
    <div class="contentss">
        <div class="title">Calendar Model for Linking Things to Dates, Weeks, Months, and Years</div>
        <div class="description">This model implements classes that make aggregation (for statistics, for example) easy.</div>
        <a href="https://learn.mdriven.net/Special:Redirect/file/CalendarPackage.modlr" class="download-link">
            <span class="download-indicator"></span>
            <span>Download .zip</span>
        </a>
    </div>
</div>
<!-- Card 6 -->
      <div class="cards">
  <img src="/images/model1.svg" alt="Placeholder" width="301" height="175">
    <div class="contentss">
        <div class="title">Store Complaint Handling</div>
        <div class="description">The complete app, model, and example data for a clothing shop, to help staff handle customer complaints professionally.</div>
        <a href="https://learn.mdriven.net/Documentation:Store_complaint_handling" class="download-link">
            <span class="download-indicator"></span>
            <span>Download .zip</span>
        </a>
    </div>
</div>
<!-- Card 7 -->
      <div class="cards">
  <img src="/images/model1.svg" alt="Placeholder" width="301" height="175">
    <div class="contentss">
        <div class="title">Turnkey Sample Board Map Balls Gantt</div>
        <div class="description">This sample is a bit of a playground for html5 component development that jacks into the Turnkey.</div>
        <a href="https://learn.mdriven.net/Documentation:Turnkey_sample_Board_Map_Balls_Gantt" class="download-link">
            <span class="download-indicator"></span>
            <span>Download .zip</span>
        </a>
    </div>
</div>
<!-- Card 8 -->
      <div class="cards">
  <img src="/images/model1.svg" alt="Placeholder" width="301" height="175">
    <div class="contentss">
        <div class="title">Turnkey Sample SoftConflict</div>
        <div class="description">A small app that helps you be constructive about issues in your daily life.</div>
        <a href="https://learn.mdriven.net/Turnkey_sample_SoftConflict" class="download-link">
            <span class="download-indicator"></span>
            <span>Download .zip</span>
        </a>
    </div>
</div>
<!-- Card 9 -->
        <div class="cards">
    <img src="/images/model1.svg" alt="Placeholder" width="301" height="175">
    <div class="contentss">
        <div class="title">Turnkey Sample InstantPoll</div>
        <div class="description">Set up an instant poll using MDriven.</div>
        <a href="https://learn.mdriven.net/Turnkey_sample_InstantPoll" class="download-link">
            <span class="download-indicator"></span>
            <span>Download .zip</span>
        </a>
     </div>
     </div>
</div>
</div>

Revision as of 19:44, 1 February 2024

Model Examples
MODEL EXAMPLES
Get started with MDriven sample models. Explore and choose what you want to build.

Complete Models

Use ready-made "complete system" (model+data) to apply to an existing turnkey site.
Placeholder
Gantt Chart Interactive
Use this when you need to show and interact with data in a timeline.
Download .zip