| @@ -1,213 +1,213 @@ | ||
| 1 | -<?php | |
| 2 | -/** | |
| 3 | - * Admin Quiz Editor: Editor template. | |
| 4 | - * | |
| 5 | - * @since 4.0.0 | |
| 6 | - * @author Nhamdv - Code is poetry | |
| 7 | - */ | |
| 8 | - | |
| 9 | -learn_press_admin_view( 'quiz/questions' ); | |
| 10 | -learn_press_admin_view( 'quiz/modal-choose-items' ); | |
| 11 | -learn_press_admin_view( 'quiz/question-fib-editor' ); | |
| 12 | -?> | |
| 13 | - | |
| 14 | -<div id="admin-editor-lp_quiz" xxxx="5"> | |
| 15 | - <div class="lp-place-holder"> | |
| 16 | - <div class="line-heading"></div> | |
| 17 | - | |
| 18 | - <div class="line-sm"></div> | |
| 19 | - <div class="line-xs"></div> | |
| 20 | - | |
| 21 | - <div class="line-df"></div> | |
| 22 | - <div class="line-lgx"></div> | |
| 23 | - <div class="line-lg"></div> | |
| 24 | - | |
| 25 | - <div class="line-df"></div> | |
| 26 | - <div class="line-lg"></div> | |
| 27 | - <div class="line-lgx"></div> | |
| 28 | - </div> | |
| 29 | -</div> | |
| 30 | - | |
| 31 | -<script type="text/x-template" id="tmpl-lp-quiz-editor"> | |
| 32 | - <div id="admin-editor-lp_quiz" class="learn-press-box-data lp-admin-editor"> | |
| 33 | - <div v-if="heartbeat"> | |
| 34 | - <div class="lp-box-data-head heading"> | |
| 35 | - <h3><?php echo esc_html__( 'Details', 'learnpress' ); ?><span class="status"></span></h3> | |
| 36 | - <div class="section-item-counts"> | |
| 37 | - <span>{{textCountQuestions()}}</span> | |
| 38 | - </div> | |
| 39 | - <span :class="['collapse-list-questions dashicons ' , close ? 'dashicons-arrow-down' : 'dashicons-arrow-up']" @click="toggle"></span> | |
| 40 | - </div> | |
| 41 | - <div class="lp-box-data-content"> | |
| 42 | - <div class="lp-list-questions"> | |
| 43 | - <div class="header"> | |
| 44 | - <div class="table-row"> | |
| 45 | - <div class="sort"></div> | |
| 46 | - <div class="order">#</div> | |
| 47 | - <div class="name"><?php esc_html_e( 'Name', 'learnpress' ); ?></div> | |
| 48 | - <div class="type"><?php esc_html_e( 'Type', 'learnpress' ); ?></div> | |
| 49 | - <div class="actions"><?php esc_html_e( 'Actions', 'learnpress' ); ?></div> | |
| 50 | - </div> | |
| 51 | - </div> | |
| 52 | - | |
| 53 | - <form @submit.prevent=""> | |
| 54 | - <lp-quiz-questions></lp-quiz-questions> | |
| 55 | - </form> | |
| 56 | - | |
| 57 | - <div class="footer" v-if="!disableUpdateList"> | |
| 58 | - <div class="table-row"> | |
| 59 | - <div class="sort lp-sortable-handle"></div> | |
| 60 | - <div class="order">{{countQuestions() + 1}}</div> | |
| 61 | - <div class="name add-new-question"> | |
| 62 | - <div class="title"> | |
| 63 | - <form @submit.prevent=""> | |
| 64 | - <input type="text" v-model="new_question.title" placeholder="<?php esc_attr_e( 'Create a new question', 'learnpress' ); ?>" @keyup.enter.prevent="addItem()"> | |
| 65 | - </form> | |
| 66 | - </div> | |
| 67 | - <div class="add-new"> | |
| 68 | - <button type="button" class="button" :disabled="!addableNew" @click.prevent="addItem(new_question.type)"> | |
| 69 | - <?php esc_html_e( 'Add with type...', 'learnpress' ); ?> | |
| 70 | - </button> | |
| 71 | - <ul class="question-types"> | |
| 72 | - <li v-for="(type, key) in questionTypes" :class="active(key)"> | |
| 73 | - <a href="#" :data-type="key" @click.prevent="addItem(key)">{{type}}</a> | |
| 74 | - </li> | |
| 75 | - </ul> | |
| 76 | - </div> | |
| 77 | - <div class="select-item"> | |
| 78 | - <button type="button" class="button" @click.prevent="openModal"> | |
| 79 | - <?php esc_html_e( 'Select items', 'learnpress' ); ?> | |
| 80 | - </button> | |
| 81 | - </div> | |
| 82 | - </div> | |
| 83 | - </div> | |
| 84 | - </div> | |
| 85 | - </div> | |
| 86 | - | |
| 87 | - <lp-quiz-choose-items @addItems="addItems"></lp-quiz-choose-items> | |
| 88 | - </div> | |
| 89 | - </div> | |
| 90 | - <div v-else> | |
| 91 | - <div class="lp-place-holder"> | |
| 92 | - <?php learn_press_admin_view( 'placeholder-animation' ); ?> | |
| 93 | - <div class="notify-reload"><?php esc_html_e( 'Something went wrong! Please reload to continue editing quiz questions.', 'learnpress' ); ?></div> | |
| 94 | - </div> | |
| 95 | - </div> | |
| 96 | - </div> | |
| 97 | -</script> | |
| 98 | - | |
| 99 | -<script type="text/javascript"> | |
| 100 | - jQuery(function ($) { | |
| 101 | - var $Vue = window.$Vue || Vue; | |
| 102 | - var $store = window.LP_Quiz_Store; | |
| 103 | - | |
| 104 | - $Vue.component('lp-quiz-editor', { | |
| 105 | - template: '#tmpl-lp-quiz-editor', | |
| 106 | - data: function () { | |
| 107 | - return { | |
| 108 | - new_question: { | |
| 109 | - 'title': '', | |
| 110 | - 'type': '' | |
| 111 | - } | |
| 112 | - } | |
| 113 | - }, | |
| 114 | - created: function () { | |
| 115 | - /*setInterval(function () { | |
| 116 | - $store.dispatch('heartbeat'); | |
| 117 | - }, 60 * 1000);*/ | |
| 118 | - }, | |
| 119 | - computed: { | |
| 120 | - heartbeat: function () { | |
| 121 | - return $store.getters['heartbeat']; | |
| 122 | - }, | |
| 123 | - // editor status | |
| 124 | - status: function () { | |
| 125 | - return $store.getters.status; | |
| 126 | - }, | |
| 127 | - // list questions close | |
| 128 | - close: function () { | |
| 129 | - return $store.getters['lqs/isHiddenListQuestions']; | |
| 130 | - }, | |
| 131 | - // quiz id | |
| 132 | - id: function () { | |
| 133 | - return $store.getters['id']; | |
| 134 | - }, | |
| 135 | - // addable new | |
| 136 | - addableNew: function () { | |
| 137 | - return !!this.new_question.title; | |
| 138 | - }, | |
| 139 | - // all question types | |
| 140 | - questionTypes: function () { | |
| 141 | - return $store.getters['questionTypes']; | |
| 142 | - }, | |
| 143 | - // trigger user memorize | |
| 144 | - newQuestionType: function () { | |
| 145 | - return $store.getters['defaultNewQuestionType']; | |
| 146 | - }, | |
| 147 | - // disable update list questions | |
| 148 | - disableUpdateList: function () { | |
| 149 | - return $store.getters['lqs/disableUpdateList']; | |
| 150 | - } | |
| 151 | - }, | |
| 152 | - methods: { | |
| 153 | - // Add disable class if no support Question type. @nhamdv | |
| 154 | - active: function(type) { | |
| 155 | - var classes = ['']; | |
| 156 | - | |
| 157 | - var supportTypes = $store.getters['lqs/supportAnswerOptions']; | |
| 158 | - | |
| 159 | - if ( supportTypes.indexOf( type ) === -1 ) { | |
| 160 | - classes.push('disabled') | |
| 161 | - } | |
| 162 | - | |
| 163 | - return classes; | |
| 164 | - }, | |
| 165 | - // toggle all questions | |
| 166 | - toggle: function () { | |
| 167 | - $store.dispatch('lqs/toggleAll'); | |
| 168 | - }, | |
| 169 | - // add new question | |
| 170 | - addItem: function (type) { | |
| 171 | - if (this.new_question.title) { | |
| 172 | - if (!type) { | |
| 173 | - type = this.newQuestionType; | |
| 174 | - } | |
| 175 | - this.new_question.id = LP.uniqueId() | |
| 176 | - | |
| 177 | - // new question | |
| 178 | - this.new_question.type = type; | |
| 179 | - $store.dispatch('lqs/newQuestion', { | |
| 180 | - quiz: { | |
| 181 | - title: $('input[name=post_title]').val(), | |
| 182 | - content: $('textarea[name=content]').val() | |
| 183 | - }, | |
| 184 | - question: this.new_question | |
| 185 | - }); | |
| 186 | - this.new_question.title = ''; | |
| 187 | - } | |
| 188 | - }, | |
| 189 | - // open modal | |
| 190 | - openModal: function () { | |
| 191 | - $store.dispatch('cqi/open', parseInt(this.quizId)); | |
| 192 | - }, | |
| 193 | - // add choose items in modal to quiz | |
| 194 | - addItems: function (type) { | |
| 195 | - // add items | |
| 196 | - $store.dispatch('cqi/addQuestionsToQuiz', { | |
| 197 | - title: $('input[name=post_title]').val(), | |
| 198 | - content: $('textarea[name=content]').val() | |
| 199 | - }); | |
| 200 | - }, | |
| 201 | - countQuestions: function () { | |
| 202 | - return $store.getters['lqs/listQuestions'].length; | |
| 203 | - }, | |
| 204 | - textCountQuestions: function () { | |
| 205 | - var count = this.countQuestions(), | |
| 206 | - labels = $store.getters['i18n/all'].question_labels; | |
| 207 | - return count + ' ' + (count > 1 ? labels.plural : labels.singular); | |
| 208 | - } | |
| 209 | - } | |
| 210 | - }) | |
| 211 | - | |
| 212 | - }) | |
| 213 | -</script> | |
| 1 | +<?php | |
| 2 | +/** | |
| 3 | + * Admin Quiz Editor: Editor template. | |
| 4 | + * | |
| 5 | + * @since 4.0.0 | |
| 6 | + * @author Nhamdv - Code is poetry | |
| 7 | + */ | |
| 8 | + | |
| 9 | +learn_press_admin_view( 'quiz/questions' ); | |
| 10 | +learn_press_admin_view( 'quiz/modal-choose-items' ); | |
| 11 | +learn_press_admin_view( 'quiz/question-fib-editor' ); | |
| 12 | +?> | |
| 13 | + | |
| 14 | +<div id="admin-editor-lp_quiz" xxxx="5"> | |
| 15 | + <div class="lp-place-holder"> | |
| 16 | + <div class="line-heading"></div> | |
| 17 | + | |
| 18 | + <div class="line-sm"></div> | |
| 19 | + <div class="line-xs"></div> | |
| 20 | + | |
| 21 | + <div class="line-df"></div> | |
| 22 | + <div class="line-lgx"></div> | |
| 23 | + <div class="line-lg"></div> | |
| 24 | + | |
| 25 | + <div class="line-df"></div> | |
| 26 | + <div class="line-lg"></div> | |
| 27 | + <div class="line-lgx"></div> | |
| 28 | + </div> | |
| 29 | +</div> | |
| 30 | + | |
| 31 | +<script type="text/x-template" id="tmpl-lp-quiz-editor"> | |
| 32 | + <div id="admin-editor-lp_quiz" class="learn-press-box-data lp-admin-editor"> | |
| 33 | + <div v-if="heartbeat"> | |
| 34 | + <div class="lp-box-data-head heading"> | |
| 35 | + <h3><?php echo esc_html__( 'Details', 'learnpress' ); ?><span class="status"></span></h3> | |
| 36 | + <div class="section-item-counts"> | |
| 37 | + <span>{{textCountQuestions()}}</span> | |
| 38 | + </div> | |
| 39 | + <span :class="['collapse-list-questions dashicons ' , close ? 'dashicons-arrow-down' : 'dashicons-arrow-up']" @click="toggle"></span> | |
| 40 | + </div> | |
| 41 | + <div class="lp-box-data-content"> | |
| 42 | + <div class="lp-list-questions"> | |
| 43 | + <div class="header"> | |
| 44 | + <div class="table-row"> | |
| 45 | + <div class="sort"></div> | |
| 46 | + <div class="order">#</div> | |
| 47 | + <div class="name"><?php esc_html_e( 'Name', 'learnpress' ); ?></div> | |
| 48 | + <div class="type"><?php esc_html_e( 'Type', 'learnpress' ); ?></div> | |
| 49 | + <div class="actions"><?php esc_html_e( 'Actions', 'learnpress' ); ?></div> | |
| 50 | + </div> | |
| 51 | + </div> | |
| 52 | + | |
| 53 | + <form @submit.prevent=""> | |
| 54 | + <lp-quiz-questions></lp-quiz-questions> | |
| 55 | + </form> | |
| 56 | + | |
| 57 | + <div class="footer" v-if="!disableUpdateList"> | |
| 58 | + <div class="table-row"> | |
| 59 | + <div class="sort lp-sortable-handle"></div> | |
| 60 | + <div class="order">{{countQuestions() + 1}}</div> | |
| 61 | + <div class="name add-new-question"> | |
| 62 | + <div class="title"> | |
| 63 | + <form @submit.prevent=""> | |
| 64 | + <input type="text" v-model="new_question.title" placeholder="<?php esc_attr_e( 'Create a new question', 'learnpress' ); ?>" @keyup.enter.prevent="addItem()"> | |
| 65 | + </form> | |
| 66 | + </div> | |
| 67 | + <div class="add-new"> | |
| 68 | + <button type="button" class="button" :disabled="!addableNew" @click.prevent="addItem(new_question.type)"> | |
| 69 | + <?php esc_html_e( 'Add with type...', 'learnpress' ); ?> | |
| 70 | + </button> | |
| 71 | + <ul class="question-types"> | |
| 72 | + <li v-for="(type, key) in questionTypes" :class="active(key)"> | |
| 73 | + <a href="#" :data-type="key" @click.prevent="addItem(key)">{{type}}</a> | |
| 74 | + </li> | |
| 75 | + </ul> | |
| 76 | + </div> | |
| 77 | + <div class="select-item"> | |
| 78 | + <button type="button" class="button" @click.prevent="openModal"> | |
| 79 | + <?php esc_html_e( 'Select items', 'learnpress' ); ?> | |
| 80 | + </button> | |
| 81 | + </div> | |
| 82 | + </div> | |
| 83 | + </div> | |
| 84 | + </div> | |
| 85 | + </div> | |
| 86 | + | |
| 87 | + <lp-quiz-choose-items @addItems="addItems"></lp-quiz-choose-items> | |
| 88 | + </div> | |
| 89 | + </div> | |
| 90 | + <div v-else> | |
| 91 | + <div class="lp-place-holder"> | |
| 92 | + <?php learn_press_admin_view( 'placeholder-animation' ); ?> | |
| 93 | + <div class="notify-reload"><?php esc_html_e( 'Something went wrong! Please reload to continue editing quiz questions.', 'learnpress' ); ?></div> | |
| 94 | + </div> | |
| 95 | + </div> | |
| 96 | + </div> | |
| 97 | +</script> | |
| 98 | + | |
| 99 | +<script type="text/javascript"> | |
| 100 | + jQuery(function ($) { | |
| 101 | + var $Vue = window.$Vue || Vue; | |
| 102 | + var $store = window.LP_Quiz_Store; | |
| 103 | + | |
| 104 | + $Vue.component('lp-quiz-editor', { | |
| 105 | + template: '#tmpl-lp-quiz-editor', | |
| 106 | + data: function () { | |
| 107 | + return { | |
| 108 | + new_question: { | |
| 109 | + 'title': '', | |
| 110 | + 'type': '' | |
| 111 | + } | |
| 112 | + } | |
| 113 | + }, | |
| 114 | + created: function () { | |
| 115 | + /*setInterval(function () { | |
| 116 | + $store.dispatch('heartbeat'); | |
| 117 | + }, 60 * 1000);*/ | |
| 118 | + }, | |
| 119 | + computed: { | |
| 120 | + heartbeat: function () { | |
| 121 | + return $store.getters['heartbeat']; | |
| 122 | + }, | |
| 123 | + // editor status | |
| 124 | + status: function () { | |
| 125 | + return $store.getters.status; | |
| 126 | + }, | |
| 127 | + // list questions close | |
| 128 | + close: function () { | |
| 129 | + return $store.getters['lqs/isHiddenListQuestions']; | |
| 130 | + }, | |
| 131 | + // quiz id | |
| 132 | + id: function () { | |
| 133 | + return $store.getters['id']; | |
| 134 | + }, | |
| 135 | + // addable new | |
| 136 | + addableNew: function () { | |
| 137 | + return !!this.new_question.title; | |
| 138 | + }, | |
| 139 | + // all question types | |
| 140 | + questionTypes: function () { | |
| 141 | + return $store.getters['questionTypes']; | |
| 142 | + }, | |
| 143 | + // trigger user memorize | |
| 144 | + newQuestionType: function () { | |
| 145 | + return $store.getters['defaultNewQuestionType']; | |
| 146 | + }, | |
| 147 | + // disable update list questions | |
| 148 | + disableUpdateList: function () { | |
| 149 | + return $store.getters['lqs/disableUpdateList']; | |
| 150 | + } | |
| 151 | + }, | |
| 152 | + methods: { | |
| 153 | + // Add disable class if no support Question type. @nhamdv | |
| 154 | + active: function(type) { | |
| 155 | + var classes = ['']; | |
| 156 | + | |
| 157 | + var supportTypes = $store.getters['lqs/supportAnswerOptions']; | |
| 158 | + | |
| 159 | + if ( supportTypes.indexOf( type ) === -1 ) { | |
| 160 | + classes.push('disabled') | |
| 161 | + } | |
| 162 | + | |
| 163 | + return classes; | |
| 164 | + }, | |
| 165 | + // toggle all questions | |
| 166 | + toggle: function () { | |
| 167 | + $store.dispatch('lqs/toggleAll'); | |
| 168 | + }, | |
| 169 | + // add new question | |
| 170 | + addItem: function (type) { | |
| 171 | + if (this.new_question.title) { | |
| 172 | + if (!type) { | |
| 173 | + type = this.newQuestionType; | |
| 174 | + } | |
| 175 | + this.new_question.id = LP.uniqueId() | |
| 176 | + | |
| 177 | + // new question | |
| 178 | + this.new_question.type = type; | |
| 179 | + $store.dispatch('lqs/newQuestion', { | |
| 180 | + quiz: { | |
| 181 | + title: $('input[name=post_title]').val(), | |
| 182 | + content: $('textarea[name=content]').val() | |
| 183 | + }, | |
| 184 | + question: this.new_question | |
| 185 | + }); | |
| 186 | + this.new_question.title = ''; | |
| 187 | + } | |
| 188 | + }, | |
| 189 | + // open modal | |
| 190 | + openModal: function () { | |
| 191 | + $store.dispatch('cqi/open', parseInt(this.quizId)); | |
| 192 | + }, | |
| 193 | + // add choose items in modal to quiz | |
| 194 | + addItems: function (type) { | |
| 195 | + // add items | |
| 196 | + $store.dispatch('cqi/addQuestionsToQuiz', { | |
| 197 | + title: $('input[name=post_title]').val(), | |
| 198 | + content: $('textarea[name=content]').val() | |
| 199 | + }); | |
| 200 | + }, | |
| 201 | + countQuestions: function () { | |
| 202 | + return $store.getters['lqs/listQuestions'].length; | |
| 203 | + }, | |
| 204 | + textCountQuestions: function () { | |
| 205 | + var count = this.countQuestions(), | |
| 206 | + labels = $store.getters['i18n/all'].question_labels; | |
| 207 | + return count + ' ' + (count > 1 ? labels.plural : labels.singular); | |
| 208 | + } | |
| 209 | + } | |
| 210 | + }) | |
| 211 | + | |
| 212 | + }) | |
| 213 | +</script> | |
