browserify

xcorecms · Aug 5, 2018 · d56cb21 · d56cb21
1 parent 621fc23
commit d56cb21
Show file tree

Hide file tree

Showing 10 changed files with 3,437 additions and 201 deletions.
diff --git a/.gitignore b/.gitignore
@@ -2,4 +2,4 @@
 /.idea
 /composer.lock
 /client-side/node_modules
-/client-side/src/ts/inline.js
+/example
diff --git a/client-side/dist/inline.css b/client-side/dist/inline.css
@@ -2,46 +2,40 @@
   -webkit-transition: all 0.3s ease;
   -moz-transition: all 0.3s ease;
   -o-transition: all 0.3s ease;
-  transition: all 0.3s ease;
-}
+  transition: all 0.3s ease; }
+
 .inline-editing {
-  outline: 1px dotted #6393b5;
-}
-.inline-editing:focus {
-  outline: 1px solid #d3dbe4;
-}
-.inline-editing a {
-  cursor: text;
-}
-.inline-editing.inline-empty {
-  padding-left: 5px;
-  min-height: 10px;
-}
-.inline-editing.inline-content-success {
-  background-color: rgba(0, 182, 109, 0.1);
-  outline-color: #00b66d;
-}
-.inline-editing.inline-content-warning {
-  background-color: rgba(182, 160, 12, 0.1);
-  outline-color: #b6b357;
-}
-.inline-editing.inline-content-error {
-  background-color: rgba(216, 32, 43, 0.1);
-  outline-color: #d8202b;
-}
+  outline: 1px dotted #6393b5; }
+  .inline-editing:focus {
+    outline: 1px solid #d3dbe4; }
+  .inline-editing a {
+    cursor: text; }
+  .inline-editing.inline-empty {
+    padding-left: 5px;
+    min-height: 10px; }
+  .inline-editing.inline-content-success {
+    background-color: rgba(0, 182, 109, 0.1);
+    outline-color: #00b66d; }
+  .inline-editing.inline-content-warning {
+    background-color: rgba(182, 160, 12, 0.1);
+    outline-color: #b6b357; }
+  .inline-editing.inline-content-error {
+    background-color: rgba(216, 32, 43, 0.1);
+    outline-color: #d8202b; }
+
 .inline-editing-tinymce.mce-content-body {
-  line-height: inherit;
-}
+  line-height: inherit; }
+
 .inline-error-msg {
   font-weight: bold;
-  color: #d8202b;
-}
+  color: #d8202b; }
+
 .inline-container {
   position: fixed;
   top: 40%;
   left: 0;
-  z-index: 100000;
-}
+  z-index: 100000; }
+
 .inline-editing-btn {
   position: absolute;
   display: inline-block;
@@ -55,51 +49,39 @@
   cursor: pointer;
   background-color: #1c2830;
   color: #cad4dd;
-  transition: background-color 0.5s ease;
-}
-.inline-editing-btn.inline-hidden {
-  display: none;
-}
-.inline-editing-btn.inline-enable,
-.inline-editing-btn.inline-disable {
-  background-color: #0571b3;
-  font-size: 20px;
-}
-.inline-editing-btn.inline-enable {
-  color: #1c2830;
-}
-.inline-editing-btn.inline-status {
-  top: 50px;
-  z-index: 100001;
-}
-.inline-editing-btn.inline-status:hover {
-  cursor: auto;
-}
-.inline-editing-btn.inline-save {
-  top: 50px;
-}
-.inline-editing-btn.inline-save:hover {
-  background-color: #152028;
-}
-.inline-editing-btn.inline-revert {
-  top: 100px;
-}
-.inline-editing-btn.inline-revert:hover {
-  background-color: #152028;
-}
-.inline-editing-btn.inactive {
-  color: #455662;
-}
-.inline-editing-btn.inactive:hover {
-  cursor: auto;
-}
+  transition: background-color 0.5s ease; }
+  .inline-editing-btn.inline-hidden {
+    display: none; }
+  .inline-editing-btn.inline-enable, .inline-editing-btn.inline-disable {
+    background-color: #0571b3;
+    font-size: 20px; }
+  .inline-editing-btn.inline-enable {
+    color: #1c2830; }
+  .inline-editing-btn.inline-status {
+    top: 50px;
+    z-index: 100001; }
+    .inline-editing-btn.inline-status:hover {
+      cursor: auto; }
+  .inline-editing-btn.inline-save {
+    top: 50px; }
+    .inline-editing-btn.inline-save:hover {
+      background-color: #152028; }
+  .inline-editing-btn.inline-revert {
+    top: 100px; }
+    .inline-editing-btn.inline-revert:hover {
+      background-color: #152028; }
+  .inline-editing-btn.inactive {
+    color: #455662; }
+    .inline-editing-btn.inactive:hover {
+      cursor: auto; }
+
 @font-face {
   font-family: "inline";
   src: url("font/inline.eot");
   src: url("font/inline.eot?#iefix") format("embedded-opentype"), url("font/inline.woff") format("woff"), url("font/inline.ttf") format("truetype"), url("font/inline.svg#inline") format("svg");
   font-weight: normal;
-  font-style: normal;
-}
+  font-style: normal; }
+
 [data-icon]:before {
   font-family: "inline" !important;
   content: attr(data-icon);
@@ -110,8 +92,8 @@
   speak: none;
   line-height: 1;
   -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
+  -moz-osx-font-smoothing: grayscale; }
+
 [class^="inline-icon-"]:before,
 [class*=" inline-icon-"]:before {
   font-family: "inline" !important;
@@ -122,26 +104,25 @@
   speak: none;
   line-height: 1;
   -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
+  -moz-osx-font-smoothing: grayscale; }
+
 .inline-icon-xcore:before {
-  content: "\61";
-}
+  content: "\61"; }
+
 .inline-icon-trash:before {
-  content: "\62";
-}
+  content: "\62"; }
+
 .inline-icon-save:before {
-  content: "\63";
-}
+  content: "\63"; }
+
 .inline-icon-ok:before {
   content: "\64";
-  color: #00b66d;
-}
+  color: #00b66d; }
+
 .inline-icon-error:before {
   content: "\65";
-  color: #d8202b;
-}
+  color: #d8202b; }
+
 .inline-icon-progress:before {
   content: url("font/loader.gif");
-  color: grey;
-}
+  color: grey; }
diff --git a/client-side/dist/inline.js b/client-side/dist/inline.js
@@ -1,3 +1,7 @@
+(function(){function r(e,n,t){function o(i,f){if(!n[i]){if(!e[i]){var c="function"==typeof require&&require;if(!f&&c)return c(i,!0);if(u)return u(i,!0);var a=new Error("Cannot find module '"+i+"'");throw a.code="MODULE_NOT_FOUND",a}var p=n[i]={exports:{}};e[i][0].call(p.exports,function(r){var n=e[i][1][r];return o(n||r)},p,p.exports,r,e,n,t)}return n[i].exports}for(var u="function"==typeof require&&require,i=0;i<t.length;i++)o(t[i]);return o}return r})()({1:[function(require,module,exports){
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var items_1 = require("./items");
 var Inline = (function () {
     function Inline() {
         var _this = this;
@@ -48,7 +52,7 @@ var Inline = (function () {
                 _this.changes[key].content = el.textContent;
             }
             else {
-                _this.changes[key] = new EntityItem(el.dataset['inlineEntity'], el.dataset['inlineId'], el.dataset['inlineProperty'], el.textContent);
+                _this.changes[key] = new items_1.EntityItem(el.dataset['inlineEntity'], el.dataset['inlineId'], el.dataset['inlineProperty'], el.textContent);
             }
             _this.btns['status'].classList.add('inline-hidden');
             _this.btns['save'].classList.remove('inactive');
@@ -121,10 +125,10 @@ var Inline = (function () {
         }
         else {
             if (el.dataset['inlineType'] === 'simple') {
-                this.changes[key] = new SimpleItem(el.dataset['inlineNamespace'], el.dataset['inlineLocale'], el.dataset['inlineName'], content);
+                this.changes[key] = new items_1.SimpleItem(el.dataset['inlineNamespace'], el.dataset['inlineLocale'], el.dataset['inlineName'], content);
             }
             else if (el.dataset['inlineType'] === 'entity') {
-                this.changes[key] = new EntityItem(el.dataset['inlineEntity'], el.dataset['inlineId'], el.dataset['inlineProperty'], content);
+                this.changes[key] = new items_1.EntityItem(el.dataset['inlineEntity'], el.dataset['inlineId'], el.dataset['inlineProperty'], content);
             }
             else {
                 console.log('invalid type');
@@ -291,16 +295,11 @@ var Inline = (function () {
     };
     return Inline;
 }());
-var SimpleItem = (function () {
-    function SimpleItem(namespace, locale, name, content) {
-        this.namespace = namespace;
-        this.locale = locale;
-        this.name = name;
-        this.content = content;
-        this.type = 'simple';
-    }
-    return SimpleItem;
-}());
+document.addEventListener('DOMContentLoaded', function () { return window.xcoreInline = new Inline; });
+
+},{"./items":2}],2:[function(require,module,exports){
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
 var EntityItem = (function () {
     function EntityItem(entity, id, property, content) {
         this.entity = entity;
@@ -311,4 +310,17 @@ var EntityItem = (function () {
     }
     return EntityItem;
 }());
-document.addEventListener('DOMContentLoaded', function () { return window.xcoreInline = new Inline; });
+exports.EntityItem = EntityItem;
+var SimpleItem = (function () {
+    function SimpleItem(namespace, locale, name, content) {
+        this.namespace = namespace;
+        this.locale = locale;
+        this.name = name;
+        this.content = content;
+        this.type = 'simple';
+    }
+    return SimpleItem;
+}());
+exports.SimpleItem = SimpleItem;
+
+},{}]},{},[1]);
diff --git a/client-side/gulpfile.js b/client-side/gulpfile.js
@@ -1,18 +1,26 @@
 var gulp = require('gulp');
-var less = require('gulp-less');
-var ts = require('gulp-typescript');
-var tsProject = ts.createProject('src/ts/tsconfig.json');
+var browserify = require('browserify');
+var tsify = require('tsify');
+var source = require('vinyl-source-stream')
+var sass = require('gulp-sass');
 
 gulp.task('ts', function () {
-    return tsProject.src()
-        .pipe(tsProject())
-        .js.pipe(gulp.dest('dist'));
+    var bundleStream = browserify('src/ts/inline.ts')
+        .plugin(tsify)
+        .bundle()
+        .on('error', function (error) {
+            console.error(error.toString());
+        })
+
+    return bundleStream
+        .pipe(source('inline.js'))
+        .pipe(gulp.dest('dist'))
 });
 
-gulp.task('less', function () {
-    return gulp.src('src/less/inline.less')
-        .pipe(less())
+gulp.task('sass', function () {
+    return gulp.src('src/sass/inline.scss')
+        .pipe(sass())
         .pipe(gulp.dest('dist'));
 });
 
-gulp.task('default', ['ts', 'less']);
+gulp.task('default', ['ts', 'sass']);
diff --git a/client-side/package.json b/client-side/package.json
@@ -1,15 +1,16 @@
 {
-  "name": "inline-editable",
-  "version": "1.0.0",
-  "description": "Inline editable...",
-  "main": "gulpfile.js",
-  "dependencies": {
-    "gulp": "^3.9",
-    "gulp-less": "^3.3",
-    "gulp-typescript": "^3.1",
-    "typescript": "^2.1"
-  },
-  "devDependencies": {},
-  "author": "",
-  "license": "MIT"
+  "name": "inline-editing",
+  "version": "1.2.1",
+  "description": "Inline editing...",
+  "private": true,
+  "author": "Jakub Janata",
+  "license": "MIT",
+  "devDependencies": {
+    "browserify": "^16.2.2",
+    "gulp": "^3.9.1",
+    "gulp-sass": "^4.0.1",
+    "tsify": "^4.0.0",
+    "typescript": "^3.0.1",
+    "vinyl-source-stream": "^2.0.0"
+  }
 }