{"version":3,"sources":["webpack:///./src/components/mathematics/Math6thGrade/demoParallelogram/Lesson.vue","webpack:///./src/components/mathematics/Math6thGrade/demoParallelogram/Boxes.js","webpack:///src/components/mathematics/Math6thGrade/demoParallelogram/Lesson.vue","webpack:///./src/components/mathematics/Math6thGrade/demoParallelogram/Lesson.vue?6f6a","webpack:///./src/components/mathematics/Math6thGrade/demoParallelogram/Lesson.vue?1735"],"names":["attrs","staticClass","_c","_vm","_self","staticStyle","staticRenderFns","Boxes","box1","JXG","Options","board","minimizeReflow","point","showInfoBox","highlight","image","line","text","fixed","polygon","cssDefaultStyle","graph","createSpace","suspendUpdate","options","layer","boundingBox","attr","boundingbox","positionX","makeResponsive","placeLogo","i","eggs","placeEggs","setAttribute","visible","placeTitle","next","placeRedo","hoverMe","prev","placeUndo","Pt0","drawPoint","setSize","Pt01","X","Pt02","Pt1","Pt2","Pt3","Pt4","drawSegment","hide1","hide3","hide2","hide4","create","vertices","borders","strokeColor","strokeWidth","fillColor","fillOpacity","lin1","drawDash","lin","t1","t2","t3","t4","horz","placeTapeVert","vert","placeTapeHori","label","placeMiddleText","on","moveTo","line1","color","line2","placeLeftText","unsuspendUpdate","name","created","$store","commit","title","newshowhome","newMath","newLeftArrow","newModule","mounted","MathJax","Hub","Queue","metaInfo","titleTemplate","meta","vmid","content","component"],"mappings":"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","file":"js/chunk-2d0dd04b.575568c8.js","sourcesContent":["var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',[_c('br'),_c('h5',[_vm._v(\"Problem Description\")]),_vm._m(0),_vm._m(1),_vm._m(2),_c('v-responsive',[_c('v-layout',{attrs:{\"justify-center\":\"\"}},[_c('div',{staticClass:\"edliy-box-about\",attrs:{\"id\":\"jxgbox1\"}})])],1),_c('br'),_c('h5',[_vm._v(\" Navigating through the MagicGraph \")]),_vm._m(3),_c('h5',[_vm._v(\" Marks & Indications \")]),_vm._m(4)],1)\n}\nvar staticRenderFns = [function (){var _vm=this,_c=_vm._self._c;return _c('p',{staticClass:\"big mt-2\"},[_vm._v(\"\\n    The area of a parallelogram with length \\\\(b\\\\) and height \\\\(h\\\\) is given by \\\\(A= b\\\\times h\\\\).\"),_c('br'),_vm._v(\"\\n    You may recall that the area of a rectangle with length \\\\(b\\\\) and height \\\\(h\\\\) is also given by \\\\(b \\\\times h\\\\).\\n    \"),_c('br'),_vm._v(\"\\n    In this MagicGraph, we will show why the area of a parallelogram equals its length times height — just as in the case of a rectangle.\\n  \")])\n},function (){var _vm=this,_c=_vm._self._c;return _c('div',{staticStyle:{\"text-align\":\"left\"}},[_c('h5',[_vm._v(\" MagicGraph | Area of a Parallelogram\")])])\n},function (){var _vm=this,_c=_vm._self._c;return _c('p',{staticClass:\"big mt-2\"},[_vm._v(\"\\n    Use the MagicGraph below to participate in the exercise. Tap on \"),_c('i',{staticClass:\"next ma-1\"}),_vm._v(\" button to move over to the next question.\\n    Tap on \"),_c('i',{staticClass:\"previous ma-1\"}),_vm._v(\" button to go to previous step.\\n    \"),_c('br')])\n},function (){var _vm=this,_c=_vm._self._c;return _c('p',{staticClass:\"big mt-2\"},[_c('i',{staticClass:\"redoer ma-1\"}),_vm._v(\" — is the 'Next' button. Tap on this button to move over to the next question. \"),_c('br'),_c('i',{staticClass:\"tester ma-1\"}),_vm._v(\" — is the 'Check Your Answer' button. Tap on this button to check your answer.\"),_c('br'),_c('i',{staticClass:\"logor ma-1\"}),_vm._v(\"—  is the 'Get a Hint' button. Tap on this button to receive a hint on how to solve this problem. \"),_c('br'),_c('i',{staticClass:\"undoer ma-1\"}),_vm._v(\" — is the 'Start Over' button. Tap on this button to start over the exercise from the begining.\\n  \")])\n},function (){var _vm=this,_c=_vm._self._c;return _c('p',{staticClass:\"big mt-2\"},[_vm._v(\"\\n    The marks and indications are located on the top-left corner of the MagicGraph, and show your attempt status. \"),_c('br'),_c('i',{staticClass:\"righter ma-1\"}),_vm._v(\" — the right checkmark indicates that your attempted response was correct. \"),_c('br'),_c('i',{staticClass:\"wrong ma-1\"}),_vm._v(\" — this crossmark indicates that your attempted response was incorrect. \"),_c('br'),_c('i',{staticClass:\"missed ma-1\"}),_vm._v(\" — this exclaimation mark indicates an unattempted (missed) response. \"),_c('br')])\n}]\n\nexport { render, staticRenderFns }","import {\r\n  createSpace,\r\n  createAxes,\r\n  makeResponsive,\r\n  placeTitle,\r\n  placeImage,\r\n  placeInput,\r\n  placeSlider,\r\n  hoverMe,\r\n  placeRec,\r\n  hiddenPt,\r\n  fixedPt,\r\n  clearInputFields,\r\n  dragMe,\r\n  placeArrow,\r\n  placeGravity,\r\n  placeText,\r\n  placeMiddleText,\r\n  placeLine,\r\n//  placePoint,\r\n  placeGlider,\r\n  placeRuler,\r\n  placeLeftText,\r\n  placeCircle,\r\n  placeAngle,\r\n  drawPoint,\r\n//  placeDash,\r\n  placeLabel,\r\n  placeRightText,\r\n//placePoint(board, positionX, positionY, size, cols1, cols2)\r\n//placeDash(board, Pt1, Pt2, width, cols)\r\n  placeArc,\r\n  placeLogo,\r\n  placeErase,\r\n  placeShuffle,\r\n  placeTest,\r\n  placeSeg,\r\n  setConfig,\r\n  placeStat,\r\n  //placeTri,\r\n  shuffle,\r\n  placeEraseLeft,\r\n  placeTapeHori,\r\n  placeTapeVert,\r\n  placeSq,\r\n  placeBoldText,\r\n  placeRedo,\r\n  placeUndo,\r\n  setSize,\r\n  labelIt,\r\n  drawSegment,\r\n  drawDash,\r\n  place3Circles,\r\n  place3BCircles,\r\n  placeEggs\r\n} from '../Utils.js';\r\nconst Boxes = {\r\n    //JXG.Options.line.highlight=false;\r\n    box1: function () {\r\n      ///////////////////////////////////GLOBAL SETTINGS//////////////////////\r\n      \tJXG.Options.board.minimizeReflow = 'none';\r\n        JXG.Options.point.showInfoBox=false;\r\n        JXG.Options.point.highlight=false;\r\n        JXG.Options.image.highlight=false;\r\n        JXG.Options.line.highlight=false;\r\n        JXG.Options.text.highlight=false;\r\n        JXG.Options.text.fixed=true;\r\n        JXG.Options.polygon.highlight=false;\r\n        JXG.Options.text.cssDefaultStyle='fontFamily:Oswald;'\r\n  //////////////////////////////////LOCAL SETTINGS////////////////////////////\r\n  var graph =createSpace(-4,12,-4,12);\r\n  graph.suspendUpdate();\r\n  graph.options.layer['image']=26;\r\n  graph.options.layer['text']=2;\r\n  graph.options.layer['html']=2;\r\n  graph.options.layer['line']=6;\r\n  graph.options.layer['point']=10;\r\n  graph.options.layer['polygon']=4;\r\n  graph.options.image.highlight=false;\r\n//    graph.options.text.display='internal';\r\n/*********************GRAPH DIMENSIONS*******************/\r\nconst boundingBox = graph.attr.boundingbox;\r\nconst positionX = (boundingBox[2]+boundingBox[0])/2;\r\nconst positionY = (boundingBox[1]+boundingBox[3])/2;\r\nconst height = (boundingBox[1]-boundingBox[3])/2;\r\n    //Make the board responsive\r\n    makeResponsive(graph);\r\n    // Creat titleStyle\r\n    placeLogo(graph);\r\n///////////////////////////////\r\n  var i = 0;\r\n  var eggs = placeEggs(graph);\r\n  eggs[0].setAttribute({visible:()=>i>=0});\r\n////////////////\r\n  eggs[1].setAttribute({visible:()=>i>=1});\r\n////////////////\r\n  eggs[2].setAttribute({visible:()=>i>=2});\r\n////////////////////////////////////////////\r\n    placeTitle(graph, 'Area of a Parallelogram', '(Showing that area of a parallelogram is bxh)');\r\n////////////////////////////////////////////////////////////////////////////////\r\n    var next = placeRedo(graph, 'right');\r\n    hoverMe(graph, next, 'Forward', 0, -5);\r\n    ////////////////////////////////////////////////////\r\n    var prev = placeUndo(graph, 'left');\r\n    hoverMe(graph, prev, 'Backward', 0, -5);\r\n/////////////////////////////////////////////////////////////////////////////\r\n    var Pt0 = drawPoint(graph, -2, 0);\r\n    setSize(graph, Pt0, 0);\r\n    //labelIt(graph, Pt0, 'A');\r\n    var Pt01 = drawPoint(graph, ()=>Pt0.X()+2, 0);\r\n    setSize(graph, Pt01, 0);\r\n    var Pt02 = drawPoint(graph, ()=>Pt0.X()+2, 4);\r\n    //labelIt(graph, Pt02, 'B');\r\n    setSize(graph, Pt02,0);\r\n    var Pt1 = drawPoint(graph, 0, 0);\r\n    setSize(graph, Pt1, 0);\r\n    var Pt2 = drawPoint(graph, 0, 4);\r\n    setSize(graph, Pt2, 0);\r\n    var Pt3 = drawPoint(graph, 5, 0);\r\n    setSize(graph, Pt3, 0);\r\n    //labelIt(graph, Pt3, 'C');\r\n    var Pt4 = drawPoint(graph, 7, 4);\r\n    setSize(graph, Pt4, 0);\r\n    drawSegment(graph, Pt0, Pt01);\r\n    var hide1 =drawSegment(graph, Pt0, Pt02);\r\n    var hide3 =drawSegment(graph, Pt01, Pt02);\r\n    drawSegment(graph, Pt1, Pt3);\r\n    var hide2=drawSegment(graph, Pt3, Pt4);\r\n    hide3.setAttribute({visible:()=>i>0});\r\n    hide1.setAttribute({visible:()=>i<2});\r\n    hide2.setAttribute({visible:()=>i<2});\r\n    drawSegment(graph, Pt2, Pt4);\r\n    var hide4=drawSegment(graph, Pt1, Pt2);\r\n    hide4.setAttribute({visible:()=>i>0});\r\n    //labelIt(graph, Pt4, 'D');\r\n    var pol1 = graph.create('polygon', [Pt0, Pt01, Pt02], {visible: true, fixed:true,  vertices:{visible:false, fixed:true}, borders:{visible:false, strokeColor: 'green', strokeWidth: 0}, fillColor:function(){if(i<2){return 'green'}else{return 'red'}}, fillOpacity:1});\r\n    var pol2 = graph.create('polygon', [Pt1, Pt3, Pt4, Pt2], {fixed:true, visible: true, vertices:{visible:false, fixed:true}, borders:{visible:false, strokeColor: 'green', strokeWidth: 0}, fillColor:function(){if(i<2){return 'green'}else{return 'red'}}, fillOpacity:1});\r\n    ////////////////////////////\r\n    var lin1 =drawDash(graph, Pt01, Pt02);\r\n    lin1.setAttribute({strokeColor:'black'});\r\n    ////////////////////////////////\r\n    var lin =drawDash(graph, Pt3, Pt4);\r\n    lin.setAttribute({strokeColor:'black'});\r\n    var t1 = drawPoint(graph, 7.5, 0);\r\n    setSize(graph, t1, 0);\r\n    var t2 = drawPoint(graph, 7.5, 4);\r\n    setSize(graph, t2, 0);\r\n    var t3 = drawPoint(graph, 0, 4.5);\r\n    setSize(graph, t3, 0);\r\n    var t4 = drawPoint(graph, 7, 4.5);\r\n    setSize(graph, t4, 0);\r\n    var horz =placeTapeVert(graph, t3, t4, ' ');\r\n    var vert =placeTapeHori(graph, t1, t2, ' ');\r\n    horz.setAttribute({label:{visible:false}});\r\n    vert.setAttribute({label:{visible:false}});\r\n    placeMiddleText(graph, positionX-0.5, 4.85, 'b');\r\n    placeMiddleText(graph, 7.85, 2, 'h');\r\n    /////////////////////\r\n    next.on('down', function(){\r\n      if(i==0){\r\n        Pt0.moveTo([-3, 0], 100);\r\n      }\r\n      if(i==1){\r\n        Pt0.moveTo([5, 0], 100);\r\n      }\r\n      if(i<2){\r\n      i+=1;}\r\n    });\r\n    prev.on('down', function(){\r\n      if(i==2){\r\n        Pt0.moveTo([-3, 0], 100);\r\n      }\r\n      if(i==1){\r\n        Pt0.moveTo([-2, 0], 100);\r\n      }\r\n      if(i>0){\r\n      i-=1;\r\n    }\r\n    });\r\n\r\n    //Pt1.moveTo([0, ()=>Pt1.Y()]);\r\n    //placeLabel(graph, Pt1, 'A', -15, 15);\r\n\r\n    var line1 = placeMiddleText(graph, positionX, 7.5, 'Area of Green Parallelogram');\r\n    line1.setAttribute({color:'green'});\r\n    var line2 = placeLeftText(graph, positionX, 6.5, '= Area of Red Rectangle = b x h');\r\n    line2.setAttribute({visible:()=>i>1, color:'red'});\r\n    //line3.setAttribute({visible:()=>i>1, color:'green'});\r\n\r\n///////////////////////////////////////////////////////////////////////\r\n    graph.unsuspendUpdate();\r\n                      },\r\n              }\r\nexport default Boxes;\r\n","<template>\r\n  <div>\r\n    <br>\r\n    <h5>Problem Description</h5>\r\n    <p class=\"big mt-2\">\n      The area of a parallelogram with length \\(b\\) and height \\(h\\) is given by \\(A= b\\times h\\).<br>\n      You may recall that the area of a rectangle with length \\(b\\) and height \\(h\\) is also given by \\(b \\times h\\).\n      <br>\r\n      In this MagicGraph, we will show why the area of a parallelogram equals its length times height &mdash; just as in the case of a rectangle.\r\n    </p>\r\n    <div style=\"text-align:left\">\r\n      <h5> MagicGraph | Area of a Parallelogram</h5>\r\n    </div>\r\n    <p class=\"big mt-2\">\r\n      Use the MagicGraph below to participate in the exercise. Tap on <i class=\"next ma-1\" /> button to move over to the next question.\r\n      Tap on <i class=\"previous ma-1\" /> button to go to previous step.\r\n      <br>\r\n    </p>\r\n    <v-responsive>\r\n      <v-layout justify-center>\r\n        <div id=\"jxgbox1\" class=\"edliy-box-about\" />\r\n      </v-layout>\r\n    </v-responsive>\r\n    <br>\r\n    <h5> Navigating through the MagicGraph </h5>\r\n    <p class=\"big mt-2\">\r\n      <i class=\"redoer ma-1\" /> &mdash; is the 'Next' button. Tap on this button to move over to the next question. <br>\r\n      <i class=\"tester ma-1\" /> &mdash; is the 'Check Your Answer' button. Tap on this button to check your answer.<br>\r\n      <i class=\"logor ma-1\" />&mdash;  is the 'Get a Hint' button. Tap on this button to receive a hint on how to solve this problem. <br>\r\n      <i class=\"undoer ma-1\" /> &mdash; is the 'Start Over' button. Tap on this button to start over the exercise from the begining.\r\n    </p>\r\n    <h5> Marks & Indications </h5>\r\n    <p class=\"big mt-2\">\r\n      The marks and indications are located on the top-left corner of the MagicGraph, and show your attempt status. <br>\r\n      <i class=\"righter ma-1\" /> &mdash; the right checkmark indicates that your attempted response was correct. <br>\r\n      <i class=\"wrong ma-1\" /> &mdash; this crossmark indicates that your attempted response was incorrect. <br>\r\n      <i class=\"missed ma-1\" /> &mdash; this exclaimation mark indicates an unattempted (missed) response. <br>\r\n    </p>\r\n  </div>\r\n</template>\r\n<script>\r\nimport Boxes from './Boxes.js'\r\nexport default {\r\n  name: 'TheoremThales',\r\n  created: function () {\r\n    this.$store.commit('navigation/resetState');\r\n    let title = 'Area of Parallelogram';\r\n    this.$store.commit('navigation/changeTitle', title);\r\n  /* this.$store.commit('navigation/changeMenu', title);\r\n    let newTopics = [\r\n      {title: 'Probability', img:'/assets/number-1.svg', action: () => this.goto('intro')},\r\n      {title: 'Probability of an Event', img:'/assets/number-2.svg', action: () => this.goto('types')},\r\n      {title: 'MagicGraph',img:'/assets/touch.svg', action: () => this.goto('pg')},\r\n    ];\r\n    this.$store.commit('navigation/replaceTopics', newTopics);\r\n*/\r\n    let newshowhome = false;\r\n    this.$store.commit('navigation/toggleshowhome', newshowhome);\r\n    let newMath =true;\r\n    this.$store.commit('navigation/replaceMath', newMath);\r\n    let newLeftArrow =true;\r\n    this.$store.commit('navigation/replaceLeftArrow', newLeftArrow);\r\n    let newModule=true;\r\n    this.$store.commit('navigation/replaceModule', newModule);\r\n  },\r\n  mounted () {\r\n    MathJax.Hub.Queue([\"Typeset\", MathJax.Hub]);\r\n    Boxes.box1();\r\n  },\r\n  metaInfo() {\r\n  return{ title: 'Area of a Parallelogram',\r\n          titleTemplate: '%s | Learn interactively',\r\n          meta: [\r\n                  {vmid: 'description', name: 'description', content: 'Learn interactively about the area of a  parallelogram.'}\r\n                ]\r\n        }\r\n   },\r\n}\r\n</script>\r\n","import mod from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/babel-loader/lib/index.js!../../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Lesson.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/babel-loader/lib/index.js!../../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Lesson.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./Lesson.vue?vue&type=template&id=5e517190&\"\nimport script from \"./Lesson.vue?vue&type=script&lang=js&\"\nexport * from \"./Lesson.vue?vue&type=script&lang=js&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports"],"sourceRoot":""}