Невозможно заставить Firepad работать правильно

0

Я создал Firebase (https://mkaminsky.firebaseio.com/), и я пытаюсь использовать Firepad для создания инструмента совместной работы с кодом. Я создал этот html файл, как сказано в примере (https://github.com/firebase/firepad/blob/master/examples/code.html).

<!doctype html>
<!-- See http://www.firepad.io/docs/ for detailed embedding docs. -->
   <html>
      <head>
         <meta charset="utf-8" />
         <script src="https://cdn.firebase.com/v0/firebase.js"></script>

         <script src="codemirror/lib/codemirror.js"></script>
         <script src="codemirror/mode/javascript/javascript.js"></script>
         <link rel="stylesheet" href="codemirror/lib/codemirror.css" />

         <script src="firepad.js"></script>
         <link rel="stylesheet" href="firepad.css" />
         <style>
             html { height: 100%; }
             body { margin: 0; height: 100%; position: relative; }
             .firepad {
              position: absolute; left: 0; top: 0; bottom: 0; right: 0; height: auto;
              }
         </style>
   </head>
   <body>
      <button type="button">Test</button> 
      <div id="firepad-container"></div>

      <script>
         //// Initialize Firebase.
         var firepadRef = new Firebase('https://mkaminsky.firebaseio.com/');

         //// Create CodeMirror (with line numbers and the JavaScript mode).
         var codeMirror = CodeMirror(document.getElementById('firepad-container'), {
           lineNumbers: true,
           mode: 'javascript'
         });

         //// Create Firepad.
         var firepad = Firepad.fromCodeMirror(firepadRef, codeMirror);

         //// Initialize contents.
         firepad.on('ready', function() {
           if (firepad.isHistoryEmpty()) {
            firepad.setText('//hello');
           }
         });
    </script>
</body>
</html>

Однако этот код не работает должным образом. Он отображает редактор кода в комплекте с подсветкой синтаксиса, но не выполняет "setText ("//hello "); метод. Любые другие команды, установленные на его место, также не работают.

Кроме того, кнопка не отображается на странице html.

Я проверил и проверил, что Firebase работает правильно.

  • 0
    Я скопировал и вставил ваш код и открыл его в Chrome, и он работал правильно (в редакторе появилось «// привет»). Вы получаете какие-либо ошибки в консоли? Какой браузер вы используете?
  • 0
    Есть две ошибки: Uncaught TypeError: Невозможно прочитать свойство 'LIST_TYPE' неопределенного firepad.js: 12 Uncaught ReferenceError: Firepad не определен index.html: 47
Показать ещё 1 комментарий
Теги:
firebase
codemirror
firepad

2 ответа

0
Лучший ответ

Может быть, код isHistoryEmpty() не работает для вас просто потому, что он работал один раз, и теперь история не пуста?

$ curl  https://mkaminsky.firebaseio.com/.json 
{"users":{"-J6J90xrR-D-XC6WE23F":{"color":"#d5b3ff"}},"history":{"A0":{"a":"-J6HUBET5icmC-yXAkJb","o":["//hello"]}}}

Попробуйте очистить свою базовую базу или использовать новое пространство имен для документов firepad. Самый простой способ проверить новые пространства имен

Firepad.fromCodeMirror(firepadRef.push(), codeMirror);

который последовательно запускает ветку isHistoryEmpty() для меня (протестирован на https://cben-sandbox.firebaseio.com/, Chrome и Firefox).

0

Скорее всего, отсутствует форматирование CSS. В соответствии с документацией добавьте следующее правило CSS:

.firepad {
  width: 700px;
  height: 450px;
  background-color: #f62; /* dark orange background */
}

Перед стилем CSS Изображение 174551 После стилизации CSS Изображение 174551

Ещё вопросы

Сообщество Overcoder
Наверх
Меню