{"id":18181,"date":"2020-04-22T14:26:35","date_gmt":"2020-04-22T22:26:35","guid":{"rendered":"https:\/\/www.techykids.com\/?page_id=18181"},"modified":"2020-04-22T14:26:35","modified_gmt":"2020-04-22T22:26:35","slug":"customizer","status":"publish","type":"page","link":"https:\/\/techykids.com\/staging\/3266\/customizer","title":{"rendered":"TechyKids Course Customizer"},"content":{"rendered":"<p>Use this page to customize your course as desired by rearranging, deleting, and adding blocks to the learning map. \u00a0Save your work. \u00a0To create this as an actual course and enroll students, email sharon@techykids.com. \u00a0You can use the drop down menu under the Customizer to open up a map you&#8217;ve previously created.<\/p>\n<div class='custom-techykids-wrapper' >\n\n  <script type=\"text\/javascript\">\n\n    var activeCalculation = {};\n\n    function timeConvertorBlocky(minutes){\n      var hours   = Math.floor( minutes \/ 60);\n      var minutes =  minutes % 60 + ' min';\n      return (hours) ? hours + ' hr ' + minutes : minutes;       \n    }\n    \n      function updateUiCalculation(){\n\n        var totalEstTime    = 0;\n        var totalMatterTags = [];\n        var totalLessonTags = [];\n        var totalTimeLength = 0;\n        var totalYoungest   = '';\n\n        var resetElement = [\n         '.blocky-total-estimate-time'\n        ,'.blocky-total-matter-tag'\n        ,'.blocky-lesson-matter-tag'\n        ,'.blocky-total-time-length'\n        ,'.blocky-total-youngest-grade'];\n\n        jQuery(resetElement.join(',')).html('');\n\n\n       \n        for(var x in activeCalculation){\n          if(\n               typeof(activeCalculation[x]) == 'undefined' \n            || typeof(activeCalculation[x]['blocky_lesson_calculation']) == 'undefined'){\n            return;\n          }\n          var temp = activeCalculation[x]['blocky_lesson_calculation'] || '';\n          if( typeof( temp ) == \"object\" ){\n            var bl_est_time_length      = parseInt(temp['bl_est_time_length']) || 0;\n            var bl_time_length          = parseInt(temp['bl_time_length'])     || 0;\n            var bl_youngest_grade_level = temp['bl_youngest_grade_level']      || '';\n          \n            totalEstTime += bl_est_time_length;\n            totalTimeLength += bl_time_length;\n\n            var intialGrade = parseInt(bl_youngest_grade_level) || 0;\n            if( intialGrade > totalYoungest){\n              totalYoungest = bl_youngest_grade_level;\n            }                                    \n          }\n\n          var bl_matters_tags = activeCalculation[x]['tags']; \n          for(var i=0; i < bl_matters_tags.length ; i++){\n            if( totalMatterTags.indexOf( bl_matters_tags[i] ) == -1 ){\n              totalMatterTags.push( bl_matters_tags[i] );\n            }\n          }\n\n          var bl_lesson_tags = activeCalculation[x]['lessonTag']; \n          for(var i=0; i < bl_lesson_tags.length ; i++){\n            if( totalLessonTags.indexOf( bl_lesson_tags[i] ) == -1 ){\n              totalLessonTags.push( bl_lesson_tags[i] );\n            }\n          }\n\n        }\n\n        updateParam = {\n          'blocky-total-estimate-time' : timeConvertorBlocky(totalEstTime),\n          'blocky-total-matter-tag'    : totalMatterTags.join(', '),\n          'blocky-lesson-matter-tag'   : totalLessonTags.join(', '),\n          'blocky-total-time-length'   : timeConvertorBlocky (totalTimeLength ),\n          'blocky-add-time-length'     : timeConvertorBlocky(totalEstTime + totalTimeLength),\n          'blocky-total-youngest-grade': totalYoungest\n        }\n\n        for(var selector in updateParam){\n          jQuery('.'+selector).html(updateParam[selector]);\n        }\n\n        \/\/ jQuery('.blocky-total-estimate-time').html(timeConvertorBlocky(totalEstTime));\n        \/\/ jQuery('.blocky-total-matter-tag').html(totalMatterTags.join(', '));\n        \/\/ jQuery('.blocky-lesson-matter-tag').html(totalLessonTags.join(', '));\n        \/\/ jQuery('.blocky-total-time-length').html(timeConvertorBlocky (totalTimeLength ));\n        \/\/ jQuery('.blocky-add-time-length').html(timeConvertorBlocky(totalEstTime + totalTimeLength) );\n        \/\/ jQuery('.blocky-total-youngest-grade').html(totalYoungest);\n\n      }\n\n\n\n  jQuery(document).ready(function(){\n\n              Blockly.Blocks[\"lessons\"] = {\n            init: function() {\n              this.appendStatementInput(\"NAME\")\n                  .setCheck(null)\n                  .appendField(\"Lessons\");\n              this.setPreviousStatement(true, null);\n              this.setNextStatement(true, null);\n              this.setColour(30);\n              this.setTooltip(\"Lessons\");\n            }\n          };\n          Blockly.JavaScript[\"lessons\"] = function(block) {\n            return 'temp'+lessons+\";\\n\";\n          };\n                 Blockly.Blocks[\"mediums\"] = {\n            init: function() {\n              this.appendStatementInput(\"NAME\")\n                  .setCheck(null)\n                  .appendField(\"Mediums\");\n              this.setPreviousStatement(true, null);\n              this.setNextStatement(true, null);\n              this.setColour(345);\n              this.setTooltip(\"Mediums\");\n            }\n          };\n          Blockly.JavaScript[\"mediums\"] = function(block) {\n            return 'temp'+mediums+\";\\n\";\n          };\n                 Blockly.Blocks[\"deliverables\"] = {\n            init: function() {\n              this.appendStatementInput(\"NAME\")\n                  .setCheck(null)\n                  .appendField(\"Deliverables\");\n              this.setPreviousStatement(true, null);\n              this.setNextStatement(true, null);\n              this.setColour(120);\n              this.setTooltip(\"Deliverables\");\n            }\n          };\n          Blockly.JavaScript[\"deliverables\"] = function(block) {\n            return 'temp'+deliverables+\";\\n\";\n          };\n                 Blockly.Blocks[\"slides\"] = {\n            init: function() {\n              this.appendStatementInput(\"NAME\")\n                  .setCheck(null)\n                  .appendField(\"Slides\");\n              this.setPreviousStatement(true, null);\n              this.setNextStatement(true, null);\n              this.setColour(60);\n              this.setTooltip(\"Slides\");\n            }\n          };\n          Blockly.JavaScript[\"slides\"] = function(block) {\n            return 'temp'+slides+\";\\n\";\n          };\n               Blockly.Blocks['slide___create_new'] = {\n          init: function() {\n            this.appendDummyInput()\n                .appendField(\"Slide\")\n                .appendField(new Blockly.FieldTextInput(\"Create Yor Own\"), \"NAME\");\n            this.setPreviousStatement(true, null);\n            this.setNextStatement(true, null);\n            this.setColour(65);\n            this.setTooltip('');\n            \/\/this.setHelpUrl('http:\/\/www.example.com\/');\n          }\n        };\n        Blockly.JavaScript['slide___create_new'] = function(block) {\n          return 'slide___create_new'+\";\\n\";\n        };\n           var options = {\n      toolbox: document.getElementById('toolbox'),\n      grid: {\n        spacing: 25,\n        length: 2,\n        color: '#ff0000',\n      },\n      trashcan: true,\n      comments: false,\n      collapse: false,\n      disable: false,\n            zoom: {\n        controls: true,\n        wheel: false,\n        startScale: 0.8,\n        maxScale: 3.0,\n        minScale: 0. ,\n        scaleSpeed: 1.2,\n      },\n    };\n\n      function openInNewTab(url) {\n        var win = window.open(url, '_blank');\n        if(win){\n          win.focus();\n        }else{\n          swal(\"Unable to open Lesson in new tab, allow popup to open Lesson in new tab\")\n        }\n      }\n\n      function bindLessonClickInNewTab(element,blockId){\n        \/*\n        element.addClass('cursor-pointer').click({id: blockId},function(event){\n          blockId = event.data.id;\n          if(blockId && activeCalculation[blockId] && activeCalculation[blockId].permalink){\n            openInNewTab(activeCalculation[blockId].permalink);\n          }\n        });\n        *\/\n        if(blockId && activeCalculation[blockId] && activeCalculation[blockId].permalink){\n\n          \/\/Desktop System\n          element.addClass('cursor-pointer').on('click',{id: blockId},function(event){\n            if(typeof(keyToUrl[blockId]) !== 'undefined' ){\n              return openInNewTab(keyToUrl[blockId]);\n            }\n            openInNewTab(activeCalculation[blockId].permalink);\n          });\n\n          \/\/OnMobile System : Opening the URL in same Tab\n          var touchmoved;\n          element.on('touchend',{id: blockId} , function(e){\n              if(touchmoved != true){\n                window.location.href=activeCalculation[blockId].permalink;\n              }\n          }).on('touchmove', function(e){\n              touchmoved = true;\n          }).on('touchstart', function(){\n              touchmoved = false;\n          });\n\n        }        \n      } \n\n      function bindClickEventToBlocks(blockId){\n        \/\/Adding Click Event\n        if(window.workspace.options.readOnly){\n          var blockDBTemp = window.workspace.blockDB_;\n          \/\/for(x in blockDBTemp){  \n            jQuery(blockDBTemp[blockId].svgPath_).parent().children('g').each(function(){\n              var children = jQuery(this).children();\n              \/\/console.log(children , children.length ,children.prop(\"tagName\") )\n              if(   children.length == 1 \n                 && children.prop(\"tagName\").toLowerCase() == \"image\" \n              ){\n                bindLessonClickInNewTab(children,blockId);\n              }\n            });\n            \n            bindLessonClickInNewTab(jQuery(blockDBTemp[blockId].svgPath_),blockId);\n          \/\/}\n        }\n      }\n\n    var keyToUrl = []\n    window.workspace = Blockly.inject('blocklyDiv', options);\n    var activeBlockyDetails = [];\n    \/\/console.log(activeBlockyDetails);\n    window.workspace.addChangeListener(function(event) {\n    \/\/console.log(event.type);\n    switch(event.type){\n      case Blockly.Events.CREATE:\n\n         for(var i=0; i< event.ids.length ; i++){\n           block = workspace.getBlockById(event.ids[i]);\n           if(typeof(activeBlockyDetails[block.type] ) !== 'undefined'){\n             activeCalculation[event.ids[i]] = activeBlockyDetails[block.type];\n             bindClickEventToBlocks(event.ids[i]);\n             if(typeof(block.helpUrl) !== 'undefined' && typeof(keyToUrl[block.id]) !== 'undefined' ){\n               block.helpUrl = keyToUrl[block.id];\n             }\n           }\n         }\n         updateUiCalculation();\n       break;\n      case Blockly.Events.DELETE:\n        for(var i=0; i< event.ids.length ; i++){\n          delete activeCalculation[event.ids[i]];\n        }\n        updateUiCalculation();\n      break;\n      case Blockly.Events.UI:\n        if(   window.workspace.options.readOnly\n           && event.element == \"click\"\n           && activeCalculation[event.blockId]\n           && activeCalculation[event.blockId].permalink){\n\n          openInNewTab(activeCalculation[event.blockId].permalink);\n        }\n      break;\n    }\n    \n    });   \n\n    var saveBlocksValue = [];\n\n    function saveActiveValue(){\n      var xml = Blockly.Xml.workspaceToDom(workspace);\n      var xml_text = Blockly.Xml.domToText(xml);\n      saveBlocksValue.push(xml_text); \n    }\n\n\n  });\n  <\/script>\n\n    <style type=\"text\/css\">\n      .blocky-listing a.woo-sc-button{\n        margin-bottom:0px;\n      }\n      .blocky-text-right{\n        text-align: right;\n      }\n      .blocky-text-left{\n        text-align: left;\n      }       \n      .blocky-action-bar{\n        margin:30px 0px 10px;\n      }\n      .blocky-add-operation .new-blocky-action,\n      .blocky-edit-operation .update-blocky-action{       \n        display:inline-block;\n      }\n      .blocky-add-operation .update-blocky-action,\n      .blocky-edit-operation .new-blocky-action{\n        display:none;\n      }\n      .blocky-action-bar button{\n        margin-left:15px;\n      }\n      .blocky-hide{\n        display:none;\n      }\n      .cursor-pointer{\n        cursor:pointer;\n      }\n      .hide-action-button .blocky-edit,\n      .hide-action-button .blocky-delete{\n        display:none;\n      }  \n      \n      \/* Create Course \/ Update Course Btn *\/\n\n      .clone-create-course.action-create-block .create-course{\n        display:inline;\n      }\n      .clone-create-course.action-create-block .update-course{\n        display:none;\n      }\n      .clone-create-course.action-update-block .create-course{\n        display:none;\n      }\n      .clone-create-course.action-update-block .update-course{\n        display:inline;\n      }\n\n\n    <\/style>\n\n    <div class=\"blocky-wrapper blocky-add-operation\" style=\"width: 100%;\">\n    <div id=\"blocklyDiv\" style=\"height:750px;\">\n      <xml xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\" id=\"toolbox\" style=\"display: none;\">\n              <\/xml>\n    <\/div>\n\n    <div class=\"blocky-action-bar blocky-text-right\">\n              <div class=\"new-blocky-action blocky-text-right\">\n          <button id=\"\" class=\"button blocky-map-save\"> <i class=\"fa fa-plus\"><\/i> Add New <\/button>\n          <button id=\"\" class=\"button red blocky-map-clear\"> <i class=\"fa fa-eraser\"><\/i> Clear <\/button>\n        <\/div>\n        <div class=\"update-blocky-action\">\n          <input type=\"text\" value=\"\" name=\"blocky-update-name\" class=\"input\" placeholder=\"Name of Blocky\">\n          <button id=\"\" class=\"button blocky-map-update\"> <i class=\"fa fa-pencil-square-o\"><\/i> Update Map <\/button>\n          <button id=\"\" class=\"button blocky-update-cancel\"> <i class=\"fa fa-close\"><\/i> Cancel Update <\/button>\n        <\/div>\n                      <div class=\"update-blocky-action clone-create-course action-create-block\">\n                                \n        <\/div>\n    <\/div>\n\n\n\n\n        <!-- Calculation -->\n\n                <style type=\"text\/css\">\n        @media (min-width:600px)  { \n          .blocklyToolboxDiv{\n            margin-top:-30px;\n            padding-bottom: 30px;\n            z-index:2;\n          }\n          .blocky-wrapper{\n            padding-top:30px;\n            position: relative;\n          }\n          .blocky-calculation{\n            position: absolute;\n            top: 0px;\n            left: 0px;\n            background-color: #DDDDDD;\n            width: 100%;\n            z-index: 2;\n          }\n          .blocky-calculation p {\n            float: right;\n            padding: 0px;\n            margin-left: 20px;\n            margin: 0px 2px 0px 20px;\n            line-height: 30px;\n            width:20%;\n          }      \n          .blocklyTreeRoot {\n            padding: 4px 0;\n            margin-top: 30px;\n          }\n\n        }\n        \n\n        <\/style>\n        <div class=\"blocky-calculation\">\n            <p>\n              <strong>Total Time: <\/strong>\n              <span class=\"blocky-add-time-length\"><\/span>\n            <\/p>          \n            <p>\n              <strong>Activity Time: <\/strong>\n              <span class=\"blocky-total-estimate-time\"><\/span>\n            <\/p>    \n            <p>\n              <strong>Lesson Time: <\/strong>\n              <span class=\"blocky-total-time-length\"><\/span>\n            <\/p>  \n            <p>\n              <strong>Grade Level: <\/strong>\n              <span class=\"blocky-total-youngest-grade\"><\/span>\n            <\/p>                         \n        <\/div>\n\n      \n     <!-- Calcuation Number 2 -->\n           <div class=\"\">        \n        <p>\n          <strong>Subject Tags: <\/strong>\n          <span class=\"blocky-total-matter-tag\"><\/span>\n        <\/p>\n      <\/div>\n\n      <div class=\"\">        \n        <p>\n          <strong>Standards: <\/strong>\n          <span class=\"blocky-lesson-matter-tag\"><\/span>\n        <\/p>\n      <\/div>\n\n     \n   \n    <!-- Listing -->\n\n    \n\n\n\n\n  <\/div>\n\n  <script type=\"text\/javascript\">\n     (function($){\n\n      $(document).ready(function(){\n\n\n        var stripSlashes = function(param){\n            return param.replace(\/\\\\(.)\/mg, \"$1\");\n        }\n\n        var currentEditId = -1; \/\/ -1 for add \n\n          var sendRequest = function(param){\n            param = $.extend({\n              success  : function(){},\n              error    : function(){},\n              complete : function(){},\n              data     : {}\n            },param);\n\n            $.ajax( $.extend( {\n              url      :  blockyTechykidsObj.ajax_url,\n              method   : 'post',\n              dataType : 'json'\n            },param,{\n              success : function(response){\n                if(response == \"0\"){\n                  var loginLink  = 'https:\/\/techykids.com\/staging\/3266\/login';\n                  var anchorText = $( document.createElement('a') ).attr('target','_blank').attr('href',loginLink).text('Click Here to login').wrap('<p\/>').parent().html();\/\/This is the fastest way\n                  return swal({\n                    title : \"Authentication error\",\n                    \/\/text  : \" <a target='_blank' href='https:\/\/techykids.com\/staging\/3266\/login' > Click Here to login  <\/a>\",\n                    text  : anchorText, \n                    type  : \"error\",\n                    html  : true,\n                    closeOnConfirm: true,\n                  });\n                }\n                if(response.status == 0){\n                  return param.error(response);\n                }\n                return param.success(response);\n              }             \n            }));\n          };\n\n\n          var showHideTable = function(tableRef){\n            if( tableRef.find('tbody tr').length <= 1){\n              tableRef.addClass('blocky-hide');\n            }else{\n              tableRef.removeClass('blocky-hide');\n            }\n          }\n\n          $('.blocky-wrapper').on('click', '.blocky-map-save', function(e) {\n          \/\/$('.blocky-map-save').click(function(){\n            var parentBlock = $(this).closest('.blocky-wrapper');\n            swal({\n              title: \"Name!\",\n              text: \"Place the name of blocky , so that you can easily manage it:\",\n              type: \"input\",\n              showCancelButton: true,\n              closeOnConfirm: false,\n              animation: \"slide-from-top\",\n              showLoaderOnConfirm: true,\n              inputPlaceholder: \"Write something\"\n            },\n            function(inputValue){\n              if (inputValue === false) return false;\n              if (inputValue === \"\") {\n                swal.showInputError(\"You need to write something!\");\n                return false\n              }\n              var xml = Blockly.Xml.workspaceToDom(window.workspace);\n              var xmlText = Blockly.Xml.domToText(xml);\n              \/\/ fa fa-spinner fa-pulse fa-fw\n              return sendRequest({\n                data : {\n                  'action' : 'blocky_techkids_insert',\n                  'xml'    : xmlText,\n                  'name'   : inputValue\n                },\n                success : function(response){\n\n                  if(response.message && response.message.id ){\n                    \/\/Adding in Listing\n                    var tableRow = '<tr data-id=\"'+response.message.id+'\">'\n                                +'<td>'+response.message.id+'<\/td>'\n                                +'<td>'+response.message.name+'<\/td>'\n                                +'<td>'\n                                  +'<a href=\"\" class=\"woo-sc-button orange blocky-edit\">'\n                                    +'<i class=\"fa fa-edit\"><\/i> <span>Edit<\/span>'\n                                  +'<\/a>'\n                                  +'<a href=\"\" class=\"woo-sc-button red blocky-delete\">'\n                                    +'<i class=\"fa fa-trash\"><\/i> <span>Delete<\/span>'\n                                  +'<\/a>'\n                                +'<\/td>'\n                                +'<\/tr>';\n                    parentBlock.find('.blocky-listing tbody').append(tableRow);\n                    showHideTable(parentBlock.find('.blocky-listing'));\n\n                    \/\/Adding in Drop Down\n                    var optionHTML = '<option value=\"'+response.message.id+'\"> '+response.message.name+'<\/option>';\n                    parentBlock.find('.blocky-listing-dropdown [name=\"active-selected-blocky\"]').append(optionHTML);\n\n                    return swal(\"Nice!\", \"You blocky is saved\");\n                  }\n                  return swal(\"Error\", \"Something went wrong while saving\", \"error\"); \n                },\n                error : function(){\n                  \/\/console.log('error');\n                  swal(\"Error\", \"Something went wrong while saving\", \"error\");\n                },\n                complete:function(){\n                  \/\/console.log('Complete');\n                }             \n              });\n            });\n            return;\n          });\n\n\n\n          \n\n          \/\/Cancel-Update\n          $('.blocky-wrapper').on('click', '.blocky-map-clear', function(e) {\n            currentEditId = -1;\n            $(this).closest('.blocky-wrapper').removeClass('blocky-edit-operation').addClass('blocky-add-operation');\n            Blockly.mainWorkspace.clear();\n          });\n\n          \/\/Cancel-Update\n          $('.blocky-wrapper').on('click', '.blocky-update-cancel', function(e) {\n            currentEditId = -1;\n            var closestParaent = $(this).closest('.blocky-wrapper');\n            closestParaent.removeClass('blocky-edit-operation').addClass('blocky-add-operation');\n            closestParaent.find('input[name=\"blocky-update-name\"]').val('');\n            Blockly.mainWorkspace.clear();\n          });\n\n\n\n          \/\/Create Course Map\n          $('.blocky-wrapper').on('click', '.blocky-map-create-course', function(e){\n\n            e.preventDefault();\n            var currentButton = $(this);\n\n            if(currentEditId == -1){\n              return sweetAlert(\"Oops...\", \"Something went wrong! Please refresh the page\", \"error\");\n            }\n\n            var closestParent = currentButton.closest('.blocky-wrapper');\n            \n            swal({\n              title: \"This request will Create Course for the current Map\",\n              text: \"You can see the Created Course in your listing\",\n              type: \"warning\",\n              showCancelButton: true,\n              confirmButtonColor: \"#DD6B55\",\n              confirmButtonText: \"Yes, Create Course Map!\",\n              cancelButtonText: \"No, cancel!\",\n              closeOnConfirm: false,\n              closeOnCancel: true,\n              showLoaderOnConfirm: true\n            },\n            function(isConfirm){\n\n              \n              if (isConfirm) {\n                return sendRequest({\n                  data : {\n                    'action' : 'blocky_techkids_createCourse',\n                    'xml_id' : currentEditId,\n                    'type'   : currentButton.attr('data-type')\n                  },\n                  success : function(response){\n                    \/\/Open Map In New Window or in same tab\n                    if(response.status == 1 && response.message){\n\n                      var title = \"Course Updated\"; \n                      if($('.clone-create-course').hasClass('action-create-block')){\n                        title = \"Course Created\";\n                      }\n\n                        \n                      if(response.permalink && response.xml_id ){\n                        \/\/ In the case title will have the star added for dropdown.\n                        var nameTd = closestParent.find('.blocky-listing tr[data-id=\"'+response.xml_id+'\"] td:nth-child(2)');\n                        if( !nameTd.find('.fa').length ){ \/\/ No link is added in past\n                          nameTd.append('<a href=\"'+response.permalink+'\" target=\"_blank\">' +\n                           '<i class=\"fa fa-external-link\" aria-hidden=\"true\"><\/i>' +\n                           '<\/a>'\n                          );\n                        }\n\n                        \/\/ In case of list it will add the link.\n\n                        \/\/ Adding * in option if not present\n                        var option = closestParent.find('.blocky-listing-dropdown [name=\"active-selected-blocky\"] option[value=\"'+response.xml_id+'\"\"]');\n                        if(option.length){\n                          var currentName = $.trim( option.html());\n                          if( currentName.charAt(currentName.length-1) != '*' ){\n                            option.html( currentName + '*' );\n                          }\n                        }\n                      }\n\n                      $('.clone-create-course').removeClass('action-create-block').addClass('action-update-block');\n                      return swal({\n                        title : title,\n                        text  : stripSlashes(response.message),\n                        html  : true\n                      });        \n                    }\n                    swal(\"Error\", \"Something went wrong while cloning\", \"error\");\n                  },\n                  error : function(){\n                    swal(\"Error\", \"Something went wrong while cloning\", \"error\");\n                  }             \n                });\n              }\n            });\n\n          });\n\n          \/\/Clone Map\n          $('.blocky-wrapper').on('click', '.blocky-map-clone', function(e){\n\n            e.preventDefault();\n            var currentButton = $(this);\n\n            if(currentEditId == -1){\n              return sweetAlert(\"Oops...\", \"Something went wrong! Please refresh the page\", \"error\");\n            }\n\n            swal({\n              title: \"This request will clone the current Map\",\n              text: \"You can see the cloned Map in your listing\",\n              type: \"warning\",\n              showCancelButton: true,\n              confirmButtonColor: \"#DD6B55\",\n              confirmButtonText: \"Yes, Clone it!\",\n              cancelButtonText: \"No, cancel!\",\n              closeOnConfirm: false,\n              closeOnCancel: true,\n              showLoaderOnConfirm: true\n            },\n            function(isConfirm){\n              if (isConfirm) {\n                return sendRequest({\n                  data : {\n                    'action' : 'blocky_techkids_clone',\n                    'xml_id' : currentEditId\n                  },\n                  success : function(response){\n                   \/\/Open Map In New Window or in same tab\n                   if(response.message){\n                      clonedUrl = \"?_e=\"+response.message;\n                      var win = window.open(clonedUrl, '_blank');\n                      swal(\"Map Cloned\");\n                      if(win)\n                        win.focus();\n                      window.location.href = clonedUrl;\n                      return            \n                   }\n                   swal(\"Error\", \"Something went wrong while cloning\", \"error\");\n                  },\n                  error : function(){\n                    swal(\"Error\", \"Something went wrong while cloning\", \"error\");\n                  }             \n                });\n              }\n            });\n\n          });\n\n\n          \/\/Update Map\n\n          $('.blocky-wrapper').on('click', '.blocky-map-update', function(e) {\n            e.preventDefault();\n            var currentButton = $(this);\n\n            if(currentEditId == -1){\n              return sweetAlert(\"Oops...\", \"Something went wrong! Please refresh the page\", \"error\");\n            }\n\n            swal({\n              title: \"Your previous changes will be overwritten?\",\n              text: \"You will not be able to recover the older blocky map\",\n              type: \"warning\",\n              showCancelButton: true,\n              confirmButtonColor: \"#DD6B55\",\n              confirmButtonText: \"Yes, Update it!\",\n              cancelButtonText: \"No, cancel !\",\n              closeOnConfirm: false,\n              closeOnCancel: true,\n              showLoaderOnConfirm: true\n            },\n            function(isConfirm){\n              if (isConfirm) {\n                var activeEditRow = currentButton.closest('tr');\n                var activeButton  = currentButton;\n                var closestParent = activeButton.closest('.blocky-wrapper');\n\n                var xml = Blockly.Xml.workspaceToDom(window.workspace);\n                var xmlText = Blockly.Xml.domToText(xml);\n\n                return sendRequest({\n                  data : {\n                    'action' : 'blocky_techkids_update',\n                    'xml_id' : currentEditId,\n                    'xml'    : xmlText,\n                    'name'   : closestParent.find('input[name=\"blocky-update-name\"]').val()\n                  },\n                  success : function(response){\n\n                    if(response.message && response.message.id ){\n              \n                      \/\/Reset Map Area\n                      \/\/closestParent.find('input[name=\"blocky-update-name\"]').val('');\n                      \/\/closestParent.removeClass('blocky-edit-operation').addClass('blocky-add-operation');\n\n                      \/\/Updating Existing Record\n                      \/\/Listing\n                      closestParent.find('.blocky-listing tr[data-id=\"'+response.message.id+'\"] td:nth-child(2)').html(response.message.name);\n\n                      \/\/DropDown\n                      closestParent.find('.blocky-listing-dropdown [name=\"active-selected-blocky\"] option[value=\"'+response.message.id+'\"]').html(response.message.name);\n\n                      return swal(\"Blocky Saved\");  \n                    }\n                    $message =  \"Something went wrong while updating Map\";\n\n                    if(typeof(response.message) !== 'undefined'){\n                      $message = response.message;\n                    }\n                    return swal(\"Error\", $message, \"error\");      \n                  },\n                  error : function(){\n                    swal(\"Error\", \"Something went wrong while fetching details\", \"error\");\n                  }             \n                });\n              }\n            });\n          });\n\n\n          \n\n          \/*\n           * Function Name : deleteBlockyUI\n           * \n           *\n           *\/\n\n          var deleteBlockyUI = function(param){\n\n            var activeButton  = param.activeButton;\n            var deleteId      = param.deleteId;\n            swal({\n              title: \"Are you sure?\",\n              text: \"You will not be able to recover this data!\",\n              type: \"warning\",\n              showCancelButton: true,\n              confirmButtonColor: \"#DD6B55\",\n              confirmButtonText: \"Yes, delete it!\",\n              cancelButtonText: \"No, cancel!\",\n              closeOnConfirm: false,\n              closeOnCancel: true,\n              showLoaderOnConfirm: true\n            },\n            function(isConfirm){\n              if (isConfirm) {\n                return sendRequest({\n                  data : {\n                    'action' : 'blocky_techkids_delete',\n                    'xml_id' : deleteId\n                  },\n                  beforeSend : function(){\n                    activeButton.find('i').attr('class','fa fa-spinner fa-pulse fa-fw');\n                    activeButton.find('span').html('');\n                  },\n                  success : param.success,\n                  error : function(){\n                    activeButton.find('i').attr('class','fa fa-refresh');\n                    activeButton.find('span').html('Retry');\n                    swal(\"Error\", \"Sorry , unable to delete blocky)\", \"error\");\n                  }             \n                }); \n              }\n            });\n\n          }\n\n          \/\/Drop Down Delete \n          $('.blocky-wrapper').on('click', '.blocky-listing-dropdown .blocky-delete', function(e) {\n            e.preventDefault();\n            var activeButton = $(this);\n            var deleteId     =  activeButton.closest('.blocky-listing-dropdown').find('[name=\"active-selected-blocky\"]').val();\n            deleteBlockyUI({\n              activeButton : activeButton,\n              deleteId     : deleteId,\n              success      : function(){\n                activeButton.find('i').attr('class','fa fa-edit');\n                activeButton.find('span').html('Delete');\n                var dropDown = activeButton.closest('.blocky-listing-dropdown').find('[name=\"active-selected-blocky\"]');\n                dropDown.val('');\n                dropDown.find('option[value=\"'+deleteId+'\"]').remove();\n                updateDropDownUI();\n                swal(\"Deleted!\", \"Your blocky has been deleted.\", \"success\");                \n              }\n            });\n          })\n\n          \/\/Delete\n          $('.blocky-wrapper').on('click', '.blocky-listing .blocky-delete', function(e) {\n            e.preventDefault();\n            var activeButton = $(this);\n            deleteBlockyUI({\n              activeButton : activeButton,\n              deleteId     : activeButton.closest('tr').attr('data-id'),\n              success      : function(){\n                var parentTable = activeButton.closest('table');\n                activeButton.closest('tr').remove();\n                showHideTable(parentTable);\n                swal(\"Deleted!\", \"Your blocky has been deleted.\", \"success\");                \n              }\n            });\n          });\n\n\n          \/*\n           * Function Name : editBlockyUI\n           * \n           *\n           *\/\n\n          var editBlockyUI = function(param){\n            var activeButton   = param.activeButton;\n            \n            swal({\n              title: \"Are you sure?\",\n              text: \"You current changes will not be saved\",\n              type: \"warning\",\n              showCancelButton: true,\n              confirmButtonColor: \"#DD6B55\",\n              confirmButtonText: \"Yes, Edit it!\",\n              cancelButtonText: \"No, cancel !\",\n              closeOnConfirm: false,\n              closeOnCancel: true,\n              showLoaderOnConfirm: true\n            },\n            function(isConfirm){\n              if (isConfirm) {\n  \n                return sendRequest({\n                  data : {\n                    'action' : 'blocky_techkids_select',\n                    'xml_id' : currentEditId\n                  },\n                  beforeSend : function(){\n                    activeButton.find('i').attr('class','fa fa-spinner fa-pulse fa-fw');\n                    activeButton.find('span').html('');\n                  },\n                  success : function(response){\n                    if(response.message && response.message.id){\n                      currentEditId = response.message.id;\n                      activeButton.find('i').attr('class','fa fa-edit');\n                      activeButton.find('span').html('Edit');\n\n                      \/\/Clean and Load new XML in workspace\n                      Blockly.mainWorkspace.clear();\n                      var xml = Blockly.Xml.textToDom(response.message.xml);\n                      Blockly.Xml.domToWorkspace(xml, window.workspace);                    \n\n                      \/\/Editing Map\n                      var closestParaent = activeButton.closest('.blocky-wrapper');\n                      closestParaent.find('input[name=\"blocky-update-name\"]').val(response.message.name);\n                      closestParaent.removeClass('blocky-add-operation').addClass('blocky-edit-operation');\n                      $('html,body').animate({scrollTop: closestParaent.offset().top});\n                      return swal(\"Blocky Loaded\");\n                    }\n                    return  swal(\"Error\", \"Something went wrong while fetching details\", \"error\");\n                  },\n                  error : function(){\n                    activeButton.find('i').attr('class','fa fa-refresh');\n                    activeButton.find('span').html('Retry');\n                    swal(\"Error\", \"Something went wrong while fetching details\", \"error\");\n                  }             \n                });\n              }\n            });\n          }\n\n          \/\/Drop Down Edit \n          $('.blocky-wrapper').on('click', '.blocky-listing-dropdown .blocky-edit', function(e) {\n            e.preventDefault();\n            var activeButton = $(this);\n            currentEditId    = activeButton.closest('.blocky-listing-dropdown').find('[name=\"active-selected-blocky\"]').val();\n\n            var closestDropdown = activeButton.closest('.blocky-listing-dropdown').find('[name=\"active-selected-blocky\"]');\n            var activeValue     = closestDropdown.val();\n            var optionHTML      = closestDropdown.find('option[value=\"'+activeValue+'\"]').html();\n\n            optionHTML = $.trim(optionHTML); \/\/ Removing spaces\n\n            console.log('optionHTML', optionHTML);\n            console.log(this);\n\n\n            if( optionHTML.charAt(optionHTML.length-1) != '*' ){ \/\/ Has course, update course\n              $('.clone-create-course')\n                .removeClass('action-create-block')\n                .addClass('action-update-block');\n            }\n\n            editBlockyUI({\n              activeButton  : activeButton\n            });\n          })\n\n          \/\/Edit\n          $('.blocky-wrapper').on('click', '.blocky-listing .blocky-edit', function(e) {\n            e.preventDefault();\n            var activeButton = $(this);\n            currentEditId    = activeButton.closest('tr').attr('data-id');\n\n            \/\/ Adding correct class according\n            var nameTd = activeButton.closest('tr[data-id]').find('td:nth-child(2)');\n        \n            $('.clone-create-course')\n              .removeClass('action-update-block')\n              .addClass('action-create-block');\n\n            if( nameTd.find('a').length ){ \/\/ This has course associated with it.\n              $('.clone-create-course')\n                .removeClass('action-create-block')\n                .addClass('action-update-block');\n            }\n\n\n\n\n           \n            editBlockyUI({\n              activeButton  : activeButton\n            });\n          })\n\n\n          \/\/DropDown-Updation\n          var updateDropDownUI = function(){\n            var dropDown  = $('.blocky-listing-dropdown [name=\"active-selected-blocky\"]');\n            var parentBar = dropDown.closest('.blocky-listing-dropdown');\n            if(dropDown.val() == ''){\n              parentBar.find('.lesson-active-status').html( \"\" );\n              return parentBar.addClass('hide-action-button');\n            }\n            var lessonStatus = dropDown.find(\"option:selected\").attr('data-lesson-status') || \"\";\n            console.log('lessonStatus', lessonStatus);\n            parentBar.find('.lesson-active-status').html( lessonStatus );\n            return parentBar.removeClass('hide-action-button');\n            \n          }  \n          \n          updateDropDownUI();\n          $('.blocky-listing-dropdown [name=\"active-selected-blocky\"]').change(updateDropDownUI);\n\n         \n      });\n\n\n\n     })(jQuery);\n  <\/script>\n    <\/div>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Use this page to customize your course as desired by rearranging, deleting, and adding blocks to the learning map. \u00a0Save your work. \u00a0To create this as an actual course and enroll students, email sharon@techykids.com. \u00a0You can use the drop down menu under the Customizer to open up a map you&#8217;ve previously created. &nbsp;<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"nf_dc_page":"","_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"site-sidebar-layout":"no-sidebar","site-content-layout":"plain-container","ast-global-header-display":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","theme-transparent-header-meta":"default","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","footnotes":""},"class_list":["post-18181","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.9 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>TechyKids Course Customizer - TechyKids.com<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/techykids.com\/customizer\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"TechyKids Course Customizer - TechyKids.com\" \/>\n<meta property=\"og:description\" content=\"Use this page to customize your course as desired by rearranging, deleting, and adding blocks to the learning map. \u00a0Save your work. \u00a0To create this as an actual course and enroll students, email sharon@techykids.com. \u00a0You can use the drop down menu under the Customizer to open up a map you&#8217;ve previously created. &nbsp;\" \/>\n<meta property=\"og:url\" content=\"https:\/\/techykids.com\/customizer\" \/>\n<meta property=\"og:site_name\" content=\"TechyKids.com\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/techykids.com\/customizer\",\"url\":\"https:\/\/techykids.com\/customizer\",\"name\":\"TechyKids Course Customizer - TechyKids.com\",\"isPartOf\":{\"@id\":\"https:\/\/techykids.com\/#website\"},\"datePublished\":\"2020-04-22T22:26:35+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/techykids.com\/customizer#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/techykids.com\/customizer\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/techykids.com\/customizer#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/techykids.com\/staging\/3266\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"TechyKids Course Customizer\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/techykids.com\/#website\",\"url\":\"https:\/\/techykids.com\/\",\"name\":\"TechyKids.com\",\"description\":\"Get Inspired.\",\"publisher\":{\"@id\":\"https:\/\/techykids.com\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/techykids.com\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/techykids.com\/#organization\",\"name\":\"TechyKids.com\",\"url\":\"https:\/\/techykids.com\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/techykids.com\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/techykids.com\/staging\/3266\/wp-content\/uploads\/2013\/05\/techykids1-2.png\",\"contentUrl\":\"https:\/\/techykids.com\/staging\/3266\/wp-content\/uploads\/2013\/05\/techykids1-2.png\",\"width\":300,\"height\":104,\"caption\":\"TechyKids.com\"},\"image\":{\"@id\":\"https:\/\/techykids.com\/#\/schema\/logo\/image\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"TechyKids Course Customizer - TechyKids.com","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/techykids.com\/customizer","og_locale":"en_US","og_type":"article","og_title":"TechyKids Course Customizer - TechyKids.com","og_description":"Use this page to customize your course as desired by rearranging, deleting, and adding blocks to the learning map. \u00a0Save your work. \u00a0To create this as an actual course and enroll students, email sharon@techykids.com. \u00a0You can use the drop down menu under the Customizer to open up a map you&#8217;ve previously created. &nbsp;","og_url":"https:\/\/techykids.com\/customizer","og_site_name":"TechyKids.com","twitter_card":"summary_large_image","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/techykids.com\/customizer","url":"https:\/\/techykids.com\/customizer","name":"TechyKids Course Customizer - TechyKids.com","isPartOf":{"@id":"https:\/\/techykids.com\/#website"},"datePublished":"2020-04-22T22:26:35+00:00","breadcrumb":{"@id":"https:\/\/techykids.com\/customizer#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/techykids.com\/customizer"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/techykids.com\/customizer#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/techykids.com\/staging\/3266\/"},{"@type":"ListItem","position":2,"name":"TechyKids Course Customizer"}]},{"@type":"WebSite","@id":"https:\/\/techykids.com\/#website","url":"https:\/\/techykids.com\/","name":"TechyKids.com","description":"Get Inspired.","publisher":{"@id":"https:\/\/techykids.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/techykids.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/techykids.com\/#organization","name":"TechyKids.com","url":"https:\/\/techykids.com\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/techykids.com\/#\/schema\/logo\/image\/","url":"https:\/\/techykids.com\/staging\/3266\/wp-content\/uploads\/2013\/05\/techykids1-2.png","contentUrl":"https:\/\/techykids.com\/staging\/3266\/wp-content\/uploads\/2013\/05\/techykids1-2.png","width":300,"height":104,"caption":"TechyKids.com"},"image":{"@id":"https:\/\/techykids.com\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/techykids.com\/staging\/3266\/wp-json\/wp\/v2\/pages\/18181","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/techykids.com\/staging\/3266\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/techykids.com\/staging\/3266\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/techykids.com\/staging\/3266\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/techykids.com\/staging\/3266\/wp-json\/wp\/v2\/comments?post=18181"}],"version-history":[{"count":0,"href":"https:\/\/techykids.com\/staging\/3266\/wp-json\/wp\/v2\/pages\/18181\/revisions"}],"wp:attachment":[{"href":"https:\/\/techykids.com\/staging\/3266\/wp-json\/wp\/v2\/media?parent=18181"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}