ccm-components by mkaul
JavaScript HTML CSS
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
clock
connect4
cryptoblock
d3_bar_chart
d3_donut
difference_chart
digital_clock
exercise
fine_upload
form
g_pie_chart
game_chooser
geogebra
group_team
highlight
histogram
learning_app
lib
loader
parkhaus
radar_chart
regex
router
show_solutions
solutions_view
tetris
tools
uml
upload
webgl_three_js
wikipedia_search
LICENSE
README.md
_config.yml

README.md

ccm Components

ccm Components developed by Manfred Kaul

Click on a link for online demo. Include the following HTML code for including the web component into your own web site.

 <script src="https://mkaul.github.io/ccm-components/game_chooser/ccm.game_chooser.min.js"></script>
 <ccm-game_chooser></ccm-game_chooser>
 <script src="https://mkaul.github.io/ccm-components/geogebra/ccm.geogebra.min.js"></script>
 <ccm-geogebra></ccm-geogebra>
 <script src="https://mkaul.github.io/ccm-components/learning_app/ccm.learning_app.min.js"></script>
 <ccm-learning_app></ccm-learning_app>
 <script src="https://mkaul.github.io/ccm-components/uml/ccm.uml.min.js"></script>
 <ccm-uml></ccm-uml>
 <script src="https://mkaul.github.io/ccm-components/upload/ccm.upload.min.js"></script>
 <ccm-upload></ccm-upload>
 <script src="https://mkaul.github.io/ccm-components/fine_upload/ccm.fine_upload.min.js"></script>
 <ccm-fine_upload></ccm-fine_upload>
 <script src="https://mkaul.github.io/ccm-components/form/ccm.form.min.js"></script>
 <ccm-form></ccm-form>

Multiple Embedding Techniques for HTML including ccm Components

  • via loader
<script src="//kaul.inf.h-brs.de/data/ccm/loader/ccm.loader.js"></script><ccm-loader nr="1"></ccm-loader>
  • via content und HTML (attention: JSON-Format!)
<script src="//akless.github.io/ccm-components/content/ccm.content.js"></script>
<ccm-content inner='[ "ccm.load", "//kaul.inf.h-brs.de/data/2017/se1/le00.html" ]'></ccm-content>

// or as nested Attribut:

<ccm-content>
  <ccm-load-inner src="https://kaul.inf.h-brs.de/data/2017/se1/le00.html"></ccm-load-inner>
</ccm-content>
  • via content und JavaScript loading HTML
<body>
<script src="https://akless.github.io/ccm/ccm.js"></script>
<script src="https://akless.github.io/ccm-components/content/ccm.content.js"></script>
<script>
  ccm.start('content',{ root: document.body, inner: [ 'ccm.load', 'https://kaul.inf.h-brs.de/data/2017/se1/le00.html' ] });
</script>
  • via content und JSON config
<script src="https://akless.github.io/ccm-components/content/ccm.content.js"></script>
<ccm-content key='["ccm.get","https://kaul.inf.h-brs.de/data/2017/se1/json/configs.js", "le04"]'></ccm-content>
  • via ccm.form.js loading a remote config
<script src="https://kaul.inf.h-brs.de/data/ccm/form/ccm.form.js"></script>
<ccm-form key='["ccm.get","https://kaul.inf.h-brs.de/data/2017/se1/json/forms.js", "orga_profil"]'></ccm-form>